html{position:relative;min-height:100%}
body{overflow-x:hidden}
#wrapper{height:100%;overflow:hidden;width:100%}
.content-page {
    margin-left: 250px;
    overflow: hidden;
    padding: 0 15px 65px 15px;
    min-height: 80vh;
    margin-top: 70px
}
.left-side-menu {
    width: 250px;
    background: #0c1033;
    border-right: 1px solid #0c1033;
    bottom: 0;
    padding: 9px 0;
    position: fixed;
    transition: all .1s ease-out;
    top: 70px;
}
#sidebar-menu > ul {
    list-style: none;
    padding: 0;
}
    #sidebar-menu > ul > li:hover {
        background-color: #06284e;
    }
    #sidebar-menu > ul > li > a {
        color: #aeb8ce;
        display: block;
        padding: 9px 3px 9px 9px;
        position: relative;
        transition: all .4s;
        font-family: sans-serif;
        font-size: medium;
        min-height:48px;
    }
    #sidebar-menu > ul > li > a:active, #sidebar-menu > ul > li > a:focus, #sidebar-menu > ul > li > a:hover {
        color: #009a6b;
        text-decoration: none
    }
        #sidebar-menu > ul > li > a:active svg, #sidebar-menu > ul > li > a:focus svg, #sidebar-menu > ul > li > a:hover svg {
            fill: rgba(83,105,248,.12)
        }
        #sidebar-menu > ul > li > a > span {
            vertical-align: middle
        }
        #sidebar-menu > ul > li > a i {
            display: inline-block;
            line-height: 1.0625rem;
            margin: 0 10px 0 3px;
            text-align: center;
            vertical-align: middle;
            width: 16px;
            font-size: 18px
        }
        #sidebar-menu > ul > li > a svg {
            width: 16px;
            height: 16px;
            margin-left: 3px;
            margin-right: 10px;
            fill: rgba(75,75,90,.12)
        }
        #sidebar-menu > ul > li > a .drop-arrow {
            float: right
        }
            #sidebar-menu > ul > li > a .drop-arrow i {
                margin-right: 0
            }
        #sidebar-menu > ul > li > a.mm-active {
            color: #aeb8ce;
        }
    #sidebar-menu > ul > li ul {
        padding-left: 22px;
        list-style: none
    }
    #sidebar-menu > ul > li ul ul {
        padding-left: 20px
    }
#sidebar-menu .badge {
    margin-top: 4px
}
#sidebar-menu .menu-title {
    padding: 25px 25px 0;
    letter-spacing: .05em;
    pointer-events: none;
    cursor: default;
    font-size: .6875rem;
    text-transform: uppercase;
    color: #4b4b5a;
    position: relative
}
    #sidebar-menu .menu-title::before {
        height: 1px;
        position: absolute;
        top: 10px;
        bottom: 10px;
        left: 15px;
        right: 15px;
        background: #ebeef5;
        content: ""
    }
#sidebar-menu .menuitem-active > a {
    color: #0c296d
}
    #sidebar-menu .menuitem-active > a svg {
        fill: rgba(83,105,248,.12)
    }
#sidebar-menu .menuitem-active .active {
    color: #aeb8ce;
}
    #sidebar-menu .menuitem-active .active svg {
        fill: rgba(83,105,248,.12)
    }
.nav-second-level li a {
    padding: 8px 2px 0px 15px;
    min-height:38px;
    color: #edefff;
    display: block;
    position: relative;
    transition: all .4s;
    font-family:sans-serif;
    font-size: .95rem;
}
    .nav-second-level li a:focus, .nav-second-level li a:hover {
        color: #009a6b
    }
.nav-second-level li.active > a {
    color: #009a6b
}
.nav-second-level label {
    font-size: 10px;
    color: #999;
}
.nav-second-level i {
    padding-right: 22px !important;
}
#sidebar-menu .droparrow {
    float: right;
    font-size: 12px
}
    #sidebar-menu .droparrow:hover {
        rotate: 90deg;
    }
#sidebar-menu .nav-second-level hr {
    padding: 0px 2px;
    margin: 0px 6px 0px 0px;
    color: #323742;
}
.menu-arrow {
    transition: transform .15s;
    position: absolute;
    right: 20px;
    display: inline-block;
    font-family: unicons, Geneva, sans-serif;
    text-rendering: auto;
    line-height: 1.8rem;
    font-size: 1rem;
    transform: translate(0,0)
}
    .menu-arrow::before {
        content: "\e82d"
    }
[dir=rtl] .menu-arrow::before {
    content: "\e82e"
}
li > a[aria-expanded=true] > span.menu-arrow {
    transform: rotate(180deg)
}
li.menuitem-active > a:not(.collapsed) > span.menu-arrow {
    transform: rotate(90deg)
}
body[data-sidebar-size=condensed] .logo-box {
    width: 70px !important;
    text-align: center;
}

