* {
	margin:0;
	padding:0;
	box-sizing:border-box;
}
header {
	width:100vw;
	height:100vh;
	background:url('6.jpg') center center;
	background-size:cover;
}
nav{
	position:absolute;
	top:0;
	left:0;
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:0 5vw;
	width:100vw;
	height:100px;
	background-color:rgba(65,81,101,0.9);
	color:white;
}
.logo {
	font-size:24px;
	font-weight:600;
	flex:1;
	min-width:100px;
	float: left;
	height: 100%;
	position: relative;
	padding-left: 25px;
}
.logo img{
	position: absolute;
	top: 50%;
	margin-top: -31px;
}
.nav-menu {
	flex:1;
	display:flex;
	justify-content:space-between;
	max-width:350px;
}
.nav-menu li {
	/*list-style:none;
	color:#dadbdd;
	font-weight:600;*/
}
.burger div {
	width:80px;
	height:5px;
	background-color:#0268bc;
	margin:21px auto;
}
/*.burger {
	display:none;
}*/
@media screen and (max-width:760px) {
.nav-menu {
	position:absolute;
	top:100px;
	right:0;
	width:45vw;
	/*height:calc(100vh - 80px);*/
	background-color:rgba(65,81,101,0.9);
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
	/*transform:translateX(100%);*/
}
.nav-menu li {
	width: 100%;
	text-align: center;
	height: 80px;
	line-height: 80px;
	font-size: 20px;
	opacity:0.3;
	position:relative;
	/*transform:translateX(20vw);*/
	border-bottom: 1px solid #fff;
	opacity: 1;
}
.nav-menu li a{
	line-height: 80px;
	font-size: 20px;
	color: #fff;
	display: block;
}
.nav-menu li:last-child{
	border: 0px;
}
.burger {
	display:block;
	    float: right;
    height: 100px;
    width: 100px;
}
.active div {
	transition:0.3s  ease-in-out 0.3s;
}
.active .top-line {
	transform:rotate(45deg) translate(22px,20px);
}
.active .bottom-line {
	transform:rotate(-45deg) translate(16px,-16px);
}
.active .middle-line {
	opacity:0;
	transform:translateX(10px);
	transition:0.3s ease-in-out;
}
.nav-menu.open {
	transform:translateX(0);
}
@keyframes slideIn {
	from {
	transform:translateX(20px);
	opacity:0;
}
to {
	transform:translateX(0);
	opacity:1;
}
}
}