@import url(https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700&display=swap);

@font-face {
    font-family: 'din';
    src: url("../fonts/dinnextltarabic-regular.eot");
    src: url("../fonts/dinnextltarabic-regular.woff") format("woff"), url("../fonts/dinnextltarabic-regular.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'din';
    src: url("../fonts/dinnextltarabic-medium.eot");
    src: url("../fonts/dinnextltarabic-medium.woff") format("woff"), url("../fonts/dinnextltarabic-medium.ttf") format("truetype"), url("../fonts/dinnextltarabic-medium.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'din';
    src: url("../fonts/dinnextltarabic-bold.eot");
    src: url("../fonts/dinnextltarabic-bold.woff") format("woff"), url("../fonts/dinnextltarabic-bold.ttf") format("truetype"), url("../fonts/dinnextltarabic-bold.svg") format("svg");
    font-weight: 600;
    font-style: normal;
}

@import url("https://fonts.googleapis.com/css?family=Roboto:400,500|Sarabun:400,600,700");
@import url("https://fonts.googleapis.com/css?family=Cairo&display=swap&subset=arabic");

#page-topbar {
    position: relative;
    z-index: 100;
    background-color: #fff;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    -webkit-border-top-left-radius: 40px;
    -webkit-border-top-right-radius: 40px;
    -moz-border-radius-topleft: 40px;
    -moz-border-radius-topright: 40px;
    border-top-left-radius: 40px;
    border-top-right-radius: 46px;
    box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.06), 0px 8px 10px 1px rgba(0, 0, 0, 0.042), 0px 3px 14px 2px rgba(0, 0, 0, 0.036);
}
.font-size-33 {
    font-size: 33px !important
}
.font-size-34 {
    font-size: 34px !important
}

img {
    max-width: 100%
}

.col-form-label.ness:after {
    content: "\f5c0";
    font-family: 'Font Awesome 5 pro';
    font-weight: 900;
    color: red;
    font-size: 5px;
    padding-right: 4px;
    position: relative;
    top: -5px;
}

.legenpie {}

.legenpie i {}

.legenpie h1 {

    font-size: 15px;

    display: inline-block;

    margin-right: 5px;
}

.col-form-label.dvcenter {

font-size: 13px;

font-weight: bold;

margin-bottom: 5px;
}

.font-size-6 {
    font-size: 6px !important
}
.mainbnrtop{
    position: relative;
    top: -10px;
}
.dter{
    position: relative;
    top: 5px;
}
.tp7{
    top:7px!important
}
.tsks{
    
/* margin-bottom: 7px; */
}
.tsks h4{
    
display: inline-block;
    
font-size: 14px;
}
.tsks a{
    width: 48px;
    height: 48px;
    display: flex;
    float: right;
    text-align: center;
    margin-left: 10px;
    font-size: 21px;
    justify-content: center;
    color: #fff;
    align-items: center;
    background: #ffa754;
    border-radius: 10px;
}
.tsks i{
    
font-size: 15px;
}
.tsks span{
    font-size:30px;
    display:block;
    line-height:28px
}
.tsks a:hover{
    color:#fff
}
.brdr-lft-30 {
    -webkit-border-top-left-radius: 35px !important;
    -moz-border-radius-topleft: 35px !important;
    border-top-left-radius: 35px !important;
}

.brdr-rdis-15 {
    border-radius: 0;
}
hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.25);
}
.pv-5 {
    padding: 5px 0 !important
}

.p-10 {
    padding: 10px 15px !important;
}

.ico3-top {
    height: 70px;
    position: relative;
    top: 7px;
}

.h-102 {
    height: 102px;

}

.noti-p {
    padding: 22px 20px !important;
    background: #2a3042;
}

.clr-white {
    color: #fff !important
}

.allCon {
    /* position: relative; */
    /* z-index: 10; */
}

.btn {

padding: .75rem 1.50rem;

font-size: 13px;

border-radius: 5px;

font-weight: bold;
}

/******************************/
.navbar-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: start;
    margin: 0 auto;
    height: 70px;
    padding: 0 0 0;
}

.navbar-header .dropdown:last-child {
    /* margin-left:15px */
}

.navbar-header .dropdown:last-child .waves-effect {
    padding-left: 26px !important;
}

.navbar-header .dropdown .waves-effect {
    padding: 5px 10px;
}

.navbar-header .waves-effect svg {
    height: 23px;
}

.navbar-header .waves-effect.noti-icon svg {
    height: 32px;
}

.navbar-header .d-flex:first-child {

    margin: 00 0;
}

.navbar-header .dropdown.show .header-item {
    background-color: #f8f9fa
}

.navbar-header .dropdown.show .header-item.brdr-lft-30 {
    -webkit-border-top-left-radius: 30px;
    -moz-border-radius-topleft: 30px;
    border-top-left-radius: 30px;
}

.navbar-brand-box {
    padding: 23px 10px 0;
    text-align: center;
    width: 250px;
    -webkit-border-top-right-radius: 40px;
    -moz-border-radius-topright: 40px;
    border-top-right-radius: 40px;
}

.sidebar-enable .navbar-header .logo-xs {
    display: none;
}

.vertical-collpsed .navbar-header .logo-xs {
    display: block;
}

.navbar-brand-box .logo-xs {
    /* background: #fff; */
    width: 65px;
    height: 51px;
    margin: 20px auto 0;
    border-radius: 100%;
    padding: 11px 0px 0;
    padding-right: 2px;
    display: none;
}

.navbar-brand-box .logo-xs img {
    width: 90%;
    height: auto;
}

.navbar-header .logo-lg {
    margin: 21px auto 6px;
    display: block;
    position: relative;
    /* background: #fff; */
    width: 135px;
    height: 100px;
    border-radius: 100%;
    padding: 9px 7px 0;
    padding-right: 13px;
}

.navbar-header .logo-lg img {}

.bgWebsit {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    background-image: url('../images/bg.svg');
    background-repeat: no-repeat;
    background-position-y: 0;
    background-color: transparent;
    min-height: 1065px;
}

.logo {
    /* line-height: 70px; */
}

.logo .logo-sm {
    display: none
}

.logo-light {
    display: none
}

.app-search {
    padding: 13px 0 0;
}

.card {
    margin-bottom: 24px;
    -webkit-box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, .03);
    border-radius: 10px;
    box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.06), 0px 6px 10px 0px rgba(0, 0, 0, 0.042), 0px 1px 18px 0px rgba(0, 0, 0, 0.036);

}
.card-content {
    padding: 0;
    margin: 13px 0 0;
}
.card-content li{
    display: inline-block;
    margin-left: 10px;
}
.app-search .form-control {
    border: none;
    height: 45px;
    padding-left: 40px;
    padding-right: 20px;
    background-color: #f8f9fa;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 30px;
    width: 280px;
}

.app-search .form-control::-webkit-input-placeholder {
    color: #919191 !important;
    font-weight: normal;
    font-size: 15px
}


.app-search span {
    position: absolute;
    z-index: 10;
    font-weight: bold;
    font-size: 15px;
    line-height: 38px;
    left: 13px;
    top: 4px;
    color: #74788d;
}

.megamenu-list li {
    position: relative;
    padding: 5px 0
}

.megamenu-list li a {
    color: #495057
}

@media (max-width:992px) {
    .navbar-brand-box {
        width: auto;
        padding-top: 21px;
        padding-bottom: 4px;
    }

    .logo span.logo-lg {
        display: none
    }

    .logo span.logo-sm {
        display: inline-block
    }

    .navbar-brand-box .logo-xs {
        margin: -11px 0 0;
        display: block;
    }
}

.page-content {
    padding: 0 12px 30px;
    background: #fafafa;
    -webkit-border-bottom-left-radius: 40px;
    -moz-border-radius-bottomleft: 40px;
    border-bottom-left-radius: 40px;
}
.page-content>.container-fluid {
   
    min-height: 524px;
}

.header-item {
    height: 70px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    color: #555b6d;
    border: 0;
    border-radius: 0
}

.header-item:hover {
    color: #555b6d
}

.header-profile-user {
    height: 36px;
    width: 36px;
    background-color: #f6f6f6;
    padding: 3px
}

.noti-icon i {
    font-size: 22px;
    color: #555b6d
}

.noti-icon.waves-effect svg {

    height: 30px;
}

.noti-icon.waves-effect[data-toggle="fullscreen"] svg {
    height: 21px;
}

.noti-icon.waves-effect[data-toggle="fullscreen"] .fullExit {
    display: none
}

.fullscreen-enable [data-toggle=fullscreen] .fullS {
    display: none
}

.fullscreen-enable [data-toggle=fullscreen] .fullExit {
    display: block !important;
    width: 39px;
}

.noti-icon .badge {
    position: absolute;
    top: 18px;
    left: 3px;
    /* width: 21px; */
    /* height: 21px; */
    border: 2px #fff solid;
}

.noti-new {
    background: #373d6f;
    padding: 18px 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.noti-new h6 {
    font-size:14px!important
}
.notif {
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

.notif btn {
    padding: 5px 0
}

.noti-icon .badge strong {
    font-size: 11px;
    text-align: center;
}
.notification-item .media h6 {font-weight:bold;color: #2a3042!important;}
.notification-item .media {
    padding: 1.15rem 1rem;
}
.notification-item .media p {font-size:12px;}
.notification-item .media p:last-child {font-weight:600;color:#3d3d3d}
.notification-item .media:hover {
    background-color: #f6f6f6;
    -webkit-transition: all .4s;
    transition: all .4s
}
.notifot{
    
-webkit-border-bottom-right-radius: 10px;
    
-webkit-border-bottom-left-radius: 10px;
    
-moz-border-radius-bottomright: 10px;
    
-moz-border-radius-bottomleft: 10px;
    
border-bottom-right-radius: 10px;
    
border-bottom-left-radius: 10px;
}
.dropdown-icon-item {
    display: block;
    border-radius: 3px;
    line-height: 34px;
    text-align: center;
    padding: 15px 0 9px;
    display: block;
    border: 1px solid transparent;
    color: #74788d
}

.dropdown-icon-item img {
    height: 24px
}

.dropdown-icon-item span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.dropdown-icon-item:hover {
    border-color: #eff2f7
}

.fullscreen-enable [data-toggle=fullscreen] .bx-fullscreen::before {
    content: "\ea3f"
}

body {
    font-family: 'cairo' !important
}

body[data-topbar=dark] #page-topbar {
    background-color: #2a3042
}

body[data-topbar=dark] .navbar-header .dropdown.show .header-item {
    background-color: rgba(255, 255, 255, .05)
}

body[data-topbar=dark] .navbar-header .waves-effect .waves-ripple {
    background: rgba(255, 255, 255, .4)
}

body[data-topbar=dark] .header-item {
    color: #e9ecef
}

body[data-topbar=dark] .header-item:hover {
    color: #e9ecef
}

body[data-topbar=dark] .header-profile-user {
    background-color: rgba(255, 255, 255, .25)
}

body[data-topbar=dark] .noti-icon i {
    color: #e9ecef
}

body[data-topbar=dark] .logo-dark {
    display: none
}

body[data-topbar=dark] .logo-light {
    display: block
}

body[data-topbar=dark] .app-search .form-control {
    background-color: rgba(243, 243, 249, .07);
    color: #fff
}

body[data-topbar=dark] .app-search input.form-control::-webkit-input-placeholder,
body[data-topbar=dark] .app-search span {
    color: rgba(255, 255, 255, .5);
}

body[data-sidebar=dark] .navbar-brand-box {
    background: #232944;
}

body[data-sidebar=dark] .logo-dark {
    display: none
}

body[data-sidebar=dark] .logo-light {
    display: block
}

@media (max-width:600px) {
    .navbar-header .dropdown {
        position: static
    }

    .navbar-header .dropdown .dropdown-menu {
        right: 10px !important;
        left: 10px !important
    }
}

@media (max-width:380px) {
    .navbar-brand-box {
        /* display: none */
    }
}

body[data-layout=horizontal] .navbar-brand-box {
    width: auto
}

body[data-layout=horizontal] .page-content {
    margin-top: 70px;
    padding: calc(55px + 24px) calc(24px / 2) 60px calc(24px / 2)
}

@media (max-width:992px) {
    body[data-layout=horizontal] .page-content {
        margin-top: 15px
    }
}

.maintit {
    padding: 30px 15px;
}

.page-title-box {
    padding-bottom: 30px;
}

.page-title-box .breadcrumb {
    background-color: transparent;
    padding: 0;
    font-weight: bold;
}

.breadcrumb-item > a {
    font-size: 13px;
}

.breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
}

.breadcrumb-item.active {
    font-size: 13px;
}

.breadcrumb-item + .breadcrumb-item::before {
    padding-right: .5rem;
    padding-left: .5rem;

}

.page-title-box h4 {
    text-transform: uppercase;
    font-weight: bold !important;
    font-size: 15px !important;
    line-height: 14px;
    /* margin-top: -16px; */
    color: #363636;
    position: relative;
    z-index: 102;
}

.page-title-box h4 i {
    font-size: 34px;
    position: relative;
    top: 9px;
    margin-left: 5px;
}

.footer {
    padding: 15px 0;
    position: relative;
    color: #74788d;
    right: 0;
    /* height: 60px; */
    background-color: #fafafa;
}

.footer .text-center {
    font-size: 13px;
    font-weight: bold;
}

@media (max-width:992px) {
    .footer {
        right: 0
    }
}

.vertical-collpsed .footer {
    right: 0;
}

body[data-layout=horizontal] .footer {
    right: 0 !important
}

.right-bar {
    background-color: #fff;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, .06), 0 1px 0 0 rgba(0, 0, 0, .02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, .06), 0 1px 0 0 rgba(0, 0, 0, .02);
    display: block;
    position: fixed;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    width: 280px;
    z-index: 9999;
    float: left !important;
    left: -290px;
    top: 0;
    bottom: 0
}

.right-bar .right-bar-toggle {
    background-color: #444c54;
    height: 24px;
    width: 24px;
    line-height: 24px;
    color: #eff2f7;
    text-align: center;
    border-radius: 50%
}

.right-bar .right-bar-toggle:hover {
    background-color: #4b545c
}

.rightbar-overlay {
    background-color: rgba(52, 58, 64, .55);
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    display: none;
    z-index: 9998;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out
}

.right-bar-enabled .right-bar {
    left: 0
}

.right-bar-enabled .rightbar-overlay {
    display: block
}

@media (max-width:767.98px) {
    .right-bar {
        overflow: auto
    }

    .right-bar .slimscroll-menu {
        height: auto !important
    }
}

.metismenu {
    margin: 0 !important;
    border: none;
}

.metismenu li {
    display: block;
    width: 100%
}

.metismenu .mm-collapse {
    display: none
}

.metismenu .mm-collapse:not(.mm-show) {
    display: none
}

.metismenu .mm-collapse.mm-show {
    display: block
}

.metismenu .mm-collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-duration: .35s;
    transition-duration: .35s;
    -webkit-transition-property: height, visibility;
    transition-property: height, visibility
}

.vertical-menu {
    width: 250px;
    z-index: 1001;
    background: #fff;
    bottom: 0;
    position: relative;
    float: right;
    padding-top: 20px;
    margin-top: 76px;
    top: 0;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    -webkit-border-bottom-right-radius: 40px;
    -moz-border-radius-bottomright: 40px;
    border-bottom-right-radius: 40px;
}

.logtxt {
    font-size: 16px;
    color: #fff;
    padding-left: 12px;
    padding-top: 12px;
    /* padding-bottom: 40px; */
}

.main-content {
    width: calc(100% - 250px);
    overflow: hidden;
    float: left;
    background-color: #fafafa;
    -webkit-border-bottom-left-radius: 40px;
    -moz-border-radius-bottomleft: 40px;
    border-bottom-left-radius: 40px;
}


.main-content .content {
    padding: 0 15px 10px 15px;
    margin-top: 70px
}

#sidebar-menu {
    padding: 0 0 40px 0;
}

.vertical-collpsed #sidebar-menu {
    padding-top: 0;
}

#sidebar-menu .mm-active > .has-arrow:after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

#sidebar-menu .has-arrow:after {
    content: "\f078";
    font-family: "Font Awesome 5 Pro";
    display: block;
    float: left;
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s;
    font-size: 0.7rem
}

#sidebar-menu .metismenu > li > a {
    display: block;
    padding: 11px 20px;
    color: #545a6d;
    position: relative;
    margin: 0;
    font-weight: 600;
    font-size: 14px;
    -webkit-transition: all .4s;
    transition: all .4s;
    /* border-bottom: 2px #ffffff0f solid; */
}

#sidebar-menu .metismenu > li:first-child > a {
    /* border-top: solid 1px #9f9f9f; */
    /* padding-top: 22PX; */
    /* background: #232a44; */
}

#sidebar-menu .metismenu > li ul a {
    display: block;
    padding: .625rem 1.5rem;
    color: #545a6d;
    position: relative;
    margin: 0 0;
    font-size: 13px;
    -webkit-transition: all .4s;
    transition: all .4s;
}

#sidebar-menu .metismenu > li:last-child > a {
    border: none
}

#sidebar-menu ul.metismenu li a i {
    display: inline-block;
    min-width: 1.75rem;
    padding-bottom: .125em;
    font-size: 1.25rem;
    line-height: 1.40625rem;
    vertical-align: middle;
    color: #7f8387;
    -webkit-transition: all .4s;
    transition: all .4s
}

#sidebar-menu ul li a:hover {
    color: #383c40
}

#sidebar-menu ul li a:hover i {
    color: #383c40
}

#sidebar-menu ul li .badge {
    margin-top: 4px
}

#sidebar-menu ul li ul.sub-menu {
    padding: 0;
    background: #24283e;
}

#sidebar-menu ul li ul.sub-menu li a {
    padding: .6rem 1.9rem;
    font-size: 13px;
    color: #545a6d;
}

#sidebar-menu ul li ul.sub-menu li a:before {
    content: "\f111";
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    font-size: 8px;
    margin-left: 10px;
    color: #848484;
    position: relative;
    left: 6px;
}

#sidebar-menu ul li ul.sub-menu li ul.sub-menu {
    padding: 0
}

#sidebar-menu ul li ul.sub-menu li ul.sub-menu li a {
    padding: .4rem 1.5rem .4rem 4.5rem;
    font-size: 13.5px
}

.menu-title {
    padding: 12px 20px !important;
    letter-spacing: .05em;
    pointer-events: none;
    cursor: default;
    font-size: 11px;
    text-transform: uppercase;
    color: #7f8387;
    font-weight: 600
}

.mm-active {
    color: #556ee6 !important
}

.mm-active .active {
    color: #556ee6 !important
}

