﻿/*    Humberger icon
--------------------------*/

.hamburger {
    display: inline-block;
    position: relative;
    top: 24px;
    left: 30px;
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
    width: 37px;
    height: 50px;
    z-index: 999;
}

    .hamburger .line {
        background-color: var(--header-primary);
        display: block;
        height: 4px;
        margin: 4px auto;
        width: 28px;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .hamburger:hover {
        cursor: pointer;
    }

        .hamburger:hover .line, .hamburger:active .line {
            background-color: var(--sidebar-dark);
        }

    .hamburger.is-active .line:nth-child(1), .hamburger.is-active .line:nth-child(3) {
        width: 10px;
        height: 3px;
    }

    .hamburger.is-active .line:nth-child(2) {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px);
        width: 20px;
        height: 3px;
    }

    .hamburger.is-active .line:nth-child(1) {
        -webkit-transform: translateY(3px) rotate(45deg);
        transform: translateY(3px) rotate(45deg);
    }

    .hamburger.is-active .line:nth-child(3) {
        -webkit-transform: translateY(-3px) rotate(-45deg);
        transform: translateY(-3px) rotate(-45deg);
    }


.navbar .sidebar-toggle {
    float: left;
    margin-left: -4px;
}

    .navbar .sidebar-toggle + .navbar-brand {
        margin-left: 0;
    }

.sidebar {
    position: fixed;
    top: 0px;
    left: 0;
    bottom: 0;
    width: 240px;
    background: var(--elevate-white);
    z-index: 100;
    overflow: auto;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: width 300ms ease-in-out;
    transition: width 300ms ease-in-out;
    font-family: var(--elevate-primary-font-new-ui);
}

    .sidebar.sidebar-static {
        position: absolute;
    }

    /* Position of icon */
    .sidebar img.sidebar-icon {
        vertical-align: middle;
        width: 24px;
        height: 24px;
        margin: 0 16px 0 16px;
        text-align: center;
        display: inline-block;
    }

    .sidebar i.fa {
        vertical-align: baseline;
    }

    .sidebar ul {
        list-style-type: none;
        padding: 0;
    }

li#WelcomeSidebar {
    margin-top: 22px;
}

.sidebar-bottom-area {
    position: relative;
    bottom: 1.5rem;
    margin-top: auto;
}

.sidebar .nano-content > ul {
    width: 100%;
    -webkit-transition: width 300ms ease-in-out;
    transition: width 300ms ease-in-out;
}

    .sidebar .nano-content > ul li.label {
        font-size: 14px;
        line-height: 40px;
        color: var(--sidebar-text);
        text-transform: capitalize;
        font-weight: normal;
    }

    .sidebar .nano-content > ul li.content {
        color: var(--sidebar-text);
    }

        .sidebar .nano-content > ul li.content .progress {
            margin-top: 0.7em;
        }

    .sidebar .nano-content > ul li > ul {
        display: none;
        background: rgba(52,57,87,0.2) !important;
    }

    .sidebar .nano-content > ul li.open > ul {
        display: block;
    }

    .sidebar .nano-content > ul li > a {
        display: block;
        overflow: hidden;
        cursor: pointer;
        color: var(--sidebar-secondary);
        /*border-bottom: none;*/
        background: var(--sidebar-primary);
        text-decoration: none;
        opacity: 100%;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        position: relative;
    }

.sidebar-li-text {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    height: 40px;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-top: 4px;
    margin-bottom: 4px;
}

.sidebar-li-text-inside {
    display: inline-block;
    opacity: 100%;
    font-family: var(--elevate-primary-font-new-ui);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    vertical-align: middle;
}

.sidebar .nano-content > ul li > a {
    border-left: 4px solid var(--elevate-white);
}

    .sidebar .nano-content > ul li > a:hover {
        color: var(--sidebar-text);
        background: var(--elevate-gradient);
        border-left: 4px solid var(--elevate-blue);
    }

a > img.sidebar-icon {
    filter: var(--sidebar-icon-gray);
}

a:hover > img.sidebar-icon, a.sidebar-li-text.active > img.sidebar-icon {
    filter: var(--sidebar-icon-blue);
}

.sidebar .nano-content > ul li > a > .sidebar-collapse-icon {
    float: right;
    margin-right: 5px;
    font-size: 10px;
    margin-top: 10px;
    transition: -webkit-transform 0.3s ease;
    -webkit-transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease
}

