@charset "UTF-8";
/*                                                            __/\
            _           _       ____   ___ ____   ___     ___/_  `.  .-"""-.
   __ _  __| |_ __ ___ (_)_ __ |___ \ / _ \___ \ / _ \    \__,`   \-'  /   )`----')  
  / _` |/ _` | '_ ` _ \| | '_ \  __) | | | |__) | | | |       )        \  ((`""""`  
 | (_| | (_| | | | | | | | | | |/ __/| |_| / __/| |_| |    ___Y  ,    .'7 /|   
 @admin2020 _|_| |_| |_|_|_| |_|_____|\___/_____|\___/    (_,___/...-` (_/_/  */  


/*base-height: 24px;*/


/* BASE
================================================================*/
* {box-sizing: border-box;}
html {position: relative;}
body {
	min-height: 100vh;
	margin: 0;
}



/* MAIN LAYOUT
================================================================*/
#header {}
#sidemenu {}
#main {}
#footer {}


#header { 
	background-color:#232323;
	width: 100%;
	height: 96px;
	z-index: 100;
}

#sidemenu { 
	position: absolute;
	top: 96px;
	width: 240px; 
	height: calc(100% - 96px);
	z-index: 5;
	background: #232323;
}

#main { 
	padding: 24px 36px;
	margin-left: 240px;
	width: 1070px;
	min-height: calc(100vh - 96px - 24px); /*100% height - header height - footer height*/
}
body.isDisplayTable #main{
	display: table;
}

#footer {
	position: absolute;
	padding:0;
	height: 24px;
	bottom: 0;
	width: 100%;
	text-align: center;
}


/* small desktop */
@media (max-width: 1350px) and (min-width: 768px) {
	#main {
		width: auto;
	}
}

@media (max-width: 768px) {
	#header {
		height: 120px;
	}
	#main  {
		margin: 0;
		width: 100%;
		padding: 20px 5px;
	}
}