/* By default, disactivate in small devices */
@media (max-width: 575px) {
 /* 80px and its content aligned to centre. Pushing it off the screen with the
       negative left margin
    */
    #sidebar.active {
        min-width: 100px;
        max-width: 100px;
        text-align: center;
    }


    /* Reappearing the sidebar on toggle button click */
    #sidebar {
        margin-left: 0;
        min-height: 100%;
    }


    /* Toggling the sidebar header content,
       hide the big heading [h3] and showing the small heading [strong] and vice versa
    */
    #sidebar .sidebar-header strong {
        display: none;
    }
    #sidebar.active .sidebar-header h3 {
        display: none;
    }
    #sidebar.active .sidebar-header strong {
        display: block;
    }

    /* Downsize the navigation links font size */
    #sidebar.active ul li a {
        padding: 10px 10px;
        font-size: 0.85em;
    }

    #sidebar.active ul li a i {
        margin-right:  0;
        display: block;
        font-size: 1.8em;
        margin-bottom: 5px;
    }

    /* Adjust the dropdown links padding*/
    #sidebar.active ul ul a {
        padding: 10px !important;
    }

    /* Changing the arrow position to bottom center position,
      translateX(50%) works with right: 50%
      to accurately  center the arrow */
    #sidebar.active a[aria-expanded="false"]::before, #sidebar.active a[aria-expanded="true"]::before {
        top: auto;
        bottom: 5px;
        right: 50%;
        transform: translateX(50%);
    }

    /*.wrapper {*/
        /*padding-top: 232px !important;*/
    /*}*/
}

/*@media (max-width:991px) and (min-width:575px) {*/
    /*.wrapper {*/
        /*padding-top: 178px !important;*/
    /*}*/
/*}*/