/*!
 * Start Bootstrap - Simple Sidebar (https://startbootstrap.com/template-overviews/simple-sidebar)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-simple-sidebar/blob/master/LICENSE)
 */

:root {
    /*--sidebar-expanded-width: 16rem;*/
}

:root {
    --menuSectionIconColor: #004c97;
    /*--menuSectionIconColor: #008088;*/
    /*--menuSectionIconColor: #007D52;*/
    /*--menuSectionIconColor: #3D4856;*/
    /*--menuSectionIconColor:#7a9e9f ;*/
}

body {
    overflow-x: hidden;
}

.navbar-brand {
    float: none;
    padding-top: .41rem;
    /*padding-bottom: .225rem;*/
    font-size: 15px;
    line-height: 20px;
}

.navbar-right .nav-item {
    margin-right: .8rem;
}
/*.navbar-right .nav-item .nav-link.fa{
    margin-top: .2rem;
}*/

.nav-link.title {
    margin-top: .1rem;
}

/*.navbar-right .nav-item .btn {
    margin-top: .4rem;
    padding-top: .25rem;
    padding-bottom: .25rem;
}*/

#sidebar-wrapper {
    min-height: calc(100vh - 64px);
    -webkit-transition: margin .15s ease-out;
    -moz-transition: margin .15s ease-out;
    -o-transition: margin .15s ease-out;
    transition: margin .15s ease-out;
    color: rgba(0, 0, 0, 0.5);
    /*border-right: 1px solid rgba(0, 0, 0, 0.125);*/
    background-color: var(--menu-color);
}

    #sidebar-wrapper .menuLabel {
        -webkit-transition: opacity .15s ease-out .1s;
        -moz-transition: opacity .15s ease-out .1s;
        -o-transition: opacity .15s ease-out .1s;
        transition: opacity .15s ease-out .1s;
    }

#sidebar-wrapper .menuSection.title .menuLabel {
    color: var(--menuSectionIconColor);
}



    #sidebar-wrapper #sidebar-heading {
        font-size: 1.2rem;
        border-bottom: 1px solid rgba(0, 0, 0, 0.125);
        border-right: 1px solid rgba(0, 0, 0, 0);
        margin-right: auto;
        margin-left: auto;
        margin-top: 0px;
        font-weight: 600;
        background-color: #004c97;
        white-space: nowrap;    
    
    }

        #sidebar-wrapper #sidebar-heading a {
            color: rgba(0,0,0,.5);
        }

    #sidebar-wrapper .list-group {
        text-transform: uppercase;
        /*border-right: 1px solid rgba(0, 0, 0, 0.125);*/
    }



    #sidebar-wrapper .list-group-item {
        padding-top: 1rem;
        border: 0px;
        /*color: rgba(0,0,0,.5);*/
        /*color: #66615B;*/
        /*color: rgba(255,0,0,.8);*/
        background-color: var(--menu-color);
    }
#sidebar-wrapper .list-group-item-action:hover,
#sidebar-wrapper .list-group-item-action:hover .fa,
#sidebar-wrapper .list-group-item-action:hover .fa-solid,
#sidebar-wrapper .list-group-item-action:hover .fa-regular,
#sidebar-wrapper .list-group .active-page,
#sidebar-wrapper .list-group .active-page .fa
#sidebar-wrapper .list-group .active-page .fa-solid,
#sidebar-wrapper .list-group .active-page .fa-regular,
#sidebar-wrapper .list-group .active-page:hover {
    /*color: #ef8157;*/
    color: var(--color-highlight);
}

#sidebar-wrapper .fa,
#sidebar-wrapper .fa-regular,
#sidebar-wrapper .fa-solid {
    margin-right: .7em;
    width: 30px;
    text-align: center;
}
#sidebar-wrapper .menuSection.title .fa,
#sidebar-wrapper .menuSection.title .fa-regular,
#sidebar-wrapper .menuSection.title .fa-solid {
    font-size: 1.5em;
    color: var(--menuSectionIconColor);
}


    #sidebar-wrapper .iconLetters
    {
        display:inline-block;
    }
        #sidebar-wrapper .iconLetters {
            font-size: 1rem;
            text-align: center;
            letter-spacing: 1px;
            /*margin-left: .5rem;*/
            margin-right: 1rem;
            width: 30px;
        }

    #sidebar-wrapper a.list-group-item {
        font-size: .9em;
        white-space:nowrap;
        overflow:hidden;
    }


