header{
position:relative;
width:100%;
border-bottom: 1px solid #eee;
background-color:#fff;
z-index:3;
transition: .8s;
-webkit-box-shadow: 0px 4px 27px 1px rgba(34, 60, 80, 0.08);
-moz-box-shadow: 0px 4px 27px 1px rgba(34, 60, 80, 0.08);
box-shadow: 0px 4px 27px 1px rgba(34, 60, 80, 0.08);
}
.header>div { 
max-width:1300px;
margin:auto;
display:grid; 
grid-template-columns:300px auto 40px;
grid-gap:25px;
align-items:center; 
position:relative; 
}
.logo { 
position:relative;
height:70px; 
display:flex;
align-items:center;
justify-content: flex-start;
}
.logo img { 
height:60px;
display:block;
}
.lang a{
width:25px;
height:19px;
display:block;
}
.lang img{
width:100%;
height:auto;
}
nav ul { 
list-style:none; 
}
nav li { 
position:relative; 
}
nav a { 
display:flex; 
justify-content:space-between; 
align-items:center; 
padding:12px 15px; 
text-decoration:none; 
color:var(--black); 
font-weight:200; 
transition:.25s ease;
font-size:15px;
font-weight: 400;
}
nav a:hover { 
color:var(--scolor); 
}
header.dark{
background-color:rgba(255,255,255,0.98); 
}
header.dark nav a{
color:var(--scolor);
}
nav ul li ul li a{
font-size:14px;
color:var(--black);
}
nav li.has-children > a::after {
content: "";
display:inline-block;
margin-left: 8px;
width: 14px;
height: 14px;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23005d33" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>') no-repeat center;
background-size: 14px;
transition: transform .3s ease;
}
nav ul li li.has-children > a::after, header.dark nav li.has-children > a::after {
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23005d33" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>') no-repeat center;
}
.menu-wrapper{
display:flex;
justify-content: flex-end;
}
@media (min-width:800px){
	nav>ul { 
	display:flex; gap:4px;
	}
	nav li.has-children > ul {
	position:absolute;
	top:100%; left:0;
	min-width:220px;
	background-color:rgba(255,255,255,0.98);
	border-radius:12px;
	box-shadow:0 15px 40px rgba(0,0,0,0.08);
	padding:8px 0;
	opacity:0;
	transform:translateY(12px);
	pointer-events:none;
	transition:.25s ease;
	}
	nav li.has-children:hover>ul { 
	opacity:1; 
	transform:translateY(0); 
	pointer-events:auto; 
	}
	nav li.has-children>ul li.has-children > ul {
	top:0; left:100%; 
	transform:translateX(12px); 
	opacity:0;
	}
	nav li.has-children>ul li.has-children:hover > ul { 
	transform:translateX(0); 
	opacity:1; 
	}
	nav li.has-children:hover > a::after { 
	transform: rotate(180deg); 
	}
	nav li.has-children>ul li.has-children > a::after { 
	transform: rotate(-90deg); 
	}
	nav li.has-children>ul li.has-children:hover > a::after { 
	transform: rotate(90deg); 
	}
}
.menu-toggle { 
display:none; 
width:28px; 
height:27px; 
position:relative; 
cursor:pointer; 
}
.menu-toggle span, .menu-close span { 
display:block; 
position:absolute; 
left:0; 
width:100%; 
height:3px; 
background-color:var(--mcolor); 
border-radius:2px; 
transition:.35s ease; 
}
.menu-toggle span:nth-child(1){ 
top:0; 
}
.menu-toggle span:nth-child(2){ 
top:50%; 
transform:translateY(-50%); 
}
.menu-toggle span:nth-child(3){ 
bottom:0; 
}
.menu-toggle.active span:nth-child(1){ 
transform:translateY(11px) rotate(45deg); 
}
.menu-toggle.active span:nth-child(2){ 
opacity:0; 
}
.menu-toggle.active span:nth-child(3){ 
transform:translateY(-11px) rotate(-45deg); 
}
.menu-close { 
display:none; 
}
@media (max-width:800px){
	.header>div { 
	grid-template-columns:auto 30px 30px;
	grid-gap:25px;
	}
	.logo { 
	height:50px; 
	}
	.logo img { 
	height:45px;
	}
	.menu-toggle { 
	display:block; 
	}
	nav.menu-wrapper { 
	position:fixed; 
	top:0; 
	left:-100%; 
	width:100%; 
	height:100%; 
	background-color:rgba(255,255,255,1); 
	overflow-y:auto; 
	transition:left .35s ease; 
	z-index:999; 
	padding:20px 0; 
	}
	nav.menu-wrapper.active { 
	left:0;
	}
	nav>ul { 
	display:flex; 
	flex-direction:column; 
	padding-top:60px; 
	width:100%;
	}
	nav li > ul { 
	max-height:0; 
	overflow:hidden; 
	transition:max-height .35s ease; 
	background-color:#fff; 
	padding-left:20px; 
	}
	nav li.open > ul {
	max-height:1000px; 
	}
	nav li a { 
	font-size:17px; 
	padding:12px 18px; 
	}
	.menu-close { 
	display:block; 
	position:absolute; 
	top: 10px;
	right: 5px;
	width:28px; 
	height:25px; 
	cursor:pointer; 
	}
	.menu-close span:nth-child(1){ 
	transform:translateY(11px) rotate(45deg); 
	}
	.menu-close span:nth-child(2){ 
	transform:translateY(11px) rotate(-45deg); 
	}
	nav li.open > a::after{
	transform: rotate(180deg);
	}
	nav li ul li.open > a::after{
	transform: rotate(180deg);
	}
	.active .menu-close span { 
	background-color:var(--black); 
	}
	.active li a { 
	color:var(--black); 
	}
	.active li.has-children a { 
	color:var(--black); 
	}
	.active li.has-children > a::after {
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23005d33" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>') no-repeat center;
	}
	.dark .menu-toggle span, .menu-close span { 
	background-color:var(--scolor); 
	}
}