@import url(menu-icon.css);
@import url(menus.css);
@import url(menu2.css);


header .header{
	padding: 0px 9px 0px 7px;
	position: relative;
}







header .header> .menu-icon{
	height: var(--header1-h);
	position: absolute;
	z-index: 1;
	top: 0;
	left:25px;
}
.menu-icon-disable{
	pointer-events: none !important;
	-moz-opacity: 0.3 !important;
	opacity: 0.3 !important;
}









header .header> .logo{
	position: absolute;
	top: 0;
	right:25px;*right:5px;*right:40px !important;
	height: var(--header1-h);
	width: 53px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	-webkit-transform-origin: right;
	-ms-transform-origin: right;
	-o-transform-origin: right;
	transform-origin: right;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
header .header> .logo> a{
	display: block;
	height: var(--header1-h);
	width: 100%;
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	background-image: url("../logo.svg");
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	background-clip: border-box;
	*filter: saturate(100%) hue-rotate(50deg) brightness(125%);
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
header .header> .logo> a:hover{
	*filter: invert(8%) sepia(100%) saturate(6481%) hue-rotate(246deg) brightness(102%) contrast(143%);
	*filter: none;
	*filter: saturate(100%) hue-rotate(0deg) brightness(80%);*filter: saturate(100%) hue-rotate(50deg) brightness(105%);
	filter: saturate(100%) hue-rotate(0deg) brightness(120%);
}




header .header> .site-title{
	position: absolute;
	top: 13px;
	right:85px;*right:63px;*right:100px !important;
	color:rgba(0,0,0,0.2);
	font-weight: bold;
	-webkit-transform-origin: right;
	-ms-transform-origin: right;
	-o-transform-origin: right;
	transform-origin: right;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
@media screen and (max-width:350px) {
	header .header> .logo{
		right:5px;
		*display: none;
		-webkit-transform: scaleX(0);
		-moz-transform: scaleX(0);
		-ms-transform: scaleX(0);
		-o-transform: scaleX(0);
		transform: scaleX(0);
	}
}
@media screen and (max-width:380px) {
	header .header> .menu-icon{
		left:10px;
	}
}
@media screen and (max-width:500px) {
	header .header> .site-title{
		right:63px;
		*display: none;
		-webkit-transform: scaleX(0);
		-moz-transform: scaleX(0);
		-ms-transform: scaleX(0);
		-o-transform: scaleX(0);
		transform: scaleX(0);
	}
}











/* header .header> .menus */
header .header> .menus{
	display:none;
	position: absolute;z-index:2;
	top: 0;
	right: 6px;
	height: var(--header1-h);
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
header .header> .menus> ul::-webkit-scrollbar{ *display: none; }
header .header> .menus> ul{
	*-ms-overflow-style: none;  /* IE and Edge */
	*scrollbar-width: none;  /* Firefox */
	*overflow-y: scroll;
}












header .header> .menu2{
	position: fixed;
	top:var(--header1-h);
	left: 0px;
	clear: both;
	width: 100%;
	height: var(--header2-h);
	border: none;
	border-top: solid 1px rgba(0,0,0,0.05);
	box-sizing: border-box;
}
header .header> .menu2> div.important-link{
	width: 100%;min-width:350px;*max-width: 400px;
	height: var(--header2-h);
	box-sizing: border-box;
	padding: 4px 0px 4px 0px;
	margin: 0 auto;
}
@media screen and (max-width:350px) {
	header .header> .menu2> div.important-link{
		padding: 4px 1px 4px 1px !important;
	}
}
@media screen and (max-width:500px) {
	header .header> .menu2> div.important-link{
		padding: 4px 10px 4px 10px;
	}
}
header .header> .menu2> span.no-connect{
	display:none;
	width:100%;
	height: var(--header2-h);
	background-color:#424242;color:#fff;text-align:center;border-bottom:solid 1px rgba(255,255,255,0.8);
	box-sizing: border-box;
	padding: 7px 9px 4px 7px;
	margin: 0 auto;
}
header .header> .menu2> span.no-connect> i> span{
	display:block;width:20px;height:2px;margin:-7px -2px;
	background-color:#fff;transform:rotate(300deg);
}
header .header> .menu2.no-connect-act> div.important-link{ display:none; }
header .header> .menu2.no-connect-act> span.no-connect{ display:block; }