@charset "UTF-8";
/* CSS Document */

html,body {
	margin: 0;
	padding: 0;
	text-align: center;
	width: 100%;
}
html {
	background-color:white;
	overflow: hidden;
	overflow-y:visible;
	height: 100%;
}
body {
	min-height: 100%;
	overflow: hidden;
}
header {
	position: fixed;
	left: 0; top: 0;
	z-index: 200;
}
header section[data-label="header"]          {z-index: 500;}
header section[data-label="menu-show"]       {z-index: 400;}
header section[data-label="menu-hide"]       {z-index: 700;}
header section[data-label="menu"]            {z-index: 600;}
header section[data-label="menu-background"] {z-index: 300;}

header section[data-label="header"] {
	position: fixed;
	width: 100%;
	left: 50%;
	top: 0;
	pointer-events: none;
	transform: translateX(-50%);
}
header section[data-label="menu-background"],
header section[data-label="menu"] {
	position: fixed;
	left: 50%;
	top: 0;
	width: 100%;
	height: auto;
	transform: translateX(-50%);
}

footer section[data-label="footer"] {
	position: relative;
	width: 100%;
	max-width: 1440px;
	left: 50%;
	top: 0;
	/* pointer-events: none; */
	transform: translateX(-50%);
	outline: 1px dotted green;
	outline: none;
}


/* SHARED */

	footer {}
	footer section[data-label="footer"] {
		position: relative;
		margin: 0; padding: 0;
	}
	footer section[data-label="footer"] .links {
		background-color: rgba(200,34,37,0.62);
		background-color: transparent;
		width: 100%;
		height: 100%;
		top: 0;
	}
	footer section[data-label="footer"] .links a[data-label="lin"] {
		display: block;
		position: absolute;
		background-color: #00ff009c;
		background-color: transparent;
	}





/* MOBILE */

	@media screen and (max-width: 799px) {

		header section[data-label="menu"] {
			transition:transform 0.3s ease;
		}
		header section[data-label="menu-show"],
		header section[data-label="menu-hide"] {
			position: fixed;
			left: 0;
			top: 0;
			width: 12.5%;
		}
		header section[data-label="menu-show"] a,
		header section[data-label="menu-hide"] a {
			display: block;
			float: right;
			height: 100%;
			aspect-ratio:1/1;
		}
		html[data-menu="0"] header section[data-label="menu"] { transform: translateX( -200vw); }
		html[data-menu="1"] header section[data-label="menu"] { transform: translateX(  -50%);}

		html                header section[data-label="menu-show"],
		html                header section[data-label="menu-hide"] { display: none; }
		html[data-menu="0"] header section[data-label="menu-show"],
		html[data-menu="1"] header section[data-label="menu-hide"] { display: block; }
		footer section[data-label="footer"] .links a[data-label="lin"] {
			left: 33%;
			top: 44%;
			width: 43%;
			height: 12%;
		}
	}

