body {background:#232323;margin:0;padding:0;width:100%;}

#menu {top:0;z-index:100;position:fixed;width:100%;height:8vh;color:red;display: block;}
#menu a {text-decoration:none;color:white;float:left;}
#logo {position:absolute;width:30%;height:100%;}
#logo img {width:12%;margin:1%;}
#logo #nev {height: 50%;width: 85%;float: right;font-size: 3vh;margin: 3% 0;}
#menunyit {width: 40%;height: 100%;float: right;position: relative;}
#menu1, #menu2, #menu3, #menu4 {width:22%;height:50%;font-size: 3vh;margin: 2.5% 0;float:left;}
#menu1 a, #menu2 a, #menu3 a, #menu4 a {text-align:center;}
#menunyit #menuki, #menunyit #menube {width:0;height:0;font-size:0;color:transparent;}

#contener {position:relative;width:100%;height:186vh;}

@media (orientation: portrait) {
	#menu {width: 100%;height: 80px;margin:0;z-index:1000;}
	#logo {height:100px;width: 90%;margin: 0 0 10% 0;}
	#nev {font-size:2.7vh;}
	#menunyit #menuki.nyitva, #menunyit #menube.nyitva {position: relative;font-size: 4em;right: -90%;top: 188%;color: white;width: 50px;height: 50px;}
	#menunyit #menuki.nyitva i, #menunyit #menube.nyitva i {top:0;left:10px;}
	#menunyit {margin: -120px 0px;width:100%;}
	#menu1.zarva, #menu2.zarva, #menu3.zarva, #menu4.zarva, #menu5.zarva  {position: relative;top:80px;height: 0;width: 0;font-size: 0;}
	#menu1.nyitva, #menu2.nyitva, #menu3.nyitva, #menu4.nyitva, #menu5.nyitva  {height: 80px;top: 180px;z-index: 100;font-size: 4vh;position: relative;float: none;width: 100%;text-align: center;}
	#menu2.nyitva {transform:translateY(-2px);}
	#menu3.nyitva {transform:translateY(-4px);}
	#menu4.nyitva {transform:translateY(-6px);}
	#menu5.nyitva {transform:translateY(-8px);}
	
	
	#contener {position:relative;width:100%;height:186vh;}
}