body{ width:100%; min-height:100%; display:flex; flex-flow:row nowrap; justify-content:stretch; align-items:stretch; gap:0px; overflow-x:hidden; }
main{ width:100%; display:flex; flex-flow:column nowrap; justify-content:stretch;  align-items:stretch; gap:0; flex-grow:1; flex-shrink:1; }
h1, h2, h3, h4, h5, h6{ padding:0px; margin:0px; cursor:default; } 


aside{ width:0px; background:#fff; box-shadow: 0 0 20px rgba(89,102,122,0.1); padding:20px 0px; display:flex; flex-flow:column nowrap; justify-content:start; align-items:stretch; gap:25px; overflow-y:auto; transition:all 0.3s linear; position:relative; 
	position: fixed; top: 0; left: 0; bottom: 0; z-index: 600;
} 
#overlap{ width:0px; position:fixed; top:0px; right:0px; bottom:0px; z-index:599; background:rgba(0,0,0,0.05); transition:all 0.3s linear; }
#burger_opener{ display:none; }
#burger_opener:checked ~ aside{ width:300px; padding:20px 0px 20px 20px; }
#burger_opener:checked ~ #overlap{ width:calc( 100% - 300px ); }
#main_logo{ display:flex; justify-content:stretch; align-items:center; gap:15px; text-decoration:none; border:0; } 
#main_logo img{ width:40px; margin:0; }
#main_logo span{ text-align:left; font-size:18px; } 
.main_menu{ width:100%; display:flex; flex-flow:column nowrap; justify-content:start; align-items:stretch; gap:0; padding:0; list-style:none; }
.main_menu input{ display:none; }
.main_menu .item{ min-height:40px; display:flex; flex-flow:row nowrap; justify-content:stretch; align-items:stretch; gap:0; } 
.main_menu .item a{ flex-grow:1; flex-shrink:1; height:100%; display:flex; justify-content:start; font-size:16px; color:var(--fontcolor); text-decoration:none; font-weight:normal; gap:15px; text-align: left; border:0; }
.main_menu .item a i{ color:var(--fontcolor); }
.main_menu .item a.active{ color:#8d81eb; }
.main_menu .item a.active i{ color:#8d81eb; }
.main_menu .item label i{}
.main_menu .item .sections{ width:100%; padding:0px 0px 0px 25px; display:none; flex-flow:column nowrap; justify-content:start; align-items:stretch; gap:0; }
.main_menu .item .sections li{ height:40px; width:100%; display:flex; flex-flow:row nowrap; justify-content:stretch; align-items:center; gap:0; cursor:pointer; } 
.main_menu .item .sections li a{ width:100%; height:100%; display:flex; justify-content:start; font-size:16px; color:#var(--fontcolor); text-decoration:none; font-weight:normal; }
.main_menu input:checked ~ .sections{ display:flex; }
.main_menu .sublink{ height:100%; aspect-ratio:1; text-decoration:none; color:var(--fontcolor); font-size:24px; display:flex; flex-flow:row nowrap; justify-content:center !important; align-items:center; gap:0; flex-grow:0 !important; flex-shrink:0 !important; }
.main_menu .item[data-opacity="1"]{ opacity:0.2; }
.main_menu .item[data-opacity="2"]{ opacity:0.4; }


.main_menu label{ display:flex; height:100%; aspect-ratio:1; cursor:pointer; flex-flow:row nowrap; justify-content:center; align-items:center; gap:0; flex-grow:0; flex-shrink:0; }
#expand_settings{ display:none; }
.main_menu .item.expand{ display:none; padding-left:20px; }
#expand_settings:checked ~ .item.expand{ display:flex; }
label[for="expand_settings"] .fa-minus-square-o{ display:none; }
label[for="expand_settings"]{ color:var(--fontcolor); font-size:18px; }
#expand_settings:checked ~ .item label[for="expand_settings"] .fa-plus-square-o{ display:none; }
#expand_settings:checked ~ .item label[for="expand_settings"] .fa-minus-square-o{ display:block; }
#aside_hidder{ position:absolute; top:10px; right:10px; background:#fff; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; font-size:18px; }


#preheader{ height:0px; width:100%; flex-grow:0; flex-shrink:0; }
header{ background: var(--solid_bg); padding:0; color:#fff; height:50px; display:flex; flex-flow:row nowrap; justify-content:stretch; gap:0; position:sticky; top:0; left:0; right:0; z-index:500; /*box-shadow: 0 0 20px rgba(89,102,122,0.1);*/ } 
header h5{ color:var(--icons_white); font-size:14px; font-weight:400; }
header a{ height:100%; aspect-ratio:1; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; gap:0; text-decoration:none; cursor:pointer; border:0; }
header a i{ color:var(--icons_white); font-size:18px !important; }
header a:hover{ background:var(--header_hover); } 
header label{ height:100%; aspect-ratio:1; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; gap:0; cursor:pointer; }
header label i{ color: var(--icons_white); }
header label:hover{ background:var(--header_hover); } 




section{ flex-grow:1; flex-shrink:1; padding:40px 25px; }
h1{ text-align:left; }

footer{ height:50px; background:black; }
footer .copyrights{ height:100%; display:flex; color:#fff; }