/* TABLET */

	@media screen and (min-width: 800px) and (max-width: 1199px) {

		header section[data-label="menu"] {
			transition:transform 0.3s ease;
		}
		header section[data-label="menu-show"],
		header section[data-label="menu-hide"] {
			position: fixed;
			left: 0;
			top: 0;
			width: 9%;
		}
		header section[data-label="menu-show"] a,
		header section[data-label="menu-hide"] a {
			display: block;
			float: right;
			height: 100%;
			aspect-ratio:1/1;
		}
		html[data-menu="0"] header section[data-label="menu"] { transform: translateX( -200vw); }
		html[data-menu="1"] header section[data-label="menu"] { transform: translateX(  -50%);}
		html                header section[data-label="menu-show"],
		html                header section[data-label="menu-hide"] { display: none; }
		html[data-menu="0"] header section[data-label="menu-show"],
		html[data-menu="1"] header section[data-label="menu-hide"] { display: block; }
		footer section[data-label="footer"] .links a[data-label="lin"] {
			left: 48%;
			top: 54%;
			width: 33%;
			height: 19%;
		}
	}
	
	
	
	
	
	header nav ul {
		list-style: none;
		display: block;
		height: 100%;
	}
	header nav ul li {
		list-style: none;
		display: inline-block;
		vertical-align: top;
		height: 100%;
	}
	header nav ul li a {
		display: block;
		text-decoration: none;
		height: 100%;
	}
	header nav ul li:nth-child(1) a:before { width:10%; content:""; }
	header nav ul li:nth-child(2) a:before { width:10%; content:""; }
	header nav ul li:nth-child(3) a:before { width:10%; content:""; }
	header nav ul li:nth-child(4) a:before { width:10%; content:""; }
	header nav ul li:nth-child(5) a:before { width:10%; content:""; }
	header nav ul li:nth-child(6) a:before { width:10%; content:""; }

	section .hash-placeholder {
		outline: 1px dashed red;
		outline: none;
		position: absolute;
		width: 100%;
		height: 100px;
		top: -20vh;
	}
	/* MOBILE */	                        @media screen and (max-width:  799px) { section .hash-placeholder { top: -10vh;} }
	/* TABLET */	@media screen and (min-width:  800px) and (max-width: 1199px) { section .hash-placeholder { top: -10vh; } }
	/* DESKTOP */	                        @media screen and (min-width: 1200px) { section .hash-placeholder { top: -5vh; } }

	footer {}
	main {
		display: block;
		position: relative;
		left: 50%;
		transform:translateX(-50%);
		max-width: 1440px;
		min-height: 100vh;
	}
	main .preload-images {}
	main .preload-images > img {
		position: absolute;
		width: 1px;
		height: 1px;
	}
	main .preload-images .mobile,
	main .preload-images .desktop,
	main .preload-images .desktop { display:none; }
	@media screen                         and (min-width: 1200px) { main .preload-images .mobile  { display:block; } }
	@media screen and (min-width:  800px) and (max-width: 1199px) { main .preload-images .tablet  { display:block; } }
	@media screen                         and (max-width:  799px) { main .preload-images .desktop { display:block; } }
	section {
		width: 100%;
		height: auto;
		position: relative;
		background-repeat: no-repeat;
		background-position: top center;
		background-size: cover;
	}
	section[data-label="menu"]             { }
	section[data-label="header"]           { }
	section[data-label="startpage"]        { }
	html                  header section[data-label="header"]          { transition:all 0.3s ease; }
	html                  header section[data-label="menu-background"] { transition:all 0.3s ease; }