@media (max-width:991.98px) {
    body[data-sidebar-size=condensed] .logo-box {
        padding-left: 0 !important
    }
}
body[data-sidebar-size=condensed] .logo span.logo-lg {
    display: none
}
body[data-sidebar-size=condensed] .logo span.logo-sm {
    display: block
}
body[data-sidebar-size=condensed] .left-side-menu {
    position: absolute;
    padding-top: 0;
    width: 70px !important;
    z-index: 5
}
    body[data-sidebar-size=condensed] .left-side-menu .simplebar-content-wrapper, body[data-sidebar-size=condensed] .left-side-menu .simplebar-mask {
        overflow: visible !important
    }
    body[data-sidebar-size=condensed] .left-side-menu .simplebar-scrollbar {
        display: none !important
    }
    body[data-sidebar-size=condensed] .left-side-menu .simplebar-offset {
        bottom: 0 !important
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu .badge, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu .collapse.in, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu .label, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu .menu-arrow, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu .menu-title {
        display: none !important
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu .nav.collapse {
        height: inherit !important
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li {
        position: relative;
        white-space: nowrap
    }
        body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li > a {
            padding: 15px 20px;
            min-height: 54px;
            transition: none
        }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li > a:active, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li > a:focus, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li > a:hover {
        color: #aeb8ce
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li > a i {
        font-size: 1.3rem;
        margin-right: 20px;
        margin-left: 5px
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li > a svg {
        width: 18px;
        height: 18px;
        margin-left: 6px
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li > a span {
        display: none;
        padding-left: 25px
    }
        body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > a {
            position: relative;
            width: calc(250px + 70px);
            color: #009a6b;
            background-color: #06284e;
        }
        body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > a span {
            display: inline
        }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover a.active :after, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover a.open :after {
        display: none
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapse, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapsing {
        display: block !important;
        height: auto !important;
        transition: none !important
    }
        body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapsing > ul {
            display: block !important;
            left: 70px;
            position: absolute;
            width: 250px;
            background-color: #0c1033;
            box-shadow: 3px 5px 10px 0 rgba(154,161,171,.2)
        }
            body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul ul, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapsing > ul ul {
                box-shadow: 3px 5px 10px 0 rgba(154,161,171,.2)
            }
        body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul a, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapsing > ul a {
            box-shadow: none;
            padding: 8px 20px;
            position: relative;
            width: 190px;
            z-index: 6
        }
            body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapse > ul a:hover, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul > li:hover > .collapsing > ul a:hover {
                color: #009a6b;
            }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul .collapsing {
        display: block !important;
        height: auto !important;
        transition: none !important
    }
    body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul ul {
        padding: 5px 0;
        z-index: 9999;
        display: none;
        background-color: #fff
    }
        body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul ul li:hover > .collapse, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul ul li:hover > .collapsing {
            display: block !important;
            height: auto !important;
            transition: none !important
        }
            body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul ul li:hover > .collapse > ul, body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul ul li:hover > .collapsing > ul {
                display: block;
                left: 190px;
                margin-top: -36px;
                position: absolute;
                width: 190px
            }
        body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul ul li > a span.pull-right {
            position: absolute;
            right: 20px;
            top: 12px;
            transform: rotate(270deg)
        }
            body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu > ul ul li.active a {
                color: #5369f8
            }
body[data-sidebar-size=condensed] .content-page {
    margin-left: 70px !important
}
@media (min-width:992px) {
    body[data-sidebar-size=condensed] .footer {
        left: 0px !important
    }
}
body[data-sidebar-size=condensed] .user-box {
    display: none !important
}
@media (min-width:768px) {
    body[data-sidebar-size=condensed]:not([data-layout=compact]) {
        min-height: 1750px
    }
}
@media (max-width:575.98px) {
    .pro-user-name {
        display: none
    }
}
@media (max-width:991.98px) {
    body {
        overflow-x: hidden;
        padding-bottom: 80px
    }

    .left-side-menu {
        display: none;
        z-index: 10 !important
    }

    .sidebar-enable .left-side-menu {
        display: block
    }

    .content-page, body[data-sidebar-size=condensed] .content-page {
        margin-left: 0 !important;
        padding: 0 10px
    }

    .footer {
        left: 0 !important
    }
}
body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .logo-box {
    width: 160px !important
}
body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu {
    width: 160px !important;
    text-align: center
}
    body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu #sidebar-menu > ul > li > a > i {
        display: block;
        font-size: 18px;
        line-height: 24px;
        width: 100%;
        margin: 0
    }
    body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu #sidebar-menu > ul > li > a svg {
        display: block;
        margin: 0 auto 5px auto
    }
    body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu #sidebar-menu > ul ul {
        padding-left: 0
    }
        body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu #sidebar-menu > ul ul a {
            padding: 10px 20px
        }
    body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu .badge, body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu .menu-arrow {
        display: none !important
    }
    body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu + .content-page {
        margin-left: 160px
    }
        body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu + .content-page .footer {
            left: 160px
        }
    body[data-sidebar-size=compact]:not([data-sidebar-size=condensed]) .left-side-menu .menu-title {
        background-color: #f8f9fa
    }
body[data-sidebar-color=dark] .logo-box {
    background-color: #e7e7e7 !important;
    border-right: 1px solid #e7e7e7 !important
}
    body[data-sidebar-color=dark] .logo-box .logo-dark {
        display: none
    }
    body[data-sidebar-color=dark] .logo-box .logo-light {
        display: block
    }
body[data-sidebar-color=dark] .left-side-menu {
    background-color: #e7e7e7;
    border-right-color: #e7e7e7;
    box-shadow: none
}
    body[data-sidebar-color=dark] .left-side-menu #sidebar-menu > ul > li > a {
        color: #9097a7
    }
        body[data-sidebar-color=dark] .left-side-menu #sidebar-menu > ul > li > a:active, body[data-sidebar-color=dark] .left-side-menu #sidebar-menu > ul > li > a:focus, body[data-sidebar-color=dark] .left-side-menu #sidebar-menu > ul > li > a:hover {
            color: #c8cddc
        }
        body[data-sidebar-color=dark] .left-side-menu #sidebar-menu > ul > li > a.mm-active {
            color: #fff;
            background-color: #373d49
        }
    body[data-sidebar-color=dark] .left-side-menu #sidebar-menu .menu-title {
        color: #adb5bd
    }
        body[data-sidebar-color=dark] .left-side-menu #sidebar-menu .menu-title::before {
            background: #424e5a
        }
    body[data-sidebar-color=dark] .left-side-menu #sidebar-menu .menuitem-active > a {
        color: #fff
    }
    body[data-sidebar-color=dark] .left-side-menu .nav-second-level li a, body[data-sidebar-color=dark] .left-side-menu .nav-thrid-level li a {
        color: #9097a7
    }
        body[data-sidebar-color=dark] .left-side-menu .nav-second-level li a:focus, body[data-sidebar-color=dark] .left-side-menu .nav-second-level li a:hover, body[data-sidebar-color=dark] .left-side-menu .nav-thrid-level li a:focus, body[data-sidebar-color=dark] .left-side-menu .nav-thrid-level li a:hover {
            background-color: transparent;
            color: #c8cddc
        }
    body[data-sidebar-color=dark] .left-side-menu .nav-second-level li.active > a, body[data-sidebar-color=dark] .left-side-menu .nav-thrid-level li.active > a {
        color: #fff
    }
    body[data-sidebar-color=dark] .left-side-menu .user-box .dropdown > a {
        color: #fff !important
    }