.mm-active .active i {
    color: #556ee6 !important
}

.mm-active > i {
    color: #556ee6 !important
}

@media (max-width:992px) {
    .vertical-menu {
        display: none
    }

    .main-content {
        margin-right: 0 !important;
        width: 100% !important;
    }

    .vertical-menu {
        position: absolute;
        background-color: #2a3042;
        top: -7px;
    }

    body.sidebar-enable .vertical-menu {
        display: block;
        /* height: 100vh; */
        padding: 0;
    }

    #sidebar-menu {
        padding: 12px 0 30px 0;
    }

    .metismenu {
        margin: 0 !important
    }
}

.vertical-collpsed .main-content {
    width: calc(100% - 70px);
    /* margin-right: 70px; */
}

.vertical-collpsed .navbar-brand-box {
    width: 70px !important;
    padding: 0;
}

.vertical-collpsed .logo span.logo-lg {
    display: none
}

.vertical-collpsed .logo span.logo-sm {
    display: block
}

.vertical-collpsed .vertical-menu {
    /* position: absolute; */
    width: 70px !important;
    z-index: 5;
    padding-top: 67px;
    margin: 0;
}

.vertical-collpsed .vertical-menu .simplebar-content-wrapper,
.vertical-collpsed .vertical-menu .simplebar-mask {
    overflow: visible !important
}

.vertical-collpsed .vertical-menu .simplebar-scrollbar {
    display: none !important
}

.vertical-collpsed .vertical-menu .simplebar-offset {
    bottom: 0 !important
}

.vertical-collpsed .vertical-menu #sidebar-menu .badge,
.vertical-collpsed .vertical-menu #sidebar-menu .collapse.in,
.vertical-collpsed .vertical-menu #sidebar-menu .menu-title {
    display: none !important
}

.vertical-collpsed .vertical-menu #sidebar-menu .nav.collapse {
    height: inherit !important
}

.vertical-collpsed .vertical-menu #sidebar-menu .has-arrow:after {
    display: none
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li {
    position: relative;
    white-space: nowrap
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a {
    padding: 15px 20px;
    min-height: 55px;
    -webkit-transition: none;
    transition: none;
    margin: 0;
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a:active,
.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a:focus,
.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a:hover {
    color: #383c40
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a i {
    font-size: 1.45rem;
    margin-right: 4px
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a span {
    display: none;
    padding-right: 25px
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a {
    position: relative;
    width: calc(190px + 70px);
    color: #556ee6;
    background-color: #f5f5f5;
    -webkit-transition: none;
    transition: none
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a i {
    color: #556ee6
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a span {
    display: inline
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul {
    display: block;
    right: 70px;
    position: absolute;
    width: 190px;
    height: auto !important;
    -webkit-box-shadow: 3px 5px 10px 0 rgba(54, 61, 71, .1);
    box-shadow: 3px 5px 10px 0 rgba(54, 61, 71, .1)
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul ul {
    -webkit-box-shadow: 3px 5px 10px 0 rgba(54, 61, 71, .1);
    box-shadow: 3px 5px 10px 0 rgba(54, 61, 71, .1)
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul a {
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 8px 20px;
    position: relative;
    width: 190px;
    z-index: 6;
    color: #545a6d
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul a:hover {
    color: #383c40
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul ul {
    padding: 5px 0;
    z-index: 9999;
    display: none;
    background-color: #fff
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul ul li:hover > ul {
    display: block;
    right: 190px;
    height: auto !important;
    margin-top: -36px;
    position: absolute;
    width: 190px
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul ul li > a span.pull-left {
    position: absolute;
    left: 20px;
    top: 12px;
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg)
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul ul li.active a {
    color: #f8f9fa
}

body[data-sidebar=dark] .vertical-menu {
    background: #232944;
}
body[data-sidebar=dark] #sidebar-menu > ul > li:hover > a, body[data-sidebar=dark] #sidebar-menu > ul > li > a:focus,
body[data-sidebar=dark] #sidebar-menu > ul > li:active > a , body[data-sidebar=dark] #sidebar-menu > ul > li:active > a:focus,
body[data-sidebar=dark] #sidebar-menu > ul > li > a.active{
    background-color:#1a1e31
    
}
body[data-sidebar=dark] #sidebar-menu > ul >  li > .sub-menu  a:hover  {
    background-color: #1a1e31;
}
body[data-sidebar=dark] #sidebar-menu ul.metismenu li a {
    color: #dadada;
}

body[data-sidebar=dark] #sidebar-menu ul.metismenu li a i {
    color: #dadada;
}

body[data-sidebar=dark] #sidebar-menu ul > li > a:hover {
    color: #fff;
    
}

body[data-sidebar=dark] #sidebar-menu ul li a:hover i {
    color: #fff
}

body[data-sidebar=dark] #sidebar-menu ul li ul.sub-menu li a {
    color: #dadada;
}

body[data-sidebar=dark] #sidebar-menu ul li ul.sub-menu li a:hover {
    color: #fff
}

body[data-sidebar=dark].vertical-collpsed {
    min-height: 1000px;
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a {
    background: #2e3548;
    color: #fff
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a i {
    color: #fff
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul a {
    color: #79829c
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul a:hover {
    color: #fff
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu > ul ul {
    background-color: #2a3042
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu ul li.mm-active .active {
    color: #ffffff !important;
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu ul li.mm-active .active i {
    color: #ffffff !important;
}

body[data-sidebar=dark] .mm-active {
    color: #fff !important
}

body[data-sidebar=dark] .mm-active > i {
    color: #fff !important
}

body[data-sidebar=dark] .mm-active .active {
    color: #fff !important
}

body[data-sidebar=dark] .mm-active .active i {
    color: #fff !important
}

body[data-sidebar=dark] .menu-title {
    color: #6a7187
}

body[data-layout=horizontal] .main-content {
    margin-right: 0 !important
}

body[data-sidebar-size=small] .navbar-brand-box {
    width: 160px
}

body[data-sidebar-size=small] .vertical-menu {
    width: 160px;
    text-align: center
}

body[data-sidebar-size=small] .vertical-menu .badge,
body[data-sidebar-size=small] .vertical-menu .has-arrow:after {
    display: none !important
}

body[data-sidebar-size=small] .main-content {
    margin-right: 160px
}

body[data-sidebar-size=small] .footer {
    right: 160px
}

body[data-sidebar-size=small] #sidebar-menu ul li.menu-title {
    background-color: #2e3548
}

body[data-sidebar-size=small] #sidebar-menu ul li a i {
    display: block
}

body[data-sidebar-size=small] #sidebar-menu ul li ul.sub-menu li a {
    padding-right: 1.5rem
}

body[data-sidebar-size=small].vertical-collpsed .main-content {
    margin-right: 70px
}

body[data-sidebar-size=small].vertical-collpsed .vertical-menu #sidebar-menu {
    text-align: right
}

body[data-sidebar-size=small].vertical-collpsed .vertical-menu #sidebar-menu > ul > li > a i {
    display: inline-block
}

body[data-sidebar-size=small].vertical-collpsed .footer {
    right: 70px
}

body[data-sidebar=colored] .vertical-menu {
    background-color: #556ee6
}

body[data-sidebar=colored] .navbar-brand-box {
    background-color: #556ee6
}

body[data-sidebar=colored] .navbar-brand-box .logo-dark {
    display: none
}

body[data-sidebar=colored] .navbar-brand-box .logo-light {
    display: block
}

body[data-sidebar=colored] .mm-active {
    color: #fff !important
}

body[data-sidebar=colored] .mm-active .active,
body[data-sidebar=colored] .mm-active > i {
    color: #fff !important
}

body[data-sidebar=colored] #sidebar-menu ul li.menu-title {
    color: rgba(255, 255, 255, .6)
}

body[data-sidebar=colored] #sidebar-menu ul li a {
    color: rgba(255, 255, 255, .6)
}

body[data-sidebar=colored] #sidebar-menu ul li a i {
    color: rgba(255, 255, 255, .6)
}

body[data-sidebar=colored] #sidebar-menu ul li a.waves-effect .waves-ripple {
    background: rgba(255, 255, 255, .1)
}

body[data-sidebar=colored] #sidebar-menu ul li ul.sub-menu li a {
    color: rgba(255, 255, 255, .5)
}

body[data-sidebar=colored].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a {
    background-color: #5e76e7;
    color: #fff
}

body[data-sidebar=colored].vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a i {
    color: #fff
}

body[data-sidebar=colored].vertical-collpsed .vertical-menu #sidebar-menu ul li.mm-active .active {
    color: #556ee6 !important
}

.vertical-collpsed #doughnut {
    height: auto !important;
}

.mainTCon {
    padding: 2px 0;
}

.vertical-collpsed .mainTCon {
    padding: 19px 0 20px;
}

.topnav {
    background: #fff;
    padding: 0 calc(24px / 2);
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    margin-top: 70px;
    position: fixed;
    right: 0;
    left: 0;
    z-index: 100
}

.topnav .topnav-menu {
    margin: 0;
    padding: 0
}

.topnav .navbar-nav .nav-link {
    font-size: 14px;
    position: relative;
    padding: 1rem 1.3rem;
    color: #545a6d
}

.topnav .navbar-nav .nav-link i {
    font-size: 15px
}

.topnav .navbar-nav .nav-link:focus,
.topnav .navbar-nav .nav-link:hover {
    color: #556ee6;
    background-color: transparent
}

.topnav .navbar-nav .dropdown-item {
    color: #545a6d
}

.topnav .navbar-nav .dropdown-item.active,
.topnav .navbar-nav .dropdown-item:hover {
    color: #556ee6
}

.topnav .navbar-nav .nav-item .nav-link.active {
    color: #556ee6
}

.topnav .navbar-nav .dropdown.active > a {
    color: #556ee6;
    background-color: transparent
}

@media (min-width:1200px) {

    body[data-layout=horizontal] .container-fluid,
    body[data-layout=horizontal] .navbar-header {
        max-width: 85%
    }
}

@media (min-width:992px) {
    .topnav .navbar-nav .nav-item:first-of-type .nav-link {
        padding-right: 0
    }

    .topnav .dropdown-item {
        padding: .5rem 1.5rem;
        min-width: 180px
    }

    .topnav .dropdown.mega-dropdown .mega-dropdown-menu {
        right: 0;
        left: auto
    }

    .topnav .dropdown .dropdown-menu {
        margin-top: 0;
        border-radius: 0 0 .25rem .25rem
    }

    .topnav .dropdown .dropdown-menu .arrow-down::after {
        left: 15px;
        -webkit-transform: rotate(-135deg) translateY(-50%);
        transform: rotate(-135deg) translateY(-50%);
        position: absolute
    }

    .topnav .dropdown .dropdown-menu .dropdown .dropdown-menu {
        position: absolute;
        top: 0 !important;
        right: 100%;
        display: none
    }

    .topnav .dropdown:hover > .dropdown-menu {
        display: block
    }

    .topnav .dropdown:hover > .dropdown-menu > .dropdown:hover > .dropdown-menu {
        display: block
    }

    .navbar-toggle {
        display: none
    }
}

.arrow-down {
    display: inline-block
}

.arrow-down:after {
    border-color: initial;
    border-style: solid;
    border-width: 0 0 1px 1px;
    content: "";
    height: .4em;
    display: inline-block;
    left: 5px;
    top: 50%;
    margin-right: 10px;
    -webkit-transform: rotate(-45deg) translateY(-50%);
    transform: rotate(-45deg) translateY(-50%);
    -webkit-transform-origin: top;
    transform-origin: top;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    width: .4em
}

@media (max-width:1199.98px) {
    .topnav-menu .navbar-nav li:last-of-type .dropdown .dropdown-menu {
        left: 100%;
        right: auto
    }
}

@media (max-width:991.98px) {
    .navbar-brand-box .logo-dark {
        display: block
    }

    .navbar-brand-box .logo-dark span.logo-sm {
        display: block
    }

    .navbar-brand-box .logo-light {
        display: none
    }

    .navbar-brand-box .logo-light span.logo-sm {
        display: none
    }

    .topnav {
        max-height: 360px;
        overflow-y: auto;
        padding: 0
    }

    .topnav .navbar-nav .nav-link {
        padding: .75rem 1.1rem
    }

    .topnav .dropdown .dropdown-menu {
        background-color: transparent;
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        padding-right: 15px
    }

    .topnav .dropdown .dropdown-menu.dropdown-mega-menu-xl {
        width: auto
    }

    .topnav .dropdown .dropdown-menu.dropdown-mega-menu-xl .row {
        margin: 0
    }

    .topnav .dropdown .dropdown-item {
        position: relative;
        background-color: transparent
    }

    .topnav .dropdown .dropdown-item.active,
    .topnav .dropdown .dropdown-item:active {
        color: #556ee6
    }

    .topnav .arrow-down::after {
        left: 15px;
        position: absolute
    }
}

@media (min-width:992px) {
    body[data-layout=horizontal][data-topbar=light] .navbar-brand-box .logo-dark {
        display: block
    }

    body[data-layout=horizontal][data-topbar=light] .navbar-brand-box .logo-light {
        display: none
    }

    body[data-layout=horizontal][data-topbar=light] .topnav {
        background-color: #556ee6
    }

    body[data-layout=horizontal][data-topbar=light] .topnav .navbar-nav .nav-link {
        color: rgba(255, 255, 255, .6)
    }

    body[data-layout=horizontal][data-topbar=light] .topnav .navbar-nav .nav-link:focus,
    body[data-layout=horizontal][data-topbar=light] .topnav .navbar-nav .nav-link:hover {
        color: rgba(255, 255, 255, .9)
    }

    body[data-layout=horizontal][data-topbar=light] .topnav .navbar-nav > .dropdown.active > a {
        color: rgba(255, 255, 255, .9) !important
    }
}

body[data-layout=horizontal][data-topbar=colored] #page-topbar {
    background-color: #556ee6;
    -webkit-box-shadow: none;
    box-shadow: none
}

body[data-layout=horizontal][data-topbar=colored] .logo-dark {
    display: none
}

body[data-layout=horizontal][data-topbar=colored] .logo-light {
    display: block
}

body[data-layout=horizontal][data-topbar=colored] .app-search .form-control {
    background-color: rgba(243, 243, 249, .07);
    color: #fff
}

body[data-layout=horizontal][data-topbar=colored] .app-search input.form-control::-webkit-input-placeholder,
body[data-layout=horizontal][data-topbar=colored] .app-search span {
    color: rgba(255, 255, 255, .5)
}

body[data-layout=horizontal][data-topbar=colored] .header-item {
    color: #e9ecef
}

body[data-layout=horizontal][data-topbar=colored] .header-item:hover {
    color: #e9ecef
}

body[data-layout=horizontal][data-topbar=colored] .navbar-header .dropdown.show .header-item {
    background-color: rgba(255, 255, 255, .1)
}

body[data-layout=horizontal][data-topbar=colored] .navbar-header .waves-effect .waves-ripple {
    background: rgba(255, 255, 255, .4)
}

body[data-layout=horizontal][data-topbar=colored] .noti-icon i {
    color: #e9ecef
}

@media (min-width:992px) {
    body[data-layout=horizontal][data-topbar=colored] .topnav {
        background-color: #556ee6
    }

    body[data-layout=horizontal][data-topbar=colored] .topnav .navbar-nav .nav-link {
        color: rgba(255, 255, 255, .6)
    }

    body[data-layout=horizontal][data-topbar=colored] .topnav .navbar-nav .nav-link:focus,
    body[data-layout=horizontal][data-topbar=colored] .topnav .navbar-nav .nav-link:hover {
        color: rgba(255, 255, 255, .9)
    }

    body[data-layout=horizontal][data-topbar=colored] .topnav .navbar-nav > .dropdown.active > a {
        color: rgba(255, 255, 255, .9) !important
    }
}

body[data-layout-size=boxed] {
    background-color: #fafafa;
    font-weight: bold;
}

body[data-layout-size=boxed] #layout-wrapper {
    width: 1400px;
    max-width: 100%;
    margin: 65px auto 50px;
    position: relative;
    -webkit-border-top-left-radius: 30px;
    -webkit-border-top-right-radius: 30px;
    -moz-border-radius-topleft: 30px;
    -moz-border-radius-topright: 30px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}

body[data-layout-size=boxed] #page-topbar {
    max-width: 1400px;
    margin: 0 auto;

}

body[data-layout-size=boxed] .footer {
    margin: 0 auto;
    /* max-width: calc(1300px - 250px) */
}

body[data-layout-size=boxed].vertical-collpsed .footer {
    /* max-width: calc(1300px - 70px) */
}

body[data-layout=horizontal][data-layout-size=boxed] #layout-wrapper,
body[data-layout=horizontal][data-layout-size=boxed] #page-topbar,
body[data-layout=horizontal][data-layout-size=boxed] .footer {
    max-width: 100%
}

body[data-layout=horizontal][data-layout-size=boxed] .container-fluid,
body[data-layout=horizontal][data-layout-size=boxed] .navbar-header {
    max-width: 1300px
}

/*!
 * Waves v0.7.6
 * http://fian.my.id/Waves 
 * 
 * Copyleft 2014-2018 Alfiana E. Sibuea and other contributors 
 * Released under the MIT license 
 * https://github.com/fians/Waves/blob/master/LICENSE */
.waves-effect {
    position: relative;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent
}

.waves-effect .waves-ripple {
    position: absolute;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    margin-top: -50px;
    margin-right: -50px;
    opacity: 0;
    background: rgba(0, 0, 0, .2);
    background: radial-gradient(rgba(0, 0, 0, .2) 0, rgba(0, 0, 0, .3) 40%, rgba(0, 0, 0, .4) 50%, rgba(0, 0, 0, .5) 60%, rgba(255, 255, 255, 0) 70%);
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    -webkit-transition-property: -webkit-transform, opacity;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transform: scale(0) translate(0, 0);
    transform: scale(0) translate(0, 0);
    pointer-events: none
}

.waves-effect.waves-light .waves-ripple {
    background: rgba(255, 255, 255, .4);
    background: radial-gradient(rgba(255, 255, 255, .2) 0, rgba(255, 255, 255, .3) 40%, rgba(255, 255, 255, .4) 50%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0) 70%)
}

.waves-effect.waves-classic .waves-ripple {
    background: rgba(0, 0, 0, .2)
}

.waves-effect.waves-classic.waves-light .waves-ripple {
    background: rgba(255, 255, 255, .4)
}

.waves-notransition {
    -webkit-transition: none !important;
    transition: none !important
}