.sidebar .nano-content > ul li > a > .badge {
    font-weight: normal;
    position: absolute;
    right: 45px;
    top: 15px;
}

.sidebar .nano-content > ul li:hover > a, .sidebar .nano-content > ul li.active > a, .sidebar .nano-content > ul li.open > a {
    color: var(--sidebar-text);
    position: relative;
}

    .sidebar .nano-content > ul li.open > a > .sidebar-collapse-icon {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg);
    }

.sidebar .nano-content > ul > li.label, .sidebar .nano-content > ul > li.content, .sidebar .nano-content > ul > li > a {
    /*            padding-left: 20px;*/
    /*            padding-right: 20px;*/
}

html.rtl .sidebar .nano-content > ul > li.label, html.rtl .sidebar .nano-content > ul > li.content, html.rtl .sidebar .nano-content > ul > li > a {
    padding-left: 15px;
    padding-right: 15px;
}

.sidebar .nano-content > ul > li.active > a, .sidebar .nano-content > ul > li.open > a, .sidebar .nano-content > ul > li > ul {
    border-left: 4px solid var(--elevate-blue);
    background-image: var(--elevate-gradient);
}

    .sidebar .nano-content > ul > li > ul > li.label, .sidebar .nano-content > ul > li > ul > li.content, .sidebar .nano-content > ul > li > ul > li > a {
        padding-left: 50px;
        padding-right: 15px;
    }

html.rtl .sidebar .nano-content > ul > li > ul > li.label, html.rtl .sidebar .nano-content > ul > li > ul > li.content, html.rtl .sidebar .nano-content > ul > li > ul > li > a {
    padding-left: 15px;
    padding-right: 45px;
}

.sidebar .nano-content > ul > li > ul > li.active > a, .sidebar .nano-content > ul > li > ul > li.open > a, .sidebar .nano-content > ul > li > ul > li > ul {
    background: #242634;
}

    .sidebar .nano-content > ul > li > ul > li > ul > li.label, .sidebar .nano-content > ul > li > ul > li > ul > li.content, .sidebar .nano-content > ul > li > ul > li > ul > li > a {
        padding-left: 67.5px;
        padding-right: 15px;
    }

html.rtl .sidebar .nano-content > ul > li > ul > li > ul > li.label, html.rtl .sidebar .nano-content > ul > li > ul > li > ul > li.content, html.rtl .sidebar .nano-content > ul > li > ul > li > ul > li > a {
    padding-left: 15px;
    padding-right: 67.5px;
}

.sidebar .nano-content > ul > li > ul > li > ul > li.active > a, .sidebar .nano-content > ul > li > ul > li > ul > li.open > a, .sidebar .nano-content > ul > li > ul > li > ul > li > ul {
    background: #1c1d28;
}

    .sidebar .nano-content > ul > li > ul > li > ul > li > ul > li.label, .sidebar .nano-content > ul > li > ul > li > ul > li > ul > li.content, .sidebar .nano-content > ul > li > ul > li > ul > li > ul > li > a {
        padding-left: 90px;
        padding-right: 15px;
    }

html.rtl .sidebar .nano-content > ul > li > ul > li > ul > li > ul > li.label, html.rtl .sidebar .nano-content > ul > li > ul > li > ul > li > ul > li.content, html.rtl .sidebar .nano-content > ul > li > ul > li > ul > li > ul > li > a {
    padding-left: 15px;
    padding-right: 90px;
}

/* Small Sidebar styles */

body {
    position: relative;
}

.sidebar-hide .sidebar {
    left: -200px;
}

.sidebar {
    -webkit-transition: left 300ms ease-in-out, width 300ms ease-in-out;
    transition: left 300ms ease-in-out, width 300ms ease-in-out;
}

/* Hide to Small bar */

.sidebar-hide .sidebar.sidebar-hide-to-small {
    position: absolute;
    width: 72px;
    left: 0;
    top: 0px;
}

    .sidebar-hide .sidebar.sidebar-hide-to-small, .sidebar-hide .sidebar.sidebar-hide-to-small .nano {
        overflow: hidden;
    }

        .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content {
            overflow: scroll;
        }

            .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul {
                width: 82px;
            }

                .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul .label, .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul .content {
                    display: none;
                }

                .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul .badge {
                    display: none;
                }

                .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a {
                }

                    .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a, .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a > .sidebar-collapse-icon {
                    }

                        .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a > div.sidebar-li-text-inside, .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a > .sidebar-collapse-icon {
                            opacity: 0%;
                            -webkit-transition: all 0.3s ease-in-out;
                            transition: all 0.3s ease-in-out;
                        }

                        .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a.active, .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a > .sidebar-collapse-icon {
                            /*                        color: orange;*/
                        }