body[data-sidebar-color=dark][data-sidebar-size=condensed] #wrapper .left-side-menu #sidebar-menu > ul > li:hover > a {
    background-color: #e7e7e7;
    box-shadow: none
}
body[data-sidebar-color=dark][data-sidebar-size=condensed] #wrapper .left-side-menu #sidebar-menu .menuitem-active .active {
    color: #aeb8ce
}

body[data-sidebar-color=dark][data-sidebar-size=compact] #wrapper .left-side-menu .menu-title {
    background-color: rgba(255,255,255,.03)
}
.user-box {
    display: none
}
.user-pro-dropdown {
    padding: 15px 5px;
    width: 90%;
    margin-left: 5%;
    margin-top: 10px
}
    .user-pro-dropdown .dropdown-item {
        border-radius: 3px
    }
body[data-layout-mode=detached] .logo-box {
    background-color: transparent !important
}
@media (min-width:992px) {
    body[data-layout-mode=detached] .navbar-custom .container-fluid {
        max-width: 95%
    }

    body[data-layout-mode=detached] #wrapper {
        max-width: 95%;
        margin: 0 auto
    }

    body[data-layout-mode=detached] .left-side-menu {
        margin-top: 30px;
        margin-bottom: 30px;
        border-radius: 5px;
        border: 1px solid #e2e7f1
    }

    body[data-layout-mode=detached] .content-page {
        padding-bottom: 30px
    }

    body[data-layout-mode=detached] .logo-box {
        background-color: transparent;
        background-image: none
    }
}
body[data-sidebar-showuser=true] .user-box {
    display: block
}
.logo {
    display: block
}
    .logo span.logo-lg {
        display: block
    }
    .logo span.logo-sm {
        display: none
    }
    .logo .logo-lg-text-dark {
        color: #343a40;
        font-weight: 700;
        font-size: 22px;
        text-transform: uppercase
    }
    .logo .logo-lg-text-light {
        color: #fff;
        font-weight: 700;
        font-size: 22px;
        text-transform: uppercase
    }
.logo-box {
    height: 70px;
    width: 250px !important;
    float: left;
    transition: all .1s ease-out;
    padding: 0 24px;
    background: #0c1033;
    border-right: 1px solid #0c1033;
}
    .logo-box .logo {
        line-height: 70px
    }
.logo-light {
    display: block
}
.logo-dark {
    display: none
}
.navbar-custom {
    background-color: #ededed;
    padding: 0 10px 0 0;
    position: fixed;
    left: 0;
    right: 0;
    height: 70px;
    border-bottom: 1px solid #e7e7e7;
    z-index: 1001
}
    .navbar-custom
    .topnav-menu > li {
        float: left
    }
    .navbar-custom .topnav-menu .nav-link {
        padding: 0 12px;
        color: rgba(255,255,255,.6);
        min-width: 32px;
        display: block;
        line-height: 70px;
        text-align: center;
        max-height: 70px
    }
        .navbar-custom .topnav-menu .nav-link svg {
            height: 20px;
            width: 20px;
            color: rgba(255,255,255,.6);
            fill: rgba(255,255,255,.12)
        }
        .navbar-custom .topnav-menu .nav-link:active svg, .navbar-custom .topnav-menu .nav-link:focus svg, .navbar-custom .topnav-menu .nav-link:hover svg {
            color: #5369f8;
            fill: rgba(83,105,248,.1)
        }
    .navbar-custom .container-fluid {
        padding: 0
    }
    .navbar-custom .app-search {
        height: 70px;
        display: table;
        max-width: 180px;
        margin-right: 20px
    }
        .navbar-custom .app-search .app-search-box {
            display: table-cell;
            vertical-align: middle;
            position: relative
        }
            .navbar-custom .app-search .app-search-box input:-ms-input-placeholder {
                font-size: .8125rem;
                color: rgba(255,255,255,.3)
            }
            .navbar-custom .app-search .app-search-box input::-ms-input-placeholder {
                font-size: .8125rem;
                color: rgba(255,255,255,.3)
            }
            .navbar-custom .app-search .app-search-box input::placeholder {
                font-size: .8125rem;
                color: rgba(255,255,255,.3)
            }
        .navbar-custom .app-search .form-control {
            border: none;
            padding-left: 20px;
            padding-right: 0;
            color: #fff;
            background-color: rgba(255,255,255,.07);
            box-shadow: none
        }
        .navbar-custom .app-search .btn {
            background-color: rgba(255,255,255,.07);
            border-color: transparent;
            color: rgba(255,255,255,.3);
            box-shadow: none !important
        }
    .navbar-custom .button-menu-mobile {
        border: none;
        color: #fff;
        display: inline-block;
        height: 70px;
        line-height: 70px;
        width: 60px;
        background-color: transparent;
        border: none;
        padding: 0;
        cursor: pointer
    }
        .navbar-custom .button-menu-mobile.disable-btn {
            display: none
        }
