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.active {position:relative;width:76%;height:84vh;margin:8vh 12%;overflow:hidden;}
#contener.notactive {position:relative;width:0;height:0;margin:0;overflow:hidden;opacity:0;}
#video1 {position:relative;width:20%;height:21vh;opacity:.7;transition:.5s;}
#video1:hover {cursor:pointer;opacity:1;}
#video1kep {width:100%;}
#video1 i {position:relative;font-size:5vh;color:red;transform: translate(260%, -275%);}

#video1player.notactive, #video1player.notactive #video1full, #video1player.notactive i {position:absolute;width:0;height:0;margin:0;opacity:0;font-size:0;}
#video1player.active {position:absolute;width:76%;height:84vh;margin:8vh 12%;opacity:1;}
#video1player.active #video1full {position:relative;width:100%;}
#video1player.active i {position: absolute;font-size: 4vh;color: white;transform: translateX(90%);cursor:pointer;}

@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: 100px;top: 180px;z-index: 100;font-size: 4vh;position: relative;float: none;width: 100%;text-align: center;background:#232323;margin:0;}
	#menu2.nyitva {transform:translateY(-2px);}
	#menu3.nyitva {transform:translateY(-4px);}
	#menu4.nyitva {transform:translateY(-6px);}
	#menu5.nyitva {transform:translateY(-8px);}
	
	#contener.active {width:94%;height:84vh;margin:8vh 3%;}
	#contener.notactive {position:relative;width:0;height:0;margin:0;overflow:hidden;opacity:0;}
	#video1 {position:relative;width:40%;height:11vh;opacity:1;}
	#video1kep {width:100%;}
	#video1 i {position:relative;font-size:5vh;color:red;transform: translate(132%, -180%);}

	#video1player.notactive, #video1player.notactive #video1full, #video1player.notactive i {position:absolute;width:0;height:0;margin:0;opacity:0;font-size:0;}
	#video1player.active {position:absolute;width:100%;height:30vh;margin:34vh 0;opacity:1;}
	#video1player.active #video1full {position:relative;width:100%;}
	#video1player.active i {position: absolute;font-size: 4vh;color: white;transform: translate(-150%, -180%);cursor:pointer;}
}