.sidebar-hide .sidebar-li-text {
    color: pink;
}

.sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > a > .badge {
    position: absolute;
    right: 3px;
    top: 3px;
}

.sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li {
    position: relative;
}

    .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > ul {
        visibility: hidden;
        width: 200px;
        position: absolute;
        top: 0;
        left: 100%;
    }

.sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul li:hover > ul {
    border-right: 1px solid var(--sidebar-secondary);
    border-top: 1px solid var(--sidebar-secondary);
    -webkit-box-shadow: 0 2px 2px 0 var(--sidebar-dark);
    box-shadow: 0 2px 2px 0 var(--sidebar-dark);
    display: block !important;
    visibility: visible;
}

.sidebar-hide .sidebar.sidebar-hide-to-small ~ .content-wrap {
    margin-left: 72px;
}

.sidebar.sidebar-overlay.sidebar-hide-to-small ~ .content-wrap {
    margin-left: 72px;
}

/* Show with Push content */

.sidebar.sidebar-push ~ .content-wrap {
    -webkit-transform: translateX(200px) translateZ(0);
    transform: translateX(200px) translateZ(0);
    transition: -webkit-transform 300ms ease-in-out, margin-left 300ms ease-in-out;
    -webkit-transition: margin-left 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
    transition: margin-left 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
    transition: transform 300ms ease-in-out, margin-left 300ms ease-in-out;
    transition: transform 300ms ease-in-out, margin-left 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
}

.sidebar-hide .sidebar.sidebar-push ~ .content-wrap {
    -webkit-transform: translateX(0) translateZ(0);
    transform: translateX(0) translateZ(0);
}

/* Show with Shrink content */

.sidebar.sidebar-shrink ~ .content-wrap {
    margin-left: 240px;
    -webkit-transition: margin-left 300ms ease-in-out;
    transition: margin-left 300ms ease-in-out;
}

.sidebar-hide .sidebar.sidebar-shrink ~ .content-wrap {
    margin-left: 0;
}

.sidebar-hide .sidebar.sidebar-shrink.sidebar-hide-to-small ~ .content-wrap {
    margin-left: 72px;
}

.sidebar-hide .sidebar.sidebar-shrink.sidebar-hide-to-small ~ .header {
    margin-left: 72px;
}

/* Hide on Content Click */

.sidebar.sidebar-overlap-content ~ .content-wrap:after {
    content: '';
    display: block;
    position: absolute;
    cursor: pointer;
    visibility: visible;
    opacity: 1;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: var(--sidebar-text);
    z-index: 10;
    -webkit-transition: opacity 300ms ease-in-out, visibility 300ms ease-in-out;
    transition: opacity 300ms ease-in-out, visibility 300ms ease-in-out;
}

.sidebar-hide .sidebar.sidebar-overlap-content ~ .content-wrap:after {
    visibility: hidden;
    opacity: 0;
}

/* Nano Scroller */

