﻿.skin-blue .main-sidebar, .skin-blue .left-side { background-color: #1d2939; }
.skin-blue .user-panel > .info, .skin-blue .user-panel > .info > a { color: #fff; }
.skin-blue .sidebar-menu > li.header { color: #4b646f; background: #1a2226; }
.skin-blue .sidebar-menu > li > a { border-left: 3px solid transparent; border-bottom: 1px solid #283b4c; }
.skin-blue .sidebar-menu > li:hover > a, .skin-blue .sidebar-menu > li.active > a { color: #91c2ff; background: #162339; border-left-color: #2e4265; }
.skin-blue .sidebar-menu > li > .treeview-menu { margin: 0 1px; position: relative; background: #162339; }
.skin-blue .sidebar-menu > li > .treeview-menu li:before { border-left: 1px solid #b8c7ce; position: absolute; height: 100%; top: -1px; left: 5px; content: ""; }
.skin-blue .sidebar-menu > li > .treeview-menu li.active:before, .skin-blue .sidebar-menu > li > .treeview-menu li:hover:before { border-left: 1px solid #91c2ff;}

.skin-blue .sidebar-menu > li > .treeview-menu > li > ul { position: relative; }
.skin-blue .sidebar-menu > li > .treeview-menu > li > ul:after { border-left: 1px solid #79919a; position: absolute; top: -6px; height: 100%; left: 25px; content: ""; }
.skin-blue .sidebar a { color: #b8c7ce; }
.skin-blue .sidebar a:hover { text-decoration: none;}
.skin-blue .treeview-menu > li > a { color: #fff; }
.skin-blue .treeview-menu > li.active > a, .skin-blue .treeview-menu > li > a:hover { color: #91c2ff; }
.sidebar-toggle:before { content: "\f0c9"; }
.toggle-sidbar:before { display: none; }
.toggle-sidbar:after { content: "\f03b"; }
.main-header .sidebar-toggle:hover { color: #fff; }
.main-header .sidebar-toggle:focus, .main-header .sidebar-toggle:active { background: transparent; }
.main-header .sidebar-toggle .icon-bar { display: none; }
.sidebar .sidebar-toggle { float: left; background-color: transparent; background-image: none; padding: 10px 13px; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 32px; text-align: left; transition: all ease-in-out .3s }
.sidebar-collapse .sidebar .sidebar-toggle { padding: 10px 1px; text-align: center; float: none; transition: all ease-in-out .3s }
.sidebar .sidebar-toggle:hover { color: #fff; }
.sidebar .sidebar-toggle:focus, .sidebar .sidebar-toggle:active { background: transparent; }
.sidebar .sidebar-toggle span { display: block; font-size: 9px; line-height: 9px; margin: 0px; padding: 0px; font-weight: 600 }

/** Component: Sidebar **/
.main-sidebar, .left-side { position: fixed; top: 0; left: 0; padding-top: 60px; height: 100%; width: 75px; z-index: 810; -webkit-transition: -webkit-transform 0.3s ease-in-out, width 0.3s ease-in-out; -moz-transition: -moz-transform 0.3s ease-in-out, width 0.3s ease-in-out; -o-transition: -o-transform 0.3s ease-in-out, width 0.3s ease-in-out; transition: transform 0.3s ease-in-out, width 0.3s ease-in-out; }
.sidebar-menu { list-style: none; margin: 0; padding: 0; }
.sidebar-menu > li { position: relative; margin: 0; padding: 0; }
.sidebar-menu > li > a { padding: 10px 3px 10px 5px; display: block; text-align: left; transition: all ease-in-out .3s }
.sidebar-collapse .sidebar-menu > li > a { padding: 10px 3px 10px 0px; text-align: center; transition: all ease-in-out .3s }
.sidebar-menu > li > a > .fas, .sidebar-menu > li > a > .fab, .sidebar-menu > li > a > .far, .sidebar-menu > li > a > .glyphicon, .sidebar-menu > li > a > .ion { font-size: 32px; text-align: center; width: 1.3em; }
.sidebar-menu > li > a > .sidebar-menu > li > a > .glyphicon, .sidebar-menu > li > a > span { margin-left: 0px; display:none }
.sidebar-menu > li .label, .sidebar-menu > li .badge { margin-right: 5px; }
.sidebar-menu > li .badge { margin-top: 3px; }
.sidebar-menu li.header { padding: 10px 25px 10px 15px; font-size: 12px; }
.sidebar-menu li > a > .fa-angle-right, .sidebar-menu li > a > .pull-right-container > .fa-angle-left { width: auto; height: auto; padding: 0; margin-right: 10px; }
.sidebar-menu li > a > .fa-angle-right { position: absolute; top: 50%; right: 10px; margin-top: -8px; }
.sidebar-menu li.active > a > .fa-angle-right, .sidebar-menu li.active > a > .pull-right-container > .fa-angle-right { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }
.sidebar-menu li.active > .treeview-menu { display: block; }
.sidebar-menu .treeview-menu { display: none; list-style: none; padding: 0; margin: 0; padding-left: 5px; }
.sidebar-menu .treeview-menu .treeview-menu { padding-left: 20px; }
.sidebar-menu .treeview-menu > li { margin: 0; position: relative; }
.sidebar-menu .treeview-menu > li a:before { border-top: 1px solid #b8c7ce; position: absolute; width: 8px; top: 14px; left: 6px; content: ""; }
.sidebar-menu .treeview-menu > li a:after { position: absolute; width: 5px; height: 5px; background: #b8c7ce; border-radius: 50%; top: 12px; left: 3px; content: ""; }
.sidebar-menu .treeview-menu > li.active a:before, .sidebar-menu .treeview-menu > li:hover a:before { border-top: 1px solid #91c2ff; }
.sidebar-menu .treeview-menu > li.active a:after, .sidebar-menu .treeview-menu > li:hover a:after {background: #91c2ff;}
.sidebar-menu .treeview-menu > li > a { padding: 5px 5px 5px 15px; display: block; font-size: 14px; }
.sidebar-menu .treeview-menu > li > a > .fa, .sidebar-menu .treeview-menu > li > a > .glyphicon, .sidebar-menu .treeview-menu > li > a > .ion { width: 20px; }
.sidebar-menu .treeview-menu > li > a > .pull-right-container > .fa-angle-left, .sidebar-menu .treeview-menu > li > a > .pull-right-container > .fa-angle-down, .sidebar-menu .treeview-menu > li > a > .fa-angle-left, .sidebar-menu .treeview-menu > li > a > .fa-angle-down { width: auto; }
.sidebar_btn { background: #04213c; }
.sidebar-menu, .main-sidebar .user-panel, .sidebar-menu > li.header { white-space: nowrap; overflow: hidden; width: 100%; float: left; }
.sidebar-menu:hover { overflow: visible; }
.sidebar-form, .sidebar-menu > li.header { overflow: hidden; text-overflow: clip; }
.sidebar-menu li > a { position: relative; }
.sidebar-menu li > a > .pull-right-container { position: absolute; right: 10px; top: 50%; margin-top: -10px; }

@media (min-width: 768px) {
.sidebar-collapse .content-wrapper, .sidebar-collapse .right-side, .sidebar-collapse .main-footer { margin-left: 0; }
.sidebar-collapse .main-sidebar, .sidebar-collapse .left-side { -webkit-transform: translate(-230px, 0); -ms-transform: translate(-230px, 0); -o-transform: translate(-230px, 0); transform: translate(-230px, 0); }
.sidebar-mini.sidebar-collapse .content-wrapper, .sidebar-mini.sidebar-collapse .right-side, .sidebar-mini.sidebar-collapse .main-footer { margin-left: 75px !important; z-index: 840; }
.sidebar-mini.sidebar-collapse .main-sidebar { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); width: 75px !important; z-index: 9999; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li { position: relative; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a { margin-right: 0; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span { border-top-right-radius: 4px; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview) > a > span { border-bottom-right-radius: 4px; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu { padding-top: 5px; padding-bottom: 5px; border-bottom-right-radius: 4px; border-top-right-radius: 4px; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right) { display: none }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu { display: block !important; position: absolute; width: 180px; left: 75px; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span { top: 0; margin-left: -3px; padding: 12px 5px 12px 5px; background-color: inherit; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container { float: right; width: auto !important; left: 230px !important; top: 10px !important; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container i { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container > .label:not(:first-of-type) { display: none; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu { top: 0px; margin-left: 0; }
.sidebar-mini.sidebar-collapse .main-sidebar .user-panel > .info, .sidebar-mini.sidebar-collapse .sidebar-form, .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span, .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu, .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .pull-right, .sidebar-mini.sidebar-collapse .sidebar-menu li.header { display: none !important; -webkit-transform: translateZ(0); transform: translateZ(0); text-align: left }
    .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .menutag { display: block !important; text-align: center; font-size: 9px; font-weight: 600; word-break: break-word; white-space: break-spaces; }
.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini { display: block; margin-left: -15px; margin-right: -15px; font-size: 18px; }
.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini img { width: 26px; height: auto; text-align: center; }
.control-sidebar { padding-top: 100px; }
.control-sidebar-open .content-wrapper, .control-sidebar-open .right-side, .control-sidebar-open .main-footer { margin-right: 230px; }
}
/*--------heigcontrast theme-----*/
.heigcontrast .main-sidebar, .skin-blue .left-side { background-color: #000000; }
.heigcontrast .sidebar a { color: #ffff00; }
.heigcontrast .sidebar-menu > li:hover > a, .heigcontrast .sidebar-menu > li.active > a { color: #ffff00; background: #2f2f2f; border-left-color: #404040; }
.heigcontrast .sidebar-menu > li > a { border-bottom: 1px solid #404040; }
.heigcontrast .sidebar-menu > li > .treeview-menu { background: #444444; }
.heigcontrast .treeview-menu > li > a { color: #ffffff; }
.heigcontrast .sidebar-menu .treeview-menu > li:before { border-top: 1px solid #fff; }
.heigcontrast .sidebar-menu .treeview-menu > li:after { background: #ffffff; }
.heigcontrast .sidebar-menu > li > .treeview-menu:before { border-left: 1px solid #ffffff; }
.heigcontrast.headmenu.sidebar-collapse .top_heading_leftnav { color: #ff0; background: #171717; }


@media (max-width: 767px) {
.sidebar-open .content-wrapper, .sidebar-open .right-side, .sidebar-open .main-footer { -webkit-transform: translate(230px, 0); -ms-transform: translate(175px, 0); -o-transform: translate(175px, 0); transform: translate(175px, 0); }
.main-sidebar, .left-side { padding-top: 120px; }
.main-sidebar, .left-side { -webkit-transform: translate(-230px, 0); -ms-transform: translate(-230px, 0); -o-transform: translate(-230px, 0); transform: translate(-230px, 0); }
.sidebar-open .main-sidebar, .sidebar-open .left-side { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); overflow:auto }
.sidebar-collapse footer { width: 100%; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a >.menutag { display: none !important }
.sidebar-menu > li > a > .sidebar-menu > li > a > .glyphicon, .sidebar-menu > li > a > span {display:inline;}
.sidebar-collapse .sidebar-menu > li > a { padding: 10px 3px 10px 5px; text-align: left; transition: all ease-in-out .3s; }
.main-sidebar, .left-side {width: 175px;}
.menutag {display: none;}
}
@media print {
.content-wrapper, .right-side { margin-left: 0 !important; -webkit-transform: translate(0, 0) !important; min-height: 100% !important; -ms-transform: translate(0, 0) !important; -o-transform: translate(0, 0) !important; transform: translate(0, 0) !important; width: 100% !important; position: relative !important; display: block !important; float: left !important; padding-top: 0px !important; }
.sidebar-mini.sidebar-collapse .content-wrapper, .sidebar-mini.sidebar-collapse .right-side, .sidebar-mini.sidebar-collapse .main-footer { margin-left: 0px !important; }
}