.waves-button,
.waves-circle {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-mask-image: -webkit-radial-gradient(circle, #fff 100%, #000 100%)
}

.waves-button,
.waves-button-input,
.waves-button:hover,
.waves-button:visited {
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: none;
    outline: 0;
    color: inherit;
    background-color: rgba(0, 0, 0, 0);
    font-size: 1em;
    line-height: 1em;
    text-align: center;
    text-decoration: none;
    z-index: 1
}

.waves-button {
    padding: .85em 1.1em;
    border-radius: .2em
}

.waves-button-input {
    margin: 0;
    padding: .85em 1.1em
}

.waves-input-wrapper {
    border-radius: .2em;
    vertical-align: bottom
}

.waves-input-wrapper.waves-button {
    padding: 0
}

.waves-input-wrapper .waves-button-input {
    position: relative;
    top: 0;
    right: 0;
    z-index: 1
}

.waves-circle {
    text-align: center;
    width: 2.5em;
    height: 2.5em;
    line-height: 2.5em;
    border-radius: 50%
}

.waves-float {
    -webkit-mask-image: none;
    -webkit-box-shadow: 0 1px 1.5px 1px rgba(0, 0, 0, .12);
    box-shadow: 0 1px 1.5px 1px rgba(0, 0, 0, .12);
    -webkit-transition: all .3s;
    transition: all .3s
}

.waves-float:active {
    -webkit-box-shadow: 0 8px 20px 1px rgba(0, 0, 0, .3);
    box-shadow: 0 8px 20px 1px rgba(0, 0, 0, .3)
}

.waves-block {
    display: block
}

.waves-effect.waves-light .waves-ripple {
    background-color: rgba(255, 255, 255, .4)
}

.waves-effect.waves-primary .waves-ripple {
    background-color: rgba(85, 110, 230, .4)
}

.waves-effect.waves-success .waves-ripple {
    background-color: rgba(52, 195, 143, .4)
}

.waves-effect.waves-info .waves-ripple {
    background-color: rgba(80, 165, 241, .4)
}

.waves-effect.waves-warning .waves-ripple {
    background-color: rgba(241, 180, 76, .4)
}

.waves-effect.waves-danger .waves-ripple {
    background-color: rgba(244, 106, 106, .4)
}

.avatar-xs {
    height: 1.8rem;
    width: 1.8rem;
}

.avatar-sm {
    height: 3rem;
    width: 3rem
}

.avatar-md {
    height: 4.5rem;
    width: 4.5rem
}

.avatar-lg {
    height: 6rem;
    width: 6rem
}

.avatar-xl {
    height: 7.5rem;
    width: 7.5rem
}

.avatar-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #556ee6;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 500;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

.custom-accordion .accordion-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 7px;
    background-color: #f6f6f6;
    padding: 12px 20px;
    color: #495057;
    font-weight: 600;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.custom-accordion .accordion-list.collapsed i.accor-plus-icon:before {
    content: "\F415"
}

.custom-accordion .accordion-list .accor-plus-icon {
    display: inline-block;
    font-size: 16px;
    height: 24px;
    width: 24px;
    line-height: 22px;
    background-color: #fff;
    text-align: center;
    border-radius: 50%
}

.custom-accordion .card-body {
    color: #74788d
}

.font-size-10 {
    font-size: 10px !important
}

.font-size-11 {
    font-size: 11px !important
}

.font-size-12 {
    font-size: 12px !important
}

.font-size-13 {
    font-size: 12px !important;
}

.font-size-14 {
    font-size: 14px !important
}

.font-size-15 {
    font-size: 15px !important;
    font-weight: bold;
}

.font-size-16 {
    font-size: 16px !important;
    font-weight: bold;
}

.font-size-17 {
    font-size: 17px !important
}

.font-size-18 {
    font-size: 18px !important
}
.font-size-19 {
    font-size: 19px !important
}
.font-size-20 {
    font-size: 20px !important
}

.font-size-22 {
    font-size: 22px !important
}

.font-size-24 {
    font-size: 24px !important
}

.font-weight-medium {
    font-weight: 500
}

.font-weight-semibold {
    font-weight: 600
}

.social-list-item {
    height: 2rem;
    width: 2rem;
    line-height: calc(2rem - 2px);
    display: block;
    border: 1px solid #adb5bd;
    border-radius: 50%;
    color: #adb5bd;
    text-align: center;
    -webkit-transition: all .4s;
    transition: all .4s
}

.social-list-item:hover {
    color: #74788d;
    background-color: #eff2f7
}

.w-xs {
    min-width: 80px
}

.w-sm {
    min-width: 95px
}

.w-md {
    min-width: 110px
}

.w-lg {
    min-width: 140px
}

.w-xl {
    min-width: 160px
}

#preloader {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 9999
}

#status {
    width: 40px;
    height: 40px;
    position: absolute;
    right: 50%;
    top: 50%;
    margin: -20px 0 0 -20px
}

.spinner-chase {
    margin: 0 auto;
    width: 40px;
    height: 40px;
    position: relative;
    -webkit-animation: spinner-chase 2.5s infinite linear both;
    animation: spinner-chase 2.5s infinite linear both
}

.chase-dot {
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-animation: chase-dot 2s infinite ease-in-out both;
    animation: chase-dot 2s infinite ease-in-out both
}

.chase-dot:before {
    content: '';
    display: block;
    width: 25%;
    height: 25%;
    background-color: #556ee6;
    border-radius: 100%;
    -webkit-animation: chase-dot-before 2s infinite ease-in-out both;
    animation: chase-dot-before 2s infinite ease-in-out both
}

.chase-dot:nth-child(1) {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s
}

.chase-dot:nth-child(1):before {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s
}

.chase-dot:nth-child(2) {
    -webkit-animation-delay: -1s;
    animation-delay: -1s
}

.chase-dot:nth-child(2):before {
    -webkit-animation-delay: -1s;
    animation-delay: -1s
}

.chase-dot:nth-child(3) {
    -webkit-animation-delay: -.9s;
    animation-delay: -.9s
}

.chase-dot:nth-child(3):before {
    -webkit-animation-delay: -.9s;
    animation-delay: -.9s
}

.chase-dot:nth-child(4) {
    -webkit-animation-delay: -.8s;
    animation-delay: -.8s
}

.chase-dot:nth-child(4):before {
    -webkit-animation-delay: -.8s;
    animation-delay: -.8s
}

.chase-dot:nth-child(5) {
    -webkit-animation-delay: -.7s;
    animation-delay: -.7s
}

.chase-dot:nth-child(5):before {
    -webkit-animation-delay: -.7s;
    animation-delay: -.7s
}

.chase-dot:nth-child(6) {
    -webkit-animation-delay: -.6s;
    animation-delay: -.6s
}

.chase-dot:nth-child(6):before {
    -webkit-animation-delay: -.6s;
    animation-delay: -.6s
}