.noti-scroll {
    max-height: 230px
}
.notification-list {
    margin-left: 0
}
        .notification-list .noti-title {
            background-color: transparent;
            padding: 15px 20px
        }
    .notification-list .noti-icon-badge {
        display: inline-block;
        position: absolute;
        top: 14px;
        right: 8px
    }
    .notification-list .notify-item {
        padding: 12px 20px
    }
        .notification-list .notify-item .notify-icon {
            float: left;
            height: 36px;
            width: 36px;
            line-height: 36px;
            text-align: center;
            margin-right: 10px;
            border-radius: 50%;
            color: #fff
        }
        .notification-list .notify-item .notify-details {
            margin-bottom: 5px;
            overflow: hidden;
            margin-left: 45px;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: #343a40
        }
            .notification-list .notify-item .notify-details b {
                font-weight: 500
            }
            .notification-list .notify-item .notify-details small {
                display: block
            }
            .notification-list .notify-item .notify-details span {
                display: block;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                font-size: 13px
            }
        .notification-list .notify-item .user-msg {
            margin-left: 45px;
            white-space: normal;
            line-height: 16px
        }
    .notification-list .profile-dropdown .notify-item {
        padding: 7px 20px
    }
.noti-icon {
    font-size: 21px;
    vertical-align: middle
}
.profile-dropdown {
    min-width: 170px
}
    .profile-dropdown i {
        vertical-align: middle;
        margin-right: 5px
    }
.nav-user {
    padding: 0 12px !important
}
    .nav-user img {
        height: 32px;
        width: 32px
    }
@media (max-width:991.98px) {
    .logo-box {
        width: 70px !important;
        padding-right: 0 !important;
        border-bottom: 1px solid #e2e7f1
    }

        .logo-box .logo-lg {
            display: none !important
        }

        .logo-box .logo-sm {
            display: block !important
        }
}
@media (max-width:600px) {
    .navbar-custom .dropdown {
        position: static
    }

        .navbar-custom .dropdown .dropdown-menu {
            left: 10px !important;
            right: 10px !important
        }
}
body[data-topbar-color=light] .navbar-custom {
    background-color: #fff !important;
    border-bottom: 1px solid #e2e7f1
}
    body[data-topbar-color=light] .navbar-custom .topnav-menu .nav-link {
        color: #343a40
    }
        body[data-topbar-color=light] .navbar-custom .topnav-menu .nav-link svg {
            color: #343a40;
            fill: rgba(52,58,64,.12)
        }
        body[data-topbar-color=light] .navbar-custom .topnav-menu .nav-link:active svg, body[data-topbar-color=light] .navbar-custom .topnav-menu .nav-link:focus svg, body[data-topbar-color=light] .navbar-custom .topnav-menu .nav-link:hover svg {
            color: #5369f8;
            fill: rgba(83,105,248,.1)
        }
    body[data-topbar-color=light] .navbar-custom .button-menu-mobile {
        color: #343a40
    }
    body[data-topbar-color=light] .navbar-custom .app-search input:-ms-input-placeholder {
        color: #adb5bd !important
    }
    body[data-topbar-color=light] .navbar-custom .app-search input::-ms-input-placeholder {
        color: #adb5bd !important
    }
    body[data-topbar-color=light] .navbar-custom .app-search input::placeholder {
        color: #adb5bd !important
    }
    body[data-topbar-color=light] .navbar-custom .app-search .form-control {
        color: #343a40;
        background-color: #f6f6f7;
        border-color: #f6f6f7
    }
    body[data-topbar-color=light] .navbar-custom .app-search .btn {
        background-color: #f6f6f7;
        color: #ced4da
    }
body[data-topbar-color=light] .logo-box {
    background: #fff;
    border-right: 1px solid #e2e7f1
}
body[data-topbar-color=light] .logo-dark {
    display: block
}
body[data-topbar-color=light] .logo-light {
    display: none
}