.sidebar .nano {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

    .sidebar .nano > .nano-content {
        position: absolute;
        overflow: scroll;
        overflow-x: hidden;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        display: flex;
        flex-direction: column;
    }

        .sidebar .nano > .nano-content:focus {
            outline: thin dotted;
        }

        .sidebar .nano > .nano-content::-webkit-scrollbar {
            display: none;
        }

    .sidebar .nano.has-scrollbar > .nano-content::-webkit-scrollbar {
        display: block;
    }

    .sidebar .nano > .nano-pane {
        background: rgba(0, 0, 0, 0.25);
        position: absolute;
        width: 5px;
        right: 0;
        top: 0;
        bottom: 0;
        visibility: hidden\9;
        /* Target only IE7 and IE8 with this hack */
        opacity: 0.01;
        -webkit-transition: 0.2s;
        transition: 0.2s;
        border-radius: 5px;
    }

        .sidebar .nano > .nano-pane > .nano-slider {
            /*    background: #ff5a5e;*/
            position: relative;
        }

        .sidebar .nano:hover > .nano-pane, .sidebar .nano > .nano-pane.active, .sidebar .nano > .nano-pane.flashed {
            visibility: visible\9;
            /* Target only IE7 and IE8 with this hack */
            opacity: 0.99;
        }

/* Light Scheme */

.sidebar.sidebar-light {
    background: #F8F8F8;
}

    .sidebar.sidebar-light .nano > .nano-pane {
        background: var(--sidebar-primary);
    }

    .sidebar.sidebar-light .nano-content > ul > li.content, .sidebar.sidebar-light .nano-content > ul > li > a {
        color: #919191;
    }

    .sidebar.sidebar-light .nano-content > ul > li:hover > a {
        color: #474747;
    }

    .sidebar.sidebar-light .nano-content > ul > li.active > a, .sidebar.sidebar-light .nano-content > ul > li.open > a {
        color: #fff;
    }

    .sidebar.sidebar-light .nano-content > ul > li.label, .sidebar.sidebar-light .nano-content > ul > li.content, .sidebar.sidebar-light .nano-content > ul > li > a {
        padding-left: 15px;
        padding-right: 15px;
    }

html.rtl .sidebar.sidebar-light .nano-content > ul > li.label, html.rtl .sidebar.sidebar-light .nano-content > ul > li.content, html.rtl .sidebar.sidebar-light .nano-content > ul > li > a {
    padding-left: 15px;
    padding-right: 15px;
}

.sidebar.sidebar-light .nano-content > ul > li.active > a, .sidebar.sidebar-light .nano-content > ul > li.open > a, .sidebar.sidebar-light .nano-content > ul > li > ul {
    background: #206da9;
}

    .sidebar.sidebar-light .nano-content > ul > li > ul > li.label, .sidebar.sidebar-light .nano-content > ul > li > ul > li.content, .sidebar.sidebar-light .nano-content > ul > li > ul > li > a {
        padding-left: 45px;
        padding-right: 15px;
    }

html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li.label, html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li.content, html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li > a {
    padding-left: 15px;
    padding-right: 45px;
}

.sidebar.sidebar-light .nano-content > ul > li > ul > li.active > a, .sidebar.sidebar-light .nano-content > ul > li > ul > li.open > a, .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul {
    background: #1d6298;
}

    .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li.label, .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li.content, .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > a {
        padding-left: 67.5px;
        padding-right: 15px;
    }

html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li.label, html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li.content, html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > a {
    padding-left: 15px;
    padding-right: 67.5px;
}

.sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li.active > a, .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li.open > a, .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > ul {
    background: #195786;
}

    .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > ul > li.label, .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > ul > li.content, .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > ul > li > a {
        padding-left: 90px;
        padding-right: 15px;
    }

html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > ul > li.label, html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > ul > li.content, html.rtl .sidebar.sidebar-light .nano-content > ul > li > ul > li > ul > li > ul > li > a {
    padding-left: 15px;
    padding-right: 90px;
}

/*
 * RTL sidebar bar
 */

html.rtl {
    direction: rtl;
    /* Show with Push content */
    /* Show with Shrink content */
}

    html.rtl .sidebar {
        left: auto;
        right: 0;
        -webkit-transition: right 300ms ease, width 300ms ease;
        transition: right 300ms ease, width 300ms ease;
    }

        html.rtl .sidebar .sidebar-icon {
            margin-right: 0;
            margin-left: 5px;
        }

        html.rtl .sidebar .nano-content > ul li > a > .sidebar-collapse-icon, html.rtl .sidebar .nano-content > ul li > a > .badge {
            float: left;
        }

    html.rtl .sidebar-hide .sidebar {
        right: -200px;
    }

        html.rtl .sidebar-hide .sidebar.sidebar-hide-to-small {
            right: 0;
            left: auto;
        }

            html.rtl .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul > li > ul {
                left: auto;
                right: 100%;
            }

    html.rtl .sidebar.sidebar-overlay ~ .content-wrap {
        margin-right: 0;
    }

    html.rtl .sidebar-hide .sidebar.sidebar-hide-to-small ~ .content-wrap, html.rtl .sidebar.sidebar-overlay.sidebar-hide-to-small ~ .content-wrap {
        margin-left: 0;
        margin-right: 60px;
    }

    html.rtl .sidebar.sidebar-push ~ .content-wrap {
        margin-left: 0;
        -webkit-transform: translate3d(-200px, 0, 0);
        transform: translate3d(-200px, 0, 0);
        transition: -webkit-transform 300ms ease-in-out, margin-right 300ms ease-in-out;
        -webkit-transition: margin-right 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
        transition: margin-right 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
        transition: transform 300ms ease-in-out, margin-right 300ms ease-in-out;
        transition: transform 300ms ease-in-out, margin-right 300ms ease-in-out, -webkit-transform 300ms ease-in-out;
    }

    html.rtl .sidebar-hide .sidebar.sidebar-push ~ .content-wrap {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    html.rtl .sidebar.sidebar-shrink ~ .content-wrap {
        margin-left: 0;
        margin-right: 200px;
        -webkit-transition: margin-right 300ms ease-in-out;
        transition: margin-right 300ms ease-in-out;
    }

    html.rtl .sidebar-hide .sidebar.sidebar-shrink ~ .content-wrap {
        margin-left: 0;
        margin-right: 0;
    }

    html.rtl .sidebar-hide .sidebar.sidebar-shrink.sidebar-hide-to-small ~ .content-wrap {
        margin-left: 0;
        margin-right: 60px;
    }

/*    Sidebar from style 
--------------------------*/
.sidebar-hide .logo {
    width: 100%;
}

    .sidebar-hide .logo .logo-text {
        opacity: 0;
        pointer-events: none;
        cursor: default;
    }

    .sidebar-hide .logo .logo-symbol {
        display: inline-block;
        margin-right: 18px;
        -webkit-transition: margin-right 0.3s;
    }

@media print {
    .header,
    .sidebar,
    .chat-sidebar,
    .control,
    .control-bar {
        display: none !important;
    }

    [contenteditable]:hover,
    [contenteditable]:focus {
        outline: none;
    }
}

/*    Label from styles
-----------------------*/
ul.inbox-nav li a span.label {
    margin-top: 13px;
}

@media (min-width: 30rem) and (max-width: 42.5rem) {
    .card-badge .label {
        display: inline-block;
        margin-bottom: 5px;
        padding: 5px;
    }
}

@media (min-width: 22.5rem) and (max-width: 30rem) {
    .card-badge .label {
        display: inline-block;
        margin-bottom: 5px;
        padding: 5px;
    }
}

@media (min-width: 20rem) and (max-width: 22.5rem) {
    .card-badge .label {
        display: inline-block;
        margin-bottom: 5px;
        padding: 5px;
    }
}

.logo-expand.sidebar {
    display: block;
}

.logo-expand.sidebar-hide {
    display: none;
}

.logo-shrink.sidebar {
    display: none;
}

.logo-shrink.sidebar-hide {
    display: block;
}

.content-body-unauthorized {
    display: flex;
    height: 100%;
}

.main-body {
    width: 100%;
}

body::after {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    z-index: -1;
}

.sidebar-impersonation-header {
    color: white;
    padding-left: .6rem;
    font-size: .7rem;
    margin-top: 1rem;
}

.nice-home {
    /*    content: url("~/shared/images/home.svg")*/
}

.nice-usage::before {
    background: url("~/shared/images/home.svg");
}

/* Sidebar Sub Panel */
.sidebar-sub-pane {
    top: -5px;
}

.sidebar-sub-li-text {
    padding-left: 0px !important;
}

.sidebar-item-not-allowed {
    cursor: not-allowed;
}

.pointer-events-none {
    pointer-events: none;
    color: var(--sidebar-text);
}

@media (max-width: 40rem) {
    .sidebar-hide .sidebar.sidebar-hide-to-small {
        width: 0px;
    }

        .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul {
            width: 0px;
        }

            .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content > ul a {
                display: none;
            }

    .sidebar.sidebar-shrink.sidebar-hide-to-small ~ .content-wrap {
        margin-left: 0;
    }

    .sidebar-hide .sidebar.sidebar-shrink.sidebar-hide-to-small ~ .content-wrap {
        margin-left: 0;
    }

    .sidebar .hamburger {
        top: 8px;
        left: 11px;
        width: 20px;
        height: 15px
    }

        .sidebar .hamburger .line {
            margin: 2px auto;
            height: 2px;
            width: 14px
        }

        .sidebar .hamburger.is-active .line:nth-child(2) {
            width: 14px
        }

        .sidebar .hamburger.is-active {
            transform: rotateY(180deg);
        }

    .hamburger.is-active .line {
        -webkit-transform: none !important;
        transform: none !important;
        height: 2px !important;
        width: 14px !important;
    }

    .sidebar-hide .sidebar.sidebar-hide-to-small, .sidebar-hide .sidebar.sidebar-hide-to-small .nano, .sidebar-hide .sidebar.sidebar-hide-to-small .nano-content {
        overflow: visible;
    }
}