@-webkit-keyframes spinner-chase {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes spinner-chase {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes chase-dot {

    100%,
    80% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes chase-dot {

    100%,
    80% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes chase-dot-before {
    50% {
        -webkit-transform: scale(.4);
        transform: scale(.4)
    }

    0%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes chase-dot-before {
    50% {
        -webkit-transform: scale(.4);
        transform: scale(.4)
    }

    0%,
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.form-check-left {
    padding-right: 0;
    display: inline-block;
    padding-left: 1.25rem
}

.form-check-left .form-check-input {
    left: 0;
    margin-right: 0
}

.form-check-left .form-check-label {
    display: block
}

.custom-control-left {
    padding-right: 0;
    padding-left: 1.5rem;
    display: inline-block
}

.custom-control-left .custom-control-label {
    display: inline-block
}

.custom-control-left .custom-control-label:after,
.custom-control-left .custom-control-label:before {
    right: auto;
    left: -1.5rem
}

.custom-control-left .custom-control-input {
    right: auto
}

.mini-stats-wid .mini-stat-icon {
    overflow: hidden;
    position: relative
}

.mini-stats-wid .mini-stat-icon:after,
.mini-stats-wid .mini-stat-icon:before {
    content: "";
    position: absolute;
    width: 8px;
    height: 54px;
    background-color: rgba(255, 255, 255, .1);
    right: 16px;
    -webkit-transform: rotate(32deg);
    transform: rotate(32deg);
    top: -5px;
    -webkit-transition: all .4s;
    transition: all .4s
}

.mini-stats-wid .mini-stat-icon::after {
    right: -12px;
    width: 12px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.mini-stats-wid:hover .mini-stat-icon::after {
    right: 60px
}

.button-items {
    margin-right: -8px;
    margin-bottom: -12px
}

.button-items .btn {
    margin-bottom: 12px;
    margin-right: 8px
}

.mfp-popup-form {
    max-width: 1140px
}

.bs-example-modal {
    position: relative;
    top: auto;
    left: auto;
    bottom: auto;
    right: auto;
    z-index: 1;
    display: block
}

.icon-demo-content {
    text-align: center;
    color: #adb5bd
}

.icon-demo-content i {
    display: block;
    font-size: 24px;
    margin-bottom: 16px;
    color: #74788d;
    -webkit-transition: all .4s;
    transition: all .4s
}

.icon-demo-content .col-lg-4 {
    margin-top: 24px
}

.icon-demo-content .col-lg-4:hover i {
    color: #556ee6;
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
}

.grid-structure .grid-container {
    background-color: #f8f9fa;
    margin-top: 10px;
    font-size: .8rem;
    font-weight: 500;
    padding: 10px 20px
}

.card-radio {
    background-color: #fff;
    border: 2px solid #f6f6f6;
    border-radius: .25rem;
    padding: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.card-radio:hover {
    cursor: pointer
}

.card-radio-label {
    display: block
}

.card-radio-input {
    display: none
}

.card-radio-input:checked + .card-radio {
    border-color: #556ee6 !important
}

.navs-carousel .owl-nav {
    margin-top: 16px
}

.navs-carousel .owl-nav button {
    width: 30px;
    height: 30px;
    line-height: 28px !important;
    font-size: 20px !important;
    border-radius: 50% !important;
    background-color: rgba(85, 110, 230, .25) !important;
    color: #556ee6 !important;
    margin: 4px 8px !important
}

@media print {

    .footer,
    .navbar-header,
    .page-title-box,
    .right-bar,
    .vertical-menu {
        display: none !important
    }

    .card-body,
    .main-content,
    .page-content,
    .right-bar,
    body {
        padding: 0;
        margin: 0
    }

    .card {
        border: 0
    }
}

[data-simplebar] {
    position: relative;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.simplebar-wrapper {
    overflow: hidden;
    width: inherit;
    height: inherit;
    max-width: inherit;
    max-height: inherit
}

.simplebar-mask {
    direction: inherit;
    position: absolute;
    overflow: hidden;
    padding: 0;
    margin: 0;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    width: auto !important;
    height: auto !important;
    z-index: 0
}

.simplebar-offset {
    direction: inherit !important;
    -webkit-box-sizing: inherit !important;
    box-sizing: inherit !important;
    resize: none !important;
    position: absolute;
    top: 0;
    right: 0 !important;
    bottom: 0;
    left: 0 !important;
    padding: 0;
    margin: 0;
    -webkit-overflow-scrolling: touch
}

.simplebar-content-wrapper {
    direction: inherit;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    position: relative;
    display: block;
    height: 100%;
    width: auto;
    visibility: visible;
    overflow: auto;
    max-width: 100%;
    max-height: 100%;
    scrollbar-width: none;
    padding: 0 !important
}

.simplebar-content-wrapper::-webkit-scrollbar,
.simplebar-hide-scrollbar::-webkit-scrollbar {
    display: none
}

.simplebar-content:after,
.simplebar-content:before {
    content: ' ';
    display: table
}

.simplebar-placeholder {
    max-height: 100%;
    max-width: 100%;
    width: 100%;
    pointer-events: none
}

.simplebar-height-auto-observer-wrapper {
    -webkit-box-sizing: inherit !important;
    box-sizing: inherit !important;
    height: 100%;
    width: 100%;
    max-width: 1px;
    position: relative;
    float: right;
    max-height: 1px;
    overflow: hidden;
    z-index: -1;
    padding: 0;
    margin: 0;
    pointer-events: none;
    -webkit-box-flex: inherit;
    -ms-flex-positive: inherit;
    flex-grow: inherit;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0
}

.simplebar-height-auto-observer {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
    display: block;
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    height: 1000%;
    width: 1000%;
    min-height: 1px;
    min-width: 1px;
    overflow: hidden;
    pointer-events: none;
    z-index: -1
}

.simplebar-track {
    z-index: 1;
    position: absolute;
    left: 0;
    bottom: 0;
    pointer-events: none;
    overflow: hidden
}

[data-simplebar].simplebar-dragging .simplebar-content {
    pointer-events: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-select: none
}

[data-simplebar].simplebar-dragging .simplebar-track {
    pointer-events: all
}

.simplebar-scrollbar {
    position: absolute;
    left: 2px;
    width: 4px;
    min-height: 10px
}

.simplebar-scrollbar:before {
    position: absolute;
    content: '';
    background: #a2adb7;
    border-radius: 7px;
    right: 0;
    left: 0;
    opacity: 0;
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear
}

.simplebar-scrollbar.simplebar-visible:before {
    opacity: .5;
    -webkit-transition: opacity 0s linear;
    transition: opacity 0s linear
}

.simplebar-track.simplebar-vertical {
    top: 0;
    width: 11px
}

.simplebar-track.simplebar-vertical .simplebar-scrollbar:before {
    top: 2px;
    bottom: 2px
}

.simplebar-track.simplebar-horizontal {
    right: 0;
    height: 11px
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar:before {
    height: 100%;
    right: 2px;
    left: 2px
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar {
    left: auto;
    right: 0;
    top: 2px;
    height: 7px;
    min-height: 0;
    min-width: 10px;
    width: auto
}

[data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
    left: auto;
    right: 0
}

.hs-dummy-scrollbar-size {
    direction: rtl;
    position: fixed;
    opacity: 0;
    visibility: hidden;
    height: 500px;
    width: 500px;
    overflow-y: hidden;
    overflow-x: scroll
}

.simplebar-hide-scrollbar {
    position: fixed;
    right: 0;
    visibility: hidden;
    overflow-y: scroll;
    scrollbar-width: none
}

.custom-scroll {
    height: 100%
}

.lnb-calendars-item {
    display: inline-block;
    margin-left: 7px
}

.tui-full-calendar-layout,
.tui-full-calendar-timegrid-timezone {
    background-color: #fff !important
}

.tui-full-calendar-dayname-container,
.tui-full-calendar-right,
.tui-full-calendar-splitter,
.tui-full-calendar-time-date,
.tui-full-calendar-timegrid-gridline,
.tui-full-calendar-timegrid-timezone,
.tui-full-calendar-weekday-grid-line {
    border-color: #f6f6f6 !important
}

.tui-full-calendar-weekday-exceed-in-week {
    text-align: center;
    width: 30px;
    height: 30px;
    line-height: 28px;
    border-radius: 4px;
    background-color: #fff;
    color: #495057;
    border-color: #eff2f7
}

.tui-full-calendar-timegrid-hour {
    color: #495057 !important
}

.tui-full-calendar-time-schedule,
.tui-full-calendar-weekday-schedule-title {
    font-weight: 600
}

.task-box {
    border: 1px solid #f6f6f6
}

.gu-transit {
    border: 1px dashed #74788d !important;
    background-color: #eff2f7 !important
}

#session-timeout-dialog .close {
    display: none
}

#session-timeout-dialog .countdown-holder {
    color: #f46a6a;
    font-weight: 500
}

#session-timeout-dialog .btn-default {
    background-color: #fff;
    color: #f46a6a;
    -webkit-box-shadow: none;
    box-shadow: none
}

.irs--square .irs-bar,
.irs--square .irs-from,
.irs--square .irs-single,
.irs--square .irs-to {
    background: #556ee6 !important;
    font-size: 11px
}

.irs--square .irs-from:before,
.irs--square .irs-single:before,
.irs--square .irs-to:before {
    border-top-color: #556ee6
}

.irs--square .irs-line {
    background: #f6f6f6;
    border-color: #f6f6f6
}

.irs--square .irs-grid-text {
    font-size: 11px;
    color: #ced4da
}

.irs--square .irs-max,
.irs--square .irs-min {
    color: #ced4da;
    background: #f6f6f6;
    font-size: 11px
}

.irs--square .irs-handle {
    border: 2px solid #556ee6;
    width: 12px;
    height: 12px;
    top: 26px;
    background-color: #fff !important
}

.swal2-container .swal2-title {
    font-size: 24px;
    font-weight: 500
}

.swal2-icon.swal2-question {
    border-color: #50a5f1;
    color: #50a5f1
}

.swal2-icon.swal2-success [class^=swal2-success-line] {
    background-color: #34c38f
}

.swal2-icon.swal2-success .swal2-success-ring {
    border-color: rgba(52, 195, 143, .3)
}

.swal2-icon.swal2-warning {
    border-color: #f1b44c;
    color: #f1b44c
}

.swal2-styled:focus {
    -webkit-box-shadow: none;
    box-shadow: none
}

.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step {
    background: #556ee6
}

.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step ~ .swal2-progress-step,
.swal2-progress-steps .swal2-progress-step.swal2-active-progress-step ~ .swal2-progress-step-line {
    background: rgba(85, 110, 230, .3)
}

.symbol {
    border-color: #fff
}

.rating-symbol-background,
.rating-symbol-foreground {
    font-size: 24px
}

.rating-symbol-foreground {
    top: 0
}

#toast-container > div {
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    opacity: 1
}

#toast-container > div:hover {
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    opacity: .9
}

#toast-container.toast-bottom-full-width > div,
#toast-container.toast-top-full-width > div {
    min-width: 96%;
    margin: 4px auto
}

.toast-primary {
    border: 2px solid #556ee6 !important;
    background-color: rgba(85, 110, 230, .8) !important
}

.toast-secondary {
    border: 2px solid #74788d !important;
    background-color: rgba(116, 120, 141, .8) !important
}

.toast-success {
    border: 2px solid #34c38f !important;
    background-color: rgba(52, 195, 143, .8) !important
}

.toast-info {
    border: 2px solid #50a5f1 !important;
    background-color: rgba(80, 165, 241, .8) !important
}

.toast-warning {
    border: 2px solid #f1b44c !important;
    background-color: rgba(241, 180, 76, .8) !important
}

.toast-danger {
    border: 2px solid #f46a6a !important;
    background-color: rgba(244, 106, 106, .8) !important
}

.toast-pink {
    border: 2px solid #e83e8c !important;
    background-color: rgba(232, 62, 140, .8) !important
}

.toast-light {
    border: 2px solid #eff2f7 !important;
    background-color: rgba(239, 242, 247, .8) !important
}

.toast-dark {
    border: 2px solid #343a40 !important;
    background-color: rgba(52, 58, 64, .8) !important
}

.toast-error {
    background-color: rgba(244, 106, 106, .8);
    border: 2px solid #f46a6a
}

.toastr-options {
    padding: 24px;
    background-color: #f6f8fa;
    margin-bottom: 0;
    border: 1px solid #eff2f7
}

.image-crop-preview .img-preview {
    float: right;
    margin-bottom: .5rem;
    margin-left: .5rem;
    overflow: hidden;
    background-color: #f6f6f6;
    text-align: center;
    width: 100%
}

.image-crop-preview .img-preview > img {
    max-width: 100%
}

.image-crop-preview .preview-lg {
    height: 9rem;
    width: 16rem
}

.image-crop-preview .preview-md {
    height: 4.5rem;
    width: 8rem
}

.image-crop-preview .preview-sm {
    height: 2.25rem;
    width: 4rem
}

.image-crop-preview .preview-xs {
    height: 1.125rem;
    margin-left: 0;
    width: 2rem
}

.img-crop-preview-btns .btn .docs-tooltip,
.img-crop-preview-toggles .btn .docs-tooltip {
    display: block;
    margin: -.47rem -.75rem;
    padding: .47rem .75rem
}

.error {
    color: #f46a6a
}

.parsley-error {
    border-color: #f46a6a
}

.parsley-errors-list {
    display: none;
    margin: 0;
    padding: 0
}

.parsley-errors-list.filled {
    display: block
}

.parsley-errors-list > li {
    font-size: 12px;
    list-style: none;
    color: #f46a6a;
    margin-top: 5px
}

.select2-container .select2-selection--single {
    background-color: #fff;
    border: 1px solid #ced4da;
    height: 38px
}

.select2-container .select2-selection--single:focus {
    outline: 0
}

.select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 36px;
    padding-right: 12px;
    color: #495057
}

.select2-container .select2-selection--single .select2-selection__arrow {
    height: 34px;
    width: 34px;
    left: 3px
}

.select2-container .select2-selection--single .select2-selection__arrow b {
    border-color: #adb5bd transparent transparent transparent;
    border-width: 6px 6px 0 6px
}

.select2-container .select2-selection--single .select2-selection__placeholder {
    color: #495057
}

.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #adb5bd transparent !important;
    border-width: 0 6px 6px 6px !important
}

.select2-container--default .select2-search--dropdown {
    padding: 10px;
    background-color: #fff
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #ced4da;
    background-color: #fff;
    color: #74788d;
    outline: 0
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #556ee6
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #f8f9fa;
    color: #16181b
}

.select2-container--default .select2-results__option[aria-selected=true]:hover {
    background-color: #556ee6;
    color: #fff
}

.select2-results__option {
    padding: 6px 12px
}

.select2-dropdown {
    border: 1px solid rgba(0, 0, 0, .15);
    background-color: #fff;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03)
}

.select2-search input {
    border: 1px solid #f6f6f6
}

.select2-container .select2-selection--multiple {
    min-height: 38px;
    background-color: #fff;
    border: 1px solid #ced4da !important
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
    padding: 2px 10px
}

.select2-container .select2-selection--multiple .select2-search__field {
    border: 0;
    color: #495057
}

.select2-container .select2-selection--multiple .select2-search__field::-webkit-input-placeholder {
    color: #495057
}

.select2-container .select2-selection--multiple .select2-search__field::-moz-placeholder {
    color: #495057
}

.select2-container .select2-selection--multiple .select2-search__field:-ms-input-placeholder {
    color: #495057
}

.select2-container .select2-selection--multiple .select2-search__field::-ms-input-placeholder {
    color: #495057
}

.select2-container .select2-selection--multiple .select2-search__field::placeholder {
    color: #495057
}

.select2-container .select2-selection--multiple .select2-selection__choice {
    background-color: #eff2f7;
    border: 1px solid #f6f6f6;
    border-radius: 1px;
    padding: 0 7px
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: #ced4da
}

.select2-container--default .select2-results__group {
    font-weight: 600
}

.select2-result-repository__avatar {
    float: right;
    width: 60px;
    margin-left: 10px
}

.select2-result-repository__avatar img {
    width: 100%;
    height: auto;
    border-radius: 2px
}

.select2-result-repository__statistics {
    margin-top: 7px
}

.select2-result-repository__forks,
.select2-result-repository__stargazers,
.select2-result-repository__watchers {
    display: inline-block;
    font-size: 11px;
    margin-left: 1em;
    color: #adb5bd
}

.select2-result-repository__forks .fa,
.select2-result-repository__stargazers .fa,
.select2-result-repository__watchers .fa {
    margin-left: 4px
}

.select2-result-repository__forks .fa.fa-flash::before,
.select2-result-repository__stargazers .fa.fa-flash::before,
.select2-result-repository__watchers .fa.fa-flash::before {
    content: "\f0e7";
    font-family: 'Font Awesome 5 Free'
}

.select2-results__option--highlighted .select2-result-repository__forks,
.select2-results__option--highlighted .select2-result-repository__stargazers,
.select2-results__option--highlighted .select2-result-repository__watchers {
    color: rgba(255, 255, 255, .8)
}

.select2-result-repository__meta {
    overflow: hidden
}

.img-flag {
    margin-left: 7px;
    height: 15px;
    width: 18px
}

input[switch] {
    display: none
}

input[switch] + label {
    font-size: 1em;
    line-height: 1;
    width: 45px;
    height: 28px;
    background-color: #ced4da;
    background-image: none;
    border-radius: 2rem;
    padding: .16667rem;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    position: relative;
    font-weight: 500;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}

input[switch] + label:before {
    color: #343a40;
    content: attr(data-off-label);
    display: block;
    font-family: inherit;
    font-weight: 500;
    font-size: 12px;
    line-height: 21px;
    position: absolute;
    left: 1px;
    margin: 3px;
    top: -2px;
    text-align: center;
    min-width: 1.66667rem;
    overflow: hidden;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

input[switch] + label:after {
    content: '';
    position: absolute;
    right: 3px;
    background-color: #232944 !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 2rem;
    height: 20px;
    width: 20px;
    top: 4px;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}

input[switch]:checked + label {
    background-color: #556ee6
}

input[switch]:checked + label {
    background-color: #556ee6
}

input[switch]:checked + label:before {
    color: #fff;
    content: attr(data-on-label);
    left: auto;
    right: 3px;
}

input[switch]:checked + label:after {
    right: 21px;
    background-color: #eff2f7;
}

input[switch=bool] + label {
    background-color: #f46a6a
}

input[switch=bool] + label:before,
input[switch=bool]:checked + label:before,
input[switch=default]:checked + label:before {
    color: #fff
}

input[switch=bool]:checked + label {
    background-color: #34c38f
}

input[switch=default]:checked + label {
    background-color: #a2a2a2
}

input[switch=primary]:checked + label {
    background-color: #556ee6
}

input[switch=success]:checked + label {
    background-color: #34c38f
}

input[switch=info]:checked + label {
    background-color: #50a5f1
}

input[switch=warning]:checked + label {
    background-color: #f1b44c
}

input[switch=danger]:checked + label {
    background-color: #f46a6a
}

input[switch=dark]:checked + label {
    background-color: #343a40
}

.square-switch {
    margin-left: 7px
}

.square-switch input[switch] + label,
.square-switch input[switch] + label:after {
    border-radius: 0
}

.datepicker {
    border: 1px solid #f8f9fa;
    padding: 8px;
    z-index: 999 !important;
    right: auto !important;
}

.datepicker table tr th {
    font-weight: 500
}

.datepicker table tr td .active.disabled,
.datepicker table tr td.active,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active:hover,
.datepicker table tr td.selected,
.datepicker table tr td.selected.disabled,
.datepicker table tr td.selected.disabled:hover,
.datepicker table tr td.selected:hover,
.datepicker table tr td.today,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today:hover {
    background-color: #f39520 !important;
    background-image: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #fff !important;
}

.datepicker table tr td span.focused,
.datepicker table tr td span:hover,
.datepicker table tr td.day.focused,
.datepicker table tr td.day:hover {
    background: #eff2f7
}

.datepicker table tr td span.new,
.datepicker table tr td span.old,
.datepicker table tr td.new,
.datepicker table tr td.old {
    color: #adb5bd;
    opacity: .6
}

.datepicker table tr td.range,
.datepicker table tr td.range.disabled,
.datepicker table tr td.range.disabled:hover,
.datepicker table tr td.range:hover {
    background-color: #f6f6f6
}

.table-condensed > tbody > tr > td,
.table-condensed > thead > tr > th {
    padding: 7px
}

.tbl-cha1 {}

.tbl-cha1 td {
    vertical-align: middle;
    font-size: 14px;
}

.tox-tinymce {
    border: 1px solid #f6f6f6 !important
}

.tox .tox-statusbar {
    border-top: 1px solid #f6f6f6 !important
}

.tox .tox-edit-area__iframe,
.tox .tox-menubar,
.tox .tox-statusbar {
    background-color: #fff !important;
    background: 0 0 !important
}

.tox .tox-mbtn {
    color: #495057 !important
}

.tox .tox-mbtn:hover:not(:disabled):not(.tox-mbtn--active) {
    background-color: #f6f6f6 !important
}

.tox .tox-tbtn:hover {
    background-color: #f6f6f6 !important
}

.tox .tox-toolbar,
.tox .tox-toolbar__overflow,
.tox .tox-toolbar__primary {
    background: #f6f6f6 !important
}

.tox .tox-tbtn {
    color: #495057 !important
}

.tox .tox-tbtn svg {
    fill: #495057 !important
}

.tox .tox-edit-area__iframe {
    background-color: #fff !important
}

.tox .tox-statusbar a,
.tox .tox-statusbar__path-item,
.tox .tox-statusbar__wordcount {
    color: #495057 !important
}

.tox:not([dir=rtl]) .tox-toolbar__group:not(:last-of-type) {
    border-left: 1px solid #e9e9e9 !important
}

.note-editor.note-frame {
    border: 1px solid #f6f6f6;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0
}

.note-editor.note-frame .note-statusbar {
    background-color: #f6f6f6;
    border-top: 1px solid #f6f6f6
}

.note-editor.note-frame .note-editing-area .note-codable,
.note-editor.note-frame .note-editing-area .note-editable {
    border: none;
    color: #adb5bd;
    background-color: transparent
}

.note-btn-group .note-btn {
    background-color: #f6f6f6 !important;
    border-color: #f6f6f6 !important
}

.note-status-output {
    display: none
}

.note-editable p:last-of-type {
    margin-bottom: 0
}

.card-header.note-toolbar .note-color .dropdown-menu,
.note-popover .popover-content .note-color .dropdown-menu {
    min-width: 344px
}

.note-popover {
    border-color: #f6f6f6
}

.card-header.note-toolbar,
.note-popover .popover-content {
    background-color: #f6f6f6
}

.note-toolbar {
    padding: 0 0 5px 5px !important
}

.dropzone {
    min-height: 230px;
    border: 2px dashed #ced4da;
    background: #fff;
    border-radius: 6px
}

.dropzone .dz-message {
    font-size: 24px;
    width: 100%
}

.twitter-bs-wizard .twitter-bs-wizard-nav {
    padding: 4px;
    background-color: rgba(85, 110, 230, .1)
}

.twitter-bs-wizard .twitter-bs-wizard-nav .step-number {
    display: inline-block;
    width: 38px;
    height: 38px;
    line-height: 34px;
    border: 2px solid #556ee6;
    color: #556ee6;
    text-align: center;
    border-radius: 50%
}

@media (max-width:991.98px) {
    .twitter-bs-wizard .twitter-bs-wizard-nav .step-number {
        display: block;
        margin: 0 auto 8px !important
    }
}

@media (min-width:992px) {
    .twitter-bs-wizard .twitter-bs-wizard-nav .nav-link {
        text-align: right
    }
}

.twitter-bs-wizard .twitter-bs-wizard-nav .nav-link.active {
    background-color: transparent;
    color: #495057
}

.twitter-bs-wizard .twitter-bs-wizard-nav .nav-link.active .step-number {
    background-color: #556ee6;
    color: #fff
}

.twitter-bs-wizard .twitter-bs-wizard-pager-link {
    padding-top: 24px;
    padding-right: 0;
    list-style: none;
    margin-bottom: 0
}

.twitter-bs-wizard .twitter-bs-wizard-pager-link li {
    display: inline-block
}

.twitter-bs-wizard .twitter-bs-wizard-pager-link li a {
    display: inline-block;
    padding: .47rem .75rem;
    background-color: #556ee6;
    color: #fff;
    border-radius: .25rem
}

.twitter-bs-wizard .twitter-bs-wizard-pager-link li.disabled a {
    cursor: not-allowed;
    background-color: #798ceb
}

.twitter-bs-wizard .twitter-bs-wizard-pager-link li.next {
    float: left
}

.twitter-bs-wizard-tab-content {
    padding-top: 24px;
    min-height: 262px
}

.table-rep-plugin .btn-toolbar {
    display: block
}

.table-rep-plugin .table-responsive {
    border: none !important
}

.table-rep-plugin .btn-group .btn-default {
    background-color: #74788d;
    color: #eff2f7;
    border: 1px solid #74788d
}

.table-rep-plugin .btn-group .btn-default.btn-primary {
    background-color: #556ee6;
    border-color: #556ee6;
    color: #fff;
    -webkit-box-shadow: 0 0 0 2px rgba(85, 110, 230, .5);
    box-shadow: 0 0 0 2px rgba(85, 110, 230, .5)
}

.table-rep-plugin .btn-group.pull-left {
    float: left
}

.table-rep-plugin .btn-group.pull-left .dropdown-menu {
    left: 0;
    -webkit-transform: none !important;
    transform: none !important;
    top: 100% !important
}

.table-rep-plugin tbody th {
    font-size: 14px;
    font-weight: 400
}

.table-rep-plugin .checkbox-row {
    padding-right: 40px;
    color: #495057 !important
}

.table-rep-plugin .checkbox-row:hover {
    background-color: #f6f8fa !important
}

.table-rep-plugin .checkbox-row label {
    display: inline-block;
    padding-right: 5px;
    position: relative
}

.table-rep-plugin .checkbox-row label::before {
    -o-transition: .3s ease-in-out;
    -webkit-transition: .3s ease-in-out;
    background-color: #fff;
    border-radius: 3px;
    border: 1px solid #f6f6f6;
    content: "";
    display: inline-block;
    height: 17px;
    right: 0;
    margin-right: -20px;
    position: absolute;
    transition: .3s ease-in-out;
    width: 17px;
    outline: 0 !important
}

.table-rep-plugin .checkbox-row label::after {
    color: #eff2f7;
    display: inline-block;
    font-size: 11px;
    height: 16px;
    right: 0;
    margin-right: -20px;
    padding-right: 3px;
    padding-top: 1px;
    position: absolute;
    top: -1px;
    width: 16px
}

.table-rep-plugin .checkbox-row input[type=checkbox] {
    cursor: pointer;
    opacity: 0;
    z-index: 1;
    outline: 0 !important
}

.table-rep-plugin .checkbox-row input[type=checkbox]:disabled + label {
    opacity: .65
}

.table-rep-plugin .checkbox-row input[type=checkbox]:focus + label::before {
    outline-offset: -2px;
    outline: 0
}

.table-rep-plugin .checkbox-row input[type=checkbox]:checked + label::after {
    content: "\f00c";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900
}

.table-rep-plugin .checkbox-row input[type=checkbox]:disabled + label::before {
    background-color: #f8f9fa;
    cursor: not-allowed
}

.table-rep-plugin .checkbox-row input[type=checkbox]:checked + label::before {
    background-color: #556ee6;
    border-color: #556ee6
}

.table-rep-plugin .checkbox-row input[type=checkbox]:checked + label::after {
    color: #fff
}

.table-rep-plugin .fixed-solution .sticky-table-header {
    top: 70px !important;
    background-color: #556ee6
}

.table-rep-plugin .fixed-solution .sticky-table-header table {
    color: #fff
}

@media (min-width:992px) {
    body[data-layout=horizontal] .fixed-solution .sticky-table-header {
        top: 120px !important
    }
}

.table-editable .editable-input .form-control {
    height: 2rem
}

.table-editable a.editable {
    color: #495057
}

.table-editable .editable-buttons .btn.btn-sm {
    font-size: 12px
}

.table-editable tbody td.focus {
    -webkit-box-shadow: inset 0 0 1px 1px #556ee6 !important;
    box-shadow: inset 0 0 1px 1px #556ee6 !important
}

.glyphicon {
    display: inline-block;
    font-family: "Material Design Icons";
    font-size: inherit;
    font-weight: 600;
    font-style: inherit
}

.glyphicon-ok:before {
    content: "\F012C"
}

.glyphicon-remove:before {
    content: "\F0156"
}

.dt-autofill-list {
    border: none !important;
    background-color: #fff !important
}

.dt-autofill-list .dt-autofill-button,
.dt-autofill-list .dt-autofill-question {
    border-bottom-color: #f6f6f6 !important
}

.dt-autofill-list ul li:hover {
    background-color: #f6f6f6 !important
}
.pieChartCon{
    margin: -12px 0 -9px;
}
#wallet-balance-chart{
    width: 200px !important;
    margin: 0 auto;
}
.vertical-collpsed #wallet-balance-chart  {
}
.apex-charts {
    min-height: 10px !important
}


.apex-charts .apexcharts-canvas {
    margin: 0 auto;
}

.apexcharts-tooltip-text,
.apexcharts-tooltip-title {
    font-family: 'cairo' !important
}

.apexcharts-legend-series {
    font-weight: 500
}

.apexcharts-gridline {
    pointer-events: none;
    stroke: #f8f9fa
}

.apexcharts-legend-text {
    color: #74788d !important;
    font-family: 'cairo' !important;
    font-size: 13px !important
}

.apexcharts-pie-label {
    fill: #fff !important
}


.e-charts {
    height: 350px
}

.flot-charts-height {
    height: 271px;
}
#four-status.flot-charts-height {
    height: 200px;
}
#website-stats .legend table{}
#website-stats .legend table td{
    padding: 3px 6px;
}
#website-stats .legend table td.legendColorBox > div{
    border: 2px #ddd solid !important;
}
#website-stats .legend table td.legendLabel{
    color: #7e7e7e;
    font-size: 12px;
    /* font-weight: normal; */
}

.flotTip {
    padding: 8px 12px;
    background-color: rgba(52, 58, 64, .9);
    z-index: 100;
    color: #f8f9fa;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    border-radius: 4px
}

