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


:root {
	--icon_size: 28px;
}

	/*   DESKTOP    */ @media screen and (min-width: 960px)                          { 
		
		.top-menu[data-res="desktop"] { display: flex; }
		.top-menu[data-res="mobile" ] { display: none; }
	}

	/*   TABLET and MOBILE   */ @media screen and (min-width:   0px) and (max-width: 959.8px) {

		header .body nav.top-menu[data-res="mobile"] {
			position: fixed;
			right: 0;
			top: 0;
			z-index: 100;
			will-change: auto;
		}
		header .body nav.top-menu[data-res="mobile"] {
			.pagecover { pointer-events: none; }			
			.pagecover label { pointer-events: all; }			
			& > label.menu-toggle {
				display: block;
				position: relative;
				pointer-events: all;
				width:  calc(var(--menu_height) * 0.5);
				height: calc(var(--menu_height) * 0.5);
				text-align: center;
				outline: 1px solid orange;
				outline: none;
			}
			& > label.menu-toggle input {}
			& > label.menu-toggle > i {
				display: block;
				font-size: 20px;
				line-height: calc(var(--menu_height) * 0.5);
				text-shadow: 0 0 5px rgba(0,0,0,0.5), 0 0 10px rgba(0,0,0,0.25);

			}
			& > label.menu-toggle[data-state="on" ] > i:before { content:"\EC06"; }
			& > label.menu-toggle[data-state="off"] > i:before { content:"\EBAB"; }
			& > label.menu-toggle                   > i:after  { content:"\EBA2"; opacity: 0; position: absolute; transform:translateX(-190%); }
			& > label.menu-toggle[data-state="on" ]:hover > i:after  { opacity: 1; }
			& > .menu-levels {
				position: absolute;
				position: fixed;
				right: 0;
				top: var(--menu_height);
				height: calc(100vh - var(--menu_height));
				font-size: var(--copy_size);
				background-color: var(--brand_darkblue);
				box-shadow: 0 25px 25px 0 rgba(0,0,0,0.76);
				transform: translateY(calc(-100vh - var(--menu_height)));
			}
			& > .menu-levels:before {
				display: block;
				content: "";
				position: absolute;
				inset:0;
				background-image: url("../../images/background/spot-wide.webp");
				background-size: cover;
				XXXbackground:linear-gradient(to bottom, var(--brand_orange_dim), var(--brand_orange_light));
				opacity: 0.5;
				mix-blend-mode: overlay;
				background-attachment: fixed;
			}
		}
		header .body nav.top-menu[data-res="mobile"] > .menu-levels .menu-level-0 {
			box-sizing: border-box;
			height: 100%;
		}
		header .body nav.top-menu[data-res="mobile"] > .menu-levels .menu-level-0 {
			.backlink {
				display: none;
			}
			.backlink i {}
			.backlink i:before { content:"\EBA3"; }
			> ul.l0 {
				display: block;
				box-sizing: border-box;
				list-style: none;
				margin: 0; padding: 0;
				padding: 50px 50px 25px 50px;
				height: 100%;
			}
			> ul.l0 > li {
				list-style: none;
				margin: 0; padding: 0;
			}
			> ul.l0 > li > a {
				display: block;
				position: relative;
				padding: 15px 50px 15px 25px;
			}
			> ul.l0 > li > a:before {
				content:"";
				background-color: var(--brand_orange);
				position: absolute;
				inset:-15px 0 15px 0;
				opacity: 0;
				z-index: 0;
				border-radius: 5px;
				transform:scale(0.95,0.9);
				transition: opacity 0.5s ease, transform 0.25s ease;
			}
			> ul.l0 > li:hover a {}
			> ul.l0 > li:hover a:before {
				transform:scale(1,1);
				opacity: 1;
			}
			> ul.l0 > li > a > i {
				position: relative;
				z-index: 2;
			}
			> ul.l0 > li > a > em {
				position: relative;
				z-index: 2;
			}
		}

		/* states */

		header .body nav.top-menu[data-res="mobile"]:has(label.menu-toggle > input[name="toggle-button"][value="main-menu"]){
			display: none;
			.menu-levels {display: block;opacity: 1;max-height:0;pointer-events: none;transition:transform 0.1s ease, max-height 0.2s ease 0.25s, opacity 0.2s ease 0.0s;}
			.pagecover { display: block; opacity: 0; pointer-events: none; transition:max-height 0.5s ease 0.25s, opacity 0.5s ease 0.0s; }
			label.menu-toggle[data-state="on" ] { display: block; }
			label.menu-toggle[data-state="off"] { display: none; }
		}
		header .body nav.top-menu[data-res="mobile"]:has(label.menu-toggle > input[name="toggle-button"][value="main-menu"]:checked){
			label.menu-toggle {background-color: var(--brand_orange_dim);background-color: transparent;}
			.menu-levels {opacity: 1;max-height: 100vh;pointer-events: all;transition: transform 0.1s ease, max-height 0.2s ease, opacity 0.2s ease 0.05s;transform: translateY(0);}
			.pagecover   {opacity: 1;max-height: 100vh; pointer-events: all; transition:transform max-height 0.6s ease, opacity 0.5s ease 0.05s;}
			.pagecover label { position: absolute; inset:var(--menu_height) 0 0 0; cursor: default; }
			label.menu-toggle[data-state="on" ] { display: none; }
			label.menu-toggle[data-state="off"] {display: block;z-index: 120;}
		}
	}

	/*   TABLET     */ @media screen and (min-width: 520px) and (max-width: 959.8px) {
		
		.top-menu[data-res="desktop"] { display: none; }
		.top-menu[data-res="mobile" ] {display: block;}
		section { min-height:0; }
		section .background { padding-bottom: 1px; }
		section h2 {
			--main_title_size: 2rem;
			--main_title_line_height: 3rem;
			text-align: center;
			text-wrap: balance;
			padding-top: 0;
			padding-bottom: 0;
		}
	}
	/*   MOBILE     */ @media screen and (min-width:   0px) and (max-width: 519.8px) { 
		
		.top-menu[data-res="desktop"] {display: none;}
		.top-menu[data-res="mobile" ] {display: block;height: 100vh;/* pointer-events: none; */}
		section#partners { min-height:0; }
		#gallery  {min-height: 0;}
		#history  { min-height:0; }
		section .background {min-height: inherit;padding-bottom: 5px;}
		section h2 {
			--main_title_size: 2.0rem;
			--main_title_line_height:1.2;
			text-align: center;
		}
		header nav.top-menu[data-res="mobile"] li[data-label="contributors"] {
			display: none !important;
		}
	}


	/*						*/
	/*	HEADER 				*/
	/*						*/

	/*   DESKTOP    */ @media screen and (min-width: 960px)                          { 
		
		.top-menu[data-res="desktop"] { display: flex; }
		.top-menu[data-res="mobile" ] { display: none; }

		header {
			display: block;
			position: fixed;
			z-index: 500;
			top: var(--menu_offset);
			left: 0;
			width: 100vw;
			height: var(--menu_height);
			pointer-events: none;
			opacity: 0.9;
			backdrop-filter: blur(2px) brightness(20) saturate(50%) contrast(1);
			backdrop-filter: blur(2px);
			box-shadow: 0 5px 15px 0 #00000088;
			transition:height 0.3s ease;
		}
		header .background {
			position: absolute;
			inset:0;
			background-color: var(--brand_darkblue);
		}
		header .background .decor {
			display: block;
			content: "";
			position: absolute;
			inset:0;
			background-image: url("../../images/background/spot-wide.webp");
			background-size: 100% 300%;
			background-position: 33vw 50%;
			background-repeat: no-repeat;
			XXXbackground:linear-gradient(to bottom, var(--brand_orange_dim), var(--brand_orange_light));
			opacity: 0.5;
			opacity: 1;
			mix-blend-mode: overlay;
			/*mix-blend-mode: normal;*/
		}
		header .stripe {
			position: absolute;
			right: 0vw;
			height: calc(var(--menu_height) * var(--top_menu_item_ratio) * 1.7);
			width: calc(400px + 50vw);
			background-color: var(--brand_purple);
			border-bottom-left-radius: 150px;
			opacity: 0.5;
			opacity: 1;
			pointer-events: none;
			transition:height 0.2s ease, opacity 0.2s ease;
		}
		html[data-scd="1"] header .stripe { height: 0; opacity: 1; }
		header .head {
			display: block;
			position: absolute;
			inset:0;
			z-index: 60;
			pointer-events: none;
			transition: opacity 0.2s ease;
		}
		html               header .head { opacity: 1; }
		html[data-scd="1"] header .head .sponsor-container { opacity: 0; }

		header .head .mirror {
			display: block;
			position: relative;
			left: 50%;
			transform: translateX(-50%);
			width: 1400px;
			max-width: 1600px;
			min-height: 50px;
			height: var(--menu_height);
			margin: 0;
			padding: 0;
			background-color: rgba(112,210,47,0.20);
			background-color: transparent;
		}
		header .head {
			.h-h-item {
				outline: 1px dashed green;
				outline: none;
			}
			.h-h-items {
				display: flex;
				position: relative;
				align-items: flex-start;
				justify-content: flex-end;
				gap: 20px;
				padding-right: calc(var(--menu_height) * 0.25 + 0px);
				width: 100%;
				height: calc(var(--menu_height) * var(--top_menu_item_ratio) * 2);
				background-color:beige;
				background-color:transparent;
			}
			.h-h-items .h-h-item {
			}
			.h-h-items .h-h-item.timer {
				position:relative;
				background-color:yellow;
				background-color:transparent;
				top:50%;
				transform:translateY(-50%);
				margin-right:25px;
			}
			.logo {
				position:absolute;
				top: 0;
				left: 50%;
				transform:translateX(-50%);
				left: 0;
				height: 150px;
				aspect-ratio:19/9;
				transform: scale(var(--logo_zoom_scale));
				transform-origin: left top;
				background-color: rgba(218,187,142,0.2);
				background-color: transparent;
			}
			.logo > a { 
				display: block;
				position: absolute;
				inset:0;
			}
			.logo > a > i {
				display: block;
				position: absolute;
				inset:0;
			}
			.logo > a > i:before {
				content:"";
				display: block;
				position: absolute;
				inset:0;
				background-image: url("../../images/logo/tuzgyujto-konferencia-1soros-feher-szines.webp");
				background-size: 80%;
				background-position: left bottom;
				background-repeat: no-repeat;
			}
			.logo > a > i:after {
				content:"";
				display: block;
				position: absolute;
				inset:0;
				background-image: url("../../images/logo/tuzgyujto-konferencia-feher.webp");
				background-size: 13%;
				background-position: 0% 10%;
				background-repeat: no-repeat;
			}
			.sponsor-container {
				display: flex;
				position: relative;
				float: none;
				margin-right: 0;
				height: calc(var(--menu_height) * var(--top_menu_item_ratio) * 2);
				outline: 1px dashed orange;
				outline: none;
				pointer-events: none;
			}
			.counter {
				display: flex;
				position: relative;
				float: none;
				margin-right: 0;
				height: calc(var(--menu_height) * var(--top_menu_item_ratio));
				align-items: center;
				color: black;
			}
			.search {
				display: flex;
				position: relative;
				float: none;
				height: calc(var(--menu_height) * var(--top_menu_item_ratio));
				align-items: center;
			}
			.sponsor {
				align-content: center;
				background-color: rgba(218,187,142,0.76);
				background-color: transparent;
				white-space: nowrap;
				text-align: left;
				color: white;
				/* color: black; */
				opacity: 0.75;
			}
			.sponsor > em {
				display: inline-block;
				vertical-align: middle;
				font-style:normal;
				font-size: calc(var(--copy_size) * 0.8);
				margin-right: 0.3em;
				white-space: normal;
				text-align: right;
				max-width: 110px;
			}
			.sponsor > em:before { content:"A konferencia támogatója:"}
			.sponsor > a {
				display: inline-block;
				vertical-align: middle;
				text-decoration: none;
			}
			.sponsor > a > i {
				display: block;
				position: relative;
				height: 100%;
				aspect-ratio: 5/1;
				background-color: rgba(187,218,142,0.76);
				background-color: transparent;
				background-image:url(../../images/main-sponsor/flow-alapitvany-1soros-feher.webp);
				/* background-image:url("../../images/main-sponsor/flow-alapitvany-1soros-szines.webp"); */
				background-size: contain;
				z-index: 2;
				background-repeat: no-repeat;
				background-position: center;
				width: 160px;
			}
			.search {}
			.search > a {}
			.search > a > i {}
		}
		/* states */

		html[data-scd="1"] header .h-h-items .h-h-item.timer {
			opacity:0;
			pointer-events:none;
		}


		header .body {
			display: flex;
			position: absolute;
			align-content: center;
			justify-content: center;
			inset:0;
			pointer-events: all;
			z-index: 50;
		}
		header .body .mirror {
			display: block;
			position: relative;
			/* left: 50%; */
			/* transform: translateX(-50%); */
			width: 1400px;
			max-width: 1600px;
			min-height: 50px;
			margin: 0;
			padding: 0;
			background-color: rgba(112,210,47,0.30);
			background-color: transparent;
		}
		header .body {
			nav.top-menu[data-res="desktop"] {
				display: flex;
				position: relative;
				/* justify-content: center; */
				justify-content: flex-start;
				/* margin-left: calc(var(--menu_height) * 0.9 * 2.111); */
				font-size: 0.8rem;
				transition:height 0.2s ease;
				/* width: calc(100% - (var(--menu_height) * 0.9 * 2.111)); */
				align-items: flex-end;
			}
			nav.top-menu[data-template="1"] {}
			nav.top-menu[data-res="desktop"] .menu-items { flex: 1 1 auto; }
			nav.top-menu[data-res="desktop"] .menu-settings {
				display: flex;
				position: absolute;
				right: 0;
				bottom: calc(var(--menu_height) * 0.18);
				align-items: center;
				gap: 0;
				color: #fff;
			}
			nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options {
				display: flex;
				gap: 0;
				background: rgba(0,0,0,0.35);
				border: 1px solid rgba(255,255,255,0.35);
				border-radius: 999px;
				padding: 1px;
				overflow: hidden;
			}
			nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button {
				border: 0;
				background: transparent;
				color: #fff;
				border-radius: 0;
				width: 20px;
				height: 18px;
				display: flex;
				align-items: center;
				justify-content: center;
				padding: 0;
				font-size: var(--copy_size_small);
				font-weight: 800;
				line-height: 1;
				cursor: pointer;
				transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
			}
			nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button + button {
				border-left: 1px solid rgba(255,255,255,0.2);
			}
			nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button:hover {
				background: rgba(255,255,255,0.12);
			}
			nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button.zoom-size-small { font-size: 5px; }
			nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button.zoom-size-medium { font-size: 8px; }
			nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button.zoom-size-large { font-size: 12px; }
			nav.top-menu[data-res="desktop"] ul {
				display: flex;
				flex-direction:row;
				/* justify-content:  space-between; */
				gap: 12px;
				align-items: flex-end;
				height: var(--menu_height);
				margin: 0;
				padding: 0;
				list-style: none;
				transition: height 0.2s ease, transform 0.2s ease;
				margin-right: 20em;
			}
			nav.top-menu[data-res="desktop"] ul li {
				display: flex;
				justify-content: center;
				align-items:center;
				height: calc(var(--menu_height) * 0.3);
			}
			nav.top-menu ul li a {
				display: block;
				color: inherit;
				text-decoration: none;
				position: relative;
				height: inherit;
			}
			nav.top-menu[data-res="desktop"] ul li a:before {
				content:"";
				display: block;
				position: absolute;
				inset:0 -15px;
				border-radius: 5px;
				background-color: var(--highlight_background_color);
				opacity: 0;
				transform:scale(0.8,0.8);
				transition: opacity 0.2s ease, transform 0.2s ease;
				z-index: -1;
			}
			nav.top-menu[data-res="desktop"] ul li:hover a:before {
				opacity: 0.6;
				opacity: 1;
			}
			nav.top-menu ul li a i {
				display: inline-block;
				position: relative;
				top: calc(50% - 0px);
				transform:translateY(-50%);
			}
			nav.top-menu ul li a em {
				display: inline-block;
				position: relative;
				top: 50%;
				transform:translateY(-50%);
				font-style: normal;
				z-index: 2;
			}
		}
		header .body nav.top-menu[data-res="desktop"] {
			li.current a em {
				border-bottom:5px solid var(--brand_orange);
				margin-top: 5px;
				padding-bottom: 5px;
				border-radius: 5%;
			}
		}
		header .body nav.top-menu[data-res="desktop"] ul li[data-label] a em {
			font-size: calc(var(--copy_size) * 1.15);
			/*text-transform: uppercase;*/
			/*letter-spacing: 0.2pt;*/
		}

		html                nav.top-menu[data-res="desktop"] .menu-settings {transition:top 0.3s ease;height: calc(var(--menu_height) * 1);}
		html[data-scd="1"]  nav.top-menu[data-res="desktop"] .menu-settings {top:0px;}
		html[data-scd="-1"] nav.top-menu[data-res="desktop"] .menu-settings {top: calc(var(--menu_height) * 0.25);}
		html[data-tzm="1"] nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button[data-zoom-target="1"],
		html[data-tzm="2"] nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button[data-zoom-target="2"],
		html[data-tzm="3"] nav.top-menu[data-res="desktop"] .menu-settings .menu-settings-options button[data-zoom-target="3"] {
			background: var(--brand_orange);
			box-shadow: inset 0 0 0 1px rgba(255,255,255,0.22);
			transform: none;
		}
		
		html[lang="hu"] header .body nav.top-menu ul {
			li[data-label="history"        ] > a > em:before { content:"Történetünk"; }
			li[data-label="events"         ] > a > em:before { content:"Rendezvényeink"; }
			li[data-label="recommendations"] > a > em:before { content:"Kinek ajánljuk?"; }
			li[data-label="program"        ] > a > em:before { content:"Program"; }
			li[data-label="contributors"   ] > a > em:before { content:"Közreműködők"; }
			li[data-label="partners"       ] > a > em:before { content:"Partnerek"; }
			li[data-label="testimonials"   ] > a > em:before { content:"Rólunk mondták"; }
			li[data-label="gallery"        ] > a > em:before { content:"Galéria"; }
			li[data-label="contact"        ] > a > em:before { content:"Kapcsolat"; }
			li[data-label="tickets"        ] > a > em:before { content:"Jegyek"; }
		}
		html[lang="hu"] header .head .counter > ul > li[data-label="days"]    .suffix:after { content:"nap"; }
		html[lang="hu"] header .head .counter > ul > li[data-label="hours"]   .suffix:after { content:"óra"; }
		html[lang="hu"] header .head .counter > ul > li[data-label="minutes"] .suffix:after { content:"perc"; }
		html[lang="hu"] header .head .counter > ul > li[data-label="seconds"] .suffix:after { content:"másodperc"; }
		html[lang="en"] header .body nav.top-menu ul {
			li[data-label="history"        ] > a > em:before { content:"Our history"; }
			li[data-label="events"         ] > a > em:before { content:"Events"; }
			li[data-label="recommendations"] > a > em:before { content:"Who is it recommended for?"; }
			li[data-label="program"        ] > a > em:before { content:"Program"; }
			li[data-label="contributors"   ] > a > em:before { content:"Contributors"; }
			li[data-label="partners"       ] > a > em:before { content:"Our partners"; }
			li[data-label="testimonials"   ] > a > em:before { content:"Testimonials"; }
			li[data-label="gallery"        ] > a > em:before { content:"Gallery"; }
			li[data-label="contact"        ] > a > em:before { content:"Contact"; }
			li[data-label="tickets"        ] > a > em:before { content:"Tickets"; }
		}
		html[lang="en"] header .head .counter > ul > li[data-label="days"]    .suffix:after { content:"days"; }
		html[lang="en"] header .head .counter > ul > li[data-label="hours"]   .suffix:after { content:"hours"; }
		html[lang="en"] header .head .counter > ul > li[data-label="minutes"] .suffix:after { content:"minutes"; }
		html[lang="en"] header .head .counter > ul > li[data-label="seconds"] .suffix:after { content:"seconds"; }
		
		header .body nav.top-menu ul li[data-label="tickets"] > a { color: var(--brand_yellow); font-weight: 900; }
		header .body nav.top-menu ul li[data-label="tickets"] > a:hover { color: white; color: black; }
		header .body nav.top-menu ul li[data-label="tickets"] > a:before {
			background-color: var(--brand_green);
			background-color: var(--brand_yellow);
		}

		/* states */

		html[data-scd="-1"] {  }
		html[data-scd="1"] {
			--menu_height:var(--menu_height_collapsed);
		}
		html                header .body nav.top-menu[data-res="desktop"] ul li:hover a:before { transform:scale(1,1.5); }
		html[data-scd="-1"] header .body nav.top-menu[data-res="desktop"] ul li:hover a:before {transform: scale(1,1.1);}
		html[data-scd="1" ] header .body nav.top-menu[data-res="desktop"] ul li:hover a:before {transform: scale(1,1.5);}
	
		html               nav.top-menu[data-res="desktop"] ul { transform: translateY(-10%); }
		html[data-scd="1"] nav.top-menu[data-res="desktop"] ul { transform: translateY(-40%); }
		header .head .logo i {
			transition: opacity 0.2s ease;
		}
		html               header .head .logo i:before,
		html               header .head .logo i:after {
			transition: height 0.2s ease, opacity 0.2s ease;
		}
		html               header .head .logo i:before { opacity: 0; }
		html               header .head .logo i:after  { opacity: 1; }
		html[data-scd="-1"] header .head .logo i:before { opacity: 1; }
		html[data-scd="-1"] header .head .logo i:after  { opacity: 0; }
		html[data-scd="1" ] header .head .logo i:before { opacity: 0; }
		html[data-scd="1" ] header .head .logo i:after  { opacity: 1; }
		html[data-scd="1" ] header .body  nav.top-menu[data-res="desktop"] {
			justify-content: center;
			justify-content: flex-start;
			margin-left: calc(var(--menu_height) * 0.5 * 2.111);
		}

		/* responsives (desktop) */

		/* XXXXL   */ @media screen and (min-width:1600px)                          {
			header .head .mirror { width: 1400px; max-width: 1600px; }
			header .body .mirror { width: 1400px; max-width: 1600px; }		
			header .body nav.top-menu[data-res="desktop"] {margin-left:calc(var(--menu_height) * 0.9 * 2.111);}
			header .body nav.top-menu[data-res="desktop"] ul {/* margin-right: 30em; */}
			header .stripe { width: calc(400px + 50vw); }
			header .head .logo {height: 150px;aspect-ratio:19/9;top: 0;}
		}
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {
			header .head .mirror {width: 1200px;max-width: 1400px;}
			header .body .mirror { width: 1200px; max-width: 1400px;}
			header .body nav.top-menu[data-res="desktop"] { margin-left:calc(var(--menu_height) * 0.9 * 2.111); }
			header .body nav.top-menu[data-res="desktop"] ul {margin-right: 15em;}
			header .stripe { width: calc(400px + 50vw); }
			header .head .logo {height: 150px;aspect-ratio:19/9;top: 0;}		
		}
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {
			header .head .mirror { width: 1000px; max-width: 1200px;}
			header .body .mirror {width: 1000px;max-width: 1200px;}
			header .body nav.top-menu[data-res="desktop"] { margin-left:calc(var(--menu_height) * 0.9 * 2.111); }
			header .body nav.top-menu[data-res="desktop"] ul {margin-right: 0em;--copy_size: 13px;}
			header .stripe {width: calc(400px + 40vw);}
			header .head .logo {height: 150px;aspect-ratio:19/9;top: 0;}		
		}
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {
			header .head .mirror { width: 900px; max-width: 1100px;}
			header .body .mirror { width: 900px; max-width: 1100px;}
			header .body nav.top-menu[data-res="desktop"] { margin-left:calc(var(--menu_height) * 0.9 * 2.111); }
			header .body nav.top-menu[data-res="desktop"] ul {margin-right: 0;--copy_size: 12px;}
			header .stripe {width: calc(400px + 40vw);}
			header .head .logo {height: 150px;aspect-ratio:19/9;top: 0;}		
		}
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {
			header .head .mirror { width: 800px; max-width: 1000px;}
			header .body .mirror { width: 800px; max-width: 1000px;}
			header .body nav.top-menu[data-res="desktop"] {margin-left: calc(var(--menu_height) * 0.9 * 1.4);}
			header .body nav.top-menu[data-res="desktop"] ul {margin-right: -60px;--copy_size: 10px;}
			header .stripe {width: calc(400px + 30vw);}
			header .head .logo {height: 101px;aspect-ratio:19/9;top: 35px;}		
		}

	}
	/*   TABLET and MOBILE     */ @media screen and (min-width:   0px) and (max-width: 959.8px) {
	}
	/*   TABLET                */ @media screen and (min-width: 520px) and (max-width: 959.8px) {
	}
	/*   TABLET and MOBILE     */ @media screen and (min-width:   0px) and (max-width: 959.8px) {
		
		.top-menu[data-res="desktop"] { display: none; }
		.top-menu[data-res="mobile" ] {display: block;}

		header {
			/* position: fixed; */
			z-index: 100;
			left: 0;
			right: 0;
			height: 65px;
			/* pointer-events: none; */
			/* background-color: yellow; */
		}
		header .head {
			display: block;
			position: absolute;
			inset: 0;
			z-index: 60;
			pointer-events: none;
		}
		header .head .mirror {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 100%;
			height: 100%;
			min-height: 65px;
			box-sizing: border-box;
			padding: 0 60px 0 10px;
		}
		header .head .h-h-items {
			display: flex;
			flex-wrap: nowrap;
			align-items: center;
			justify-content: flex-end;
			gap: 10px;
			width: auto;
			min-width: 0;
			height: 100%;
			flex: 1 1 auto;
			position: relative;
		}
		header .head .h-h-items .h-h-item.logo {
			position: relative;
			left: 0;
			top: 0;
			height: 45px;
			flex: 0 0 auto;
			transform: scale(var(--logo_zoom_scale));
			transform-origin: left center;
		}
		header .head .h-h-items .h-h-item.timer {
			position: relative;
			top: 0;
			transform: none;
			margin: 0;
			flex: 0 0 auto;
		}
		header .head .h-h-items .h-h-item.sponsor-container {
			flex: 0 0 auto;
		}
		header .head .h-h-items .h-h-item.search {
			flex: 0 0 auto;
		}
		header .head .h-h-items a,
		header .head .h-h-items .h-h-item {
			pointer-events: auto;
		}

		header nav.top-menu {
			position: relative;
			/* height: inherit; */
			outline: 1px solid orange;
			outline: none;
			/* backdrop-filter:blur(5px); */
			/* box-shadow: 0 5px 15px 0 rgba(0,0,0,0.2); */
		}
		header nav.top-menu:before {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			display: none;
		}

		/* toggle menu */

		header nav.top-menu label.show-menu,
		header nav.top-menu label.hide-menu {
			z-index: 3;
			position: fixed;
			right: 0;
			top: 0;
			opacity: 1;
			width: 100px;
			height: 100px;
		}
		header nav.top-menu label.show-menu {z-index:4;transition: opacity 0.3s ease 0.3s;cursor: pointer;pointer-events: all;}
		header nav.top-menu label.hide-menu {z-index: 2;transition: opacity 0.3s ease 0.3s;}

		header:has(label.show-menu input:checked) label.show-menu {opacity: 0;pointer-events: none;}
		header:has(label.hide-menu input:checked) label.hide-menu { opacity: 0; pointer-events: none; }

		header nav.top-menu label.show-menu > input {
			position: absolute;
			width: inherit;
			height: inherit;
			padding: 0;
			border: 0;
			opacity: 0;
			appearance: none;
			border: none;
			outline: none;
			width: 1px;
			height: 1px;
			margin: -1px;
			overflow: hidden;
			top: -10px;
		}
		header nav.top-menu label.hide-menu > input {
			position: absolute;
			width: 1px;
			height: 1px;
			padding: 0;
			border: 0;
			appearance: none;
			border: none;
			outline: none;
			margin: -1px;
			overflow: hidden;
			top: -10px;
		}
		header i.toggle-icon {
			display: block;
			position: fixed;
			right: 15px;
			top: 15px;
			z-index: 20;
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
			width: 32px;
			height: 32px;
			width: 50px;
			height: 50px;
			background-size: 60%;
			outline: 1px solid orange;
			outline: none;
			pointer-events: none;
			background-color: var(--brand_darkblue);
			border-radius: 50px;
			box-shadow: 0 0 15px 1px white;
			background-color: transparent;
			backdrop-filter: blur(15px);
		}
		header:has(label.hide-menu input:checked) i.toggle-icon { opacity:1; background-image:url("../../images/assets/white/menu-show.webp?v=2"); }
		header:has(label.show-menu input:checked) i.toggle-icon { 
			opacity:1;
			background-image:url("../../images/assets/white/menu-hide.webp?v=2"); 
			box-shadow:none;
		}

		header nav.top-menu > .menu-items {
			display: block;
			list-style: none;
			margin: 0;
			padding: 0;
			position: fixed;
			top: 0;
			right: 0;
			bottom: 0;
			height: 100vh;
			height: 100dvh;
			height: 100svh;
			width: 100vw;
			z-index: 1;
			pointer-events: none;
			will-change:transform;
			transition:transform 500ms cubic-bezier(.2,.8,.2,1), opacity 300ms linear;
			/* left: 20px; */
			/* top: 20px; */
			/* width: calc(100% - 20px); */
			/* height: calc(100% - 40px); */
			/* box-shadow: 0 0 0 5px var(--brand_darkblue); */
			/* border-radius:15px; */
		}
		header nav.top-menu > .menu-items > .background {
			background-color: var(--brand_darkblue);
			/*box-shadow: -15px 0 30px 3px rgba(23,94,150,0.64);*/
			pointer-events: none;
			position: absolute;
			z-index: 10;
			/* top: -60px; */
			bottom: 0px;
			right: 0;
			width: inherit;
			inset: 0px;
			/* background-color: orange; */
		}
		/* menu shadow: GPU */
		
		header nav.top-menu > .menu-items > .background::after {
			content:"";
			position:absolute;
			top:0; bottom:0;
			left:0;
			width:100%;
			background-color: var(--brand_darkblue);
			pointer-events:none;
			filter:drop-shadow(-24px 0 20px rgba(0,0,0,.35));
			opacity:0;
			transition:opacity 500ms;
		}

		/* language switcher */

		.language-switcher {
			display:none;
		}

		/* menu position */

		header nav.top-menu .menu-items { transform:translateZ(0) translateX(calc(100% + 50px)); }
		header:has(label.show-menu input:checked) .menu-items { transform:translateZ(0) translateX(calc(  0% +  0px)); }
		header:has(label.show-menu input:checked) .menu-items .background::after{ opacity:1; }

		header:has(label.show-menu input:checked) nav.top-menu label.show-menu {
			width:100%;
			height: 100px;
			background-color: rgb(205 160 83 / 67%);
			background-color: transparent;
			/* pointer-events: all; */
		}
		header:has(label.show-menu input:checked) nav.top-menu label.hide-menu {
			width:100%;
			height: 100px;
			background-color: rgba(179,179,129,0.67);
			background-color: transparent;
			cursor: pointer;
		}
		header nav.top-menu > .menu-items > .background > ul {
			display: inline-block;
			z-index: 3;
			position: relative;
			left: calc(50% - 0vw);
			top: calc(50% - 50px);
			transform: translate(-50%,-50%);
			pointer-events: all;
			width: auto;
			list-style: none;
			margin: 0;
			/* padding: 25px 0 0 0; */
			color: white;
			text-align: center;
		}
		header nav.top-menu > .menu-items > .background > ul > li {
			padding: 0;
			margin: 0;
			list-style: none;
			color: inherit;
		}
		header nav.top-menu > .menu-items > .background > ul > li > a {
			text-decoration: none;
			display: block;
			position: relative;
			left: 0;
			color: white;
			transition: left .3s ease, opacity .3s ease;
		}
		header nav.top-menu > .menu-items > .background > ul > li > a:hover {
			/* left: -15px; */
			opacity: 1;
		}	
		header nav.top-menu > .menu-items > .background > ul > li > a > i {
			display: block;
			position: relative;
			width: var(--icon_size);
			height:var(--icon_size);
			margin-bottom: calc(-1 * var(--icon_size));
			pointer-events: none;
			display: none;
		}
		header nav.top-menu > .menu-items > .background > ul > li > a > em {
			display: block;
			position: relative;
			margin: 0;
			padding: 0;
			color: inherit;
			font-size: var(--copy_size_big);
			line-height: calc(var(--copy_line_height_big) * 2);
			/* text-transform: uppercase; */
			/* pointer-events: none; */
			font-style: normal;
		}
		header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings {
			margin-top: 25px;
			padding-top: 15px;
			border-top: 1px solid rgba(255,255,255,0.25);
		}
		header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options {
			display: flex;
			justify-content: center;
			gap: 0;
			background: rgba(0,0,0,0.35);
			border: 1px solid rgba(255,255,255,0.35);
			border-radius: 999px;
			padding: 1px;
			overflow: hidden;
		}
		header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button {
			border: 0;
			background: transparent;
			color: #fff;
			border-radius: 0;
			width: 21px;
			height: 19px;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 0;
			font-size: var(--copy_size_small);
			font-weight: 800;
			line-height: 1;
			transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
		}
		header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button + button {
			border-left: 1px solid rgba(255,255,255,0.2);
		}
		html[data-tzm="1"] header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button[data-zoom-target="1"],
		html[data-tzm="2"] header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button[data-zoom-target="2"],
		html[data-tzm="3"] header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button[data-zoom-target="3"] {
			background: var(--brand_orange);
			box-shadow: inset 0 0 0 1px rgba(255,255,255,0.22);
			transform: none;
		}
		header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button.zoom-size-small { font-size: 5px; }
		header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button.zoom-size-medium { font-size: 8px; }
		header nav.top-menu > .menu-items > .background > ul > li.menu-zoom-settings .menu-zoom-options button.zoom-size-large { font-size: 12px; }

		html[lang="hu"] header .body nav.top-menu ul {
			li[data-label="history"        ] > a > em:before { content:"Történetünk"; }
			li[data-label="events"         ] > a > em:before { content:"Rendezvényeink"; }
			li[data-label="recommendations"] > a > em:before { content:"Kinek ajánljuk?"; }
			li[data-label="program"        ] > a > em:before { content:"Program"; }
			li[data-label="contributors"   ] > a > em:before { content:"Közreműködők"; }
			li[data-label="partners"       ] > a > em:before { content:"Partnereink"; }
			li[data-label="testimonials"   ] > a > em:before { content:"Rólunk mondták"; }
			li[data-label="gallery"        ] > a > em:before { content:"Galéria"; }
			li[data-label="contact"        ] > a > em:before { content:"Kapcsolat"; }
			li[data-label="tickets"        ] > a > em:before { content:"Jegyek"; }
		}
		html[lang="en"] header .body nav.top-menu ul {
			li[data-label="history"        ] > a > em:before { content:"Our history"; }
			li[data-label="events"         ] > a > em:before { content:"Events"; }
			li[data-label="recommendations"] > a > em:before { content:"Who is it recommended for?"; }
			li[data-label="program"        ] > a > em:before { content:"Program"; }
			li[data-label="contributors"   ] > a > em:before { content:"Contributors"; }
			li[data-label="partners"       ] > a > em:before { content:"Our partners"; }
			li[data-label="testimonials"   ] > a > em:before { content:"Testimonials"; }
			li[data-label="gallery"        ] > a > em:before { content:"Gallery"; }
			li[data-label="contact"        ] > a > em:before { content:"Contact"; }
			li[data-label="tickets"        ] > a > em:before { content:"Tickets"; }
		}
	}
	/*   MOBILE                */ @media XXXscreen and (min-width:   0px) and (max-width: 519.8px) {
		
		.top-menu[data-res="desktop"] { display: none; }
		.top-menu[data-res="mobile" ] { display: block; height: 100vh; pointer-events: none; }

		header {
			/* position: fixed; */
			z-index: 100;
			left: 0;
			right: 0;
			/* height: 65px; */
			pointer-events: none;
		}

		header nav.top-menu {
			position: relative;
			/* height: inherit; */
			outline: 1px solid orange;
			outline: none;
			/* backdrop-filter:blur(5px); */
			/* box-shadow: 0 5px 15px 0 rgba(0,0,0,0.2); */
			/* pointer-events: none; */
		}
		header nav.top-menu:before {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			display: none;
		}

		/* toggle menu */

		header nav.top-menu label.show-menu,
		header nav.top-menu label.hide-menu {
			z-index: 3;
			position: fixed;
			right: 0;
			top: 0;
			opacity: 1;
			width: 60px;
			height: 60px;
		}
		header nav.top-menu label.show-menu {z-index:4;transition: opacity 0.3s ease 0.3s;cursor: pointer;pointer-events: all;}
		header nav.top-menu label.hide-menu {z-index:1;transition: opacity 0.3s ease 0.3s;}

		header:has(label.show-menu input:checked) label.show-menu {opacity: 0;pointer-events: none;}
		header:has(label.hide-menu input:checked) label.hide-menu { opacity: 0; pointer-events: none; }

		header nav.top-menu label.show-menu > input,
		header nav.top-menu label.hide-menu > input {
			position: absolute;
			width: 1px;
			height: 1px;
			margin: -1px;
			padding: 0;
			border: 0;
			opacity: 0;
			overflow: hidden;
			clip: rect(0 0 0 0);
			clip-path: inset(50%);
			appearance: none;
		}
		header i.toggle-icon {
			display: block;
			position: fixed;
			right: 15px;
			top: 15px;
			z-index: 20;
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
			width: 32px;
			height: 32px;
			width: 65px;
			height: 65px;
			right: 0;
			top: 0;
			background-size: 70%;
			outline: 1px solid orange;
			outline: none;
			pointer-events: none;
			background-color: var(--brand_darkblue);
		}
		header:has(label.hide-menu input:checked) i.toggle-icon { opacity:1; background-image:url("../../images/assets/white/menu-show.webp?v=2"); }
		header:has(label.show-menu input:checked) i.toggle-icon { opacity:1; background-image:url("../../images/assets/white/menu-hide.webp?v=2"); }

		header nav.top-menu > .menu-items {
			display: block;
			list-style: none;
			margin: 0;
			padding: 0;
			position: fixed;
			top: 65px;
			right: 0;
			height: calc(100vh - 65px);
			width: 100vw;
			z-index: 1;
			/* pointer-events: none; */
			will-change:transform;
			transition:transform 500ms cubic-bezier(.2,.8,.2,1), opacity 300ms linear;
		}
		header nav.top-menu > .menu-items > .background {
			background-color: var(--brand_darkblue);
			/*box-shadow: -15px 0 30px 3px rgba(23,94,150,0.64);*/
			pointer-events: none;
			position: absolute;
			z-index: 10;
			/* top: -60px; */
			bottom: 0px;
			right: 0;
			width: inherit;
			inset: 0;
		}
		/* menu shadow: GPU */
		
		header nav.top-menu > .menu-items > .background::after {
			content:"";
			position:absolute;
			top:0; bottom:0;
			left:0;
			width:100%;
			background-color: var(--brand_darkblue);
			pointer-events:none;
			filter:drop-shadow(-24px 0 20px rgba(0,0,0,.35));
			opacity:0;
			transition:opacity 500ms;
		}

		/* menu position */

		header nav.top-menu .menu-items { transform:translateZ(0) translateX(calc(100% + 50px)); }
		header:has(label.show-menu input:checked) .menu-items { transform:translateZ(0) translateX(calc(  0% +  0px)); }
		header:has(label.show-menu input:checked) .menu-items .background::after{ opacity:1; }

		header:has(label.show-menu input:checked) nav.top-menu label.show-menu {
			width:100%;
			height: calc(100% - 0px);
			background-color: rgba(179,179,129,0.67);
			background-color: transparent;
			/* pointer-events: all; */
		}
		header:has(label.show-menu input:checked) nav.top-menu label.hide-menu {
			width:100%;
			height: 100vh;
			background-color: rgba(179,179,129,0.67);
			background-color: transparent;
			cursor: pointer;
		}
		header nav.top-menu > .menu-items > .background > ul {
			display: inline-block;
			z-index: 3;
			position: relative;
			left: calc(50% - 0vw);
			top: calc(50% - 50px);
			transform: translate(-50%,-50%);
			pointer-events: all;
			width: auto;
			list-style: none;
			margin: 0;
			/* padding: 25px 0 0 0; */
			color: white;
			text-align: center;
		}
		header nav.top-menu > .menu-items > .background > ul > li {
			padding: 0;
			margin: 0;
			list-style: none;
			color: inherit;
		}
		header nav.top-menu > .menu-items > .background > ul > li > a {
			text-decoration: none;
			display: block;
			position: relative;
			left: 0;
			color: white;
			transition: left .3s ease, opacity .3s ease;
		}
		header nav.top-menu > .menu-items > .background > ul > li > a:hover {
			/* left: -15px; */
			opacity: 1;
		}	
		header nav.top-menu > .menu-items > .background > ul > li > a > i {
			display: block;
			position: relative;
			width: var(--icon_size);
			height:var(--icon_size);
			margin-bottom: calc(-1 * var(--icon_size));
			pointer-events: none;
			display: none;
		}
		header nav.top-menu > .menu-items > .background > ul > li > a > em {
			display: block;
			position: relative;
			margin: 0;
			padding: 0;
			color: inherit;
			font-size: var(--copy_size_big);
			line-height: calc(var(--copy_line_height_big) * 2);
			/* text-transform: uppercase; */
			pointer-events: none;
		}

		html[lang="hu"] header .body nav.top-menu ul {
			li[data-label="history"        ] > a > em:before { content:"Történetünk"; }
			li[data-label="events"         ] > a > em:before { content:"Rendezvényeink"; }
			li[data-label="recommendations"] > a > em:before { content:"Kinek ajánljuk?"; }
			li[data-label="program"        ] > a > em:before { content:"Program"; }
			li[data-label="contributors"   ] > a > em:before { content:"Közreműködők"; }
			li[data-label="partners"       ] > a > em:before { content:"Partnereink"; }
			li[data-label="testimonials"   ] > a > em:before { content:"Rólunk mondták"; }
			li[data-label="gallery"        ] > a > em:before { content:"Galéria"; }
			li[data-label="contact"        ] > a > em:before { content:"Kapcsolat"; }
			li[data-label="tickets"        ] > a > em:before { content:"Jegyek"; }
		}
		html[lang="en"] header .body nav.top-menu ul {
			li[data-label="history"        ] > a > em:before { content:"Our history"; }
			li[data-label="events"         ] > a > em:before { content:"Events"; }
			li[data-label="recommendations"] > a > em:before { content:"Who is it recommended for?"; }
			li[data-label="program"        ] > a > em:before { content:"Program"; }
			li[data-label="contributors"   ] > a > em:before { content:"Contributors"; }
			li[data-label="partners"       ] > a > em:before { content:"Our partners"; }
			li[data-label="testimonials"   ] > a > em:before { content:"Testimonials"; }
			li[data-label="gallery"        ] > a > em:before { content:"Gallery"; }
			li[data-label="contact"        ] > a > em:before { content:"Contact"; }
			li[data-label="tickets"        ] > a > em:before { content:"Tickets"; }
		}
	}