.hamburger{position: absolute; right:94px; top:41px; width:52px; height:52px; z-index:99; display: none;}
.hamburger div {width: 30px; height: 16px; position: absolute; left: 11px; top: 18px; cursor: pointer;}
.hamburger span{width:30px; height:2px; background:#333333; transition:All 0.3s ease; display: block; margin-bottom: 5px;}
.hamburger span:nth-of-type(3){margin-bottom: 0;}
.hamburger.active span {position: absolute; top: 8px; background: #333333;}
.hamburger.active span:nth-of-type(1){-webkit-transform:rotate(45deg); transform:rotate(45deg);}
.hamburger.active span:nth-of-type(2){display:none;}
.hamburger.active span:nth-of-type(3){-webkit-transform:rotate(-45deg); transform:rotate(-45deg);}

.hamburger_nav{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:98; overflow:hidden;}
.hamburger_nav .bg{position:absolute; width:100%; height:100%; background: url(/img/background.png?v=1) repeat center; z-index:1;}
.hamburger_nav.active .bg{-webkit-animation:hamburger_nav 0.3s ease 0s 1 both; animation:hamburger_nav 0.3s ease 0s 1 both;}
.hamburger_nav .bg{-webkit-animation:hamburger_nav_rev 0.3s ease 0s 1 both; animation:hamburger_nav_rev 0.3s ease 0s 1 both;}
.hamburger_nav ul{position:absolute; left:50%; top:50%; width:100%; margin:0; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%); padding:0; z-index:2;}
.hamburger_nav ul li{width:100%; padding:0; margin:0; text-align:center;}
.hamburger_nav ul li a{display:inline-block; font-size:24px; line-height:32px; color:#181649; padding:10px 0; opacity:1 \9;}
.hamburger_nav.active ul li a{-webkit-animation:hamburger_nav_a 0.2s ease 0.3s 1 normal both; animation:hamburger_nav_a 0.2s ease 0.3s 1 normal both;}
.hamburger_nav.active ul li:nth-of-type(1) a{-webkit-animation-delay:0.3s; animation-delay:0.3s;}
.hamburger_nav.active ul li:nth-of-type(2) a{-webkit-animation-delay:0.4s; animation-delay:0.4s;}
.hamburger_nav.active ul li:nth-of-type(3) a{-webkit-animation-delay:0.5s; animation-delay:0.5s;}
.hamburger_nav.active ul li:nth-of-type(4) a{-webkit-animation-delay:0.6s; animation-delay:0.6s;}
.hamburger_nav.active ul li:nth-of-type(5) a{-webkit-animation-delay:0.7s; animation-delay:0.7s;}
.hamburger_nav.active ul li:nth-of-type(6) a{-webkit-animation-delay:0.8s; animation-delay:0.8s;}
.hamburger_nav.active ul li:nth-of-type(7) a{-webkit-animation-delay:0.9s; animation-delay:0.9s;}
.hamburger_nav.active ul li:nth-of-type(8) a{-webkit-animation-delay:1.0s; animation-delay:1.0s;}
.hamburger_nav.active ul li:nth-of-type(9) a{-webkit-animation-delay:1.1s; animation-delay:1.1s;}
.hamburger_nav.active ul li:nth-of-type(10) a{-webkit-animation-delay:1.2s; animation-delay:1.2s;}
.hamburger_nav ul li a.active, .hamburger_nav ul li a:hover{text-decoration: underline;}

/*anim*/
@-webkit-keyframes hamburger_nav{
	from{top:-230%;}
	to{top:0;}
}
@keyframes hamburger_nav{
	from{top:-230%;}
	to{top:0;}
}
@-webkit-keyframes hamburger_nav_rev{
	from{top:0;}
	to{top:-230%;}
}
@keyframes hamburger_nav_rev{
	from{top:0;}
	to{top:-230%;}
}
@-webkit-keyframes hamburger_nav_a{
	0%{opacity:0; -webkit-transform:scale3d(0.7, 0.7, 0.7); transform:scale3d(0.7, 0.7, 0.7);}
	80%{-webkit-transform:scale3d(1.05, 1.05, 1.05); transform:scale3d(1.05, 1.05, 1.05);}
	100%{opacity:1; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1);}
}
@keyframes hamburger_nav_a{
	0%{opacity:0; -webkit-transform:scale3d(0.7, 0.7, 0.7); transform:scale3d(0.7, 0.7, 0.7);}
	80%{-webkit-transform:scale3d(1.05, 1.05, 1.05); transform:scale3d(1.05, 1.05, 1.05);}
	100%{opacity:1; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1);}
}

@media screen and (max-width:1200px){
	.hamburger {display: block; right: 86px; top: 38px;}
}
@media screen and (max-width:990px){
	.hamburger {top: 33px; right: 72px;}
}

@media screen and (max-width:750px){
	.hamburger {width:50px; height:50px; right: 5px; top: 0;}
	.hamburger div {left: 10px; top: 17px;}

}