.legendLabel {
    color: #adb5bd
}

.jqstooltip {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    width: auto !important;
    height: auto !important;
    background-color: #343a40 !important;
    -webkit-box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175);
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175);
    padding: 5px 10px !important;
    border-radius: 3px;
    border-color: #212529 !important
}

.jqsfield {
    color: #eff2f7 !important;
    font-size: 12px !important;
    line-height: 18px !important;
    font-family: 'cairo' !important;
    font-weight: 500 !important
}

.gmaps,
.gmaps-panaroma {
    height: 300px;
    background: #f8f9fa;
    border-radius: 3px
}

.gmaps-overlay {
    display: block;
    text-align: center;
    color: #fff;
    font-size: 16px;
    line-height: 40px;
    background: #556ee6;
    border-radius: 4px;
    padding: 10px 20px
}

.gmaps-overlay_arrow {
    right: 50%;
    margin-right: -16px;
    width: 0;
    height: 0;
    position: absolute
}

.gmaps-overlay_arrow.above {
    bottom: -15px;
    border-right: 16px solid transparent;
    border-left: 16px solid transparent;
    border-top: 16px solid #556ee6
}

.gmaps-overlay_arrow.below {
    top: -15px;
    border-right: 16px solid transparent;
    border-left: 16px solid transparent;
    border-bottom: 16px solid #556ee6
}

.jvectormap-label {
    border: none;
    background: #343a40;
    color: #f8f9fa;
    font-family: Poppins, sans-serif;
    font-size: .8125rem;
    padding: 5px 8px
}

.leaflet-map {
    height: 300px
}

.leaflet-map.leaflet-container {
    z-index: 99
}

.home-btn {
    position: absolute;
    top: 15px;
    left: 25px
}

.search-box .form-control {
    border-radius: 30px;
    padding-right: 40px
}

.search-box .search-icon {
    font-size: 16px;
    position: absolute;
    right: 13px;
    top: 0;
    line-height: 38px
}

.product-list li a {
    display: block;
    padding: 4px 0;
    color: #495057
}

.product-view-nav.nav-pills .nav-item {
    margin-right: 4px
}

.product-view-nav.nav-pills .nav-link {
    width: 36px;
    height: 36px;
    font-size: 16px;
    padding: 0;
    line-height: 36px;
    text-align: center;
    border-radius: 50%
}

.product-ribbon {
    position: absolute;
    left: 0;
    top: 0
}

.product-detai-imgs .nav .nav-link {
    margin: 7px 0
}

.product-detai-imgs .nav .nav-link.active {
    background-color: #f6f6f6
}

.product-color a {
    display: inline-block;
    text-align: center;
    color: #495057
}

.product-color a .product-color-item {
    margin: 7px
}

.product-color a.active,
.product-color a:hover {
    color: #556ee6
}

.product-color a.active .product-color-item,
.product-color a:hover .product-color-item {
    border-color: #556ee6 !important
}

.visa-card .visa-logo {
    line-height: .5
}

.visa-card .visa-pattern {
    position: absolute;
    font-size: 385px;
    color: rgba(255, 255, 255, .05);
    line-height: .4;
    left: 0;
    bottom: 0
}

.checkout-tabs .nav-pills .nav-link {
    margin-bottom: 24px;
    text-align: center;
    background-color: #fff;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03)
}

.checkout-tabs .nav-pills .nav-link.active {
    background-color: #556ee6
}

.checkout-tabs .nav-pills .nav-link .check-nav-icon {
    font-size: 36px
}

.email-rightbar {
    width: 236px;
    float: right;
    padding: 20px;
    border-radius: 5px
}

.email-rightbar {
    margin-right: 260px
}

.chat-user-box p.user-title {
    color: #343a40;
    font-weight: 500
}

.chat-user-box p {
    font-size: 12px
}

@media (max-width:767px) {
    .email-rightbar {
        float: none;
        width: 100%
    }

    .email-rightbar {
        margin: 0
    }
}

.mail-list a {
    display: block;
    color: #74788d;
    line-height: 24px;
    padding: 8px 5px
}

.mail-list a.active {
    color: #f46a6a;
    font-weight: 500
}

.message-list {
    display: block;
    padding-right: 0
}

.message-list li {
    position: relative;
    display: block;
    height: 50px;
    line-height: 50px;
    cursor: default;
    -webkit-transition-duration: .3s;
    transition-duration: .3s
}

.message-list li a {
    color: #74788d
}

.message-list li:hover {
    background: #f6f6f6;
    -webkit-transition-duration: .05s;
    transition-duration: .05s
}

.message-list li .col-mail {
    float: right;
    position: relative
}

.message-list li .col-mail-1 {
    width: 320px
}

.message-list li .col-mail-1 .checkbox-wrapper-mail,
.message-list li .col-mail-1 .dot,
.message-list li .col-mail-1 .star-toggle {
    display: block;
    float: right
}

.message-list li .col-mail-1 .dot {
    border: 4px solid transparent;
    border-radius: 100px;
    margin: 22px 26px 0;
    height: 0;
    width: 0;
    line-height: 0;
    font-size: 0
}

.message-list li .col-mail-1 .checkbox-wrapper-mail {
    margin: 15px 10px 0 20px
}

.message-list li .col-mail-1 .star-toggle {
    margin-top: 18px;
    margin-right: 5px
}

.message-list li .col-mail-1 .title {
    position: absolute;
    top: 0;
    right: 110px;
    left: 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    margin-bottom: 0
}

.message-list li .col-mail-2 {
    position: absolute;
    top: 0;
    right: 320px;
    left: 0;
    bottom: 0
}

.message-list li .col-mail-2 .date,
.message-list li .col-mail-2 .subject {
    position: absolute;
    top: 0
}

.message-list li .col-mail-2 .subject {
    right: 0;
    left: 200px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.message-list li .col-mail-2 .date {
    left: 0;
    width: 170px;
    padding-right: 80px
}

.message-list li.active,
.message-list li.active:hover {
    -webkit-box-shadow: inset 3px 0 0 #556ee6;
    box-shadow: inset 3px 0 0 #556ee6
}

.message-list li.unread {
    background-color: #f6f6f6;
    font-weight: 500;
    color: #292d32
}

.message-list li.unread a {
    color: #292d32;
    font-weight: 500
}

.message-list .checkbox-wrapper-mail {
    cursor: pointer;
    height: 20px;
    width: 20px;
    position: relative;
    display: inline-block;
    -webkit-box-shadow: inset 0 0 0 1px #ced4da;
    box-shadow: inset 0 0 0 1px #ced4da;
    border-radius: 1px
}

.message-list .checkbox-wrapper-mail input {
    opacity: 0;
    cursor: pointer
}

.message-list .checkbox-wrapper-mail input:checked ~ label {
    opacity: 1
}

.message-list .checkbox-wrapper-mail label {
    position: absolute;
    height: 20px;
    width: 20px;
    right: 0;
    cursor: pointer;
    opacity: 0;
    margin-bottom: 0;
    -webkit-transition-duration: .05s;
    transition-duration: .05s;
    top: 0
}

.message-list .checkbox-wrapper-mail label:before {
    content: "\F12C";
    font-family: "Material Design Icons";
    top: 0;
    height: 20px;
    color: #292d32;
    width: 20px;
    position: absolute;
    margin-top: -16px;
    right: 4px;
    font-size: 13px
}

@media (max-width:575.98px) {
    .message-list li .col-mail-1 {
        width: 200px
    }
}

@media (min-width:992px) {
    .chat-rightsidebar {
        min-width: 380px
    }
}

.chat-rightsidebar .chat-rightsidebar-nav .nav {
    background-color: #fff
}

.chat-rightsidebar .chat-rightsidebar-nav .tab-content {
    min-height: 488px
}

.chat-noti-dropdown.active:before {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    background-color: #f46a6a;
    border-radius: 50%;
    left: 0
}

.chat-noti-dropdown .btn {
    padding: 6px;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 20px
}

.chat-search-box .form-control {
    border: 0
}

.chat-list {
    margin: 0
}

.chat-list li.active a {
    background-color: #fff;
    border-color: transparent;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03)
}

.chat-list li a {
    display: block;
    padding: 14px 16px;
    color: #74788d;
    -webkit-transition: all .4s;
    transition: all .4s;
    border-top: 1px solid #eff2f7;
    border-radius: 4px
}

.chat-list li a:hover {
    background-color: #fff;
    border-color: transparent;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03)
}

.user-chat-nav .dropdown .nav-btn {
    height: 40px;
    width: 40px;
    line-height: 40px;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;
    font-size: 16px;
    background-color: #eff2f7;
    border-radius: 50%
}

.user-chat-nav .dropdown .dropdown-menu {
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    border: 1px solid #eff2f7
}

.chat-conversation li {
    clear: both
}

.chat-conversation .chat-day-title {
    position: relative;
    text-align: center;
    margin-bottom: 24px
}

.chat-conversation .chat-day-title .title {
    background-color: #fff;
    position: relative;
    z-index: 1;
    padding: 6px 24px
}

.chat-conversation .chat-day-title:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    right: 0;
    left: 0;
    background-color: #eff2f7;
    top: 10px
}

.chat-conversation .chat-day-title .badge {
    font-size: 12px
}

.chat-conversation .conversation-list {
    margin-bottom: 24px;
    display: inline-block;
    position: relative
}

.chat-conversation .conversation-list .ctext-wrap {
    padding: 12px 24px;
    background-color: rgba(85, 110, 230, .1);
    border-radius: 8px 8px 8px 0;
    overflow: hidden
}

.chat-conversation .conversation-list .ctext-wrap .conversation-name {
    font-weight: 600;
    color: #556ee6;
    margin-bottom: 4px
}

.chat-conversation .conversation-list .dropdown {
    float: left
}

.chat-conversation .conversation-list .dropdown .dropdown-toggle {
    font-size: 18px;
    padding: 4px;
    color: #74788d
}

@media (max-width:575.98px) {
    .chat-conversation .conversation-list .dropdown .dropdown-toggle {
        display: none
    }
}

.chat-conversation .conversation-list .dropdown .dropdown-menu {
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    border: 1px solid #eff2f7
}

.chat-conversation .conversation-list .chat-time {
    font-size: 12px
}

.chat-conversation .left .conversation-list {
    float: left
}

.chat-conversation .left .conversation-list .ctext-wrap {
    background-color: #eff2f7;
    text-align: left;
    border-radius: 8px 8px 0 8px
}

.chat-conversation .left .conversation-list .dropdown {
    float: right
}

.chat-conversation .left .conversation-list.last-chat .conversation-list:before {
    left: 0;
    right: auto
}

.chat-conversation .last-chat .conversation-list:before {
    content: "\F009";
    font-family: "Material Design Icons";
    position: absolute;
    color: #556ee6;
    left: 0;
    bottom: 0;
    font-size: 16px
}

@media (max-width:575.98px) {
    .chat-conversation .last-chat .conversation-list:before {
        display: none
    }
}

.chat-input-section {
    border-top: 1px solid #eff2f7
}

.chat-input {
    border-radius: 30px;
    background-color: #eff2f7 !important;
    border-color: #eff2f7 !important;
    padding-left: 120px
}