/* DESKTOP */

	@media screen and (min-width: 1200px) {

		section[data-label="menu"]             { }
		section[data-label="menu"] nav {
			position: absolute;
			inset:0;
			text-align: center;
		}
		section[data-label="menu"] nav ul   {list-style: none;height: 100%;margin: 0;padding: 0;font-size: 0;line-height: 0;text-align: center;display: inline-block;width: 80%;}
		section[data-label="menu"] nav ul li { display:inline-block; list-style: none; height: 100%; margin: 0; padding: 0; }
		section[data-label="menu"] nav ul li a { display:block;  }
		
		section[data-label="menu"] nav > a.language-switcher {
			width: 80px;
			height: 50px;
			float: right;
			outline: 1px solid red;
			outline: none;
		}
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(1) {width: calc(100% / 6 - 12%);background-color:rgba(255,0,0,0.5);}
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(2) {width: calc(100% / 6 - 1%);background-color:rgba(255,0,0,0.2);}
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(3) {width: calc(100% / 6 - 1%);background-color:rgba(0,255,195,0.2);}
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(4) {width: calc(100% / 6 + 10%);background-color:rgba(75,0,255,0.2);}
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(5) {width: calc(100% / 6 - 2%);background-color:rgba(103,255,0,0.2);}
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(6) {width: calc(100% / 6 - 6%);background-color:rgba(255,0,35,0.2);}
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(7) { width:  7%; background-color:rgba(0,30,255,0.20); }
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(8) { width:  7%; background-color:rgba(137,255,0,0.20); }
		html[lang="hu"] section[data-label="menu"] nav ul li:nth-child(9) { width:  7%; background-color:rgba(255,243,0,0.20); }
		
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(1) {width: calc(100% / 6 - 13%);background-color:rgba(255,0,0,0.5);}
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(2) {width: calc(100% / 6 - 2%);background-color:rgba(255,0,0,0.2);}
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(3) {width: calc(100% / 6 - 4%);background-color:rgba(0,255,195,0.2);}
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(4) {width: calc(100% / 6 + 4%);background-color:rgba(75,0,255,0.2);}
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(5) {width: calc(100% / 6 - 0%);background-color:rgba(103,255,0,0.2);}
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(6) {width: calc(100% / 6 + 2%);background-color:rgba(255,0,35,0.2);}
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(7) { width:  7%; background-color:rgba(0,30,255,0.20); }
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(8) { width:  7%; background-color:rgba(137,255,0,0.20); }
		html[lang="en"] section[data-label="menu"] nav ul li:nth-child(9) { width:  7%; background-color:rgba(255,243,0,0.20); }

		section[data-label="menu"] nav ul li {outline: 0px dotted red;background-color: transparent!important;}

		.links {
			position: relative;
			margin: 0;
			padding: 0;
			font-size: 0;
			line-height: 0;
			width: 20%;
			top: 3svh;
			height: 51%;
			background-color: #56eec5e;
			left: 50%;
			background-color: transparent;
			transform: translateX(-50%);
		}
		.links a {
			display: block;
			outline: 1px dashed red;
			outline: none;
			width:100%;
			height: 100%;
		}
		html[data-scroll="1"] header section[data-label="menu-background"] { background-image: none; }
		html[data-scroll="0"] header section[data-label="header"] {}
		html[data-scroll="1"] header section[data-label="header"] { background-image:none; background: linear-gradient(90deg, #f29002,#7d2128); height: 55px; box-shadow: 0 5px 15px 0 rgba(0,0,0,0.54); }
		footer section[data-label="footer"] .links a[data-label="lin"] {
			left: 67%;
			top: 57%;
			width: 22%;
			height: 17%;
		}
	}

/* TABLET */

	@media screen and (min-width: 800px) and (max-width: 1199px) {
		section[data-label="menu"]             { }
		section[data-label="menu"] nav {
			position: absolute;
			inset:0;
			text-align: center;
		}
		section[data-label="menu"] nav ul    {
			position: relative;
			list-style: none;
			height: 74%;
			margin: 0;
			padding: 0;
			font-size: 0;
			line-height: 0;
			text-align: left;
			top: 0%;
			/* outline: 1px solid blue; */
			left: 1%;
			width: 57.5%;
		}
		section[data-label="menu"] nav ul li { 
			display:block;
			list-style: none;
			width: 100%;
			height: 4.4%;
			margin: 0;
			padding: 0;
		}
		section[data-label="menu"] nav ul li a { display:block;  }

		section[data-label="menu"] nav ul li:nth-child(1) {
			background-color:rgba(0,255,147,0.20);
			position: relative;
			left: 0;
			top:0;
			width: 70%;
			height: 27%;
		}
		section[data-label="menu"] nav ul li:nth-child(2) { background-color:rgba(255,0,0,0.1); }
		section[data-label="menu"] nav ul li:nth-child(3) { background-color:rgba(0,255,195,0.1); }
		section[data-label="menu"] nav ul li:nth-child(4) { background-color:rgba(75,0,255,0.1); }
		section[data-label="menu"] nav ul li:nth-child(5) { background-color:rgba(103,255,0,0.1); }
		section[data-label="menu"] nav ul li:nth-child(6) { background-color:rgba(255,0,35,0.1); }
		section[data-label="menu"] nav ul li:nth-child(7) { background-color:rgba(187,0,255,0.10); }
		section[data-label="menu"] nav ul li:nth-child(8) { background-color:rgba(0,171,255,0.10); }
		section[data-label="menu"] nav ul li:nth-child(9) { background-color:rgba(35,255,0,0.10); }

		section[data-label="menu"] nav ul li {
			outline: 1px dotted red;
			outline: 0;
			background-color: transparent!important;
			height: calc(100% / 7);
		}
		section[data-label="menu"] nav a.language-switcher {
			width: 15%;
			height: 10%;
			outline: 1px solid red;
			outline: none;
			display: inline-block;
			float: left;
			left: 42.5%;
			position: relative;
			top: -69%;
		}
		
		.links {
			position: relative;
			margin: 0;
			padding: 0;
			font-size: 0;
			line-height: 0;
			width: 36%;
			top: 3svh;
			height: 51%;
			background-color: #56eeec5e;
			left: 50%;
			background-color: transparent;
			transform: translateX(-50%);
		}
		.links a {
			display: block;
			outline: 1px dashed red;
			outline: none;
			width:100%;
			height: 100%;
		}
		html[data-scroll="0"] header section[data-label="menu-background"] {}
		html[data-scroll="1"] header section[data-label="menu-background"] { background-image:none; background: linear-gradient(90deg, #f29002,#7d2128); height: 12vw; box-shadow: 0 5px 15px 0 rgba(0,0,0,0.54); }
	}

/* MOBILE */

	@media screen and (max-width: 799px) {
		section[data-label="header"]           {/* background-color: black; */}
		section[data-label="menu"] nav {
			position: absolute;
			inset:0;
		}
		section[data-label="menu"]             { }
		section[data-label="menu"] nav {
			position: absolute;
			inset:0;
		}
		section[data-label="menu"] nav ul    {
			position: relative;
			list-style: none;
			height: 58%;
			margin: 0;
			padding: 0;
			font-size: 0;
			line-height: 0;
			text-align: left;
			top: 6.7%;
			top: 0;
			/* outline: 1px solid blue; */
		}
		section[data-label="menu"] nav ul li { 
			display:block;
			list-style: none;
			width: 100%;
			margin: 0;
			padding: 0;
		}
		section[data-label="menu"] nav ul li a { display:block;  }

		section[data-label="menu"] nav ul li:nth-child(1) {
			background-color:rgba(0,255,147,0.20);
			position: relative;
			left: 0;
			top:0;
			width: 100%;
			height: 27%;
		}
		section[data-label="menu"] nav ul li:nth-child(2) { background-color:rgba(255,0,0,0.1); }
		section[data-label="menu"] nav ul li:nth-child(3) { background-color:rgba(0,255,195,0.1); }
		section[data-label="menu"] nav ul li:nth-child(4) { background-color:rgba(75,0,255,0.1); }
		section[data-label="menu"] nav ul li:nth-child(5) { background-color:rgba(103,255,0,0.1); }
		section[data-label="menu"] nav ul li:nth-child(6) { background-color:rgba(255,0,35,0.1); }
		section[data-label="menu"] nav ul li:nth-child(7) { background-color:rgba(187,0,255,0.10); }
		section[data-label="menu"] nav ul li:nth-child(8) { background-color:rgba(0,171,255,0.10); }
		section[data-label="menu"] nav ul li:nth-child(9) { background-color:rgba(35,255,0,0.10); }

		section[data-label="menu"] nav ul li {
			outline: 1px dotted red;
			outline: 0;
			background-color: transparent!important;
			height: calc(100% / 7);
		}
		section[data-label="menu"] nav a.language-switcher {
			display: inline-block;
			position: relative;
			float: right;
			width: 33%;
			height: 8%;
			left: -4%;
			outline: 1px solid red;
			outline: none;
			top: -53%;
		}
		.links {
			position: relative;
			margin: 0;
			padding: 0;
			font-size: 0;
			line-height: 0;
			width: 80%;
			top: 5svh;
			height: 60%;
			background-color: #56eeec5e;
			left: 10%;
			background-color: transparent;
		}
		.links a {
			display: block;
			outline: 1px dashed red;
			outline: none;
			width:100%;
			height: 100%;
		}
		.links a[data-label="ins"] {}
		.links a[data-label="fcb"] {}
		.links a[data-label="web"] {}
		.links a[data-label="wsh"] {}
		
		html[data-scroll="0"] header section[data-label="menu-background"] {}
		html[data-scroll="1"] header section[data-label="menu-background"] { background-image:none; background: linear-gradient(90deg, #f29002,#7d2128); height: 12vw; box-shadow: 0 5px 15px 0 rgba(0,0,0,0.54); }
	}


@media screen                        and (min-width: 1200px) {	/* DESKTOP */	}
@media screen and (min-width: 800px) and (max-width: 1199px) {	/* TABLET */	}
@media screen                        and (max-width: 799px) {	/* MOBILE */	}


/* DESKTOP */

	@media screen and (min-width: 1200px) {
		header section[data-label="header"] {max-width: 1440px;}
		header section[data-label="menu"] {max-width: 1440px;}
		header section[data-label="menu-background"] { max-width: 1440px; }
		header section[data-label="menu-background"]:before {
			display: block;
			z-index: -1;
			content:"";
			position: absolute;
			background-color: black;
			top: 0;
			bottom: 0;
			left: -100vw;
			right: -100vw;
			display: none;
		}
	}
	
/* TABLET */

	@media screen and (min-width: 800px) and (max-width: 1199px) {
		section[data-label="gallery"] .scroller {
			position: absolute;
			width: 100vw;
			top: 40%;
			overflow-x: auto;
			overscroll-behavior: auto;
			scroll-snap-type: x mandatory;
			scroll-behavior: smooth;
		}
		section[data-label="gallery"] .scroller section[data-label="gallery-items"] {
			width: 300vw;
			scroll-snap-align: center;
			/* scroll-snap-stop: always; */
			/* overscroll-behavior-x: contain; */
			scroll-snap-stop: always;
		} 
	}

/* MOBILE */

	@media screen and (max-width: 799px) {
		section[data-label="gallery"] .scroller {
			position: absolute;
			width: 100vw;
			top: 40%;
			overflow-x: auto;
			overscroll-behavior: auto;
			scroll-snap-type: x mandatory;
			scroll-behavior: smooth;
		}
		section[data-label="gallery"] .scroller section[data-label="gallery-items"] {
			width: 300vw;
			scroll-snap-align: center;
			/* scroll-snap-stop: always; */
			/* overscroll-behavior-x: contain; */
			scroll-snap-stop: always;
		} 
	}

	section[data-label="startpage"]:before   {
		display: block;
		z-index: -1;
		content:"";
		position: absolute;
		background-color: transparent;
		top: 0; bottom: 0;
		left: -100vw;
		right: -100vw;
	}