@media (max-width:991.98px) {
    body[data-layout-mode=horizontal] .navbar-toggle {
        border: 0;
        position: relative;
        padding: 0;
        margin: 0;
        cursor: pointer
    }

        body[data-layout-mode=horizontal] .navbar-toggle .lines {
            width: 25px;
            display: block;
            position: relative;
            height: 16px;
            transition: all .5s ease;
            margin-top: calc(54px / 2)
        }

        body[data-layout-mode=horizontal] .navbar-toggle span {
            height: 2px;
            width: 100%;
            background-color: #4b4b5a;
            display: block;
            margin-bottom: 5px;
            transition: transform .5s ease
        }

        body[data-layout-mode=horizontal] .navbar-toggle.open span {
            position: absolute
        }

            body[data-layout-mode=horizontal] .navbar-toggle.open span:first-child {
                top: 7px;
                transform: rotate(45deg)
            }

            body[data-layout-mode=horizontal] .navbar-toggle.open span:nth-child(2) {
                visibility: hidden
            }

            body[data-layout-mode=horizontal] .navbar-toggle.open span:last-child {
                width: 100%;
                top: 7px;
                transform: rotate(-45deg)
            }
}
body[data-layout-mode=horizontal] .button-menu-mobile {
    display: none
}
body[data-layout-mode=horizontal] .logo-box {
    width: auto;
    padding-right: 50px;
    background-color: transparent;
    padding-left: 0;
    border: none !important
}
@media (max-width:1366px) {
    body[data-layout-mode=horizontal] .logo-box {
        padding-left: 20px
    }
}
@media (max-width:360px) {
    .navbar-custom .topnav-menu .nav-link {
        padding: 0 12px
    }

    .navbar-custom .button-menu-mobile {
        width: 45px
    }
}
body[data-layout-mode=two-column] .logo-box {
    display: none
}
.page-title-box {
    align-items: center;
    justify-content: space-between;
    display: flex;
    margin: 0 -27px 0;
    padding: 20px 27px
}
    .page-title-box .page-title {
        font-size: 1.05rem;
        margin: 0;
        font-weight: bold;
    }
    .page-title-box .breadcrumb {
        padding: 0
    }
@media (max-width:639px) {
    .page-title-box {
        display: block
    }

        .page-title-box .page-title {
            display: block;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden
        }

        .page-title-box .page-title-right {
            display: block;
            padding-top: 5px
        }
}
.footer {
    bottom: 0;
    padding: 2px;
    position: absolute;
    right: 0;
    color: #fff;
    left: 0px;
    border-top: 1px solid #e2e7f1;
    background-color: #0c1033;
}
    .footer .footer-links a {
        color: #e9f5ff;
        margin-left: 1.5rem;
        transition: all .4s
    }
        .footer .footer-links a:hover {
            color: #212529
        }
    .footer .footer-links a:first-of-type {
        margin-left: 0
    }
.footer-alt {
    left: 0 !important;
    text-align: center;
    background-color: transparent
}
@media (max-width:575.98px) {
    .footer {
        left: 0 !important;
        text-align: center
    }
}
body[data-layout-mode=horizontal] .footer {
    left: 0 !important
}
body[data-layout-mode=horizontal][data-layout-width=boxed] .footer {
    max-width: 1300px !important
}
@media (min-width:992px) {
    body[data-layout-mode=detached] .footer {
        position: inherit;
        margin: 0 10px
    }
}
.right-bar {
    background-color: #fff;
    box-shadow: 0 0 24px 0 rgba(0,0,0,.06),0 1px 0 0 rgba(0,0,0,.02);
    display: block;
    position: fixed;
    transition: all .2s ease-out;
    width: 260px;
    z-index: 9999;
    float: right !important;
    right: -270px;
    top: 0;
    bottom: 0
}
    .right-bar .rightbar-title {
        background-color: #5369f8;
        padding: 27px 25px;
        color: #fff
    }
    .right-bar .right-bar-toggle {
        background-color: #444c54;
        height: 24px;
        width: 24px;
        line-height: 27px;
        color: #fff;
        text-align: center;
        border-radius: 50%;
        margin-top: -4px
    }
        .right-bar .right-bar-toggle:hover {
            background-color: #4b545c
        }.right-bar .user-box{padding:25px;text-align:center}
            .right-bar .user-box .user-img {
                position: relative;
                height: 64px;
                width: 64px;
                margin: 0 auto 15px auto
            }
                .right-bar .user-box .user-img .user-edit {
                    position: absolute;
                    right: -5px;
                    bottom: 0;
                    height: 24px;
                    width: 24px;
                    background-color: #fff;
                    line-height: 24px;
                    border-radius: 50%;
                    box-shadow: 0 1rem 3rem rgba(0,0,0,.175)
                }
            .right-bar .user-box h5 {
                margin-bottom: 2px
            }
                .right-bar .user-box h5 a {
                    color: #343a40
                }
    .right-bar .notification-item .media {
        padding: .75rem 1rem
    }
        .right-bar .notification-item .media:hover {
            background-color: #f8f9fa
        }
    .right-bar .notification-item .user-status {
        position: absolute;
        right: 0;
        bottom: -4px;
        font-size: 10px
    }
        .right-bar .notification-item .user-status.online {
            color: #43d39e
        }
        .right-bar .notification-item .user-status.away {
            color: #ffbe0b
        }
        .right-bar .notification-item .user-status.busy {
            color: #ff5c75
        }