.chat-input-links {
    position: absolute;
    left: 16px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.chat-input-links li a {
    font-size: 16px;
    line-height: 36px;
    padding: 0 4px;
    display: inline-block
}

@media (max-width:575.98px) {
    .chat-send {
        min-width: auto
    }
}

.project-list-table {
    border-collapse: separate;
    border-spacing: 0 12px
}

.project-list-table tr {
    background-color: #fff
}

.contact-links a {
    color: #495057
}

.profile-user-wid {
    margin-top: -26px
}

@media (min-width:576px) {
    .currency-value {
        position: relative
    }

    .currency-value:after {
        content: "\F04E1";
        font-family: "Material Design Icons";
        font-size: 24px;
        position: absolute;
        width: 45px;
        height: 45px;
        line-height: 45px;
        border-radius: 50%;
        text-align: center;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        background-color: #556ee6;
        color: #fff;
        z-index: 9;
        left: -34px
    }
}

.crypto-buy-sell-nav-content {
    border: 2px solid #f6f6f6;
    border-top: 0
}

.kyc-doc-verification .dropzone {
    min-height: 180px
}

.kyc-doc-verification .dropzone .dz-message {
    margin: 24px 0
}

.section {
    position: relative;
    padding-top: 80px;
    padding-bottom: 80px
}

.section.bg-white {
    background-color: #fff !important
}

.small-title {
    color: #74788d;
    margin-bottom: 8px
}

.navigation {
    padding: 0 16px;
    width: 100%;
    z-index: 999;
    margin-bottom: 0;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

@media (max-width:991.98px) {
    .navigation {
        background-color: #fff
    }
}

.navigation .navbar-logo {
    line-height: 70px;
    -webkit-transition: all .4s;
    transition: all .4s
}

.navigation .navbar-logo .logo-dark {
    display: none
}

@media (max-width:991.98px) {
    .navigation .navbar-logo .logo-dark {
        display: block
    }
}

.navigation .navbar-logo .logo-light {
    display: block
}

@media (max-width:991.98px) {
    .navigation .navbar-logo .logo-light {
        display: none
    }
}

.navigation .navbar-nav .nav-item .nav-link {
    color: rgba(255, 255, 255, .6);
    line-height: 58px;
    padding: 6px 16px;
    font-weight: 500;
    -webkit-transition: all .4s;
    transition: all .4s
}

@media (max-width:991.98px) {
    .navigation .navbar-nav .nav-item .nav-link {
        color: #555b6d
    }
}

.navigation .navbar-nav .nav-item .nav-link.active,
.navigation .navbar-nav .nav-item .nav-link:hover {
    color: rgba(255, 255, 255, .9)
}

@media (max-width:991.98px) {

    .navigation .navbar-nav .nav-item .nav-link.active,
    .navigation .navbar-nav .nav-item .nav-link:hover {
        color: #556ee6
    }
}

@media (max-width:991.98px) {
    .navigation .navbar-nav .nav-item .nav-link {
        line-height: 28px !important
    }
}

.navigation.nav-sticky {
    background-color: #fff;
    -webkit-box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 .75rem 1.5rem rgba(18, 38, 63, .03)
}

.navigation.nav-sticky .navbar-logo {
    line-height: 60px
}

.navigation.nav-sticky .navbar-logo .logo-dark {
    display: block
}

.navigation.nav-sticky .navbar-logo .logo-light {
    display: none
}

.navigation.nav-sticky .navbar-nav .nav-item .nav-link {
    line-height: 48px;
    color: #555b6d
}

.navigation.nav-sticky .navbar-nav .nav-item .nav-link.active,
.navigation.nav-sticky .navbar-nav .nav-item .nav-link:hover {
    color: #556ee6
}

.bg-overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    opacity: .7;
    background-color: #000
}

.hero-section {
    padding-top: 220px;
    padding-bottom: 190px
}

.hero-section.bg-ico-hero {
    background-image: url(../images/crypto/bg-ico-hero.jpg);
    background-size: cover;
    background-position: top
}

@media (max-width:575.98px) {
    .hero-section {
        padding-top: 140px;
        padding-bottom: 80px
    }
}

.hero-section .hero-title {
    font-size: 42px
}

@media (max-width:575.98px) {
    .hero-section .hero-title {
        font-size: 26px
    }
}

.hero-section .ico-countdown {
    font-size: 22px;
    margin-left: -12px;
    margin-right: -12px
}

@media (max-width:575.98px) {
    .hero-section .ico-countdown {
        display: block
    }
}

.hero-section .ico-countdown .coming-box {
    margin-left: 12px;
    margin-right: 12px;
    border: 1px solid #eff2f7;
    border-radius: 4px;
    padding: 8px;
    background-color: #fff
}

@media (max-width:575.98px) {
    .hero-section .ico-countdown .coming-box {
        display: inline-block;
        width: 40%;
        margin-bottom: 24px
    }
}

.hero-section .ico-countdown .coming-box span {
    background-color: #eff2f7;
    font-size: 12px;
    padding: 4px;
    margin-top: 8px
}

.hero-section .softcap-progress {
    overflow: visible
}

.hero-section .softcap-progress .progress-bar {
    overflow: visible
}

.hero-section .softcap-progress .progress-label {
    position: relative;
    text-align: left;
    color: #495057;
    bottom: 20px;
    font-size: 12px;
    font-weight: 500
}

.currency-price {
    position: relative;
    bottom: 40px
}

.client-images img {
    max-height: 34px;
    width: auto !important;
    margin: 12px auto;
    opacity: .7;
    -webkit-transition: all .4s;
    transition: all .4s
}

.features-number {
    opacity: .1
}

.team-box .team-social-links a {
    color: #495057;
    font-size: 14px
}

.blog-box .blog-badge {
    position: absolute;
    top: 12px;
    left: 12px
}

.landing-footer {
    padding: 80px 0 40px;
    background-color: #2a3042;
    color: rgba(255, 255, 255, .5)
}

.landing-footer .footer-list-title {
    color: rgba(255, 255, 255, .9)
}

.landing-footer .footer-list-menu li a {
    display: block;
    color: rgba(255, 255, 255, .5);
    margin-bottom: 14px;
    -webkit-transition: all .4s;
    transition: all .4s
}

.landing-footer .footer-list-menu li a:hover {
    color: rgba(255, 255, 255, .8)
}

.landing-footer .blog-post .post {
    display: block;
    color: rgba(255, 255, 255, .5);
    padding: 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.landing-footer .blog-post .post .post-title {
    color: rgba(255, 255, 255, .8);
    font-size: 14px
}

.landing-footer .blog-post .post:first-of-type {
    padding-top: 0
}

.landing-footer .blog-post .post:last-of-type {
    padding-bottom: 0;
    border-bottom: 0
}

.landing-footer .footer-border {
    border-color: rgba(255, 255, 255, .1)
}

.counter-number {
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.counter-number span {
    font-size: 16px;
    font-weight: 400;
    display: block;
    padding-top: 5px
}

.coming-box {
    width: 25%
}

.hori-timeline .events .event-list {
    text-align: center;
    display: block
}

.hori-timeline .events .event-list .event-down-icon {
    position: relative
}

.hori-timeline .events .event-list .event-down-icon::before {
    content: "";
    position: absolute;
    width: 100%;
    top: 16px;
    right: 0;
    left: 0;
    border-bottom: 3px dashed #f6f6f6
}

.hori-timeline .events .event-list .event-down-icon .down-arrow-icon {
    position: relative;
    background-color: #fff;
    padding: 4px
}

.hori-timeline .events .event-list:hover .down-arrow-icon {
    -webkit-animation: fade-down 1.5s infinite linear;
    animation: fade-down 1.5s infinite linear
}

.hori-timeline .events .event-list.active .down-arrow-icon {
    -webkit-animation: fade-down 1.5s infinite linear;
    animation: fade-down 1.5s infinite linear
}

.hori-timeline .events .event-list.active .down-arrow-icon:before {
    content: "\ec4c"
}

.verti-timeline {
    border-right: 3px dashed #f6f6f6;
    margin: 0 10px
}

.verti-timeline .event-list {
    position: relative;
    padding: 0 0 40px 30px
}

.verti-timeline .event-list .event-timeline-dot {
    position: absolute;
    right: -9px;
    top: 0;
    z-index: 9;
    font-size: 16px
}

.verti-timeline .event-list .event-content {
    position: relative;
    border: 2px solid #eff2f7;
    border-radius: 7px
}

.verti-timeline .event-list.active .event-timeline-dot {
    color: #556ee6
}

.verti-timeline .event-list:last-child {
    padding-bottom: 0
}

.plan-box .plan-btn {
    position: relative
}

.plan-box .plan-btn::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background: #f6f6f6;
    right: 0;
    left: 0;
    top: 12px
}

/**********************************/

table.orders-grid {}

table.orders-grid .btn {
    font-size: 12px;
    padding: .53rem 1.50rem;
}

table.orders-grid thead tr th:last-child {
    /* width: 155px !important; */
}

table.orders-grid thead tr th:first-child {
    /* width: 60px !important; */
    text-align: center;
}
table.orders-grid tr td:first-child {
    text-align: center;
    color: #f7901f;
    font-weight: 600;
}



table.orders-grid tr td:first-child {
    text-align: center;
    color: #f7901f;
    font-weight: bold;
}

table.orders-grid tr td {
    font-weight: bold;
    padding: 10px 12px !important;
    vertical-align: middle;
    font-size: 13px;
}


table.orders-grid tr th {
    padding: 25px 13px;
    font-weight: bold;
    font-size: 14px;
    border: 1px solid #dedede;
}

table.orders-grid tr td {

border: 1px solid #dedede;
}

table.orders-grid thead th:nth-child(3) {

    text-align: center !important;
}

table.orders-grid thead th:nth-child(4) {

    text-align: center !important;
}

table.orders-grid tbody td:nth-child(3) {

    text-align: center;
}

table.orders-grid tbody td:nth-child(4) {

    text-align: center;
}

table.orders-grid tbody td:nth-child(5) {

    text-align: center;
}

.gridIco {
    width: 52px;
    display: inline-block;
}

.gridIco img {
    width: 30px;
}
/*******************/
.table {border-collapse:separate;border-spacing: 0;}
.table  thead tr th{border-bottom:none;border-left:none}
.table  tr td{border-bottom: none !important;}
.table  tr td{border-left: none !important;}

.table  thead tr th:first-child{
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    border-top-right-radius: 10px;
}
.table  thead tr th:last-child{
   -webkit-border-top-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    border-top-left-radius: 10px;
}
.table  tbody tr:last-child td:first-child{
    -webkit-border-bottom-right-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    border-bottom-right-radius: 10px;
}
.table  tbody tr:last-child td:last-child{
    -webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 10px;
}
.table.table-bordered tbody tr:last-child td{
    border-bottom: 1px solid #dedede!important;
}
.table.table-bordered tbody td:last-child  , .table.table-bordered thead th:last-child {
    border-left: 1px solid #dedede!important;
}
/* ======
18. Form-elements
   ====== */
/* ==============
  Form-elements
===================*/
label {
    font-weight: 600;
}

.form-control {
    font-size: 12px;
    height: 44px;
    border-radius: 0;
    background-color: #fcfcfc;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border: 1px solid #c9c9c9;
    color: #4b4b4b !important;
    font-weight: bold;
    margin-bottom: 5px;
}

select.form-control {
    background: #fff url(../images/arrowdown.svg) no-repeat left .75rem center;
    background-size: 11px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.form-control::-webkit-input-placeholder {
    color: #919191 !important;
    font-weight: bold!important;
    font-size:12px!important;
}

.form-control:focus {
    border-color: #9150ae;
    -webkit-box-shadow: 0 3px 10px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 3px 10px 0 rgba(0, 0, 0, .15);
}

.fileBox {}

.fileBox input {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.fileBox label {

    position: relative;
}

.fileBox label span {
    font-size: 15px;
    display: block;
    padding-left: 91px;
    margin: 7px 0 0;
}

.fileBox label button {
    font-size: 15px;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border: none;
    background: #187fce;
    color: #fff !important;
    padding: 10px 23px !important;
    border-radius: 0 !important;
    -webkit-border-top-left-radius: 5px !important;
    -webkit-border-bottom-left-radius: 5px !important;
    -moz-border-radius-topleft: 5px !important;
    -moz-border-radius-bottomleft: 5px !important;
    border-top-left-radius: 5px !important;
    border-bottom-left-radius: 5px !important;
}

.form-group .custom-control {
    margin: 0;
    margin-left: 15px
}

.nav-tabs-custom {
    border: none;
    margin-bottom: 30px;
}

.nav-tabs-custom .nav-item {
    position: relative;
}

.nav-tabs-custom .nav-item .nav-link {

position: relative;

/* background: #f39520; */

border-radius: 0;

padding: 20px 12px;

padding-left: 8px;

position: relative;

border: none;

color: #474747;

font-weight: bold;

font-size: 14px;

-webkit-transition: all .5s ease;

transition: all .5s ease;
}

.nav-tabs-custom .nav-item .nav-link::after {
    position: absolute;
    top: 39%;
    right: 44%;
    content: "";
    width: 279px;
    height: 4px;
    z-index: 1;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f39520+50,fbc434+50 */
    -webkit-transform: scale(1);
    transform: scale(1);
    background: #fccd92;
    /* Old browsers */

    /* FF3.6-15 */

    /* Chrome10-25,Safari5.1-6 */

    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

    /* IE6-9 */
}

.nav-tabs-custom .nav-item:last-child .nav-link::after {
    display: none
}

.nav-tabs-custom .nav-item:first-child .nav-link {
    text-align: right
}

.nav-tabs-custom .nav-item:first-child .nav-link .tabicoCon {
    margin-right: 20px
}

.nav-tabs-custom .nav-item:last-child .nav-link {
    text-align: left
}

.nav-tabs-custom .nav-item:last-child .nav-link .tabicoCon {
    margin-left: 10px
}


.nav-tabs-custom .nav-item .nav-link .tabicoCon {
    position: relative;
    z-index: 2;
    width: 80px;
    height: 80px;
    margin: 0 auto;
    font-size: 28px;
    display: flex;
    color: #fff;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fbc434+50,f39520+50 */
    justify-content: center;
    font-weight: bold;
    align-items: center;
    margin-bottom: 11px;
    border-radius: 100%;
    background-color: #fff;
    border: 2px #f39520 solid;
    color: #474747;
    outline: solid 4px #fff;
}

.nav-tabs-custom .nav-item .nav-link .tabicoCon i {

    color: #f39520;
    margin: 0 !important;
}

.nav-tabs-custom .nav-item .nav-link.active .tabicoCon,
.nav-tabs-custom .nav-item .nav-link.active:hover .tabicoCon {
    color: #fff;
    background: #f1b44c;
    /* Old browsers */

    /* FF3.6-15 */

    /* Chrome10-25,Safari5.1-6 */

    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

    /* IE6-9 */
    border: none;
    outline: solid 4px #fff;
}


.nav-tabs-custom .nav-item .nav-link:hover .tabicoCon {
    color: #f39520;
}

.nav-tabs-custom .nav-item .nav-link:hover {
    color: #f39520 !important;
}

.nav-tabs-custom .nav-item .nav-link:hover i {
    color: #979797 !important;
}

.nav-tabs-custom .nav-item .nav-link.active {
    color: #363b74 !important;
}

.nav-tabs-custom .nav-item .nav-link.active i {
    color: #fff !important;
}


.nav-tabs-custom > li > a {
    color: #2a3142;
}



.nav-tabs-custom > li > a.active::after,
.nav-tabs-custom > li:hover > a::after {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.nav-tabs-custom > li > a.active {
    color: #623AA2 !important;
}

.totalicns {

margin-bottom: 0;

justify-content: center;

display: flex;

padding: 20px 0;

background: #fafafa;

margin-top: -16px;

margin-bottom: 0;

border-radius: 15px;
}

.totalicns li {

    display: inline-block;

    margin-left: 21px;
}

.totalicns a {

color: #323232 !important;

font-size: 14px;

font-weight: bold;
}

.totalicns a:hover {
    color: #354c90 !important
}

.totalicns span {

    margin-left: 5px;

    color: #f39520;

    font-size: 28px;

    position: relative;

    top: 6px;
}

.icnsbranch {
    font-size: 24px;
    position: relative;
    top: 5px;
}

.notifcont {

    margin: 20px 0;

    border-bottom: solid 1px #e2e2e2;

    padding-bottom: 21px;
}

.notifcont:last-child {
    border-bottom: none
}

.notifcont h1 {}

.notifcont h2 {}

.notifcont img {}

.notifcont a {

color: #535353;

font-size: 14px;

display: inline-block;

margin-bottom: 1px;

margin-top: 12px;
}

.notifcont strong {
    color: #34c38f;
    font-weight: bold!important;
    font-size: 13px;
}

.notifcont p {

font-size: 12px;

font-weight: 600!important;

margin-top: 1px;
}

.notifcont span {
    color: #f39520
}

.notifcont i {

    position: relative;

    /* top: 8px; */

    justify-content: center;

    align-items: center;

    display: flex;

    float: right;

    height: 60px;

    width: 60px;

    text-align: center;

    margin-left: 15px;

    border-radius: 50%;

    /* color: #fff; */

    font-size: 28px;

    /* padding-top: 10px !important; */
}

/* Input with icons */
.input_with_icon {
    position: relative;
}

.input_with_icon span {
    position: absolute;
    left: 20px;
    margin-top: -3px;
    top: 50%;
    font-size: 16px;
    color: #f1b44c;
    font-weight: bold;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.datepicker table {
    direction: rtl
}

.table tbody > tr > td.type span {
    line-height: 26px;
    -webkit-border-radius: 200px;
    border-radius: 200px;
    display: inline-block;
    padding: 0 15px;
    color: #fff;
    font-weight: bold;
    font-size: 12px;
    white-space: nowrap;
    width: 100%;
    text-align: center;
}

/*
.table tbody > tr > td.type span.sale {
    background: #34c38f;
}

.table tbody > tr > td.type span.purchase {
    background: #f39520;
}

.table tbody > tr > td.type span.credited {
    background: #0078ae;
}

.table tbody > tr > td.type span.withdrawal {
    background: #d43953;
}
*/
.table tbody > tr > td.earning {
    color: #483475;
    font-weight: 500;
}

.table tbody > tr > td.earning.subtract {
    color: #7347c1;
}

.tooltip .tooltip-inner {
    padding: 4px 10px;
    background: #000000;
    position: relative;
    z-index: 2;
    border-radius: 10px;
    font-family: 'cairo' !important;
}

.tooltip .arrow {
    font-family: "Font Awesome 5 Pro";
    position: absolute;
    left: 0 !important;
    right: 0;
    top: 83%;
    margin: 0 auto;
    width: 13px;
    text-align: center;
    font-weight: bold;
    color: #000000;
}

.tooltip .arrow:after {
    content: "\f0dd";
    font-size: 24px;
    display: none;
}

.single_acco_title {}

.single_acco_title a {
    background: #f1f1f1;
    display: block;
    color: #434343;
    font-size: 15px;
    font-weight: bold;
    padding: 23px 18px 20px;
    position: relative;
    padding-right: 45px;
    border-bottom: 1px solid #e9ecef !important;
    border-radius: 20px;
    box-shadow: none;
}

.single_acco_title a:before {
    position: absolute;
    top: 29%;
    right: 14px;
    font-family: 'Material Design Icons';
    color: #8f8f8f;
    font-weight: normal;
    font-size: 25px;
    content: '\F377';
}

.single_acco_title a[aria-expanded="false"]:before {
    content: '\F419';
}

.single_acco_title a[aria-expanded="true"]:before {
    content: '\F377';
}


/*******************************
--- Advanced Search
*******************************/
.top-search {}

.top-search h1 {
    text-align: right;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
}

.advanced-search {}

.advanced-search .form-row {

    background: #623AA2;

    padding: 15px 8px;
}

.advanced-search h1 {

    font-size: 19px;

    margin-bottom: 29px;
}

.searchcont:first-child {
    margin: 20px 0;
}

.searchcont {

    margin: 35px 0;

    border-bottom: solid 2px #efefef;

    padding-bottom: 21px;
}

.searchcont .satusIco {
    display: flex;
    text-align: center;
    height: 100%;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.searchcont .satusIco img {
    width: 41px;
}

.satusIco {
    width: 65px !important;
}

.searchcont:last-child {
    border-bottom: none;
}

.searchcont .status {
    height: 140px;
    width: 140px;
    float: left;
    border-radius: 100%;
    justify-content: center;
    display: flex;
    align-items: center;
    font-size: 16px;
    line-height: 21px;
    border: solid 5px #34c38f;
}

.searchcont .status1 {
    height: 140px;
    width: 140px;
    float: left;
    border-radius: 100%;
    justify-content: center;
    display: flex;
    align-items: center;
    font-size: 16px;
    line-height: 21px;
    border: solid 5px #f7ac0c;
}

.searchcont .status2 {

    border: solid 5px #d43953;
}

.searchcont h1 {

    font-size: 15px;

    color: #f39520;

    font-weight: 600;

    margin-bottom: 10px;
}

.searchcont h2 {}

.searchcont h3 {}

.searchcont a {

font-size: 15px;

color: #111111;

margin-bottom: 13px;

display: block;
}

.searchcont strong {

    color: #187fce;

    font-weight: normal;

    font-size: 14px;
}

.searchcont p {

margin-bottom: 12px;

font-weight: normal;

font-size: 13px;

/* color: #000; */
}

.searchcont i {

    font-size: 19px;

    border-radius: 10px;

    text-align: center;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    background: #fafafa;

    color: #fff;

    padding-top: 0;

    width: 45px;

    height: 45px;

    margin: 2px 0px;

    margin-left: 7px;

    margin-top: 8px;
}

.searchcont b {
    font-weight: bold;
    font-size: 14px;
}

.btnFormL {
    height: 44px;
    margin-top: -5px;
}


/***************newww****************/

.filter-bar.dashboard_title_area {
    padding: 0px 30px 0;
}

.filter-bar.dashboard_title_area .dashboard__title h3 {
    font-size: 24px;
    /*line-height: 45px;*/
}

.filter-bar.dashboard_title_area .filter__option {
    margin-left: 0;
    padding: 0;
}

.filter-bar.dashboard_title_area .filter__option p {
    font-size: 18px;
}

.filter-bar.filter-bar2 {
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    background: #fff;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    margin-bottom: 30px;
    padding-right: 30px;
}

.filter-bar.filter-bar2 .filter__option {
    padding: 22px 0 9px;
}

.filter-bar.dashboard_title_area .dashboard__title h3 {
    font-size: 20px;
    /* line-height: 45px; */
}

.sidebar-card {
    background: #fff;
    padding: 20px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    padding: 20px;
    -webkit-box-shadow: 0 2px 4px rgba(108, 111, 115, 0.1);
    box-shadow: 0 2px 4px rgba(108, 111, 115, 0.1);
    margin-bottom: 30px;
}

.sidebar-card.sidebar-card1 {


    padding: 0;

    -webkit-box-shadow: none;

    box-shadow: none;

}

.sidebar-card.sidebar-card1 .card-title {
    margin-bottom: 19px;
}

.sidebar-card h4 {
    font-size: 21px;
    margin: 10px 0 30px;
    color: #000;
    line-height: 34px;
}

.sidebar-card h4 i {

    font-size: 109px;

    color: #d43953;

    margin: 40px 0 45px;

    animation: tada 3s linear 2s infinite;

}

.sidebar-card .card-title {
    padding: 0 0 10px;
    border-bottom: 1px solid #ececec;
    color: #000;
}

.message_composer .btns label input {
    display: none;
}

.message_composer .btns label {
    margin-bottom: 0;
}

.message_composer .btns label span {
    display: inline-block;
    margin-left: 5px;
    font-size: 20px;
    font-weight: bold;
    position: relative;
    top: 2px;
}

.message_composer .attached p {
    display: inline-block;
    font-size: 15px;
    font-weight: 500;
    line-height: 36px;
    color: #0674ec;
    background: #f2f4f8;
    padding: 0 15px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin-left: 13px;
    margin-bottom: 13px;
    direction: ltr;
}



.invoice {
    background: #fff;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /* -webkit-box-shadow: 0 2px 4px rgba(108, 111, 115, 0.1); */
    /* box-shadow: 0 2px 4px rgba(108, 111, 115, 0.1); */
}

.invoice .invoice__head {
    overflow: hidden;
    padding: 40px 30px 30px;
    border-bottom: 1px solid #ececec;
}

.invoice .invoice__head .invoice_logo {
    float: left;
    margin-top: 10px;
}

.invoice .invoice__head .info {
    float: right;
    text-align: right;
}

.invoice .invoice__head .info h4 {
    font-size: 20px;
    margin-bottom: 5px;
    line-height: 32px;
    color: #333;
    font-weight: 500;
}

.invoice .invoice__meta p {
    line-height: 30px;
}

.invoice .invoice__meta .address {
    width: 50%;
    display: inline-block;
    margin-left: -3px;
}

.invoice .invoice__meta .address h5 {
    color: #000;
    font-size: 16px;
    line-height: 30px;
}

.invoice .invoice__meta .date_info {
    width: 50%;
    display: inline-block;
    vertical-align: top;
    text-align: right;
    margin-left: -3px;
}

.invoice .invoice__meta .date_info p span {
    color: #000;
    font-weight: 500;
    margin-right: 5px;
}

.invoice .invoice__meta .date_info p span:after {
    content: ':';
    margin-left: 2px;
}

.invoice .invoice__meta .date_info p.status {
    color: #8dc63f;
}

.invoice .invoice__meta {
    padding: 45px 30px;
}

.invoice .invoice__meta p {
    margin-bottom: 0;
}

.invoice .pricing_info {
    padding: 0 30px 100px;
    margin-top: 30px;
    text-align: right;
}

.invoice .pricing_info p {
    margin: 0;
    color: #000;
    line-height: 36px;
}

.invoice .pricing_info .bold {
    font-size: 18px;
}

.invoice .invoice__detail {
    margin-top: 100px;
}


.single_acco_title {}

.single_acco_title a {
    background: #f1f1f1;
    display: block;
    color: #434343;
    font-size: 14px;
    font-weight: bold;
    padding: 17px 18px 20px;
    position: relative;
    padding-right: 45px;
    border-bottom: 1px solid #e9ecef !important;
    border-radius: 10px;
    box-shadow: none;
}
.panel.accordion__single:first-child .single_acco_title a:before {
    color:#fff!important;
}
.single_acco_title a:before {
    position: absolute;
    top: 22%;
    right: 14px;
    font-family: 'Material Design Icons';
    color: #8f8f8f;
    font-weight: normal;
    font-size: 25px;
    content: '\F377';
}

.single_acco_title a[aria-expanded="false"]:before {
    content: '\F419';
}

.single_acco_title a[aria-expanded="true"]:before {
    content: '\F377';
}

/*.single_acco_title a[aria-expanded="true"],.single_acco_title a.collapse{background:#f39520 ; color:#fff}
.single_acco_title a[aria-expanded="true"]:before{ color:#fff}*/


/* AUTHOR FOLLOWERS AREA */
.user_area {
    background: #fff;
    -webkit-box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, .03);
    box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, .03);
    border-radius: 10px;
    box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.06), 0px 6px 10px 0px rgba(0, 0, 0, 0.042), 0px 1px 18px 0px rgba(0, 0, 0, 0.036);
}

.user_area > ul {
    margin-bottom: 30px;
}

.user_area > ul > li + li {
    border-top: 1px solid #ececec;
}

.user_area .user_single {
    padding: 30px 0;
}

.user_area .user_single .user__short_desc,
.user_area .user_single .user__meta,
.user_area .user_single .user__status {
    display: inline-block;
    vertical-align: middle;
    margin-left: -3px;
    padding: 0 28px;
    border-left: 1px solid #ececec;
}

.user_area .user_single .user__short_desc p,
.user_area .user_single .user__meta p,
.user_area .user_single .user__status p {
    margin: 0;
}

.user_area .user_single .user__short_desc,
.user_area .user_single .user__meta {
    min-height: 100px;
}

.user_area .user_single .user__short_desc {
    max-width: 350px;
}

.user_area .user_single .user__short_desc .user_avatar,
.user_area .user_single .user__short_desc .user_info {
    display: inline-block;
}

.user_area .user_single .user__short_desc .user_info {
    width: calc(100% - 75px);
    padding-right: 15px;
}

.user_area .user_single .user__short_desc .user_info a {
    font-size: 18px;
    line-height: 26px;
    color: #000;
    font-weight: 500;
    display: inline-block;
    padding-bottom: 10px;
}

.user_area .user_single .user__short_desc .user_info p {
    line-height: 28px;
}

.user_area .user_single .user__meta {
    max-width: 195px;
}

.user_area .user_single .user__meta p {
    line-height: 28px;
}

.user_area .user_single .user__meta .rating {
    padding-top: 7px;
}

.user_area .user_single .user__status {
    border-left: 0;
}

.user_area .user_single .user__status .btn {
    min-width: 135px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    margin-bottom: 10px;
}

.user_area .user_single .user__status.user--follow .btn {
    background: #7347c1;
}

.user_area .user_single .user__status.user--follow .btn:hover {
    background: #483475;
    color: #fff;
}

.user_area .user_single .user__status.user--following .btn:hover {
    background: #ff6a6d;
    color: #fff;
}

ul {
    list-style: none
}

.user_area .pagination-area {
    border-top: 1px solid #ececec;
}

.page-link {
    padding: .75rem 1.25rem;
    font-weight: bold;
}

.product--sidebar .sidebar-card {
    background: #fff;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 4px rgba(108, 111, 115, 0.1);
    box-shadow: 0 2px 4px rgba(108, 111, 115, 0.1);
    margin-bottom: 30px;
}

.product--sidebar .sidebar-card .card-title {
    padding: 20px 30px 18px;
    display: block;
    margin-bottom: 0;
    border-bottom: 1px solid #ececec;
}

.product--sidebar .sidebar-card .collapsible-content {
    padding: 0 20px;
}

.product--sidebar .sidebar-card .card-content {
    padding: 20px 0;
}

.product-title-area:before,
.shortcode_module_title:before,
.search_contents .dashboard_title_area:before,
.product-title-area:after,
.shortcode_module_title:after,
.search_contents .dashboard_title_area:after {
    display: table;
    content: "";
    clear: both;
}

.product-title-area .product__slider-nav,
.shortcode_module_title .product__slider-nav,
.search_contents .dashboard_title_area .product__slider-nav {
    float: left;
    background: #7347c1;
}

.product-title-area .product__slider-nav span,
.shortcode_module_title .product__slider-nav span,
.search_contents .dashboard_title_area .product__slider-nav span {
    line-height: 45px;
    color: #fff;
    cursor: pointer;
    width: 52px;
    display: inline-block;
    text-align: center;
}

.product-title-area .date_area,
.shortcode_module_title .date_area,
.search_contents .dashboard_title_area .date_area {
    float: left;
}

.dashboard__title h3 {
    font-size: 23px;
    color: #000;
    font-weight: normal;
}

.product-title-area .date_area p,
.shortcode_module_title .date_area p,
.search_contents .dashboard_title_area .date_area p {
    float: right;
}

.product-title-area .date_area .input_with_icon,
.shortcode_module_title .date_area .input_with_icon,
.search_contents .dashboard_title_area .date_area .input_with_icon {
    max-width: inherit;
}

.product-title-area .date_area .input_with_icon,
.shortcode_module_title .date_area .input_with_icon,
.search_contents .dashboard_title_area .date_area .input_with_icon,
.product-title-area .date_area .select-wrap,
.shortcode_module_title .date_area .select-wrap,
.search_contents .dashboard_title_area .date_area .select-wrap {
    float: none;
    margin-left: 0px;
    /* margin-bottom:10px; */
}

.product-title-area .date_area .select-wrap select,
.shortcode_module_title .date_area .select-wrap select,
.search_contents .dashboard_title_area .date_area .select-wrap select {
    height: 47px;
}

.product-title-area .date_area .btn:hover,
.shortcode_module_title .date_area .btn:hover,
.search_contents .dashboard_title_area .date_area .btn:hover {
    background: #623AA2;
    border-color: #623AA2;
}

.product__title {
    float: right;
}

.product__title h2 {
    font-weight: 400;
    line-height: 45px;
}

.filter__menu {
    float: left;
    position: relative;
    margin-top: 10px;
}

.filter__menu p {
    margin-bottom: 0;
    display: inline-block;
    vertical-align: middle;
    color: #747b86;
    margin-left: 15px;
}

.filter__menu .filter__menu_icon {
    display: inline-block;
    vertical-align: middle;
    margin-top: 6px;
    width: 17px;
}

.filter__menu .filter__menu_icon svg {
    height: 16px;
    cursor: pointer;
}

.filter__menu .filter__menu_icon svg:hover circle {
    fill: #483475;
}

.filter__menu .filter__menu_icon svg circle {
    fill: #a3b1c4;
}

.filter__menu .filter__menu_icon .filter_dropdown {
    position: absolute;
    min-width: 183px;
    padding: 20px 27px;
    top: 45px !important;
    z-index: 3;
    background: #fff;
    left: -15px;
    right: auto !important;
    -webkit-box-shadow: 0 5px 40px rgba(82, 85, 90, 0.2);
    box-shadow: 0 5px 40px rgba(82, 85, 90, 0.2);
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
}

.filter__menu .filter__menu_icon .filter_dropdown.active {
    display: block;
}

.filter__menu .filter__menu_icon .filter_dropdown:before {
    position: absolute;
    content: "";
    border-bottom: 10px solid #fff;
    border-right: 10px solid transparent;
    left: 15px;
    bottom: 100%;
    border-left: 10px solid transparent;
}

.filter__menu .filter__menu_icon .filter_dropdown li a {
    color: #747b86;
    display: block;
    -webkit-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
    line-height: 28px;
}

.filter__menu .filter__menu_icon .filter_dropdown li a:hover {
    color: #483475;
}

.searc-wrap input {
    line-height: 45px;
    height: 45px;
    border: 1px solid #d9dfe5;
    width: 360px;
    max-width: 100%;
    -webkit-border-radius: 23px;
    border-radius: 5px;
    padding: 0 25px;
}

.searc-wrap .search-wrap__btn {
    position: absolute;
    line-height: 45px;
    left: 0;
    top: 0;
    border: 0;
    width: 45px;
    height: 45px;
    text-align: center;
    background: #f39520;
    color: #fff;
    -webkit-border-radius: 50%;
    border-radius: 8px;
}

.searc-wrap {
    position: relative;
}

.lnr {
    font-family: 'Linearicons-Free';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.txtCon {
    margin-top: 25px;
}

.txtCon h1 {
    color: #f7901f;
    font-size: 25px;
    line-height: 30px;
    font-weight: bold;
    margin: 10px 0 15px;
    letter-spacing: -0.5px;
}

.txtCon p {

line-height: 20px;

color: #5c5c5c;

font-size: 15px;

font-weight: bold;
}

.btnsCon {
    text-align: center;
    margin: 15px 0 28px;
}

a {
    text-decoration: none;
}

.txtCon .lnk {
    padding: 6px 56px;
    color: #fff;
    background: #6eb3c5;
    display: inline-block;
    font-size: 18px;
    border-radius: 10px;
    margin: 0 3px;
}

.txtCon .lnk2 {
    background: #ffa0a3;
}

/* ======
09. Email
   ====== */
/* ==============
  Email
===================*/
.email-leftbar {
    /* width: 230px; */
    /* float: left; */
    background-color: #ffffff;
    padding: 20px;
}

.email-rightbar {
    margin-right: 260px;
}

.chat-user-box p.user-title {
    font-size: 14px;
    color: #2a3142;
    font-weight: 500;
}

.chat-user-box p {
    font-size: 12px;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
    background-size: 10px 10px;
}

/*****browsePage*******/
.reqDetals {
    margin: 0 0 13px;
}

.reqDetals .tel {
    direction: ltr;
    display: inline-block;
}

.reqDetals .attachFile {
    width: 47px;
}

.reqDetals span {
    color: #050505;
    font-size: 14px;
    font-weight: bold;
}

.reqDetals span:after {
    content: ":";
    margin: 0 5px;
}

.reqDetals b {
    font-size: 13px;
    font-weight: bold;
    color: #6c6c6c;
}

.reqDetals strong {
    font-weight: bold;
    font-size: 13px;
    color: #7b7b7b;
}

.hdr-style3 {
    background: #ffa754;
    border: solid 1px #ffa754;
    color: #ffffff;
    padding: 15px 16px 18px 16px;
    border-radius: 15px;
    font-weight: 600;
    font-size: 15px;
    margin: 35px 0 !important;
}

.hdr-style3 i {
    font-size: 22px;
}

.subReqRcon {
    margin-top: 40px;
}

.subReqRcon .col-sm-4 {
    /* border-left: 4px #f1f1f1a8 solid; */
}

.subReqRcon .col-sm-4:last-child {
    border-left: none
}

.subReqRcon .hdr-style3 {
    margin-top: 0 !important;
}

/* Activity */
.activity-feed {
    padding: 31px 15px 0 15px;
    list-style: none;
}

.activity-feed .feed-item {
    position: relative;
    padding-bottom: 30px;
    padding-right: 30px;
    border-right: 2px solid #e9ecef;
}

.activity-feed .feed-item:last-child {
    border-color: transparent;
}

.activity-feed .feed-item.close::after {
    content: "";
    display: block;
    position: absolute;
    top: 3px;
    right: -17px;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    background: #d43953;
}

.activity-feed .feed-item.missionpending::after {
    content: "";
    display: block;
    position: absolute;
    top: 3px;
    right: -17px;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    background: #f39520;
}

.missionproce {}

.missionproce h1 {

    font-size: 17px;

    text-align: right;

    margin-right: 2px;

    font-weight: normal;

    color: #a2a2a2;

    margin: 0;
}

.missionproce span {

    color: #623AA2;
}

.activity-feed .feed-item.missiondone::after {
    content: "";
    display: block;
    position: absolute;
    top: 3px;
    right: -17px;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    background: #25aa46;
}

.activity-feed .feed-item.missiondone .date {
    display: block;
    position: relative;
    top: -5px;
    color: #34c38f;
    text-transform: uppercase;
    font-size: 33px;
}

.activity-feed .feed-item.missionpending .date {
    display: block;
    position: relative;
    top: -5px;
    color: #f39520;
    text-transform: uppercase;
    font-size: 33px;
}

.activity-feed .feed-item.missionclose::after {
    content: "";
    display: block;
    position: absolute;
    top: 3px;
    right: -17px;
    width: 30px;
    height: 30px;
    border-radius: 30px;
    background: #d43953;
}

.activity-feed .feed-item.missionclose .date {
    display: block;
    position: relative;
    top: -5px;
    color: #ec4561;
    text-transform: uppercase;
    font-size: 33px;
}

.activity-feed .feed-item .activity-text {
    position: relative;
    top: -3px;
}


.adv {
    display: block;
}

.adv img {
    height: 165px;
    width: 100%;
    display: block;
}

.adv1 img {
    border-radius: 20px;
}

.adv2 img {
    border-radius: 20px;
}

.adv3 {
    margin-bottom: 23px;
}

.adv3 img {

    height: auto;

    border-radius: 20px;
}

/*.morris-hover.morris-default-style{display: none !important}*/
.totalChrt {}

.totalChrt h1 {
    font-size: 21px;
    font-weight: bold;
}

.totalChrt h3 {
    font-weight: bold;
    color: #ffb309;
    font-size: 30px;
    margin: 15px 0 0;
}


.legend-chart-con {
    margin: 15px 0 12px;
    text-align: center;
}

.legend-item {
    display: inline-block;
    margin-bottom: 0;
    font-size: 12px;
    margin-left: 7px;
}

.legend-item span {
    display: inline-block !important;
    border-radius: 100%;
    width: 11px;
    height: 11px;
    margin-left: 0px;
    top: 2px;
    position: relative;
    /* border: 2px #dadada solid; */
}

.legend-item b {
    margin-right: 1px;
    font-weight: bold;
    color: #909090;
}

.blck .header-title {
    color: #fff
}

.blck .header-title i {

    font-size: 22px;

    margin-left: 5px;
}

.blck .header-title {

padding: 7px 16px 12px 0;

font-size: 14px;

border-radius: 5px;
}

.header-title {
    font-size: 15px;
    border-radius: 0;
    font-weight: bold;
    color: #292929;
    padding: 6px 0 10px 0;
}

.header-title i {
    font-size: 22px;
    position: relative;
    top: 4px;
}

.header-title img {
    font-size: 22px;
    position: relative;
    top: -3px;
}

.brogCon {
    margin-bottom: 30px;
}

.brogCon h6 {
    font-size: 14px;
    margin-bottom: 10px;
}

.progress {
    height: 9px;
}

.progress-bar {
    background-color: #623AA2;
}

.progress-bar.info {
    background-color: #187fce
}

.progress-bar.warning {
    background-color: #f39520
}

.progress-bar.success {
    background-color: #37c24e
}

#column_chart path[barHeight="0"] {
    display: none !important;
    width: 0 !important;
}

#column_chart path {
    width: 200px !important;
    stroke-width: 7px !important;
}

.advIn1 {
    background-color: #08ad6c;
    height: 100px;
    display: block;
    position: relative;
    border-radius: 10px;
}

.txtadv {

    display: inline-block;

    margin-right: 25px;

    margin-top: 13px;
}

.advIn1 h1,
.advIn2 h1 {

color: #fff;

font-size: 16px;

margin-bottom: 0;
}

.advIn1 h2,
.advIn2 h2 {

color: #fff;

font-size: 15px;

margin-bottom: 0;
}

.advIn1 h3,
.advIn2 h3 {

font-size: 23px;

color: #fff;

line-height: 32px;
}

.advIn1 span,
.advIn2 span {

    width: 59px;

    height: 100%;

    background: #acf0e1;

    position: absolute;

    left: 19px;
}

.advIn2 span {

    background: #ffe49f;
}

.advIn1 b,
.advIn2 b {
    width: 24px;
    height: 100%;
    background: #57e2c5;
    position: absolute;
    left: 82px;
}

.advIn2 b {

    background: #fdcf84;

}

.advIn1 img {
    /* height: 135px; */
}

.advIn2 {
    background-color: #ffa754;
    height: 100px;
    display: block;
    position: relative;
    border-radius: 10px;
}


/*********dark-theme********************/


.darkThem {
    background-color: #001627 !important;
}
.darkThem .nav-tabs-custom .nav-item .nav-link .tabicoCon {

    outline: solid 4px transparent;
}
.darkThem .nav-tabs-custom .nav-item .nav-link.active .tabicoCon, .nav-tabs-custom .nav-item .nav-link.active:hover .tabicoCon {

    outline: solid 4px transparent;
}
.darkThem .modal-confirm h4{
    color:#343434!important
}
.darkThem .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #fff!important;
    background-color: transparent;
    border-color: #ced4da #ced4da #fff;
}
.darkThem .nav-tabs-custom .nav-item .nav-link.active , .darkThem .nav-tabs-custom .nav-item .nav-link {
    color: #b2b2b2 !important;
}
.darkThem .editForm {
    color:#e4e4e4
}
/*.darkThem * {
    -webkit-transition: color 300ms, background-color 300ms, border-color 300ms;
    -moz-transition: color 300ms, background-color 300ms, border-color 300ms;
    -o-transition: color 300ms, background-color 300ms, border-color 300ms;
    transition: color 300ms, background-color 300ms, border-color 300ms;
}*/
.darkThem #sidebar-menu ul li ul.sub-menu {
    background: #252b3c;
}
.darkThem .searchcont {
    border-bottom: solid 2px #4c505f;
}
.darkThem .reqDetals span{
    color:#fff
}
.darkThem .reqDetals strong{
    color:#ccc
}
.darkThem .reqDetals b{
    color:#ccc
}
.darkThem .searchcont a{
    color:#fff!important
}
.darkThem .searchcont span{
    color:#fff!important
}
.darkThem .searchcont p{
    color:#fff!important
}
.darkThem .searchcont i{
    color:#fff!important
}
.darkThem .navbar-brand-box{
    background-color:#2a3042!important
}
.darkThem .vertical-menu{
        background-color:#2a3042!important

}
.darkThem .text-muted{
    color:#bababa!important
}
.darkThem .progressCon .txt h4{
    color:#a5a5a5
}
.darkThem .table-hover tbody tr:hover {
    color: #495057;
    background-color: transparent!important;
}
.darkThem .header-title{
    color:#fff!important
}
.darkThem .h1, .darkThem .h2, .darkThem .h3, .darkThem .h4, .darkThem .h5, .darkThem .h6, {
    color: #ffffff!important;
}
.darkThem h1 , .darkThem h2 , .darkThem h3 , .darkThem h4 , .darkThem h5 , .darkThem h6 {
    color: #ebebeb!important;
}
.darkThem .datepicker td , .darkThem .datepicker th{
    color:#000!important;
}
.darkThem table td , .darkThem table th{
    color: #ebebeb!important;
}
.darkThem .table tbody tr:nth-of-type(odd) {
    background-color: #2a3042;
}
.darkThem table.orders-grid tr td , .darkThem table.orders-grid tr th {
    border: 1px solid #5e6370;
}
.darkThem .table tbody tr:last-child td{
    border-bottom: 1px solid #5e6370!important;
}
.darkThem .table.table-bordered tbody td:last-child, .darkThem .table.table-bordered thead th:last-child {
    border-left: 1px solid #5e6370!important;
}
 body.darkThem{
    background-color: #222736!important;
    color: #fff!important;
}
.darkThem #page-topbar {
    background-color: #262b3c;
}
 .darkThem .navbar-header .dropdown.show .header-item {
    background-color: #2a3042;
    color: #fff;
}

