.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
}

.admin_sidebarNav {
    padding-top: 3px !important;
    min-width: 250px;
    max-width: 250px;
    min-height: 100vh;
    background: #284a6a;
    color: #fff;
    transition: all 0.3s;
}

    .admin_sidebarNav ul {
        list-style: none;
    }


    .admin_sidebarNav.active {
        margin-left: -250px;
    }





.admin_MenuItemDropDownToggle {
    vertical-align: middle;
    color: white;
    text-decoration: none;
}

    .admin_MenuItemDropDownToggle:hover {
        border: .25px;
        border-style: ridge;
        border-color: darkslategrey;
        transition: all 0.3s;
    }

        .admin_MenuItemDropDownToggle:hover .admin_MenuItemFaMinusSign {
            color: #396ef1;
        }

    .admin_MenuItemDropDownToggle:after {
        display: block;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
    }

    .admin_MenuItemDropDownToggle[data-toggle="collapse"],
    .admin_MenuItemDropDownToggle[data-bs-toggle="collapse"] {
        position: relative;
    }

.admin_MenuGroupItem a, a:hover, a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}


.admin_sidebarNav .sidebar-header {
    padding: 20px;
    background: #284a6a;
}

.admin_sidebarNav ul.admin_sidebarNavComponents {
    border-bottom: 1px solid #47748b;
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}

.admin_sidebarNav .admin_sidebarNavComponents .admin_MenuGroupItem .admin_MenuItemDropDownToggle {
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 9px;
    padding-right: 10px;
    font-size: 1.1em;
    display: block;
}

.admin_MenuSubItems_ul {
    background-color: rgb(48, 59, 69);
}

.admin_sidebarNav ul li.active > a, a[aria-expanded="true"] {
    color: #fff;
}

.admin_sidebarNavComponents ul a {
}

.admin_MenuSubItem_a {
    background-color: #303b45;
    color: #dcdcdc;
    display: block;
    padding: 10px;
}

    .admin_MenuSubItem_a:hover {
        color: #396ef1;
    }

/*#region Font Awesome Icon formats*/
/*set the styles for the line on the menu group items*/
.admin_MenuMinusSign {
    color: #DCDCDC;
    float: left;
    line-height: inherit;
    margin-right: 10px;
    vertical-align: middle;
}

.admin_MenuItemFaMinusSign {
    color: #DCDCDC;
    opacity: 0;
}

/*rotate the line when the group is expanded*/
.admin_MenuItemDropDownToggle[aria-expanded="true"] > i {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

/*rotate the line when the group is expanded*/
.admin_MenuItemDropDownToggle[aria-expanded="true"] > span {
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.admin_MenuSubItem_li {
    border-left: 4px solid #DCDCDC;
    margin-left: 15px;
    transition: all 0.3s;
}

    .admin_MenuSubItem_li:hover {
        border-left: 4px solid #396ef1;
    }

/*#endregion Font Awesome Icon formats*/

/*#region Admin Animated Hamburger*/

.adminMenuSideBarCollapseButton {
    width: 40px;
    height: 40px;
    display: block;
    border-color: white;
    border-image: linear-gradient(to left, #ddd 0%, #284a6a 100%);
    border-image-slice: 1;
    border-width: 2px;
}



    .adminMenuSideBarCollapseButton span {
        width: 80%;
        height: 2px;
        margin: 0 auto;
        display: block;
        background: #555;
        transition: all 0.8s cubic-bezier(0.810, -0.330, 0.345, 1.375);
    }


    .adminMenuSideBarCollapseButton .adminMenuSideBarCollapseButtonSOne {
        /* rotate first one */
        transform: rotate(45deg) translate(2px, 2px);
        background-color: white;
    }

    .adminMenuSideBarCollapseButton .adminMenuSideBarCollapseButtonSTwo {
        /* second one is not visible */
        opacity: 0;
        background-color: white;
    }

    .adminMenuSideBarCollapseButton .adminMenuSideBarCollapseButtonSThree {
        /* rotate third one */
        transform: rotate(-45deg) translate(1px, -1px);
        background-color: white;
    }



    .adminMenuSideBarCollapseButton.active span {
        /* no rotation */
        transform: none;
        /* all bars are visible */
        opacity: 1;
        margin: 5px auto;
    }

    .adminMenuSideBarCollapseButton.active {
        /*transition the border to a square*/
        border-radius: 0;
        margin-left: 1px;
        margin-bottom: 1px;
        margin-top: 1px;
        border: 1px solid #ddd;
        -moz-transition: all .51s;
        -o-transition: all .51s;
        -webkit-transition: all .51s;
        transition: all .51s;
    }





.adminMenuSideBarCollapseButton {
    border-left: 0;
    -moz-transition: all .51s;
    -o-transition: all .51s;
    -webkit-transition: all .51s;
    transition: all .51s;
    background-color: #284a6a;
}

    .adminMenuSideBarCollapseButton:focus {
        outline: 0;
    }

/*#endregion Admin Animated Hamburger*/

.admin_MenuNavBarNav {
    background-color: #284a6a;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
}

.admin_LayoutContainer {
}

.admin_MenuNavbarContainer {
    padding: 0;
}

.admin_sidebarNavOptions {
    padding: 5px !important;
    margin: 0 !important;
}

.admin_sidebarNavOptionsUl {
    margin: 0;
    padding: 0px;
}


input#filterBox {
    width: 100%;
}


/*css option make the login details visible when screen is small*/
@media (max-width: 992px) {
    #navbarNavDropdown {
        display: flex !important;
        flex-basis: auto;
    }

    .navbar-nav.ml-auto,
    .navbar-nav.ms-auto {
        flex-direction: inherit;
    }


    .dropdown-menu.adminNavBarAccount.show {
        position: absolute;
    }
}