* {background:#fbe5bb;padding:0;margin:0;}
body {width:100%;margin:0;padding:0;}
i, h1, h2, h3, h4, h5, h6, ::marker {color:#fbe5bb;font-size:0;}
ul, li {height:0;}

#fekvo, #fekvokiir, #telefon, #telefon1, #telefon2 {width:0;height:0;font-size:0;}
#menu a {color:black;text-decoration:none;}
#logo {width:25%;height: 80px; float:left;margin:0 0 0 8%;}
#menunyit {width:60%;height: 80px;float:left;margin:0;}
#menunyit #menuki, #menunyit #menube {width:0;height:0;}
#menunyit #menuki i, #menunyit #menube i{font-size:0em;}
#nev1, #nev2{width:35%;height:30px; float: left;text-align: left;font-size: 4vh;margin:20px 0;font-family: 'Dancing Script', cursive;}
#nev1{text-align: right;width:42%;}
#logo1{width:80px;height: 80px; float: left;background-image: url(logo.png);background-size: cover;}
#menu1, #menu2, #menu3, #menu4, #menu5, #menu6 {text-align: center;font-size: 4vh;font-family: 'Dancing Script', cursive;width:12%;height: 30px; float: left;margin:20px 0;}
#menu4 {width:21%;margin:20px;}
#menu5 {width:14%;margin:20px 30px 20px 20px;}
#logo:hover, #menu1:hover , #menu2:hover , #menu3:hover , #menu4:hover, #menu5:hover, #menu6:hover {animation :menufokus 2.5s ;}
@keyframes menufokus {
	0%, 100% {filter:none;}
	50% {filter:blur(2px);}
}

.contener {position: relative;width:80%;height:86vh;top:80px;left:50%;transform:translatex(-50%);}
h1 {position:relative;color:black;text-align:center;font-size:1em;}
h2 {position:relative;color:black;text-align:center;font-size:2em;margin:3% 0;}
#ringkep1 {position:relative;width:28%;left:6%;float:left;}
h3, strong {position:relative;color:black;text-align:center;font-size:1.5em;margin:1% 0;float:left;left:10%;width:56%}
#leiras {position:relative;float:left;width:55%;height:20%;left:10%;}
dt {color:black;text-align:center;font-size:1.5em;margin:0 0 1% 0;}
dd {color:black;text-align:center;font-size:1.2em;margin:1% 0;}
p {position:relative;left:10%;width:55%;color:black;text-align:center;font-size:1.2em;margin:1% 0;float:left;}
#csomagkepek {position:relative;left:10%;width:55%;height:36%;float:left;overflow:hidden;}
#bal {position: relative;top:0;left:0;width:15%;height:100%;margin:0;background:transparent;float:left;z-index:1;}
#jobb {position: relative;top:0;left:70%;width:15%;height:100%;margin:0;background:transparent;float:left;z-index:1;}
#csomagkepek img.active {position:absolute;width:50%;left:50%;transform:translateX(-50%);}
#csomagkepek img.notactive {position:absolute;width:50%;left:150%;transform:translateX(-50%);}
#csomagkepek span.active {bottom:0;position:absolute;display:block;background:transparent;width:100%;color:black;font-size:2em;text-align:center;}
#csomagkepek span.notactive {left:150%;position:absolute;display:block;background:transparent;width:100%;color:white;font-size:2em;text-align:center;}
#csomagkepek i {color:black;position:relative;top:50%;left:50%;transform: translate(-50% , -50%);font-size:6vh;background:transparent;}

@media only screen and (max-width: 1460px) {
	#menu {position: fixed;top:0;left:0;width: 80%;height: 80px;margin: 0 10%;z-index:1;}
	#menu a {color:black;text-decoration:none;}
	#logo {width:79%;height: 80px; float:left;margin:0 10% 0 10%;}
	#menunyit {width:99%;height:0px;margin:0;}
	#menunyit #menuki.nyitva , #menunyit #menube.nyitva {width: 48px;height: 50px;top: 20%;right:0;position: absolute;}
	#menunyit #menuki.nyitva i, #menunyit #menube.nyitva i{color:black;font-size:3em;width: 48px;height: 50px;top: 20%;right:0;position: absolute;}
	#menunyit #menuki.zarva, #menunyit #menube.zarva {font-size:0em;width: 0px;height: 0px;top: 20%;position: absolute;}
	#nev1, #nev2{width:35%;height:30px; float: left;text-align: left;font-size: 4vh;margin:20px 0;font-family: 'Dancing Script', cursive;}
	#nev1{text-align: right;width:42%;}
	#logo1{width:80px;height: 80px; float: left;background-image: url(logo.png);background-size: cover;}
	#menu1.nyitva, #menu2.nyitva, #menu3.nyitva, #menu4.nyitva, #menu5.nyitva, #menu6.nyitva {text-align: center;font-size: 4vh;font-family: 'Dancing Script', cursive;width:101%;margin:0;height: 90px;left:-3px;position:relative;transition:1s;}
	#menu1.zarva, #menu2.zarva, #menu3.zarva, #menu4.zarva, #menu5.zarva, #menu6.zarva {text-align: center;font-size: 0vh;font-family: 'Dancing Script', cursive;width:100%;margin:0;height: 0px;transition:1s;}
	#logo:hover, #menu1:hover , #menu2:hover , #menu3:hover , #menu4:hover, #menu5:hover, #menu6:hover {animation :menufokus 2.5s ;}
	@keyframes menufokus {
		0%, 100% {filter:none;}
		50% {filter:none;}
	}
	.contener {height:95vh;}
	p {top:10%;}
	#csomagkepek {top:10%;}
}

@media only screen and (max-width: 1367px) {
	#menu1.nyitva, #menu2.nyitva, #menu3.nyitva, #menu4.nyitva, #menu5.nyitva, #menu6.nyitva {font-size: 5vh;}
	h1 {font-size:1.7em;}
	#ringkep1 {width:40%;left:50%;transform:translateX(-50%);float:none;top:3%;}
	h2, strong {font-size:2.5em;float:none;left:0;width:100%;display:block;top:2%;}
	h3 {font-size:2.5em;margin:4% 0;float:none;left:0;width: 100%;}
	#leiras {float:none;width:100%;top:5%;height:30%;left:0;}
	dt {font-size:2.6em;}
	dd {font-size:2.1em;}
	p {left:0%;width:100%;font-size:2.2em;float:none;top:13%;}
	#csomagkepek {top:15%;left:0%;width:100%;height:28%;float:none;}
	#csomagkepek img.active {width:60%;}
	#csomagkepek span.active {bottom:10%;font-size:3em;}
}
@media (orientation: landscape) and (max-width: 1367px) {
	p {top:25%;}
	#csomagkepek {top:28%;height:60%;}
}

@media (orientation: portrait) and (max-width: 600px) {
	* {background:#fbe5bb;}
	#menu {width: 100%;height: 80px;margin:0;z-index:1000;}
	#logo {height:80px;width: 90%;margin: 0 0 10% 0;}
	.contener {scroll-snap-type:none;top:80px;}
	#nev1, #nev2 {font-size:2.7vh;}
	#logo1 {margin:10px 0 0 0;width: 45px;height: 45px;}
	#menunyit #menuki.nyitva, #menunyit #menube.nyitva {font-size: 0.7em;right:5%;}
	#menunyit #menuki.nyitva i, #menunyit #menube.nyitva i {top:0;left:10px;}
	#menunyit {margin: -120px 0px;}
	#menu1.zarva, #menu2.zarva, #menu3.zarva, #menu4.zarva, #menu5.zarva, #menu6.zarva  {position: relative;top:80px;}
	#menu1.nyitva, #menu2.nyitva, #menu3.nyitva, #menu4.nyitva, #menu5.nyitva, #menu6.nyitva  {height: 50px;top:80px;z-index:100;font-size:4vh;}
	#menu2.nyitva {transform:translateY(-2px);}
	#menu3.nyitva {transform:translateY(-4px);}
	#menu4.nyitva {transform:translateY(-6px);}
	#menu5.nyitva {transform:translateY(-8px);}
	#menu6.nyitva {transform:translateY(-10px);}
	h1 {font-size:1.4em;}
	#ringkep1 {width:80%;}
	h2, strong {font-size:1.5em;}
	h3 {font-size:1.5em;}
	#leiras {height:40%;}
	dt {font-size:1.6em;}
	dd {font-size:1.1em;}
	p {font-size:1.2em;top:8%;}
	#csomagkepek {height:32%;}
	#csomagkepek img.active {width:100%;}
	#csomagkepek span.active {font-size:2em;color:#0045ff}
	#csomagkepek i {color:#0045ff;top:75%;}
}