@font-face {
    font-family: 'Outfit';
    src: url(/assets/fonts/static/Outfit-Regular.ttf);
}



.sidebar{
    background-color: #26438E;
    width: 292px;
    color: #FFFFFF;
    position: sticky;
    top: 95px;
    left: 0px;
    display: flex;
    flex-direction: column;
    height: 1180px !important;
    padding-bottom: 25px;
    z-index: 1;
    transition: width 0.5s ease-in-out;
}

li{
    list-style-type: none !important;
}
.tree-icon{
            width: 20px;
            height: 20px;
}

.treeview{
            list-style: none;
            font-family: 'Outfit';
        }

.rectangle{
    width: 262px;
    height: 40px;
    padding-top: 10px;
    padding-bottom: 15px;
    text-decoration: none;
    margin-top: 15px;
    margin-left: 15px;
    cursor: pointer;
    padding-left: 5px;
    color: #fff;
}

.rectangle:hover{
    background-color: #060F59;
    border-radius: 4px;
    padding-left: 5px;
    color: #fff;
    padding-bottom: 8px;
}


.highlight{
            background-color: #010737;
            border-radius: 4px;
            padding-bottom: 8px;
}

.rectangle::selection{
                        background-color: #010737;
                        color: #FFFFFF;
}

.header{
        list-style-type: none; 
        margin-top: 10px;
        margin-bottom: 10px;
}

.treeview-menu{
                background-color:#060F59;
                padding-top: 8px !important;
                padding-bottom: 8px !important;
                border-radius: 5px;
                margin-top: 0px !important;
                margin-left: 40px !important;
                /* moves the sidebar sub-menus to the side of side navigation instead of underneath it */
                /* position: absolute;
                left: 25px;
                top: 0px; */
}


.nav-item{
            list-style-type: none !important;
}

.nav-link{
            text-decoration: none;
            color: #fff;
            list-style-type: none !important;
            outline: none !important;
}

/* top nav area */

.dropdown-menu{
                /* background-color: black; */
                padding: 15px;
                /* increase the width of navigation submenus on site.Master */
                width:  300px !important;
}

small{
        margin-right: 10px;
        color: black;
        list-style-type: none !important;
        text-decoration: none;
}

.topnavbar-item{
                list-style-type: none;
                color: #fff;
                text-decoration: none;
                display: inline;
}

.topnavbar-item:hover{
                                color: black;
                                list-style-type: none !important;
}

ul a .dropdown{
    color: black;
    /* background-color: #fff; */
    background-origin: padding-box;
    list-style-type: none !important;
}

#sidebar {
            position:sticky;
            /* changed navbar position from absolute to fixed june 20, 2023 9:30am */
            top:48px;
            height: 2100px;
            width: 292px;
            left: 0px;
            transition:all 300ms linear;
  }

  .collapse .navbar-collapse{
    position: fixed;
  }


  #sidebar.minified{
                        height: fit-content !important;
  }
  

  .fa-ellipsis-v{
                    margin-top: 0px;
  }

  .fa-arrow-circle-left{
    font-size: 50px;
    position: fixed;
    display: none;
    animation: infinite;
}

.btn-adjust{
                display: none;
            }


.easy-access-link:hover{
        background-color: #fff; 
        color: black; 
        padding-left: 0px;
    }

.easy-access-link{
        margin-top: 8px !important; 
        margin-bottom: 19px; 
        margin-right: 19px; 
        margin-left: 19px;
    }

.easy-access-link:last-child{
        margin-bottom: 19px !important;
    }

.easy-access-link:first-child{
        margin-top: 18px !important;
    }

.easy-menu{
        width: 180px; 
    }
    
.easy-link{
        font-size: 14px; 
        margin-right: 15px;
    }

.easy-link:hover{
        margin-left: 0px;
    }

.external-link{
        color: #FFFFFF; 
        text-decoration: none;
    }

.external-link:hover{
        color: black;
    }