.rightbar-overlay {
    background-color: rgba(52,58,64,.2);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: none;
    z-index: 9998;
    transition: all .2s ease-out
}
.right-bar-enabled .right-bar {
    right: 0
}
.right-bar-enabled .rightbar-overlay {
    display: block
}
@media (max-width:575.98px) {
    .right-bar {
        overflow: auto
    }

        .right-bar .slimscroll-menu {
            height: auto !important
        }
}
body[data-layout-width=boxed] #wrapper {
    max-width: 1300px;
    margin: 0 auto;
    box-shadow: 0 1rem 3rem rgba(0,0,0,.175)
}body[data-layout-width=boxed] .navbar-custom{max-width:1300px;margin:0 auto}
body[data-layout-width=boxed] .footer {
    margin: 0 auto;
    max-width: calc(1300px - 250px)
}
body[data-layout-width=boxed][data-sidebar-size=condensed] .footer {
    max-width: calc(1300px - 70px)
}
body[data-layout-width=boxed][data-sidebar-size=compact] .footer {
    max-width: calc(1300px - 160px)
}
@media (min-width:768px) {
    body[data-layout-width=boxed][data-sidebar-size=condensed] .content-page {
        min-height: calc(1750px - 70px)
    }
}
@media (min-width:1200px) {
    body[data-layout-menu-position=scrollable]:not([data-sidebar-size=condensed]):not([data-sidebar-size=compact]):not([data-layout-mode=two-column]) {
        padding-bottom: 0
    }

        body[data-layout-menu-position=scrollable]:not([data-sidebar-size=condensed]):not([data-sidebar-size=compact]):not([data-layout-mode=two-column]) #wrapper {
            display: flex
        }

        body[data-layout-menu-position=scrollable]:not([data-sidebar-size=condensed]):not([data-sidebar-size=compact]):not([data-layout-mode=two-column]) .navbar-custom, body[data-layout-menu-position=scrollable]:not([data-sidebar-size=condensed]):not([data-sidebar-size=compact]):not([data-layout-mode=two-column]) .topnav {
            position: absolute
        }

        body[data-layout-menu-position=scrollable]:not([data-sidebar-size=condensed]):not([data-sidebar-size=compact]):not([data-layout-mode=two-column]) .left-side-menu {
            position: relative;
            min-width: 250px;
            max-width: 250px;
            padding: 20px 0 calc(70px + 20px)
        }

        body[data-layout-menu-position=scrollable]:not([data-sidebar-size=condensed]):not([data-sidebar-size=compact]):not([data-layout-mode=two-column]) .content-page {
            margin-left: 0;
            width: 100%;
            padding-bottom: 60px
        }
}
@media (min-width:1200px) {
    body[data-layout-mode=horizontal] .container-fluid {
        max-width: 90%
    }

    body[data-layout-mode=horizontal] .navbar-custom {
        padding: 0 24px
    }
}body[data-layout-mode=horizontal] .content-page{margin-left:0!important}
.topnav {
    background: #fff;
    border-bottom: 1px solid #e2e7f1;
    margin-top: 70px;
    padding: 0 calc(24px / 2);
    position: fixed;
    left: 0;
    right: 0;
    z-index: 100
}.topnav .topnav-menu{margin:0;padding:0}
    .topnav .navbar-nav .nav-link {
        font-size: .95rem;
        position: relative;
        line-height: 22px;
        padding: calc(33px / 2) 1.1rem;
        color: #6e7488;
        font-family: "IBM Plex Sans",sans-serif
    }.topnav .navbar-nav .nav-link i{font-size:15px;display:inline-block}
        .topnav .navbar-nav .nav-link svg {
            display: inline-block;
            width: 16px;
            height: 16px;
            margin: -4px 5px 0 0;
            color: #6e7488;
            fill: rgba(110,116,136,.12)
        }
        .topnav .navbar-nav .nav-link:focus, .topnav .navbar-nav .nav-link:hover {
            color: #5369f8;
            background-color: transparent
        }
    .topnav .navbar-nav .nav-item .dropdown.active > a.dropdown-toggle {
        color: #5369f8
    }
    .topnav .navbar-nav .nav-item.active > a {
        color: #5369f8
    }
        .topnav .navbar-nav .nav-item.active > a svg {
            color: #5369f8;
            fill: rgba(83,105,248,.12)
        }

@media (min-width:992px) {
    .topnav {
        height: 55px
    }

        .topnav .navbar-nav .nav-item:first-of-type .nav-link {
            padding-left: 0
        }

        .topnav .dropdown-item {
            padding: .5rem 1.25rem;
            min-width: 180px;
            margin: 0 .3rem;
            width: auto
        }

            .topnav .dropdown-item.active {
                background-color: transparent;
                color: #5369f8
            }

        .topnav .dropdown.mega-dropdown .mega-dropdown-menu {
            left: 0;
            right: auto
        }

        .topnav .dropdown .dropdown-menu {
            padding: .3rem 0;
            margin-top: 0;
            border-radius: 0 0 .25rem .25rem
        }

            .topnav .dropdown .dropdown-menu .arrow-down::after {
                right: 20px;
                transform: rotate(-135deg) translateY(-50%);
                position: absolute
            }

            .topnav .dropdown .dropdown-menu .dropdown .dropdown-menu {
                position: absolute;
                top: 0 !important;
                left: 100%;
                display: none
            }

        .topnav .dropdown:hover > .nav-link {
            color: #5369f8
        }

            .topnav .dropdown:hover > .nav-link svg {
                color: #5369f8;
                fill: rgba(83,105,248,.12)
            }

        .topnav .dropdown:hover > .dropdown-menu {
            display: block
        }

            .topnav .dropdown:hover > .dropdown-menu > .dropdown:hover > .dropdown-item {
                color: #5369f8
            }

            .topnav .dropdown:hover > .dropdown-menu > .dropdown:hover > .dropdown-menu {
                display: block
            }

    .navbar-toggle {
        display: none
    }

    body[data-layout-mode=horizontal] .content-page {
        padding: 55px 12px 65px 12px
    }
}
.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;
        right: 5px;
        top: 50%;
        margin-left: 10px;
        transform: rotate(-45deg) translateY(-50%);
        transform-origin: top;
        transition: all .3s ease-out;
        width: .4em
    }

