/* ===================== Sidebar Media Queries =================*/


/* ------------------- Medium Monitors ---------------------- */

@media only screen and (max-width: 1499px) {
    #sidebar {
        font-size: 0.9em;
        width: 200px;
        transition: width 0.5s;
    }

    #mainContent {
        width: calc(100% - 200px);
        font-size: 0.85em;
        margin-left: 200px;
        transition: width 0.5s;
    }
}

/* ------------------- Laptop Monitors ---------------------- */

@media only screen and (max-width: 1299px) {
    #sidebar {
        font-size: 0.8em;
        width: 175px;
    }

    #mainContent {
        width: calc(100% - 175px);
        font-size: 0.85em;
        margin-left: 175px;
    }
}

/* ------------------- Small Monitors ---------------------- */

@media only screen and (max-width: 1099px) {
    #sidebar {
        font-size: 0.8em;
        width: 150px;
    }

    #mainContent {
        width: calc(100% - 150px);
        font-size: 0.85em;
        margin-left: 150px;
    }

    nav.navbar {
        font-size: 1.4em;
    }

    .navbar.business-nav .btn {
        float: none;
    }

}

/* ------------------- Tablets ---------------------- */

@media only screen and (max-width: 899px) {
    #sidebar {
        font-size: 0.7em;
        width: 140px;
    }

    #mainContent {
        width: calc(100% - 140px);
        font-size: 0.8em;
        margin-left: 140px;
    }

}

/* ------------------- Small Tablets ---------------------- */

@media only screen and (min-width: 768px) and (max-width: 836px) {

    #sidebar {
        font-size: 0.7em;
        width: 120px;
    }

    #mainContent {
        width: calc(100% - 120px);
        font-size: 0.8em;
        margin-left: 120px;
    }
}

/* ------------------- Extra Small ---------------------- */

@media (max-width: 768px) {
    #sidebar {
        min-width: 110px;
        max-width: 110px;
        text-align: center;
        margin-left: -0px !important ;
        font-size: 0.9em;
    }

    #mainContent {
        width: calc(100% - 110px);
        font-size: 0.8em;
        margin-left: 110px;
    }

    .navbar .btn.navbar-btn{
        font-size: 1.4em;
    }

    .sidebar-header { display: none; }

    a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
        top: auto;
        bottom: 5px;
        right: 50%;
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%);
    }
    #sidebar.active {
        margin-left: 0 !important;
    }

    #sidebar .sidebar-header h3, #sidebar .CTAs {
        display: none;
    }

    #sidebar .sidebar-header strong {
        display: block;
    }

    #sidebar ul li a {
        text-align: center;
        font-size: 1.2em !important;
        padding: 20px 10px;
    }

    #sidebar ul li a span {
        font-size: 0.85em;
    }
    #sidebar ul li a i {
        margin-right:  0;
        display: block;
    }

    #sidebar ul ul a {
        padding: 1.5rem 0.5rem !important;
    }

    #sidebar ul li a i {
        font-size: 1.3em;
    }
    #sidebar {
        margin-left: 0;
    }
    #sidebarCollapse span {
        display: none;
    }
}

/*
END Sidebar Media Queries
*/