@media (max-width:741px) {
    #sidebar{
                left: -50px;
                
    }
    #sidebar.minified{
        position: fixed !important; 
        display: block !important; 
        left: 230px !important; 
        height: fit-content !important;
    }
    #sidebar.active {
        /* left:0px; */
        left: 230px;
}
.btn-adjust{
                display: block;
                box-shadow: 11px 9px 14px -1px rgba(0,0,0,0.75);
                -webkit-box-shadow: 11px 9px 14px -1px rgba(0,0,0,0.75);
                -moz-box-shadow: 11px 9px 14px -1px rgba(0,0,0,0.75);
            }
}
@media (max-width:740px) {
        /* #sidebar{position: fixed; left: -40px ;} */
        .employee-perf-charts, #MainContent_box_Training, .box-asset, section.content-header{width: 425px !important; margin-left: 0px !important;}
}


@media (max-width:414px){
            #sidebar{position: fixed;}
            #sidebar.minified{display: block !important; }
            .sidebar.minified .main-page-panel{overflow: auto;}
}
/* .sidebar.minified .btn-adjust{
                display: none;
} */

.sidebar-UserImg{
                    width: 8rem;
                    height: auto;
                    margin: auto;
                    display: block;
}

/* sidebar-mini here */
ul{
    list-style-type: none;
}
.sidebar-mini-menu{
        width: 80px;
        margin-left: 5px;
        display: none;
}
.treeview-mini{
                margin-top: 30px;
}
.treeview-mini:last-child{
                padding-bottom: 30px;
}
.treeview-mini:first-child{
            padding-top: 30px;
}

.tree-mini-icon{
            width: 19px;
}
.tree-mini-icon:hover{
                    background-color: #2D3790;
                    background-size: contain;
                    border-radius: 4px;
                    width: 25px;
                    padding: 5px;
}
.sidebar-mini-menu{
        background-color: #060F59;
}

.arrow-btn{
    width: 30px;
    margin-top: 30px;
    margin-bottom: 30px;
    margin-left: 0px;
    margin-right: 0px;
}
.pointer-arrow{
        width: 20px;
        height: auto;
}

.sidebarMiniBlock{
                    display: block;
                    position: absolute;
                    top: 100px;
                    z-index: 999;
}
/* sidebar-mini ends */

.sidebar.minified{
    width: 65px !important;
    margin-left: 15px;
    z-index: 1;
    height: fit-content;
    margin-top: 60px;
    padding-top: 20px;
    padding-bottom: 20px;
    border-radius: 10px;
    box-shadow: -8px 7px 11px 3px rgba(0,0,0,0.75);
    -webkit-box-shadow: -8px 7px 11px 3px rgba(0,0,0,0.75);
    -moz-box-shadow: -8px 7px 11px 3px rgba(0,0,0,0.75);
}

.sidebar.minified .toggleable{
                                display: none;
}

.sidebar.minified .rectangle{
                                width: 40px;
}

.user-Account{position: absolute; right: 120px;}

.ul-Login{right: 50px !important;}

.user-help{right: 250px !important;}

.sidebar.minified .treeview-menu{
    position: absolute;                                
    left: 28px;
    top: -20px;
}

.nav-item .nav-link{text-overflow: clip !important;}

.minify-btn{
                display: block;
                margin: auto;
                width: 30px;
                height: auto;
                -moz-transition: all .5s linear;
                -webkit-transition: all .5s linear;
                transition: all .5s linear;
                box-shadow: 10px 6px 26px -6px rgba(0,0,0,0.69);
                -webkit-box-shadow: 10px 6px 26px -6px rgba(0,0,0,0.69);
                -moz-box-shadow: 10px 6px 26px -6px rgba(0,0,0,0.69);
}


.minify-btn.down {
                -moz-transform:rotate(180deg);
                -webkit-transform:rotate(180deg);
                transform:rotate(180deg);
}

.sidebar.minified .tooltip:hover{
                                display: block; 
                                opacity: 0.5; 
                                position: absolute; 
                                left: 30px; 
                                background-color: #26438E;
                                border-radius: 20px;
                                border: 1px solid #010737;
                                width: 100px;
                                padding: 2px;
                                text-align: center;
}

.tooltip .tootltiptext{
                        position: absolute;
                        top: -30px;
                        right: 50px;
}