/*#page-content-wrapper *,
.card {
    -webkit-transition: width .15s ease-out;
    -moz-transition: width .15s ease-out;
    -o-transition: width .15s ease-out;
    transition: width .15s ease-out;
}*/
#page-content-wrapper {
    /*width: calc(100vw - var(--sidebar-expanded-width));*/
    width: calc(100vw - 16rem);
}

.sidebar-mini #page-content-wrapper {
    width: calc(100vw - var(--sidebar-mini-width));
}

#sidebar-wrapper .navbar-brand {
    margin-right: 0rem;
}





#wrapper.toggled #sidebar-wrapper {
    margin-left: 0;
}

body #sidebar-wrapper {
    min-height: 100vh;
    position: relative;
    z-index:1010;
}

.sidebar-mini .sidebar,
.sidebar-mini #mainMenu {
    display: block;
    font-weight: 200;
    z-index: 1000;
}

#sidebar-heading {
    height: 4rem;
    padding-left: 1rem;
}


#mainMenu {
    position: fixed;
    transition: width 0s !important;
}
#sidebar-wrapper,
/*#sidebar-wrapper *,
    #sidebar-heading,
    #mainMenu .mainSection,
    #mainMenu .list-group-item 
        */ {
    animation: none;
    transition: width 0s !important;
}


/*    .sidebar-mini .sidebar,
    .sidebar-mini .sidebar .sidebar-wrapper,*/
.sidebar-mini #mainMenu,
.sidebar-mini #sidebar-wrapper
/*,.sidebar-mini #sidebar-heading */ {
    position: fixed;
    width: var(--sidebar-mini-width);
    min-width: var(--sidebar-mini-width);
    top: 0;
}
    #mainMenu.top {
        top: 64px;
    }

    .sidebar-mini #sidebar-heading {
        width: var(--sidebar-mini-width);
        min-width: var(--sidebar-mini-width);
    }
.sidebar-mini #sidebar-wrapper {
    border: 0px;
    /*height: 100vh;*/
    height:100%;
}

.sidebar-mini #page-content-wrapper {
    position: relative;
    left: var(--sidebar-mini-width);
}

.sidebar-mini #sidebar-heading{
    padding-left: .4rem;
}

/*.imgHelper {
    display: inline-block;*/
    /*height: 100%;*/
    /*vertical-align: middle;
}
.sidebar-mini #mainMenu:hover .navbar-brand imgHelper,
.sidebar-mini #sidebar-wrapper:hover .navbar-brand imgHelper,
.sidebar-mini #sidebar-wrapper:hover .navbar-brand imgHelper {
    height: 100%;
}*/

.navbar-brand img {
    -webkit-transition: all .15s ease-out;
    -moz-transition: all .15s ease-out;
    -o-transition: all .15s ease-out;
    transition: all .15s ease-out;
    width: 6rem;
    vertical-align: middle;
    display: inline-block;
    /*height: 3.2rem;*/
    /*So called 3 line solution*/
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
}
.sidebar-mini .navbar-brand img {
    width:3.2rem;
}



.sidebar-mini #mainMenu:hover .navbar-brand img,
.sidebar-mini #sidebar-wrapper:hover .navbar-brand img,
.sidebar-mini #sidebar-wrapper:hover .navbar-brand img {
    width: 6rem;
    padding-left: 1rem;
    /*transform: translateY(25%);*/
}
#sidebar-wrapper, #sidebar-heading, #mainMenu {
    width: var(--sidebar-expanded-width);
    min-width: var(--sidebar-expanded-width);
}

    #sidebar-wrapper.sidebar-mobile,
    #sidebar-wrapper.sidebar-mobile #sidebar-heading,
    #sidebar-wrapper.sidebar-mobile #mainMenu {
        width: 75%;
        transition: left 0.33s ease;
        margin-left: 0rem;
    }

    #sidebar-wrapper.sidebar-mobile {
        left:-76%;
    }
        #sidebar-wrapper.sidebar-mobile #mainMenu .menuSection {
            
            left: 0px;
        }
            #sidebar-wrapper.sidebar-mobile #mainMenu .menuSection,
            #sidebar-wrapper.sidebar-mobile #mainMenu .menuLabel {
                font-size: 1.2rem;;
            }

    #sidebar-wrapper.sidebar-mobile.sidebar-mobile-show {
        left: 0rem;
    }
        #sidebar-wrapper.sidebar-mobile.sidebar-mobile-show #sidebar-mobile-close {
            display: flex !important;
            align-items: center;
        }
#sidebar-mobile-close .fa {
    font-size: 3rem;
    line-height: 3rem;
    transform: scale(75%);
}