.darkThem .footer{
    background-color:#222736;
    color: #acacac!important;
}

.darkThem .navbar-header .waves-effect {}

.darkThem .noti-icon .badge {
    border-color: #001627
}

.darkThem .navbar-header .waves-effect svg {
    fill: #fff;
}

.darkThem .navbar-header .waves-effect svg .st0,
.darkThem .navbar-header .waves-effect svg .st2,
.darkThem .navbar-header .waves-effect svg .st3,
.darkThem .navbar-header .waves-effect svg .st4,
.darkThem .navbar-header .waves-effect svg .st5,
.darkThem .navbar-header .waves-effect svg .st6,
.darkThem .navbar-header .waves-effect svg .st7 {
    fill: #fff !important;
}

.darkThem .navbar-header .waves-effect svg .st1 {
    fill: #fff;
    stroke: #ffffff;
}


.darkThem .page-content {
    background-color: #222736;
}

.darkThem .maintit {
    background-color: #222736;
}

.darkThem .page-title-box h4,
.darkThem .breadcrumb li,
.darkThem .breadcrumb li a {
    color: #fff
}

.darkThem {}
.darkThem .main-content{
    background:#222736!important
}
.darkThem .card {
    background-color: #2a3042
}

.darkTheme .page-content {
    background: #222736 !important
}