/* smart menu */
/* sub menus arrows */
.navbar-nav .sub-arrow, .navbar-nav .collapsible .sub-arrow {
	position:static;
	margin-top:0;
	margin-right:0;
	margin-left:6px;
	display:inline-block;
	width:0;
	height:0;
	overflow:hidden;
	vertical-align:middle;
	border-top:4px solid;
	border-right:4px dashed transparent;
	border-bottom:4px dashed transparent;
	border-left:4px dashed transparent;
}
.navbar-fixed-bottom .sub-arrow {
	margin-top:-5px;
	border-top:4px dashed transparent;
	border-bottom:4px solid;
}

.collapse .navbar-collapse{
    position: sticky;
}
.navbar-nav ul .sub-arrow {
	position:absolute;
	right:-10px;
	margin-top:6px;
	margin-right:15px;
	border-top:4px dashed transparent;
	border-bottom:4px dashed transparent;
	border-left:4px solid;
}
.navbar-nav ul a.has-submenu {
	padding-right:10px;
}
/* scrolling arrows for tall menus */
.navbar-nav span.scroll-up, .navbar-nav span.scroll-down {
	position:absolute;
	display:none;
	visibility:hidden;
	height:20px;
	overflow:hidden;
	text-align:center;
}
.navbar-nav span.scroll-up-arrow, .navbar-nav span.scroll-down-arrow {
	position:absolute;
	top:-2px;
	left:50%;
	margin-left:-8px;
	width:0;
	height:0;
	overflow:hidden;
	border-top:7px dashed transparent;
	border-right:7px dashed transparent;
	border-bottom:7px solid;
	border-left:7px dashed transparent;
}
.navbar-nav span.scroll-down-arrow {
	top:6px;
	border-top:7px solid;
	border-right:7px dashed transparent;
	border-bottom:7px dashed transparent;
	border-left:7px dashed transparent;
}
/* add more indentation for 2+ level sub in collapsible mode - Bootstrap normally supports just 1 level sub menus */
.navbar-nav .collapsible ul .dropdown-menu > li > a,
.navbar-nav .collapsible ul .dropdown-menu .dropdown-header {
	padding-left:35px;
}
.navbar-nav .collapsible ul ul .dropdown-menu > li > a,
.navbar-nav .collapsible ul ul .dropdown-menu .dropdown-header {
	padding-left:45px;
}
.navbar-nav .collapsible ul ul ul .dropdown-menu > li > a,
.navbar-nav .collapsible ul ul ul .dropdown-menu .dropdown-header {
	padding-left:55px;
}
.navbar-nav .collapsible ul ul ul ul .dropdown-menu > li > a,
.navbar-nav .collapsible ul ul ul ul .dropdown-menu .dropdown-header {
	padding-left:65px;
}
/* fix SmartMenus sub menus auto width (subMenusMinWidth and subMenusMaxWidth options) */
.navbar-nav .dropdown-menu > li > a {
	white-space:normal;
}
.navbar-nav ul.sm-nowrap > li > a {
	white-space:nowrap;
}
/* fix .navbar-right subs alignment */
.navbar-right ul.dropdown-menu {
	left:0;
	right:auto;
}

/* remove underline from help on navbar */
#lnk_Help{
        text-decoration: none !important;
}
/* remove alse background:hover on help in navbar  */
#lnk_Help:hover{
            background-color: #ECF0F5 !important;
}

@media all and (min-width:992px){
    .navbar .nav-item .dropdown-menu{ display: none; }
	.navbar .nav-item:hover .dropdown-menu{ display: block; }
	.navbar .nav-item .dropdown-menu{ margin-top:0; }
    .submenu{background-color: #FFFFFF !important; padding: 15px !important; border: 1px solid #ece7e7 !important; border-radius: 5px;}
    .submenu li a{color: #7d7e81;}
    .submenu li a:active{background-color: unset;}
}

@media screen and (max-width:414px){
                .submenu{background-color: #FFFFFF; border-radius: 5px; padding: 15px; position: relative; top: 5px; left: 185px; box-shadow: #7d7e81;}
}