@media (max-width:1199.98px) {
    .topnav-menu .navbar-nav li:last-of-type .dropdown .dropdown-menu {
        right: 100%;
        left: auto
    }
}
@media (max-width:991.98px) {
    .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;
            box-shadow: none;
            padding-left: 15px
        }

        .topnav .dropdown .dropdown-item {
            position: relative;
            background-color: transparent
        }

            .topnav .dropdown .dropdown-item.active, .topnav .dropdown .dropdown-item:active {
                color: #5369f8
            }

        .topnav .arrow-down::after {
            right: 15px;
            position: absolute
        }
}
body[data-layout-mode=horizontal][data-layout-width=boxed] .topnav {
    max-width: 1300px;
    margin: 70px auto 0
}
body[data-layout-mode=horizontal] .logo-box {
    background-color: transparent !important
}
body[data-layout-mode=two-column] .left-side-menu {
    width: calc(70px + 220px);
    background-color: transparent;
    box-shadow: none
}
body[data-layout-mode=two-column] .sidebar-icon-menu {
    position: fixed;
    width: 70px;
    z-index: 500;
    top: 0;
    bottom: 0;
    padding-bottom: 20px;
    background-color: #5369f8
}
    body[data-layout-mode=two-column] .sidebar-icon-menu .logo {
        display: block;
        width: 70px;
        height: 70px;
        line-height: 70px;
        text-align: center
    }
    body[data-layout-mode=two-column] .sidebar-icon-menu .nav {
        background-color: transparent;
        margin: 24px auto
    }
        body[data-layout-mode=two-column] .sidebar-icon-menu .nav .nav-link {
            text-align: center;
            width: 40px;
            height: 40px;
            line-height: 40px;
            margin: 12px auto;
            padding: 0;
            border-radius: 4px
        }
            body[data-layout-mode=two-column] .sidebar-icon-menu .nav .nav-link.active {
                background-color: rgba(255,255,255,.12)
            }
            body[data-layout-mode=two-column] .sidebar-icon-menu .nav .nav-link svg {
                color: #fff;
                fill: rgba(255,255,255,.12);
                height: 22px;
                width: 22px
            }
body[data-layout-mode=two-column] .sidebar-main-menu {
    display: block;
    position: fixed;
    width: 220px;
    background-color: #fff;
    top: 70px;
    bottom: 0;
    left: 70px;
    padding: 30px 5px;
    border-right: 1px solid #e2e7f1;
    transition: all .1s ease-out
}
    body[data-layout-mode=two-column] .sidebar-main-menu .sidebar-menu-body {
        padding: 20px
    }
    body[data-layout-mode=two-column] .sidebar-main-menu .menu-title {
        color: #adb5bd !important;
        margin: 0;
        padding: 10px 20px;
        letter-spacing: .05em;
        font-size: .7rem;
        text-transform: uppercase;
        font-weight: 600
    }
    body[data-layout-mode=two-column] .sidebar-main-menu .nav > .nav-item > .nav-link {
        color: #4b4b5a;
        font-size: .95rem;
        font-family: "IBM Plex Sans",sans-serif
    }
    body[data-layout-mode=two-column] .sidebar-main-menu .nav > .nav-item .menu-arrow {
        right: 10px
    }
    body[data-layout-mode=two-column] .sidebar-main-menu .nav .nav-link {
        position: relative;
        color: #4b4b5a;
        padding: 6px 15px;
        border-radius: 3px;
        margin: 3px 5px
    }
        body[data-layout-mode=two-column] .sidebar-main-menu .nav .nav-link.active, body[data-layout-mode=two-column] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode=two-column] .sidebar-main-menu .nav .nav-link:hover {
            color: #5369f8
        }
    body[data-layout-mode=two-column] .sidebar-main-menu .nav .menuitem-active > a.nav-link {
        color: #5369f8;
        background-color: rgba(83,105,248,.07)
    }
    body[data-layout-mode=two-column] .sidebar-main-menu .nav .menuitem-active a.active {
        color: #5369f8
    }
    body[data-layout-mode=two-column] .sidebar-main-menu #sidebar-menu .menu-arrow {
        top: 7px
    }
    body[data-layout-mode=two-column] .sidebar-main-menu .nav-second-level {
        padding-left: 15px;
        list-style: none
    }