.darkThem input[switch=default]:checked + label {
    background-color: #ffffff;
}
.darkThem .apex-charts text {

    fill: #adb5bd !important;
}
/****************************/
.vertical-collpsed .changeColCon {
    /* display: none */
    right: 13px;
    top: 95px;
}

.vertical-collpsed .QuickIco {
    display: none
}

.QuickIco {
    padding: 0;
    text-align: center;
    margin: 9px 0 0;
}

.QuickIco li {
    display: inline-block;
    margin: 0 4px;
}

.QuickIco li a {
    font-size: 14px;
    color: #fff;
}

.QuickIco li:hover a {}

.changeColCon {
    position: absolute;
    right: 18px;
    top: 19px;
}

.bg-secondry {
    background-color: #a675f0 !important
}

.mini-stats-wid {
    padding: 20px 17px 20px;
    border-radius: 10px;
}

.mini-stats-wid .card-body {
    padding: 0;
}

.mini-stats-wid p {
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    margin: 0 0 6px;
}

.mini-stats-wid h4 {
    font-size: 35px;
    color: #fff;
    font-weight: bold;
}

.mini-stats-wid .align-self-center {
    position: absolute;
    left: 0;
    bottom: 0;
}

.topBnnr {
    border-radius: 10px;
    margin: 0 0 18px;
    padding: 42px 28px 20px;
}

.topBnnr h1 {
    color: #fff;
    font-size: 15px;
    font-weight: bold;
}

.topBnnr p {
    margin: 12px 0 0;
    font-size: 13px;
    color: #fff;
}

.topBnnr img {
    margin-top: -92px;
    margin-right: 25px;
    width: 240px;
}


.progressCon {
    margin: 4px 0 22px;
}

.progressCon .txt {}

.progressCon .txt i {
    font-size: 9px;
    margin-left: 10px;
}

.progressCon .txt h4 {
    padding-right: 15px;
    font-size: 14px;
    color: #4d4d4d;
    font-weight: bold;
}

.progressCon .txt h5 {
    font-size: 13px;
    margin-bottom: 3px;
}

.progressCon .progressB {
    margin: 12px 0 0;
}

.progressCon .progress {
    display: inline-flex;
    width: 63%;
    background: #dadada;
    margin-left: 6px;
    height: 5px;
}

.progressCon .progressB span {
    display: inline-flex;
    font-size: 12px;
    font-weight: bold;
    position: relative;
    top: 2px;
}

.openedPop {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1000000;
}

.overlayP {
    background: #000000d9;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.openedPop .cls {
    position: absolute;
    left: 18px;
    top: 9px;
    font-size: 18px;
    color: #d3e3fd;
}

.openedPop .contnt {
    position: absolute;
    z-index: 2;
    width: 569px;
    max-width: 100%;
    left: 0;
    right: 0;
    top: 50%;
    margin: -150px auto 0;
}

.openedPop .PopCell {
}

.openedPop .popCon {
    background: url(../images/popUpBg.png) no-repeat top center;
    min-height: 300px;
    margin: 0 auto;
    padding: 20px 28px 10px 10px;
    position: relative;
    background-size: 100% auto;
}

.openedPop .popCon .imgCon {
    position: absolute;
    left: 21px;
    bottom: 85px;
    width: 40%;
}
.openedPop .popCon .imgCon img {
    width: 230px;
}
.openedPop .popCon h1 {
    color: #efa835;
    font-weight: 700;
    font-size: 17px;
    margin: 44px 0 0;
}

.openedPop .popCon h3 {
    color: #d3e3fd;
    font-weight: 700;
    font-size: 16px;
    margin: 12px 0 0;
}

.openedPop .popCon p {
    font-weight: 700;
    font-size: 13px;
    color: #fff;
    margin: 14px 0 0;
}

.openedPop .foott {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    bottom: 24px;
}

.openedPop .foott span {
    font-size: 25px;
    font-weight: 600;
    color: #555;
    display: inline-block;
    margin-left: 10px;
    position: relative;
    top: 4px;
}

.openedPop .foott a {
    display: inline-block;
    margin: 0 3px;
}

.openedPop .foott i {
    width: 38px;
    height: 38px;
    background: #435bfd;
    border-radius: 100%;
    padding: 10px 0 0;
    font-size: 18px;
    color: #fff;
}

.openedPop .foott i.fa-linkedin-in {
    background: #435bfd;
}

.openedPop .foott i.fa-facebook-f {
    background: #1877f2;
}

.openedPop .foott i.fa-twitter {
    background: #1da1f2;
}
/***************AlertsModal***************************/
	.modal-confirm {
		color: #434e65;
		width: 400px;
	}
	.modal-confirm .modal-content {
		padding: 20px;
		font-size: 16px;
		border-radius: 5px;
		border: none;
	}
	.modal-confirm .modal-header {
		background: #eb6364;
		border-bottom: none;
		position: relative;
		justify-content: center;
		text-align: center;
		margin: -20px -20px 0;
		border-radius: 5px 5px 0 0;
		padding: 17px 35px;
	}
	.modal-confirm h4 {
		text-align: center;
		font-size: 25px;
		margin: 10px 0;
	}
	.modal-confirm .form-control, .modal-confirm .btn {
		min-height: 40px;
		border-radius: 3px; 
	}
	.modal-confirm .close {
        position: absolute;
		top: 15px;
		right: 15px;
		color: #fff;
		text-shadow: none;
		opacity: 0.5;
	}
	.modal-confirm .close:hover {
		opacity: 0.8;
	}
	.modal-confirm .icon-box {
		color: #fff;
		width: 85px;
		height: 85px;
		display: inline-block;
		border-radius: 50%;
		z-index: 9;
		border: 2px solid #fff;
		padding: 15px;
		text-align: center;
	}
	.modal-confirm .icon-box i {
		font-size: 29px;
		margin: 0;
		padding-top: 13px;
	}
	.modal-confirm.modal-dialog {
		margin-top: 80px;
	}
	.modal-confirm.modal-dialog p {
		color:#a5a5a5;
		font-size:13px
	}
    .modal-confirm .btn {
        color: #fff;
        border-radius: 4px;
        /* background: #eeb711; */
        text-decoration: none;
        transition: all 0.4s;
        line-height: normal;
        border-radius: 30px;
        margin-top: 10px;
        padding: 6px 20px;
        border: none;
    }
	.modal-confirm .btn:hover, .modal-confirm .btn:focus {
		/* background: #eda645; */
		outline: none;
	}
	.modal-confirm .btn span {
		margin: 1px 3px 0;
		float: left;
	}
	.modal-confirm .btn i {
		margin-left: 1px;
		font-size: 20px;
		float: right;
	}
	.trigger-btn {
		display: inline-block;
		margin: 100px auto;
	}
/*************************************/

.modal-Edit {		
		color: #636363;
		width: 500px;
    max-width: 100%
        
	}

.modal-confirm .icon-box.bg-danger i {font-size: 36px;margin: 11px 0 0;}
.modal-confirm .icon-box.bg-warning i{font-size: 36px;margin: 11px 0 0;}

/***************** Users-Modal ****************/
#usersModal{
    
}
#usersModal .modal-content{
    
border-radius: 5px;
}
#usersModal .modal-header{
    
background: #f3f3f3;
    
font-size: 13px;
}
#usersModal .modal-body{
    padding: 15px 0 4px;
}
#usersModal .modal-body select.form-control{
    font-size: 12px;
    /* font-weight: bold; */
}
#usersModal .modal-footer{
    
padding-top: 0;
}
#usersModal .modal-footer .btn{
    margin-left: 0;
    padding: 10px 18px;
    font-size: 11px;
}
/*****************/
 #quarterChart .apexcharts-bar-series path:nth-child(2) {
    fill: #7467ef !important;
}
 #quarterChart .apexcharts-bar-series path:nth-child(3) {
    fill: #e95455 !important;
}
 #quarterChart .apexcharts-bar-series path:nth-child(4) {
    fill: #ff9e43 !important;
}
.apexcharts-tooltip-marker{display:none}
.apexcharts-tooltip-y-group{direction:rtl}

.apex-charts text {
    font-family: 'cairo' !important;
    font-size: 14px;
    fill: #adb5bd ;
}
.apexcharts-xaxis text{font-size:12px; font-weight:bold}
.apexcharts-yaxis text{}
#wallet-balance-chart  text { font-size:11px!important}


#radialBar-chart.apex-charts text {
    font-family: 'cairo' !important;
    font-size: 22px;
    fill: #464646;
    font-weight: normal;
}
/********************/
.navbar-header .dropdown-menu  {
    border-radius: 16px;
}
.navbar-header .dropdown:last-child .dropdown-menu  {
    -webkit-border-radius: 10px;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius: 10px;
    -moz-border-radius-topleft: 0;
    border-radius: 10px;
    border-top-left-radius: 0;
}

.knobCon{position:relative;height: 100px;overflow: hidden;margin: 0 0;}
.vertical-collpsed .knobCon canvas{width: 83% !important;}
.knobCon canvas{/* height: 188px; */width: 98% !important;margin: 0 auto;display: block;}
.knobCon input.knob{
    left: 0;
    margin: 0 !important;
    right: 4px;
   
    width: 100% !important;
}
.knobCon  span{
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 23px;
    padding-left: 30px;
    font-weight: bold;
    margin-top: -2px;
}
.knobCon span , .knobCon input.knob{top: 33%;}
.vertical-collpsed .knobCon span ,.vertical-collpsed .knobCon input.knob{top: 33%;}

.titknob{font-size: 12px;text-align: center;margin: 5px 0 10px;font-weight: bold;}
.orderStatue{}
.orderStatueItem{
    margin: 0 0 14px;
}
.orderStatueItem:last-child{
    margin:0
}
.orderStatue p{
    margin: 0 0 8px !important;
}
.orderStatue h5{
    margin: 0;
    padding-right: 20px;
    font-size: 15px;
}
.card-content {
    padding: 0;
    margin: 13px 0 0;
}
.card-content li{
    display: inline-block;
    margin-left: 10px;
}

[dir=rtl] .page-item:first-child .page-link {
    margin-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
     border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
}
[dir=rtl] .page-item:last-child .page-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem;
}
.editForm {
    border: none;
    background: transparent;
    outline: none;
    margin: 3px 0 5px;
    width: 100%;
    font-weight: 600;
    color: #383838;
}
.editForm.tel{text-align:right}
/*********************/
[dir=rtl] .modal-header .close {
    margin: -1rem auto -1rem -1rem ;
}


/****************Intro*********************/

.mainLnks {
    display: flex;
    height: 89vh;
    align-items: center;
    width: 1300px;
    max-width: 100%;
    margin: 0 auto;
    padding: 20px 28px;
}
.mainLnks:after {
    content:"";
    position: absolute;
    width:100%;
    left: 0;
    top: 0;
    z-index: -1;
    height: 100%;
    background: url("../images/intro-bg.jpg") no-repeat center 70%;
    background-size: 100%;
}

.circlcsCon {
    text-align: center;
    width: 100%;
    display: block;
}
.circlcsCon .circleItem{
    display: inline-block;
    position: relative;
    margin: 0 21px;
}
.circlcsCon .circleItem > a {
    display: block;
    margin: 0 0 17px;
    color: #464646;
    font-size: 21px;
    font-weight: bold;
}

.circlcsCon a span {
    display: block;
}





.circlcsCon .circleSub{
    border-left: 5px #ddd solid;
}
.circlcsCon .circleItem:last-child .circleSub{border:none}
.circlcsCon .circleSub a{
    width: 150px;
    height: 150px;
    border-radius: 100%;
    display: inline-flex;
    vertical-align:top;
    justify-content: center;
    align-items: center;
    padding:20px;
    margin: 4px 13px;
    color:#fff;
    font-weight: bold;
    font-size: 15px;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.circlcsCon .circleSub a span{
}
.circlcsCon .circleSub a:first-child{
}
.circlcsCon .circleSub a:last-child{}
.circlcsCon .circleItem:nth-child(1) .circleSub  a{
    background: #eb6365 !important;
}

.circlcsCon .circleItem:nth-child(2) .circleSub a {
    background: #2ab880 !important;
}

.circlcsCon .circleItem:nth-child(3) .circleSub a{
    background: #ffa755 !important;
}

.circlcsCon .circleItem:nth-child(4)  .circleSub a {
    background: #623AA2 !important;
    background: linear-gradient(to bottom right, #9853af, #623AA2) !important;
}

.circlcsCon .circleSub a:hover{
    margin-top:-10px;
    box-shadow: 0 16px 26px 0 rgba(198, 198, 200, 0.8), 0 3px 6px 0 rgba(198, 198, 198, 0.2);

}
/************************#res **********/
@media (max-width:768px) {
    #layout-wrapper {
        width: 98%;
    }

    .bgWebsit {
        height: 500px
    }

    .nav-tabs-custom .nav-item .nav-link .tabicoCon {
        width: 66px;
        height: 66px;
    }

    .nav-tabs-custom .nav-item .nav-link::after {
        width: 159px;
        top: 48px;
        height: 6px;
    }

    .totalicns {}

    .totalicns li {
        text-align: center
    }

    .totalicns li span {
        display: block;
        margin: 0 0 15px
    }

    .advIn img {
        height: auto;
    }

    .sidebar-enable .navbar-header .logo-xs {
        display: block !important;
        /* margin: 0; */
    }

    .topBnnr img {
        margin: 19px auto 0;
    }

    .topBnnr {
        text-align: center
    }

    .changeColCon {
        display: none
    }

    .openedPop .contnt {
        width: 90%;
    }

    .openedPop .popCon .imgCon {
        width: 30%
    }

    .openedPop .cls {
        left: 20px
    }
    .btnFormL{margin-top:8px;}
    .knobCon canvas{width:100px !important}
    .mainLnks{height:auto}
    .mainLnks:after {    background-size: auto 100%;}
    .circlcsCon .circleItem > a {   }
    .circlcsCon .circleSub {
         border-bottom:5px #ddd solid;
         padding-bottom:20px;
    border-left:none
}
    .circlcsCon .circleItem{display:block;width: 100%;margin: 0 auto 30px;}
    .vertical-menu{
        position: relative;
        margin: 1px 0 0;
    height: auto;
    border-radius: 0;
    width: 100%;}

}

@media (max-width:767px) {
    .navbar-header .dropdown .waves-effect {
        padding: 0 2px
    }

    .page-title-box {
        display: block !important;
    }

    .page-title-box h4 {
        width: 100%;
        margin: 0 0 13px !important;
    }

    .nav-tabs-custom .nav-item .nav-link::after {
        display: none;
    }

    .nav-tabs-custom .nav-item .nav-link {
        text-align: center !important
    }

    .nav-tabs-custom .nav-item .nav-link .tabicoCon {
        margin: 0 auto !important
    }

    .totalicns {
        display: block;
    }

    .totalicns li {
        width: 48%;
        margin: 0 0 16px;
    }

    .totalicns li span {
        display: block;
        margin: 0 0 15px
    }

    .openedPop .foott {
        position: relative;
        bottom: 0
    }

    .openedPop .popCon {
        background: #36457f;
        padding: 30px 17px 150px;
        min-height: 366px;
    }

    .openedPop .popCon h1 {
        font-size: 16px;
    }

    .openedPop .popCon h3 {
        font-size: 13px
    }

    .openedPop .popCon p {
        font-size: 13px
    }

    .openedPop .foott span {
        font-size: 14px;
        color: #fff
    }

    .openedPop .popCon .imgCon {
        width: 60%;
        bottom: 0
    }

    .openedPop .cls {
        left: 20px
    }
    .card-content li{display:block}
    .navbar-brand-box {
    padding-top: 22px;
    padding-bottom: 9px;
}
.vertical-menu {
    top: -5px;
}
.mainLnks {
   width: 94%;
   display: block;
   padding: 30px 17px 0;
}
.mainLnks:after {    background-size: auto 100%;}
    .circlcsCon .circleItem > a {  }
    .circlcsCon .circleItem{display:block;width: 250px;margin: 0 auto 115px;}
    .circlcsCon .circleSub a{width: 140px;height: 140px;font-size: 12px;}



}