#sidebar-mobile-backdrop {
    position: fixed;
    width:100%;
    display:none;
    inset: 0; /* shorthand for top/right/bottom/left: 0 */
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s;
    z-index: 9;
}

#sidebar-wrapper.sidebar-mobile-show #sidebar-mobile-backdrop {
    display:block;
    opacity: 1;
    pointer-events: all;
}

.sidebar-mini .menuLabel {
    opacity: 0;
}
.sidebar-mobile .menuLabel {
    opacity:1;
}
.sidebar-mini #mainMenu:hover .menuLabel,
.sidebar-mini #sidebar-wrapper:hover .menuLabel {
    opacity: 1;
}

.sidebar-mini #mainMenu:hover .menuSection.title .menuLabel,
.sidebar-mini #sidebar-wrapper:hover .menuSection.title .menuLabel {
    opacity: .8;
}

.navbar-expand-md .navbar-collapse {
    display: flex !important;
    flex-basis: auto;
}

@media (min-width: 577px) {
    .sidebar-mini #mainMenu:hover,
    .sidebar-mini #sidebar-wrapper:hover,
    .sidebar-mini #sidebar-wrapper:hover #mainMenu {
        width: var(--sidebar-expanded-width);
    }
}

@media(max-width: 576px){
    .navbar-expand-md .navbar-collapse:not(.show) {
        display: none !important;
        flex-basis: auto;
    }


    .menu
    #pageHeaderPanel.openMenu .navbar-collapse.show {
        display: block !important;
    }
}

    .sidebar-mini #mainMenu:hover {
        /*border-right: 1px solid #ddd;*/
        box-shadow: 3px 0px 3px -1px #eee;
    }

    #mainMenu,
    #sidebar-wrapper {
        -webkit-transition-property: top,bottom;
        transition-property: top,bottom;
        -webkit-transition-duration: .2s,.2s,.35s;
        transition-duration: .2s,.2s,.35s;
        -webkit-transition-timing-function: linear,linear,ease;
        transition-timing-function: linear,linear,ease;
        -webkit-overflow-scrolling: touch;
    }

        #sidebar-wrapper .menuSection {
            padding-top: .75rem;
            /*width: 16rem;*/
            background-color: var(--menu-color);
        }
            #sidebar-wrapper .menuSection:first-of-type {
                padding-top: 4px;
            }

            .menuSection.title {
                margin-left: 1rem;
                font-size: .9rem;
                /*width: 16rem;*/
                color: rgba(0,0,0,.5);
                text-transform: uppercase;
                overflow: hidden;
                white-space: nowrap;
                margin-top: 1rem;
                margin-bottom: .5rem;
            }


        .menuSection .list-group-item {
            padding: 0.5rem 1rem !important;
            /*padding-top: .7rem !important;*/
        }

.menuSection > .current-page {
    background-color: var(--hover-bg-color) !important;
    border-left: 0.4rem solid var(--color-highlight) !important;
    padding-left: 0.6rem !important;
    color: var(--color-highlight);
}



            .menuSection > .current-page > i {
                color: var(--color-highlight);
            }

    /*@media (min-width: 1320px) {*/
    @media (max-width: 576px) {
        .sidebar-mini #sidebar-heading,
        #sidebar-wrapper {
            margin-left: -16rem;
        }

        .sidebar-mini #page-content-wrapper {
            min-width: 100vw;
        }

        #page-content-wrapper {
            position: fixed;
            left: 0px !important;
            width: 100%;
        }
    }


    @media (min-width: 992px) {
        #sidebar-wrapper .list-group a.active-page:after /*> [data-bs-toggle=collapse] + div .nav a:after,*/
        /*, #sidebar-wrapper .list-group a.active-page*/ /*> a:not([data-bs-toggle=collapse]):after*/ {
            border-right: 17px solid #f4f3ef;
            border-top: 17px solid transparent;
            border-bottom: 17px solid transparent;
            content: "";
            display: inline-block;
            position: absolute;
            right: -1px;
            opacity: 1;
            top: .8rem;
            transition: opacity .15s ease-in;
        }

        #page-content-wrapper {
            left: 0rem;
        }

        .sidebar-mini #page-content-wrapper {
            left: var(--sidebar-mini-width);
        }
        /*}

@media (max-width: 576px) {*/


        .sidebar-mini #page-content-wrapper {
            /*min-width: 100vw;*/
        }
    }

    *, ::after, ::before {
        box-sizing: border-box;
    }