@media (min-width:992px) {
    body[data-layout-mode=two-column] .navbar-custom {
        left: 70px !important;
        padding-left: 0
    }

        body[data-layout-mode=two-column] .navbar-custom .logo-box {
            width: 220px
        }

            body[data-layout-mode=two-column] .navbar-custom .logo-box .logo-sm {
                display: none
            }

    body[data-layout-mode=two-column][data-sidebar-size=condensed] .logo-box {
        width: 0 !important
    }
}
body[data-layout-mode=two-column][data-sidebar-color=light] .logo-box {
    background-color: #fff
}

@media (min-width:992px) {
    body[data-layout-mode=two-column] .content-page {
        margin-left: calc(70px + 220px)
    }

    body[data-layout-mode=two-column] .footer {
        left: calc(70px + 220px)
    }

    body[data-layout-mode=two-column][data-sidebar-size=condensed] .sidebar-main-menu {
        display: none
    }
}
body[data-layout-mode=two-column] .twocolumn-menu-item {
    display: none
}
body[data-layout-mode=two-column][data-sidebar-color=dark] .sidebar-main-menu {
    background-color: #e7e7e7
}
    body[data-layout-mode=two-column][data-sidebar-color=dark] .sidebar-main-menu .nav > .nav-item > .nav-link {
        color: #9097a7
    }
    body[data-layout-mode=two-column][data-sidebar-color=dark] .sidebar-main-menu .nav .nav-link.active, body[data-layout-mode=two-column][data-sidebar-color=dark] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode=two-column][data-sidebar-color=dark] .sidebar-main-menu .nav .nav-link:hover {
        color: #c8cddc
    }
    body[data-layout-mode=two-column][data-sidebar-color=dark] .sidebar-main-menu .nav .menuitem-active > a.nav-link {
        color: #5369f8;
        background-color: rgba(83,105,248,.07)
    }
    body[data-layout-mode=two-column][data-sidebar-color=dark] .sidebar-main-menu .nav .menuitem-active a.active {
        color: #5369f8
    }
body[data-layout-mode=two-column][data-sidebar-color=brand] .sidebar-main-menu .nav > .nav-item > .nav-link, body[data-layout-mode=two-column][data-sidebar-color=gradient] .sidebar-main-menu .nav > .nav-item > .nav-link {
    color: rgba(255,255,255,.7)
}
body[data-layout-mode=two-column][data-sidebar-color=brand] .sidebar-main-menu .nav .nav-link.active, body[data-layout-mode=two-column][data-sidebar-color=brand] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode=two-column][data-sidebar-color=brand] .sidebar-main-menu .nav .nav-link:hover, body[data-layout-mode=two-column][data-sidebar-color=gradient] .sidebar-main-menu .nav .nav-link.active, body[data-layout-mode=two-column][data-sidebar-color=gradient] .sidebar-main-menu .nav .nav-link:focus, body[data-layout-mode=two-column][data-sidebar-color=gradient] .sidebar-main-menu .nav .nav-link:hover {
    color: rgba(255,255,255,.9)
}
body[data-layout-mode=two-column][data-layout-width=boxed] .navbar-custom {
    max-width: calc(1300px - 70px)
}
body[data-layout-mode=two-column][data-layout-width=boxed] .sidebar-main-menu {
    position: absolute;
    top: 0
}
body[data-layout-mode=two-column][data-layout-width=boxed]:not([data-sidebar-size=condensed]) .footer {
    max-width: calc(1300px - calc(70px + 220px))
}

[data-simplebar] {
    position: relative;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-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;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: auto !important;
    height: auto !important;
    z-index: 0
}

.simplebar-offset {
    direction: inherit !important;
    box-sizing: inherit !important;
    resize: none !important;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 0;
    margin: 0;
    -webkit-overflow-scrolling: touch
}

.simplebar-content-wrapper {
    direction: inherit;
    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;
}

    .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 {
    box-sizing: inherit !important;
    height: 100%;
    width: 100%;
    max-width: 1px;
    position: relative;
    float: left;
    max-height: 1px;
    overflow: hidden;
    z-index: -1;
    padding: 0;
    margin: 0;
    pointer-events: none;
    flex-grow: inherit;
    flex-shrink: 0;
    flex-basis: 0
}

.simplebar-height-auto-observer {
    box-sizing: inherit;
    display: block;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 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;
    right: 0;
    bottom: 0;
    pointer-events: none;
    overflow: hidden
}

[data-simplebar].simplebar-dragging .simplebar-content {
    pointer-events: 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;
    right: 2px;
    width: 5px;
    min-height: 10px
}

    .simplebar-scrollbar:before {
        position: absolute;
        content: '';
        background: #a2adb7;
        border-radius: 7px;
        left: 0;
        right: 0;
        opacity: 0;
        transition: opacity .2s linear
    }

    .simplebar-scrollbar.simplebar-visible:before {
        opacity: .5;
        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 {
    left: 0;
    height: 11px
}

    .simplebar-track.simplebar-horizontal .simplebar-scrollbar:before {
        height: 100%;
        left: 2px;
        right: 2px
    }

    .simplebar-track.simplebar-horizontal .simplebar-scrollbar {
        right: auto;
        left: 0;
        top: 2px;
        height: 7px;
        min-height: 0;
        min-width: 10px;
        width: auto
    }

[data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
    right: auto;
    left: 0
}

.hs-dummy-scrollbar-size {
    direction: rtl;
    position: fixed;
    opacity: 0;
    visibility: hidden;
    height: 500px;
    width: 500px;
    overflow-y: hidden;
    overflow-x: scroll
}