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

:root {
	--icon_size:50px;
	--extralightblue:#B0F1FF;
	--lightblue:#78CBFF;
	--blue:#0083e7;
	--blue_dim:#0083e755;
	--darkblue:#0A4E98;
	--green:#91D34A;
	--lightgreen:#B4F66D;
	--label_size: 80px;
	--input_size: calc(100% - var(100px));
	--input_size: calc(100% - var(--label_size));0px));
}

	/*										*/
	/*	Shared								*/
	/*										*/

		html,body {
			width: 100%;
			min-height: 100%;
			margin: 0;
			padding: 0;
			font-family: "Exo 2", sans-serif;
			font-optical-sizing: auto;
			font-size: 15px;
			line-height: 22px;
			overflow-x:hidden;
		}
		html {
			background-color:var(--blue);
			overscroll-behavior: contain;
			overflow-x: clip;			
			user-select: none;
			-webkit-user-select:none;
			-moz-user-select:none;
			-ms-user-select:none;
			-o-user-select:none;
		}
		body {
			max-width: 100%;
			min-height: inherit;
			overflow-y: hidden;
		}
		
		h1,h2,h3,h4,h5,h6 {
			font-weight: 600; /* semibold */
			font-style: normal;
			margin: 0; padding: 0;
		}
		.inset p,
		.inset ul,
		.inset ol,
		.inner-mirror p,
		.inner-mirror ul,
		.inner-mirror ol {
			font-weight: 300;
			color: var(--extralightblue);
			margin: 0;
		}
		i,em { font-style: normal; }

		.mirror {
			margin: 0 auto;
		}
		.background {
			color: white;
			padding-block: 70px;
		}
		figure, i, div {
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
		}
		ul,ol, ul li, ol li { list-style: none; margin: 0; padding: 0; }
		
		/*										*/
		/*	Columns								*/
		/*										*/
		
		.columns {
			font-size: 0;
			line-height: 0;
		}
		.columns .column {
			display: inline-block;
			vertical-align: top;
			font-size: 1rem;
			line-height: 1.5;
		}
		.columns .column .inner-mirror {
			padding: 0 15px;
			outline: 1px dotted orange;
			outline: none;
		}
		
		.columns[data-rule="between"] .column { position: relative; }
		.columns[data-rule="between"] .column:first-child:before {
			content:"";
			display: block;
			position: absolute;
			width: 2px;
			height: calc(100% + 30px);
			margin: -15px 0 0 calc(100% + 25px);
			background-color: var(--blue);
		}
		.columns[data-rule="between"] .column:last-child:before {
			content:"";
			display: block;
			position: absolute;
			width: 2px;
			height: calc(100% + 30px);
			margin: -15px 0 0 -25px;
			background-color: var(--blue);
		}
		
		.columns .column[data-rule="above"] { position: relative; }
		.columns .column[data-rule="above"]:before {
			content:"";
			display: inline-block;
			vertical-align: middle;
			position: absolute;
			width: 2px;
			height: calc(100% + 30px);
			margin: -15px 0 0 -25px;
			background-color: var(--blue);
		}
		.columns .column[data-rule="below"] { position: relative; }
		.columns .column[data-rule="below"]:before {
			content:"";
			display: inline-block;
			vertical-align: middle;
			position: absolute;
			width: 2px;
			height: calc(100% + 30px);
			margin: -15px 0 0 -25px;
			background-color: var(--blue);
		}
		
		.columns[data-split="1-1"] .column { width: 50%; }
		.columns[data-split="1-2"] .column:nth-child(1) { width: 33.3%; }
		.columns[data-split="1-2"] .column:nth-child(2) { width: 66.6%; }

		.columns[data-split="1-1"][data-gap="1"] .column { width: calc(50% - 50px); }
		.columns[data-split="1-1"][data-gap="1"] .column:first-child { margin-right: 50px; }

	/*										*/
	/*	Blocks								*/
	/*										*/

		.framed {
			border:2px solid white;
			border-radius: 20px;
		}
		.hash-placeholder {
			display: block;
			position: relative;
			width: 100%;
			height: 1px;
			margin: 0 0 -1px 0;
			top: -65px;
			background-color: orange;
			background-color: transparent;
			pointer-events: none;
		}
		.grid {
			padding: 30px 40px 30px 50px;
		}
		.grid > ul {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: repeat(2, 1fr);
			gap: 50px 30px;
			margin: 0;
			padding: 0;
		}
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) { .grid > ul { grid-template-columns: repeat(2, 1fr); } }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) { .grid > ul { grid-template-columns: repeat(2, 1fr); } }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { .grid > ul { grid-template-columns:none; grid-template-rows: none; display: block; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {}
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {  }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  }
		

	/*										*/
	/* Forms 								*/
	/*										*/

		.form {
			display: block;
			position: relative;
			/* background-color: #F0F0F5; */
			border-radius: 5px;
			padding: 15px 25px 15px 25px;
			margin: 15px 0 0 0;
			width: calc(100% - 0px);
			font-family: "Exo 2", sans-serif;
			font-weight: normal;
			font-style: normal;
		}
		.form-elements {font-size: 0;line-height: 0;margin: 0;padding: 0;text-align: left;}
		.form-element {
			font-size: 0;
			line-height: 0;
			margin: 0;
			padding: 0;
			position: relative;
		}
		.form-element .form-label {
			display: block;
			position: relative;
			height: 40px;
			margin-bottom: -40px;
			font-size: 1.3rem;
			line-height: 1.2;
		}
		.form-element .form-label em {
			display: block;
			font-style: normal;
		}
		.form-element .form-label em:hover {
			cursor: context-menu;
		}
		.form-element .form-value {
			display: inline-block;
			vertical-align: top;
			font-size: 0; line-height: 0;
			margin: 0; padding: 0;
		}
		.form .progress {
			position: absolute;
			inset:0;
			background-color: rgba(255,255,255,0.7);
			z-index: 999;
			backdrop-filter:blur(5px);
		}
		.form .progress:before,
		.form .progress:after {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			background-repeat: no-repeat;
			background-position: center center;
			mix-blend-mode:multiply
		}
		.form .progress:before { background-size: 100px; background-image: url("../../images/form/progress-forward.svg" ); animation: processing_forward  2.5s infinite; animation-timing-function:linear; }
		.form .progress:after  { background-size: 100px; background-image: url("../../images/form/progress-backward.svg"); animation: processing_backward 2.5s infinite; animation-timing-function:linear; }

		@keyframes processing_forward {
			from	{ transform:rotate(0deg);  }
			to		{ transform:rotate(360deg) }
		}
		@keyframes processing_backward {
			from	{ transform:rotate(360deg);  }
			to		{ transform:rotate(0deg) }
		}
		/* states */

			form[name="registration"]                    .progress { display: none; }
			form[name="registration"][data-progress="1"] .progress { display: block; }


			.form .progress .message {}
			.form .progress .message i {}
			.form .progress .message em {}
			.form .form-label {}
			.form .form-element[data-type="text1row"] input {}
			.form .form-element[data-type="text3rows"] textarea {}
			.form .form-element[data-type="radios"] label {
				display: block;
			}

		/* gaps */

			.form .form-element[data-type="copy"][data-gap_before="0"]  { margin-top:0px; }
			.form .form-element[data-type="copy"][data-gap_before="10"] { margin-top:10px; }
			.form .form-element[data-type="copy"][data-gap_before="15"] { margin-top:15px; }
			.form .form-element[data-type="copy"][data-gap_before="25"] { margin-top:25px; }
			.form .form-element[data-type="copy"][data-gap_after="0"]  { margin-bottom:0px; }
			.form .form-element[data-type="copy"][data-gap_after="10"] { margin-bottom:10px; }
			.form .form-element[data-type="copy"][data-gap_after="15"] { margin-bottom:15px; }
			.form .form-element[data-type="copy"][data-gap_after="25"] { margin-bottom:25px; }
		
		/* defaults */
		
			form[name="registration"] {
				padding-bottom: 10px;
			}
			.form .form-label { text-align: right; }
			.form .form-label em { display: block; padding:0 10px 0 0; font-style: normal;}
			.form .form-value { display: inline-block; }
			.form .form-value em {font-style: normal;color: var(--blue);}
			.form .form-element[data-type="text1row"] input,
			.form .form-element[data-type="text1row"] textarea,
			.form .form-element[data-type="text3rows"] textarea,
			.form .form-element[data-type="text5rows"] textarea,
			.form .form-element[data-type="text7rows"] textarea,
			.form .form-element[data-type="text9rows"] textarea,
			.form .form-element[data-type="text11rows"] textarea,
			.form .form-element[data-type="text13rows"] textarea,
			.form .form-element[data-type="text15rows"] textarea,
			.form .form-element[data-type="text17rows"] textarea,
			.form .form-element[data-type="text19rows"] textarea,
			.form .form-element[data-type="select"] select {
				border: 1px solid #aeaed2;
				margin: 0 -1px 0px -1px;
				padding: 10px 30px 10px 10px;
				font-family: "Exo 2", sans-serif;
				font-weight: normal;
				/* font-size: 1.3rem; */
				/* line-height: 1.2; */
				background-color: white;
				/* color:var(--blue); */
				outline: none;
				width: calc(100% - 40px);
				height: 20px;
				border-radius: 5px;
			}
			.form .form-element[data-type="text3rows"],
			.form .form-element[data-type="text5rows"],
			.form .form-element[data-type="text7rows"],
			.form .form-element[data-type="text9rows"],
			.form .form-element[data-type="text11rows"],
			.form .form-element[data-type="text13rows"],
			.form .form-element[data-type="text15rows"],
			.form .form-element[data-type="text17rows"],
			.form .form-element[data-type="text19rows"] textarea {margin-bottom: 10px;}
			
			.form .form-element[data-type="checkbox"] input,
			.form .form-element[data-type="checkboxes"] input,
			.form .form-element[data-type="radios"] input,
			.form .form-element[data-type="select"] input {
			}
			.form .form-break { display: block; width: 100%; height: 20px; }
			
			.form .form-element[data-type="checkbox"] .form-value label { margin-right: 10px; }
			.form .form-elements .form-element[data-input_size="100"] .form-value {width: var(--input_size);margin-left: var(--label_size);}
			
			
		/* default font size */

			.form .form-label em,
			.form .form-value input,
			.form .form-value textarea,
			.form .form-value select,
			.form .form-value i,
			.form .form-value em,
			.form .form-value .placeholder {
				font-size: 1.2rem;
				line-height: 1.2;
			}
			
		/* states */
			
			.form .form-element[data-label_size="0"] .form-label {display: none;}
			
		/* mandatory sign */

			.form .form-element[data-type="text1row"][data-mandatory="1"] .form-value:before {
				content:"*";
				display: block;
				float: right;
				color: #BF0000;
				position: relative;
				width: 40px;
				height: 40px;
				margin: 0 0 -40px 0;
				left: -3px;
				top: 3px;
				text-align: right;
				pointer-events: none;
				outline: 1px solid blue;
				outline: none;
				font-size: 12px;
				line-height: 1.2;
				float: left;
				text-align: left;
				left: -10px;
				top: 8px;
			}
			.form .form-element[data-type="text1row"][data-mandatory="1"]                   .form-value .input-field { transition: background-color 0.6s ease; }
			.form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="1"] .form-value .input-field,
			.form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="2"] .form-value .input-field { background-color: rgba(255,0,0,0.025); }
			.form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="1"] .form-value:before,
			.form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="2"] .form-value:before {
				left: 7px;
				width: 100%;
				font-size: 1rem;
			}
			html[lang="hu"] .form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="1"] .form-value:before { content:"Kérjük, töltsd ki ezt a mezőt!"; }
			html[lang="en"] .form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="1"] .form-value:before { content:"Please fill this field!"; }
			
			html[lang="hu"] .form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="2"] .form-value:before { content:"A jelszavak nem egyeznek!"; }
			html[lang="en"] .form .form-element[data-type="text1row"][data-mandatory="1"][data-invalid="2"] .form-value:before { content:"Passwords are different!"; }

		/* group */

			/* titles */
			
				.form .form-element[data-type="group"] { margin-top: 15px; position: relative; z-index: 50; }
				.form .form-element[data-type="group"]:first-child { margin-top: 0px; }
				.form .form-element[data-type="group"] h2 {
					display: inline-block;
					font-family: "Exo 2", sans-serif;
					font-weight: 400;
					font-size: 1.8rem;
					line-height: 1.3;
					color:var(--blue);
					margin: 0px 0 10px 0;
				}
				.form .form-element[data-type="group"] h2 .counter {
					display: inline-block;
					position: relative;
					top: -1px;
					font-size: .55em;
					line-height: 1.11em;
					width: auto;
					height: 1em;
					padding: 1px 5px;
					margin-left: 5px;
					background-color: var(--blue);
					color: white;
					border-radius: 15px;
					opacity: 0.5;
				}
				.form .form-element[data-type="group"] h2 .counter:empty { display: none; }
				
				
			/* copy */
			
				.form .form-element[data-type="copy"] {}
				.form .form-element[data-type="copy"] .form-label {}
				.form .form-element[data-type="copy"] .form-value { margin-bottom: 10px; }
				.form .form-element[data-type="copy"] .form-value * {
					font-size: 1.3rem;
					line-height: 1.2;
				}
				
				.form .form-element[data-type="copy"] .form-label { }
				.form .form-element[data-type="copy"] {margin: 0 0 5px 0;}
				.form .form-element[data-type="copy"] p {
					display: block;
					font-family: "Exo 2", sans-serif;
					font-weight: normal;
					font-size: 1.3rem;
					line-height: 1.2;
					color:var(--brand_gray);
					margin: 0;
				}
				.form .form-element[data-type="copy"] p b,
				.form .form-element[data-type="copy"] p strong {
					font-family: "Exo 2", sans-serif;
				}
				
				

			/* wrapper */
		
				.form-element-wrapper {}
				.form-element-wrapper[data-align="right"] { text-align: right; }

			/* select */

				.form .form-element[data-type="select"] select {
					box-sizing: content-box;
					appearance:none;
				}
				.form .form-element[data-type="select"] .form-label em { padding-top:13px; }
				.form .form-element[data-type="select"] .form-value select ~ i {
					display: block;
					float: right;
					position: relative;
					width:          30px;
					height:         40px;
					margin-bottom: -40px;
					text-align: center;
					top: -40px;
					font-size: 20px;
					line-height: 40px;
					pointer-events: none;
				}
				.form .form-element[data-type="select"] .form-value select[disabled] ~ i { display: none; }

				.form .form-element[data-type="select"] .form-value select ~ i:before { content:"\EBA2"; }
				.form .form-element[data-type="select"] .form-value select ~ .placeholder {
					display: block;
					position: absolute;
					font-size: 1.3rem;
					line-height: 25px;
					height: 25px;
					margin-bottom: -25px;
					text-indent: 10px;
					transform: translateY(calc(-100% - 2px));
					pointer-events: none;
					color: #AAAAAA;
				}
			
			/* states */
			
				.form .form-element[data-type="select"] select       {font-size: 1.3rem;}
				.form .form-element[data-type="select"][data-selected="0"] .form-value select ~ .placeholder { opacity: 1; }
				.form .form-element[data-type="select"][data-selected="1"] .form-value select ~ .placeholder { opacity: 0; }
			

			/* textrows */

				.form .form-element {
					display: inline-block;
				}
				.form .form-element[data-input_size="100"] {
					width: calc(var(--input_size) + var(--label_size));
				}
				.form .form-element[data-type="text1row"]  .form-label em,
				.form .form-element[data-type="text3rows"] .form-label em,
				.form .form-element[data-type="text5rows"] .form-label em,
				.form .form-element[data-type="text7rows"] .form-label em,
				.form .form-element[data-type="text9rows"] .form-label em,
				.form .form-element[data-type="text11rows"] .form-label em,
				.form .form-element[data-type="text13rows"] .form-label em,
				.form .form-element[data-type="text15rows"] .form-label em,
				.form .form-element[data-type="text17rows"] .form-label em,
				.form .form-element[data-type="text19rows"] .form-label em {position: relative;top: 50%;transform: translateY(-50%);}

				.form .form-element[data-type="text3rows"] .form-value textarea {resize:none;height: 60px;}
				.form .form-element[data-type="text5rows"] .form-value textarea {resize:none;height: 90px;}
				.form .form-element[data-type="text7rows"] .form-value textarea {resize:none;height: 120px;}
				.form .form-element[data-type="text9rows"] .form-value textarea {resize:none;height: 150px;}
				.form .form-element[data-type="text11rows"] .form-value textarea {resize:none;height: 180px;}
				.form .form-element[data-type="text13rows"] .form-value textarea {resize:none;height: 210px;}
				.form .form-element[data-type="text15rows"] .form-value textarea {resize:none;height: 240px;}
				.form .form-element[data-type="text17rows"] .form-value textarea {resize:none;height: 270px;}
				.form .form-element[data-type="text19rows"] .form-value textarea {resize:none;height: 300px;}


			/* radios */

				.form .form-element[data-type="radios"] .form-label em { padding-top:7px;}
				.form .form-element[data-type="radios"] { margin-top: 5px; margin-bottom: 10px; }
				.form .form-element[data-type="radios"] .form-value label { margin-top:5px; margin-bottom: 5px; }
				.form .form-element[data-type="radios"] input { position: absolute; opacity: 0;}
				.form .form-element[data-type="radios"] input ~ i {
					display: inline-block;
					vertical-align: top;
					width:         16px;
					height:        16px;
					border-radius: 16px;
					border: 2px solid #7d8597;
					background-color: white;
					background-image: url("../../images/assets/white2x/checked.webp?v=2");
					background-size: 0px;
				}
				.form .form-element[data-type="radios"] input:checked ~ i { background-size: 100%; background-color:var(--blue); border-color:var(--blue); }
				.form .form-element[data-type="radios"] input ~ em {
					display: inline-block;
					vertical-align: top;
					margin: 2px 0 0 5px;
					color:var(--blue);
				}
			
			/* checkbox */

				.form .form-element[data-type="checkbox"] .form-label em { padding-top:0px;}
				.form .form-element[data-type="checkbox"] { margin-top:10px; margin-bottom: 10px; }
				.form .form-element[data-type="checkbox"] ~ .form-element[data-type="checkbox"] { margin-top:-10px; }
				.form .form-element[data-type="checkbox"] .form-value label {margin-bottom: 5px;white-space: nowrap;display: block;}
				.form .form-element[data-type="checkbox"] input { position: absolute; opacity: 0;}
				.form .form-element[data-type="checkbox"] input ~ i {
					display: inline-block;
					vertical-align: top;
					width:         16px;
					height:        16px;
					border: 2px solid #7d8597;
					background-color: white;
					background-image: url("../../images/assets/white2x/checked.webp?v=2");
					background-size: 0px;
				}
				.form .form-element[data-type="checkbox"] input:checked ~ i { background-size: 100%; background-color:var(--blue); border-color:var(--blue); }
				.form .form-element[data-type="checkbox"] input ~ em {
					display: inline-block;
					vertical-align: top;
					max-width: calc(100% - 50px);
					white-space: normal;
					margin: 2px 0 0 5px;
					text-align: justify;
					-webkit-hyphens: auto;
					-ms-hyphens: auto;
					hyphens: auto;
				}
				.form .form-element[data-type="checkbox"] input ~ em a {
					XXXcolor: var(--brand_red);
					text-decoration: underline;
				}
			
			/* button */

				.form .form-element[data-type="button"] {
					margin: 15px 0 0 0;
				}
				.form .form-element[data-type="button"] .form-label {}
				.form .form-element[data-type="button"] .form-label em {}
				.form .form-element[data-type="button"] .form-value {}
				.form .form-element[data-type="button"][data-align="right"] .form-value { text-align: right; }
				.form .form-element[data-type="button"] .form-value a {
					display: inline-block;
					padding: 15px 25px;
					border-radius: 5px;
					background-color: var(--blue);
					background-color: var(--green);
					color: white;
					color: var(--darkblue);
					font-family: "Exo 2", sans-serif;
					font-weight: normal;
					font-size: 1.4rem;
					line-height: 1;
					text-decoration: none;
					box-shadow: 0 0 0 0 var(--blue);
					box-shadow: 0 0 0 0 var(--green);
					transition: box-shadow 0.3s ease, background-color 0.3s ease;
				}
				.form .form-element[data-type="button"] .form-value a:hover {
					box-shadow: 0 0 0 3px var(--blue);
					background-color: var(--lightgreen);
					box-shadow: 0 0 0 3px var(--lightgreen);
				}
				.form .form-element[data-type="button"] .form-value a i {}
				.form .form-element[data-type="button"] .form-value a em {font-size: 1.3rem;color: inherit;}
				.form .form-element[data-type="button"] .form-value .gap {
					display: inline-block;
					height: 40px;
				}
				.form .form-element[data-type="button"] .form-value .gap:first-child {}
				.form .form-element[data-type="button"] .form-value .gap:last-child {}
				.form .form-element[data-type="button"] .form-value .gap[data-size="5"]  { width: 5px; }
				.form .form-element[data-type="button"] .form-value .gap[data-size="10"] { width:10px; }

			/* button-small */

				.form .form-element[data-type="button-small"] {
					margin: 5px 0 0 0;
					float: left;
				}
				.form .form-element[data-type="button-small"] .form-value a {
					display: inline-block;
					padding: 4px 15px;
					margin: 35px 0 0 0;
					border-radius: 25px;
					background-color: var(--blue);
					color: white;
					font-family: "Exo 2", sans-serif;
					font-weight: normal;
					font-size: 1.4rem;
					line-height: 1;
					text-decoration: none;
					box-shadow: 0 0 0 0 var(--blue); transition: box-shadow 0.3s ease;
				}
				.form .form-element[data-type="button-small"] .form-value a:hover {
					box-shadow: 0 0 0 3px var(--blue);
				}
			
			/* states */

								   .conditional-contents[data-content="progress"] .form .form-element[data-type="button"],
				html[data-pro="1"] .conditional-contents[data-content="success"]  .form .form-element[data-type="button"] {
					opacity: 1;
					pointer-events: none;
				}
			   .form-element[data-type="button"] a {
					position: relative;
					overflow: hidden;
				}
			   .form-element[data-type="button"]:last-child a:before {
					content: "";
					display: block;
					position: absolute;
					inset:0;
					background-image:url("../../images/form/bar22.gif");
					background-size: 110px 44px;
					opacity: 1;
					mix-blend-mode: overlay;
					pointer-events: none;
					display: none;
				}
				html[data-pro="1"] .form-element[data-type="button"]:last-child a:before {
					display: block;
				}

	/*										*/
	/*	Footnores							*/
	/*										*/
		
		ul.footnotes {
			display: block;
			left: 0;
			margin: 15px 0 0 -1em;
			padding: 0;
			list-style: none;
			color: var(--blue);
			font-family: "Exo 2", sans-serif;
			font-size: 0.9rem;
			font-weight: 300;
		}
		ul.footnotes li {
			margin: 0 0 0 20px;
			padding: 0;
			list-style: none;
		}
		ul.footnotes li:before {
			content:""; 
			display: block;
			position: relative;
			left: -23px;
			text-align: right;
			width: 20px;
			height: 15px;
			margin-bottom: -15px;
		}
		ul.footnotes li:nth-child(1):before { content:"*"; }
		ul.footnotes li:nth-child(2):before { content:"**"; }
		ul.footnotes li:nth-child(3):before { content:"***"; }
		ul.footnotes li:nth-child(4):before { content:"****"; }
		ul.footnotes li:nth-child(5):before { content:"*****"; }

	/*										*/
	/*	Typography							*/
	/*										*/

		h2.side-title {
			font-size: 2.5rem;
			line-height: 1;
			font-weight: 800;
			text-transform: uppercase;
		}
		h2.side-title em { display: block; }
		/*
		h2.side-title em:nth-child(1) { color:var(--lightgreen)!important; opacity:1.0; }
		h2.side-title em:nth-child(2) { color:var(--lightgreen)!important; opacity:0.9; }
		h2.side-title em:nth-child(3) { color:var(--lightgreen)!important; opacity:0.8; }
		*/

		#title-1 em:nth-child(1) { font-size:2.4em; line-height: 1.0; }
		#title-1 em:nth-child(2) { font-size:1.5em; line-height: 0.8; }
		#title-1 em:nth-child(3) { font-size:1.0em; line-height: 1.2; }

		#title-2 em:nth-child(1) { font-size:2.4em; line-height: 1.0; }
		#title-2 em:nth-child(2) { font-size:1.4em; line-height: 1.0; }

		.pictos-title {
			position: relative;
			text-align: center;
			text-shadow: 
				0 0 10px var(--blue)
				0 0 10px var(--blue)
				0 0 10px var(--blue)
				0 0 10px var(--blue)
				0 0 10px var(--blue);
			z-index:2;
			margin-bottom: 25px;
		}
		.pictos-title:before {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			border-bottom:3px dotted white;
			opacity: 0.5;
			transform:translateY(-40%);
			z-index: -1;
		}
		.pictos-title h2 {
			display: inline-block;
			padding-inline:10px;
			left: 50%;
		}
		.framed > .baseline-on-rule {
			width: 100%;
			outline: 2px solid orange;
			outline: none;
		}
		.framed > .baseline-on-rule > h2 {
			display: inline-block;
			position: relative;
			vertical-align: top;
			padding-inline:0.5em;
			left: 50%;
			transform:translate(-50%,-100%);
			font-size: 2.5rem;
		}
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {}
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) {}
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { .framed > .baseline-on-rule > h2 { font-size: 1.5rem; transform:translate(-50%,-80%); } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {}
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {}
		/*   -XS   */ @media screen and (min-width:   0px) and (max-width: 579.8px) { .framed > .baseline-on-rule > h2 { font-size: 1.25rem; transform:translate(-50%,-80%); } }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {}
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {}
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {}
		
		
		.background[data-skin="blue"] { background-color:var(--blue); }
		.background[data-skin="blue"] h2,
		.background[data-skin="blue"] h3,
		.background[data-skin="blue"] h4,
		.background[data-skin="blue"] p,
		.background[data-skin="blue"] ul,
		.background[data-skin="blue"] ol { color: white; color: }

		.background[data-skin="dark-blue"] { background-color:var(--darkblue); }
		.background[data-skin="dark-blue"] h2,
		.background[data-skin="dark-blue"] h3,
		.background[data-skin="dark-blue"] h4,
		.background[data-skin="dark-blue"] p,
		.background[data-skin="dark-blue"] ul,
		.background[data-skin="dark-blue"] ol { color: white; }

		.background[data-skin="white"] { background-color:white; }
		.background[data-skin="white"] h2,
		.background[data-skin="white"] h3,
		.background[data-skin="white"] h4,
		.background[data-skin="white"] p,
		.background[data-skin="white"] ul,
		.background[data-skin="white"] ol { color: var(--blue); }

		.background[data-skin="blue"]      .pictos-title > h2 { background-color:var(--blue); }
		.background[data-skin="dark-blue"] .pictos-title > h2 { background-color:var(--darkblue); }
		.background[data-skin="white"]     .pictos-title > h2 { background-color:var(--white); }

		.background[data-skin="blue"]      .baseline-on-rule > h2 { background-color:var(--blue); }
		.background[data-skin="dark-blue"] .baseline-on-rule > h2 { background-color:var(--darkblue); }
		.background[data-skin="white"]     .baseline-on-rule > h2 { background-color:var(--white); }

		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) { h2.side-title { font-size: 2.2rem; }  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) { h2.side-title { font-size: 1.9rem; }  }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) {}
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) { h2.side-title { font-size: 1.5rem; }  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) { h2.side-title { font-size: 1.4rem; }  }
		/*   -XS   */ @media screen and (min-width:   0px) and (max-width: 579.8px) { .columns[data-split="1-2"] .column:nth-child(1) { width: 100%; text-align: center; margin-bottom: 25px; } .columns[data-split="1-2"] .column:nth-child(2) { width: 100%; text-align: center; margin-bottom:30px; } }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) { h2.side-title { font-size: 1.25rem; }  }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {}
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {}

		/*
		#int .pictos-title           > h2,
		#int .baseline-on-rule > h2,
		#srv .baseline-on-rule > h2,
		#tec .baseline-on-rule > h2,
		#prc .baseline-on-rule > h2,
		#mnt .baseline-on-rule > h2,
		#cmp .baseline-on-rule > h2  { background-color:var(--blue); }
		
		#drn .pictos-title           > h2,
		#int .baseline-on-rule > h2 { background-color:var(--darkblue); }
		*/

	/*										*/
	/*	Pictograms							*/
	/*										*/

		.picto-items {}
		.picto-items > .scroller {}
		.picto-items > .scroller > ul {
			display: block;
			white-space: nowrap;
			color: white;
			list-style: none;
			margin: 0; padding: 0;
		}
		.picto-items > .scroller > ul > li {
			list-style: inherit;
			margin: inherit;
			padding: inherit;
			white-space: normal;
			text-align: center;
			display: inline-block;
			vertical-align: bottom;
		}
		.picto-items[data-count="4"] > .scroller > ul > li { width: 25%; }
		.picto-items > .scroller > ul > li > i {
			display: block;
			height: 100px;
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
			filter: hue-rotate(45deg);
		}
		.picto-items > .scroller > ul > li > em {
			display: block;
			text-align: center;
			color: white;
			text-wrap:balance;
			color: var(--extralightblue);
		}
		.picto-items .scroller ul li[data-label="alp"] {}
		.picto-items .scroller ul li[data-label="mea"] {}
		.picto-items .scroller ul li[data-label="env"] {}
		.picto-items .scroller ul li[data-label="eff"] {}

		.picto-items .scroller ul li[data-label="alp"] i { background-image:url(../../images/assets/white/allvanyozas.webp?v=2); }
		.picto-items .scroller ul li[data-label="mea"] i { background-image:url(../../images/assets/white/felmeres.webp?v=2); }
		.picto-items .scroller ul li[data-label="env"] i { background-image:url(../../images/assets/white/vegyszermentes.webp?v=2); }
		.picto-items .scroller ul li[data-label="eff"] i { background-image:url(../../images/assets/white/gyors-kivitelezes.webp?v=2); }
		
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) { }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { .picto-items > .scroller > ul { white-space:normal; } .picto-items[data-count="4"] > .scroller > ul > li { width: calc(50% - 10px); } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*   -XS   */ @media screen and (min-width:   0px) and (max-width: 579.8px) { .picto-items > .scroller > ul { white-space:normal; } .picto-items[data-count="4"] > .scroller > ul > li { width: calc(100% - 0px); } }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {  }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  }
		

	/*						*/
	/*	Popup 				*/
	/*						*/

		.popup-holder {
			z-index: 999;
			position:fixed;
			display:none;
			display:table-cell;
			width:100%;
			height:0px;
			left:0px;
			padding:0px 0px 0px 0px;
			top:-10000px;
			text-align:center;
			vertical-align:middle;
			background-color:rgba(177,175,170,0);
			background-color:rgba(255,255,255,0);
			transition:background 0.1s linear, display 0s linear 0.1s, height 0s linear 0.1s, top 0s linear 0.1s;
			background-repeat:repeat;
		}
		.popup-holder.visible {
			display:table-cell;
			top:0px;
			padding-top:10px;
			height:100%;
			background-color:rgba(177,175,170,0.3);
			background-color:rgba(255,255,255,0.5);
			box-shadow:inset 0px 0px 5px 0px rgba(37,35,30,0.75), inset 0px 0px 25px 0px rgba(177,175,170,0.75);
			box-shadow: none;
			transition:padding 0.2s ease, background-color 0.1s linear 0s;
			backdrop-filter: blur(2px);
			-webkit-backdrop-filter:blur(2px);
		}
		.popup-holder .popup {
			position:relative;
			top:50%;
			transform: translateY(-50%);
			display:inline-block;
			min-width:450px;
			max-width:900px;
			height:auto;
			max-height:600px;
			border:0px solid white;
			margin:5px;
			padding: 15px;
			border-radius:8px;
			background-color:rgba(255,255,255,1);
			opacity:0.25;
			box-shadow:inset 0px 0px 75px 0px #F5F5F5, 0px 5px 25px 0px rgba(0,0,0,0.2);
			box-shadow:0px 2px 8px 0px rgba(0,0,0,0.3), 0px 5px 25px 0px rgba(0,0,0,0.2);
			cursor:default;
			transition:opacity 0.25s ease, border 0.25s ease;
		}
		.popup-holder .popup * {
			user-select:none;
			-webkit-user-select:none;
		}
		.popup-holder .popup.size-XS { max-width:300px; }
		.popup-holder .popup.size-S  { max-width:450px; }
		.popup-holder .popup.size-M  { max-width:600px; }
		.popup-holder .popup.size-L  { max-width:750px; }
		.popup-holder .popup.size-XL { max-width:900px; }
		.popup-holder .popup label > span   { display: inline-block; width: 200px; }
		.popup-holder .popup label > sepect { display: inline-block; width: calc(100% - 200px); }
		.popup-holder.visible .popup {
			border:5px solid white;
			margin:0px;
			opacity:1;
			transition:opacity 0.5s ease, border 0.15s ease;
		}
		.popup-holder .popup .close-button {
			background-image:url("../../images/assets/black/menu-hide.webp?v=2");
			background-size: contain;
			background-repeat: no-repeat;
			background-position: 0;
			width: 25px;
			height: 25px;
			text-decoration: none;
			display: block;
			position: relative;
			top: -3px;
			right: 27px;
			overflow: hidden;
			text-indent: -10000px;
			float: right;
			margin: 0px -35px -25px 0px;
			opacity: 0.5;
		}
		.popup-holder .popup .close-button:hover {
			opacity:1;
		}
		.popup .title {
			text-align: left;
			font-family: "Exo 2", sans-serif;
			font-weight: 700;
			font-size: 1.5rem;
			line-height: 1.2;
			margin: 0px;
			padding: 0px 15px 30px 5px;
			cursor: default;
			color: #BF0000;
		}
		.popup p.copy {
			text-align:left;
			font-size: 1.15rem;
			line-height: 1.2;
			margin:0px;
			padding:0px 15px 5px 15px;
			cursor:default;
		}
		.popup p.copy > p {
			font-size: inherit;
			line-height: inherit;
		}
		.popup .additional-content {
			display:inline-block;
			width:100%;
			height:0px;
			height: auto;
		}
		.popup .action-buttons { 
			display: block; 
			text-align: right;
			padding: 10px 10px 10px 10px;
		}
		.popup .action-buttons .action-button {
			display: inline-block;
			vertical-align: top;
			min-width: 60px;
			width: auto;
			height: auto;
			text-decoration: none;
			margin: 0px 0px 0px 10px;
			padding: 5px 20px 5px 20px;
			background-color: #E2E2E2;
			font-family: "Exo 2", sans-serif;
			font-weight: 700;
			font-size: 12px;
			line-height: 15px;
			text-align: center;
			color: black;
			border: 1px solid rgba(0,0,0,0.25);
			text-shadow: 1px 1px 1px white;
			border-radius: 6px;
			box-shadow: inset 0px 17px 10px rgb(255 255 255 / 35%), inset 0px 7px 10px rgb(255 255 255 / 75%), inset 2px 2px 2px rgb(255 255 255 / 75%), -2px -2px 5px rgb(0 0 0 / 10%);
			transition: box-shadow 0.2s linear;	
		}
		.popup .action-buttons .action-button:hover {
			background-color: #E2E2E2;
			box-shadow: inset 0px 17px 10px rgb(255 255 255 / 35%), inset 0px 7px 10px rgb(255 255 255 / 75%), inset 2px 2px 2px rgb(255 255 255 / 75%), -2px -2px 5px rgb(0 0 0 / 10%), 0px 0px 10px 0px hsl(200deg 91% 50% / 75%);
		}
		.popup .action-buttons .action-button i {}
		.popup .action-buttons .action-button i:before {}
		.popup .action-buttons .action-button em { font-style: normal; }
		.popup .action-buttons .action-button em:before {}

		.popup .note {
		}
		.popup .note i {
			width:  25px;
			height: 25px;
			border-radius: 25px;
			margin: 0 5px 0 0;
			display: inline-block;
			vertical-align: top;
			background-position: center;
			background-size: contain;
		}
		.popup .note[data-label="ok"]     i {
			background-image: url("../../images/assets/white/checked.webp?v=2");
			background-color:#279D0D; 
		}
		.popup .note[data-label="failed"] i {
			background-image: url("../../images/assets/white/menu-hide.webp?v=2");
			background-color::#CF3131; 
		}
		.popup .note em {
			display: inline-block;
			vertical-align: top;
			font-style: normal;
		}
		.popup .footnote {
			position:relative;
			display:block;
			padding:25px 15px 10px 15px;
			margin:0px 0px 0px 0px;
			font-size:11px;
			line-height:13px;
			text-align:left;
		}
		.popup .footnote:empty { display: none; }
		.popup-holder .popup[data-has_close_button="no"] .close-button { display: none; }

		/* Responsives */

		@media screen and (min-width:1440px) and (max-width:9999px){}
		@media screen and (min-width:1240px) and (max-width:1439px){}
		@media screen and (min-width:1040px) and (max-width:1239px){}
		@media screen and (min-width:960px) and (max-width:1039px){}
		@media screen and (min-width:860px) and (max-width:959px){}
		@media screen and (min-width:700px) and (max-width:859px){}
		@media screen and (min-width:580px) and (max-width:699px){}
		@media screen and (min-width: 310px) and (max-width:579px){
			.popup-holder.visible {
				/*backdrop-filter:none;*/
				background-color:#c9c9c9ad;
				background-color: var(--blue_dim);
			}
			.popup-holder .popup {
				position: relative;
				top: 50%;
				left: 50%;
				transform: translate(-50%,-50%);
				display: block;
				min-width: 60vw;
				max-width: 80vw;
				padding-block: 15px;
			}
			.popup .title {
				padding-right:10%;
			}
			.popup-holder .popup .close-button {
				top:-10px;
			}
		}
		@media screen and (min-width: 0px) and (max-width:309px){}

	/*										*/
	/*	Header > Menu 						*/
	/*										*/

		header {
			position: fixed;
			z-index: 100;
			left: 0; right: 0;
			height: 65px;
		}

		header .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 .menu:before {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			background-color: var(--blue);
			color:var(--lightblue);
		}
		header .menu .menu-head {
			position: absolute;
			left: 0;
		}
		header .menu .menu-head {
		}
		header .menu .menu-head .logo {
			position: relative;
			left: 10px;
			top: 5px;
		}
		header .menu .menu-head .logo a {
			display: block;
		}
		header .menu .menu-head .logo a i {
			display: inline-block;
			vertical-align: middle;
			width: 140px;
			height: 50px;
			margin-right: 10px;
			background-image: url("../../images/assets/white/logo-extrawide.webp?v=2");
		}
		header .menu .menu-head .logo a em.slogan {
			display: inline-block;
			vertical-align: middle;
			color: white;
			font-size: 1.25rem;
		}
		header .menu .menu-head .logo a em.slogan .sl1 { text-transform: uppercase; }
		header .menu .menu-head .logo a em.slogan .sl2 { color:var(--lightblue); color: var(--green); font-weight: 700; }

		header .menu .menu-body {
			position: absolute;
			right: 0;
		}
		header .menu .menu-body nav {
			margin: 0; padding: 0;
		}

		/* toggle menu */

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

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

		header .menu .menu-body nav label.show-menu > input,
		header .menu .menu-body nav label.hide-menu > input {
			position: absolute;
			opacity:0;
		}
		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(--lightgreen);
			background-color: var(--green);
			
			
		}
		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.hide-menu input:checked) i.toggle-icon { opacity:1; background-image:url("../../images/assets/blue/menu-show.webp?v=2"); }
		header:has(label.show-menu input:checked) i.toggle-icon { opacity:1; background-image:url("../../images/assets/blue/menu-hide.webp?v=2"); }


		header .menu .menu-body nav > .menu-items {
			display: block;
			list-style: none;
			margin: 0;
			padding: 0;
			position: fixed;
			top: 60px;
			right: 0;
			height: calc(100vh - 60px);
			width: 350px;
			z-index: 1;
			pointer-events: none;
			will-change:transform;
			transition:transform 500ms cubic-bezier(.2,.8,.2,1), opacity 300ms linear;
		}
		header .menu .menu-body nav > .menu-items > .background {
			background-color:var(--lightgreen);
			background-color:var(--green);
			/*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: 350px;
		}
		/* menu shadow: GPU */
		
		header .menu .menu-body nav > .menu-items > .background::after {
			content:"";
			position:absolute;
			top:0; bottom:0;
			left:0;
			width:100%;
			pointer-events:none;
			background-color: white;
			background-color:var(--lightgreen);
			background-color:var(--green);
			filter:drop-shadow(-24px 0 20px rgba(0,0,0,.35));
			opacity:0;
			transition:opacity 500ms;
		}

		/* menu position */

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

		header:has(label.show-menu input:checked) .menu .menu-body nav label.show-menu {
			width:100%;
			height: 100%; 
			background-color: rgba(179,179,129,0.67);
			background-color: transparent;
		}
		header:has(label.show-menu input:checked) .menu .menu-body nav label.hide-menu {
			width:100%;
			height: 100vh;
			background-color: rgba(179,179,129,0.67);
			background-color: transparent;
			cursor: pointer;
		}
		header .menu > .menu-body > nav > .menu-items > .background > ul {
			display: inline-block;
			z-index: 3;
			position: relative;
			left: calc(50% - 0vw);
			top: 50px;
			transform:translate(-50%,0%);
			pointer-events: all;
			width: auto;
		}
		header .menu > .menu-body > nav > .menu-items > .background > ul > li {}
		header .menu > .menu-body > nav > .menu-items > .background > ul > li > a {
			text-decoration: none;
			display: block;
			position: relative;
			left: 0;
			color:var(--lightblue);
			transition: left .3s ease, opacity .3s ease;
		}
		header .menu > .menu-body > nav > .menu-items > .background > ul > li > a:hover {
			left: -15px;
			opacity: 1;
		}	
		header .menu > .menu-body > nav > .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;
		}
		header .menu > .menu-body > nav > .menu-items > .background > ul > li > a > em {
			display: block;
			position: relative;
			margin: 0 0 0 var(--icon_size);
			padding: 0 0 0 10px;
			color:var(--blue);
			color:var(--darkblue);
			font-size: 1.05rem;
			line-height: var(--icon_size);
			text-transform: uppercase;
			pointer-events: none;
		}
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="int"] > a > i { background-image: url("../../images/assets/blue/bemutatkozas.webp?v=2"); }
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="ser"] > a > i { background-image: url("../../images/assets/blue/szolgaltatasaink.webp?v=2"); }
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="tec"] > a > i { background-image: url("../../images/assets/blue/technologiank.webp?v=2"); }
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="ref"] > a > i { background-image: url("../../images/assets/blue/referenciaink.webp?v=2"); }
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="num"] > a > i { background-image: url("../../images/assets/blue/eredemenyeink-szamokban.webp?v=2"); }
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="cnt"] > a > i { background-image: url("../../images/assets/blue/kapcsolat.webp?v=2"); }
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="que"] > a > i { background-image: url("../../images/assets/blue/kerdese-van.webp?v=2"); }
		header .menu > .menu-body > nav > .menu-items > .background > ul > li[data-label="quo"] > a > i { background-image: url("../../images/assets/blue/ajanlatkeres.webp?v=2"); }

		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) { header .menu .menu-head .logo a em.slogan { font-size: 1.0rem; }  }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { header .menu .menu-head .logo a em.slogan { font-size: 0.85rem; } header .menu .menu-head .logo a em.slogan .sl2 { display: none; }  }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {}
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  header .menu .menu-head .logo a em.slogan { display: none; }  }





	/*										*/
	/*	Menu placeholder					*/
	/*										*/
	
		.menu-placeholder {
			display: block;
			position: relative;
			width: 100%;
			height: 50px;
			background-color: gainsboro;
			background-color: transparent;
		}

	/*										*/
	/*	Hero banner 						*/
	/*										*/

		#anm {
			z-index: 100;
			position: fixed;
			inset:0;
		}
		html[data-anm="0"] #anm { display: none; }
		html[data-anm="1"] #anm { display: none; }
		
		#anm .pagecover {
			position: fixed;
			inset:0;
			background-color: var(--blue);
		}
		#anm .layers {
			position: absolute;
			inset:0;
		}
		#anm .layers .layer {
			position: absolute;
			inset:0;
		}
		#anm .layers .layer#outer       {}
		#anm .layers .layer#logo        {}
		#anm .layers .layer#logo-mirror {}
		#anm .layers .layer#inner       {}
		#anm .layers .layer#dirt        {}
		#anm .layers .layer#drone       {}
		#anm .layers .layer#water       {}
		#anm .layers .layer#mask-left   {}
		#anm .layers .layer#mask-right  {}

		
	/*										*/
	/*	Hero banner 						*/
	/*										*/

		#bnr {
			position: relative;
			width: 100vw;
			height: 400px;
			--gap: 150px;
			margin-bottom: 30px;
		}
		#bnr > .block {
			height:inherit;
		}
		#bnr .scroller {
			position: relative;
			width: 100vw;
			height: inherit;
			overflow: hidden;
			-ms-overflow-style: none;
			scrollbar-width: none;
			overflow-x: scroll;
			scroll-behavior: smooth;
		}
		#bnr .scroller::-webkit-scrollbar {
			display: none;
		}
		#bnr .slides {
			display: flex;
			height: inherit;
			cursor: grab;
			gap: var(--gap);
			transition: transform 0.6s ease;
			will-change: transform;
		}
		#bnr .slides::-webkit-scrollbar {
			display: none;
		}
		#bnr .slide {
			flex: 0 0 calc((100vw / 3) - var(--gap));
			height: 100%;
			position: relative;
		}
		@media (max-width: 900px) {
			#bnr .slide {
				flex: 0 0 calc((100vw / 2) - var(--gap));
			}
		}
		@media (max-width: 600px) {
			#bnr .slide {
				flex: 0 0 calc(100vw - var(--gap));
			}
		}
		#bnr .scroller ul.slides li.slide figure {
			position: absolute;
			inset:0 -110px;
			margin: 0; padding: 0;
			background-repeat: no-repeat;
			background-position: center;
			background-size: cover;
			clip-path: polygon(90px 0, 100% 0, calc(100% - 90px) 100%, 0 100%);
		}
		#bnr .scroller ul.slides li.slide figcaption {
			position: absolute;
			bottom: 30px;
			left:   50px;
			font-size: 1.5rem;
			line-height: 1.2;
			color: white;
			transform-origin: left center;
			transform:rotate(-77deg);
			text-shadow: 
				0 0 5px rgba(0,0,0,0.5),
				0 0 8px rgba(0,0,0,0.5),
				0 0 12px rgba(0,0,0,0.5);
		}
		#bnr .scroller ul.slides li.slide[data-id="1"] figure { background-image:url(../../images/hero/slides/1.webp?v=2); }
		#bnr .scroller ul.slides li.slide[data-id="2"] figure { background-image:url(../../images/hero/slides/2.webp?v=2); }
		#bnr .scroller ul.slides li.slide[data-id="3"] figure { background-image:url(../../images/hero/slides/3.webp?v=2); }
		#bnr .scroller ul.slides li.slide[data-id="4"] figure { background-image:url(../../images/hero/slides/4.webp?v=2); }
		#bnr .scroller ul.slides li.slide[data-id="5"] figure { background-image:url(../../images/hero/slides/5.webp?v=2); }
		#bnr .scroller ul.slides li.slide[data-id="6"] figure { background-image:url(../../images/hero/slides/6.webp?v=2); }
		#bnr .scroller ul.slides li.slide[data-id="7"] figure { background-image:url(../../images/hero/slides/7.webp?v=2); }

		#bnr .scroller ul.slides li.slide[data-id="1"] figcaption:before { content:"Magas építmények"; }
		#bnr .scroller ul.slides li.slide[data-id="2"] figcaption:before { content:"Napelemek"; }
		#bnr .scroller ul.slides li.slide[data-id="3"] figcaption:before { content:"Hidak"; }
		#bnr .scroller ul.slides li.slide[data-id="4"] figcaption:before { content:"Nagy üvegfelületek"; }
		#bnr .scroller ul.slides li.slide[data-id="5"] figcaption:before { content:"Törékeny palatetők"; }
		#bnr .scroller ul.slides li.slide[data-id="6"] figcaption:before { content:"Magas épületek"; }
		#bnr .scroller ul.slides li.slide[data-id="7"] figcaption:before { content:"Ipari kémények, létesítmények"; }

		#bnr .dots {
		  position: absolute;
		  bottom: -30px;
		  left: 50%;
		  transform: translateX(-50%);
		  display: flex;
		  margin: 0;
		  padding: 0;
		  gap: 10px;
		  list-style: none;
		  z-index: 10;
		}

		#bnr .dots li {
		  width: 10px;
		  height: 10px;
		  border-radius: 50%;
		  background-color: rgba(255,255,255,0.4);
		  box-shadow:0 0 0 0 var(--green);
		  cursor: pointer;
		  transition: background-color 0.3s;
		}

		#bnr .dots li.active {
		  background-color: var(--green);
		  box-shadow:0 0 0 3px var(--green);
		}

	/*										*/
	/*	A jövő tisztítási technológiája 	*/
	/*										*/
	
		.pictos {
			margin-top: 50px;
		}
		#int .background {
			background-color:var(--blue);
		}
		#int h3 {
			font-size: 2.25rem;
			line-height: 1.2;
			text-wrap: balance;
			margin-bottom: 15px;
		}
		#int p {
			font-size: 1.25rem;
		}

	/*										*/
	/*	Miért Drónnal 						*/
	/*										*/

		#drn figure {
			margin: 0;
			margin-block:100px -100px;
			padding: 0;
			position: relative;
			left: 50%;
			transform: translateX(-50%);
			background-position: top center;
			background-repeat: no-repeat;
			background-size: contain;			
			background-color: #EEE;
			background-color: transparent;
			background-image: url("../../images/product/817.webp");
			background-image: url("../../images/product/818.webp");
			background-image: url("../../images/product/819.webp");
			background-image: url("../../images/product/820.webp");
			width: 100%;
			aspect-ratio:12/9;
			aspect-ratio:120/66;
		}
		/* XXXXL   */ @media screen and (min-width:1600px)                          { #drn figure {margin-block: 100px -80px;} }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) { #drn figure {margin-block: 70px -50px;} }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) { #drn figure {margin-block: 70px -40px;} }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) { #drn figure {margin-block: 70px -70px;} }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) { #drn figure {margin-block: 60px -60px;} }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) { #drn figure {margin-block: 60px -40px;} }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) { #drn figure {margin-block: 50px -30px;} }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) { #drn figure {margin-block: 60px -20px;width: 95vw;} }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) { #drn figure {margin-block: 70px -30px;} }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) { #drn figure {margin-block: 70px -20px;width: 95vw;} }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) { #drn figure {margin-block: 70px -20px;width: 95vw;} }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) { #drn figure {margin-block: 70px -20px;width: 95vw;} }

		#drn h3 {
			font-size: 2.25rem;
			line-height: 1.2;
			text-wrap: balance;
			margin-bottom: 15px;
		}
		#drn p {
			font-size: 1.25rem;
		}
		#drn .background {
			background-color: var(--blue);
			padding-block:0 50px;
		}
		#drn .background .creative {
			width: 100vw;
			height: 500px;
			margin-bottom:50px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/2.webp?v=3);
			/* background-attachment: fixed; */
		}
		#drn .list-items {}
		#drn .list-items > ul {
			font-size: 1.2rem;
			line-height: 1.5;
		}
		#drn .list-items > ul > li {}
		#drn .list-items > ul > li > i {
			display: block;
			position: relative;
			width: 35px;
			height: 35px;
			margin: 0 0 -35px 0;
			background-image: url("../../images/assets/white/checked.webp?v=2");
			background-size: contain;
			top: -0.33em;
		}
		#drn .list-items > ul > li > span {
			display: block;
			position: relative;
			margin: 0 0 0 50px;
		}
		#drn .list-items > ul > li > span > b  {
			display:inline-block;
			color: var(--extralightblue);
			margin: 0 10px 0 0;
		}
		#drn .list-items > ul > li > span > em {
			display:inline-block;
			margin: 0 0 0 1em;
		}
		#drn .list-items > ul > li > span > em:before {
			display: block;
			position: absolute;
			margin: -0.25em 0 0 -0.75em;
			content:"/";
			font-size: 1.6em;
		}
	
	/*										*/
	/*	Szolgáltatásaink					*/
	/*										*/
	
		#srv .framed {}
		#srv .grid > ul {}
		#srv .grid > ul > li {
			position: relative;
		}
		#srv .grid > ul > li > .picto {
			position: relative;
			width: calc(100% - 10px);
			outline: 1px solid orange;
			outline:none;
		}
		#srv .grid > ul[data-buttons="0"] > li > .picto {
			height: 120px;
			margin-bottom: 10px;
		}
		#srv .grid > ul[data-buttons="1"] > li > .picto {
			height: 120px;
			margin-bottom: 250px;
		}
		#srv .grid > ul > li > .picto > i {
			display: block;
			box-sizing:border-box;
			position: relative;
			width:  120px;
			height: 120px;
			margin: 0 0 -120px 0;
			border-radius: 50%;
			border: 2px solid white;
			background-size: contain;
			outline: 1px solid orange;
			outline: none;
		}
		#srv .grid > ul > li > .picto > em {
			display: block;
			box-sizing: border-box;
			position: relative;
			top: 50%;
			transform: translateY(-50%);
			width: calc(100% - 140px);
			margin: 0 0 0 130px;
			padding:0;
			font-size: 1.25rem;
			line-height: 1.2;
			font-weight: 600;
			text-wrap:balance;
			white-space: normal;
		}
		#srv .grid > ul > li > p {
			color: var(--extralightblue);
			-webkit-font-smoothing: antialiased;
			font-weight: 500;
			text-align: center;
			text-wrap: balance;
			/*! margin-bottom: 70px; */
			position: absolute;
		}
		#srv .grid > ul[data-buttons="0"] > li > p {
			margin-top: 10px;
			position: relative;
			text-align: left;
			padding-left: 50px;
		}
		#srv .grid > ul[data-buttons="1"] > li > p {
			margin-top: 30px;
			top: 50%;
			transform: translateY(-50%);
		}
		
		#srv .grid > ul > li > figure {
			display: none;
		}
		#srv .grid > ul > li > .buttons {
			margin: 15px auto;
			text-align: center;
			position: absolute;
			bottom: 0;
		}
		#srv .grid > ul > li > .buttons > .button {
			display: inline-block;
			vertical-align: top;
			appearance:none;
			border:none;
			background-color: rgba(221,216,30,1.00);
			box-shadow: 0 0 0 0 rgba(221,216,30,1.00);
			color: var(--darkblue);
			text-align: center;
			padding: 8px 50px;
			min-width: 120px;
			border-radius: 25px;
			text-transform: uppercase;
			font-family: "Exo 2", sans-serif;
			font-weight: 600;
			font-size: 1.25rem;
			line-height: 1;
			text-decoration: none;
			transition: box-shadow 0.3s ease;
		}
		#srv .grid > ul > li > .buttons > .button:hover {
			box-shadow: 0 0 0 5px rgba(221,216,30,1.00);
		}
		
		#srv .grid > ul > li > .buttons > .button i {}
		#srv .grid > ul > li > .buttons > .button em {}
		#srv .grid > ul > li > .buttons > .button em:before { content:"Érdekel"; }
		
		#srv .grid > ul > li[data-label="bui"] > .picto > i { background-image:url("../../images/assets/white/epulet-homlokzat.webp?v=2"); }
		#srv .grid > ul > li[data-label="rft"] > .picto > i { background-image:url("../../images/assets/white/palatetok.webp?v=2"); }
		#srv .grid > ul > li[data-label="sol"] > .picto > i { background-image:url("../../images/assets/white/napelem-hatekonysag.webp?v=2"); }
		#srv .grid > ul > li[data-label="lrg"] > .picto > i { background-image:url("../../images/assets/white/silok-tartalyok.webp?v=2"); }
		#srv .grid > ul > li[data-label="wnt"] > .picto > i { background-image:url("../../images/assets/white/magas-szerkezetek.webp?v=2"); }
		#srv .grid > ul > li[data-label="ind"] > .picto > i { background-image:url("../../images/assets/white/ipari-kemenyek.webp?v=2"); }
		#srv .grid > ul > li[data-label="sta"] > .picto > i { background-image:url("../../images/assets/white/szobrok.webp?v=2"); }
		#srv .grid > ul > li[data-label="wto"] > .picto > i { background-image:url("../../images/assets/white/viztornyok-templomtornyok.webp?v=2"); }
		#srv .grid > ul > li[data-label="brg"] > .picto > i { background-image:url("../../images/assets/white/hidak-feluljarok.webp?v=2"); }

		/* XXXXL   */ @media screen and (min-width:1600px)                          {}
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {}
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {}
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {}
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {}
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) {}
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) {}
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {}
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {}
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {}
		/*  -XXS   */ @media screen and (min-width:   0px) and (max-width: 519.8px) {}
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {}
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {
			#srv .grid > ul[data-buttons="0"] > li > .picto {
				height: auto;
				margin-bottom: 10px;
		}
    }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {}




	/*										*/
	/*	Technológiánk						*/
	/*										*/

		#tec {}
		#tec .background {
			padding-block:0 70px;
		}
		#tec .background .creative {
			width: 100vw;
			height: 500px;
			margin-bottom:70px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/14.webp?v=2);
		}
		#tec .background .creative-1 {
			position: absolute;
			z-index: 0;
			left: 40%;
			transform: translate(calc(-500px + -80px  + -50%), -15%);
			width:  300px;
			height: 300px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/5.webp?v=2);
			border-radius: 15px;
			overflow: hidden;
		}
		#tec .background .creative-2 {
			position: absolute;
			z-index: 0;
			left: 60%;
			transform: translate(calc(0px + 280px  + 50%), -85%);
			width:  300px;
			height: 300px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/4.webp?v=2);
			border-radius: 15px;
			overflow: hidden;
		}
		#tec .framed {
			position: relative;
			z-index: 2;
		}
		#tec .framed:before {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			z-index: -1;
			background-color: var(--blue);
			opacity: 0.75;
			border-radius: inherit;
		}
		#tec .inset {
			padding: 10px 80px 30px 80px;
		}
		#tec .inset.baseline-on-rule {
			padding: 0;
		}
		#tec h3 {
			margin-top: 10px;
			margin-bottom: 25px;
			text-align: center; 
			text-transform: uppercase;
			letter-spacing: 0.5pt;
			font-weight: 300;
			font-size: 1.5rem;
			line-height: 1.3;
		}
		#tec h4 {
			font-size:1.3rem;
			line-height:1.2;
			color:var(--extralightblue);
			margin: 15px 0 5px 0;
			padding:0;
			letter-spacing: 0.3pt;
			text-wrap:balance;
		}
		#tec p.prolog,
		#tec p.epilog {
			text-align: center;
			text-wrap:balance;
			color: white;
			font-weight: 500;
		}		
		#tec ul.simple-list {
			font-weight:300;
			font-size: 1.0rem;
			line-height: 1.5;
		}
		#tec ul.simple-list li {}
		#tec ul.simple-list li i {
			display:block;
			position:relative;
			width:20px;
			height:20px;
			margin:0 0 -20px 0;
			background-image: url("../../images/assets/white/checked.webp?v=2");
			background-size: 15px;
			background-position: left 80%;
		}
		#tec ul.simple-list li i:before {
			display:block;
			position:relative;
			top:-0.2em;
			content:"•";
			font-size:1.5em;
			line-height:1.2;
			color:white;
			display: none;
		}
		#tec ul.simple-list li em {
			display:block;
			position:relative;
			margin:0 0 0 25px;
		}
		#tec .columns {
			margin-block:15px 25px;
		}
		#tec .columns .column .inner-mirror {
			padding:0 5% 0 0;
		}
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) {  }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { #tec .columns[data-split="1-1"] .column { width: 100%; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*  -XXS   */ @media screen and (min-width:   0px) and (max-width: 519.8px) { #tec .inset { padding: 10px 50px 30px 50px; } #tec p.prolog, #tec p.epilog { text-align: left; } }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {  }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  }
		

	/*										*/
	/*	Pontos felmérés						*/
	/*										*/

		#prc {}
		#prc .background {
			background-color:var(--blue);
			padding-block: 50px 100px 0 100px;
		}
		#prc .background .creative-1 {
			position: absolute;
			z-index: 0;
			left: 40%;
			transform: translate(calc(-500px + -80px  + -50%), -15%);
			width:  300px;
			height: 300px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/8.webp?v=2);
			border-radius: 15px;
			overflow: hidden;
		}
		#prc .background .creative-2 {
			position: absolute;
			z-index: 0;
			left: 60%;
			transform: translate(calc(0px + 280px  + 50%), -85%);
			width:  300px;
			height: 300px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/9.webp?v=2);
			border-radius: 15px;
			overflow: hidden;
		}
		#prc .inset {
			padding: 10px 80px 50px 80px;
		}
		#prc .inset.baseline-on-rule {
			padding: 0;
		}
		#prc .framed {
			position: relative;
			z-index: 2;
		}
		#prc .framed:before {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			z-index: -1;
			background-color: var(--blue);
			opacity: 0.75;
			border-radius: inherit;
		}
		#prc h3 {
			margin-top: 10px;
			margin-bottom: 25px;
			text-align: center; 
			text-transform: uppercase;
			letter-spacing: 0.5pt;
			font-weight: 300;
			font-size: 1.5rem;
			line-height: 1.3;
		}
		#prc h4 {
			font-size:1.3rem;
			color:var(--extralightblue);
			margin: 15px 0 5px 0;
			padding:0;
			letter-spacing: 0.3pt;
		}
		#prc p.prolog,
		#prc p.epilog {
			text-align: center;
			text-wrap:balance;
			color: white;
			font-weight: 500;
		}		
		#prc ul.simple-list {
			font-weight:300;
			font-size: 1.0rem;
			line-height: 1.5;
		}
		#prc ul.simple-list li {}
		#prc ul.simple-list li i {
			display:block;
			position:relative;
			width:20px;
			height:20px;
			margin:0 0 -20px 0;
			background-image: url("../../images/assets/white/checked.webp?v=2");
			background-size: 15px;
			background-position: left 80%;
		}
		#prc ul.simple-list li i:before {
			display:block;
			position:relative;
			top:-0.2em;
			content:"•";
			font-size:1.5em;
			line-height:1.2;
			color:white;
			display: none;
		}
		#prc ul.simple-list li em {
			display:block;
			position:relative;
			margin:0 0 0 25px;
			padding-right:5%;
		}
		
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) {  }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { #prc .columns[data-split="1-1"] .column { width: 100%; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*  -XXS   */ @media screen and (min-width:   0px) and (max-width: 519.8px) { #prc .inset { padding: 10px 50px 30px 50px; } }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {  }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  }
		

	/*										*/
	/*	Karbantartási szolgáltatás 			*/
	/*										*/

		#mnt {}
		#mnt .block {
			position: relative;
		}
		#mnt .background {
			background-color:var(--blue);
			padding-block:0 50px;
		}
		#mnt .background[data-skin="blue"] .baseline-on-rule > h2 {
			background-color: var(--blue);
		}
		#mnt .background .creative {}
		#mnt .inset {
			padding: 10px 80px 30px 80px;
		}
		#mnt .inset.baseline-on-rule {
			padding: 0;
		}
		#mnt .inset.has-picto {
		}
		#mnt .inset.has-picto i {
			display: block;
			position: relative;
			width:       100px;
			height:      100px;
			margin: 0 0 -100px 0;
			left: -10px;
			top:-10px;
			background-image: url("../../images/assets/white/szolgaltatasaink.webp?v=2");
			background-size: contain;
			background-repeat: no-repeat;
			outline: 1px solid orange;
			outline:none;
		}
		#mnt .inset.has-picto p {
			margin: 0 0 0 100px;
		}
		#mnt h3 {
			margin-top: 10px;
			margin-bottom: 25px;
			text-align: center;
			text-transform: uppercase;
			letter-spacing: 0.5pt;
			font-weight: 300;
			font-size: 1.5rem;
			line-height: 1.2;
		}
		#mnt p strong {
			font-weight: 700;
			color: white;
			letter-spacing: 0.3pt;
		}
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {}
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) {}
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) {}
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {}
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {}
		/*   -XS   */ @media screen and (min-width:   0px) and (max-width: 579.8px) { #mnt .inset { padding: 10px 50px 30px 50px; } #mnt .inset.has-picto i { width: 100%; margin-bottom: 0; } #mnt .inset.has-picto p { margin-left: 0; text-align: center; } }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {}
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {}
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {}
		
		
	/*										*/
	/*	Hagyományos vs. Drónos tisztítás	*/
	/*										*/

		#cmp .background .creative-1 {
			position: absolute;
			z-index: 0;
			left: 40%;
			transform: translate(calc(-500px + -80px  + -50%), -15%);
			width:  300px;
			height: 300px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/10.webp?v=2);
			border-radius: 15px;
			overflow: hidden;
		}
		#cmp .background .creative-2 {
			position: absolute;
			z-index: 0;
			left: 60%;
			transform: translate(calc(0px + 280px  + 50%), -85%);
			width:  300px;
			height: 300px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/11.webp?v=2);
			border-radius: 15px;
			overflow: hidden;
		}
		#cmp .framed {
			position: relative;
			z-index: 2;
		}
		#cmp .framed:before {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			z-index: -1;
			background-color: var(--blue);
			opacity: 0.75;
			border-radius: inherit;
		}
		#cmp .inset {
			padding: 10px 80px 30px 80px;
		}
		#cmp .inset.baseline-on-rule {
			padding: 0;
		}
		#cmp .inset .comparison {
		}
		#cmp .inset .comparison > ul {
			white-space: nowrap;
			margin: 0; padding: 0;
			font-size: 0; line-height: 0;
		}
		#cmp .inset .comparison > ul > li {
		}
		#cmp .inset .comparison > ul > li > .col {
			display: inline-block;
			vertical-align: middle;
			white-space: normal;
			font-size: 1rem;
			line-height: 1.4;
		}
		#cmp .inset .comparison > ul > li > .col:nth-child(1) { width: calc(33.3% - 11px); border-right: 1px solid var(--lightblue);; margin-right: 10px; }
		#cmp .inset .comparison > ul > li > .col:nth-child(2) { width: calc(33.3% - 11px); border-right: 1px solid var(--lightblue);; margin-right: 10px; }
		#cmp .inset .comparison > ul > li > .col:nth-child(3) { width: calc(33.3% - 0px); }


		#cmp .inset .comparison > ul.head {
			border-bottom: 1px solid var(--lightblue);
			font-weight: 700;
			color: white;
			letter-spacing: 0.3pt;
		}
		#cmp .inset .comparison > ul.head > li > .col {
			padding: 10px 0;
		}
		
		#cmp .inset .comparison > ul.body li {
			border-bottom: 1px solid var(--lightblue);
		}
		#cmp .inset .comparison > ul.body li:last-child { border-bottom: none; }
		#cmp .inset .comparison > ul.body > li {}
		#cmp .inset .comparison > ul.body > li > .col {
			padding: 5px 0;
			height: 60px;
		}
		#cmp .inset .comparison > ul.body > li > .col > i {
			display: block;
			position: relative;
			width:       25px;
			height:      25px;
			margin: 0 0 -25px 0;
			background-repeat: no-repeat;
			background-size: contain;
			top: 50%;
			transform: translateY(-50%);
			border-radius: 25px;
			box-shadow: 0 0 0 2px white;
		}
		#cmp .inset .comparison > ul.body > li > .col:nth-child(2) > i { background-color: #BF0000; }
		#cmp .inset .comparison > ul.body > li > .col:nth-child(3) > i { background-color: #00B905; }
		
		#cmp .inset .comparison > ul.body > li > .col:nth-child(1) > i { display: none; }
		#cmp .inset .comparison > ul.body > li > .col:nth-child(2) > i { background-image:url(../../images/assets/white/menu-hide.webp?v=2); }
		#cmp .inset .comparison > ul.body > li > .col:nth-child(3) > i { background-image:url(../../images/assets/white/checked.webp?v=2); }
		#cmp .inset .comparison > ul.body > li > .col > em {
			display: block;
			margin: 0 0 0 35px;
			top: 50%;
			transform: translateY(-50%);
			position: relative;
		}
		#cmp .inset .comparison > ul.body > li > .col:nth-child(1) > em { 
			margin:0;
			text-transform: uppercase;
			color: white;
			font-weight: 500;
			letter-spacing: 0.3pt;
		}
		
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) {}
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { #cmp .inset { padding: 0px 10px 0px 10px; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*   -XS   */ @media screen and (min-width:   0px) and (max-width: 579.8px) { #cmp .inset .comparison > ul > li > .col { font-size: 0.8rem; } }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {  }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  }
		

	/*										*/
	/*	Eredményeink számokban				*/
	/*										*/

		#num {
		}
		#num .background { 
			background-color: var(--darkblue); 
		}
		#num .mirror {
			margin-top: 45px;
			margin-bottom: 15px;
		}
		#num h2 {
			text-align: center;
			font-size: 3rem;
			line-height: 1.1;
			font-weight: 300;
			margin-bottom: 10px;
		}
		#num h2 b {
			font-weight: 700;
			color: var(--lightblue);
		}
		#num .counters {
			width: calc(100% + 100px);
			margin: 0;
			position: relative;
			left: 50%;
			transform: translateX(-50%);
			padding:50px 0 10px 0;
			list-style: none;
			white-space: nowrap;
			text-align: center;
		}
		#num .counters .counter-items {
			text-align: center;
		}
		#num .counters .counter-items > li {
			display: inline-block;
			position: relative;
			vertical-align: middle;
		}
		#num .counters .counter-items > li {
			opacity: 0.25;
			transition: opacity 1s ease;
		}
		#num .counters .counter-items > li.updating {
			opacity:1;
		}
		
		#num .counters .counter-items > li .inner-mirror {
			padding: 25px;
		}
		#num .counters .counter-items > li:before {
			content:"";
			display: block;
			position: absolute;
			width: 6px;
			height: calc(100% + 20px);
			top: -10px;
			background-color: var(--blue);
			transform-origin: center;
			transform:rotate(13deg);
		}
		#num .counters .counter-items > li:first-child:before { display: none; }
		#num .counters .counter-items h6 {
			display: block;
			font-size: 1.5rem;
			line-height: 1.2;
			font-weight: 400;
			text-align: center;
		}
		#num .counters .counter-items b {
			display: block;
			font-size: 2em;
			font-weight: 700;
			color: var(--lightblue);
			color: var(--lightgreen);
		}
		#num .counters .counter-items span.c-digits {
			display: inline-block;
			margin: 0;
			padding: 0;
			letter-spacing: -0.0em;
		}
		#num .counters .counter-items span.c-digits span.c-digit {
			display: inline-block;
			width: 0.66em;
			margin: 0; padding: 0;
		}
		
		#num .counters .counter-items > li[data-label="srf"] {}
		#num .counters .counter-items > li[data-label="scp"] {}
		#num .counters .counter-items > li[data-label="acd"] {}
		#num .counters .counter-items > li[data-label="stf"] {}

		#num .counters .counter-items > li[data-label="srf"] h6 {}
		#num .counters .counter-items > li[data-label="scp"] h6 {}
		#num .counters .counter-items > li[data-label="acd"] h6 {}
		#num .counters .counter-items > li[data-label="stf"] h6 {}
		
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) { #num .counters .counter-items h6 { font-size: 1.1rem; } }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { #num .counters { padding: 25px 0 0 0; } #num .counters .counter-items > li { display: block; } #num .counters .counter-items > li:before { display: none; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {  }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  }


	/*										*/
	/*	Gyakran ismételt kérdések			*/
	/*										*/

		#faq {}
		#faq {}
		#faq .background {
			background-color:var(--blue);
			padding-block:0 50px;
		}
		#faq .background .creative {
			width: 100vw;
			height: 500px;
			margin-bottom:50px;
			background-size: cover;
			background-position: center;
			background-image: url(../../images/page/15.webp?v=2);
			/* background-attachment: fixed; */
		}
		#faq h2 {
			text-align: center;
			font-size: 3rem;
			line-height: 1.2;
			font-weight: 300;
			margin: 0 0 70px 0;
		}
		#faq h2 b {
			font-weight: 700;
			color: var(--lightblue);
		}
		#faq .questions {}
		#faq .questions > .qa-items {
			columns:2;
			break-inside: avoid;
			will-change: transform;
		}
		#faq .questions > .qa-items > li {
			display: block;
			break-inside: avoid;
		}
		#faq .questions > .qa-items > li > button {
			display: block;
			position: relative;
			appearance:none;
			border:none;
			background-color: transparent;
			width:       100%;
			height:      40px;
			margin: 0 0 -40px 0;
			outline: 1px solid yellow;
			outline: none;
			cursor: pointer;
		}
		#faq .questions > .qa-items > li > button > i {
			display: block;
			position: relative;
			width:  20px;
			height: 25px;
			left: -5px;
			top: -5px;
			
			background-image: url("../../images/assets/white/arrow-right.webp?v=2"); 
			background-size: contain;
			background-repeat: no-repeat;
			pointer-events: none;
			transform-origin: center;
			transition: transform 0.6s ease;
			opacity: 0.5;
			opacity: 1;
		}
		#faq .questions > .qa-items > li.expanded > button > i {
			transform: rotate(90deg);
		}
		#faq .questions > .qa-items > li > button:hover {}
		#faq .questions > .qa-items > li > p.que {
			display: block;
			position: relative;
			margin: 0 0 0 35px;
			font-weight: 500;
			font-size: 1.2rem;
			line-height: 1.2;
			color: var(--extralightblue);
			pointer-events: none;
			letter-spacing: 0.2pt;
			text-shadow: 0 1px 3px #00000059;
		}
		#faq .questions > .qa-items > li > p.ans {
			margin: 0px 0 10px 35px;
			padding:0;
			height: auto;
			max-height: 0;
			overflow: hidden;
			transition: max-height 0.2s ease, margin 0.2s ease, opacity 0.4s ease;
			/*@starting-style { height: 0; }*/
			opacity: 0;
			-webkit-font-smoothing: antialiased;
			font-weight: 600;
			font-size: 1.0rem;
			line-height: 1.4;
			}
		#faq .questions > .qa-items > li.expanded > p.ans { 
			margin: 10px 0 20px 35px;
			max-height: 400px;
			opacity: 1;
		}
		#faq .questions > .qa-items > li.expanded > button > i { 
			opacity: 1;
		}
		#faq .questions[data-template="toggle-one"] {}
		#faq .questions[data-template="all-expanded"] {}
		
		#faq .questions[data-template="all-expanded"] > .qa-items { counter-reset:item; }
		#faq .questions[data-template="all-expanded"] > .qa-items > li {
			padding-top: 10px;
			padding-left: 10px;
			margin-top: -10px;
			margin-left: 10px;
			margin-bottom: 25px;
		}
		#faq .questions[data-template="all-expanded"] > .qa-items > li > button > i {
			font-family: "Exo 2";
			font-size: 1.25rem;
			line-height: 25px;
			background-image: none;
			background-color: var(--green);
			width:  30px;
			height: 30px;
			border-radius: 15px;
			color: white;
			color: var(--darkblue);
		}
		#faq .questions[data-template="all-expanded"] > .qa-items > li > button > i::before{
			counter-increment:item;
			content:counter(item);
		}
		#faq .questions[data-template="all-expanded"] > .qa-items > li > button > i::after{ content:"."; }
		#faq .questions[data-template="all-expanded"] > .qa-items > li > p.que {
			font-size: 1.5rem;
			margin-bottom: 5px;
			color: white;
		}
		#faq .questions[data-template="all-expanded"] > .qa-items > li > button { pointer-events: none; }
		#faq .questions[data-template="all-expanded"] > .qa-items > li > p.ans { 
			height: auto;
			max-height:none;
			opacity: 1;
			padding: 0 0 0 0.2em;
			font-weight: 400;
		}
		/* XXXXL   */ @media screen and (min-width:1600px)                          {  }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) {  }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) {  }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) {  }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) {  }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) {  }
		/*   -MS   */ @media screen and (min-width:   0px) and (max-width: 859.8px) { #faq .questions > .qa-items { columns:1; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) {  }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) {  }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) {  }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) {  }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) {  }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) {  }
		

		

	/*										*/
	/*	Kapcsolat							*/
	/*	Ajánlatkérés						*/
	/*										*/

		#cnt {}
		#cnt .background { background-color: white; }
		#cnt h2 {
			text-align: center;
			font-size: 3rem;
			line-height: 1.2;
			font-weight: 400;
			margin: 0 0 70px 0;
			color: var(--blue);
			text-wrap:balance;
		}
		#cnt p b { font-weight: 700; }
		#cnt .firm { margin: 30px 0 30px 0; }
		#cnt .firm * { margin:0; color: var(--darkblue); text-decoration: none; }
		#cnt .firm .f-name  { font-size: 1.2em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.3pt; margin-bottom: 5px; }
		#cnt .firm .f-email {}
		#cnt .firm .f-tel   {}
		#cnt .firm .f-web   {}

		#cnt .conditional-contents {}
		#cnt .conditional-contents .conditional-content {display: none;}
		#cnt .conditional-contents[data-content="form"]     .conditional-content[data-label="form"],
		#cnt .conditional-contents[data-content="progress"] .conditional-content[data-label="progress"],
		#cnt .conditional-contents[data-content="success"]  .conditional-content[data-label="success"],
		#cnt .conditional-contents[data-content="failed"]   .conditional-content[data-label="failed"] {
			display: block;
		}

		#cnt .conditional-contents[data-content="success"] .conditional-content[data-label="form"],
		#cnt .conditional-contents[data-content="failed"] .conditional-content[data-label="form"],
		#cnt .conditional-contents[data-content="progress"] .conditional-content[data-label="form"] {
			display: block;
			position: absolute;
			opacity: 0.2;
			pointer-events: none;
			filter:blur(1px);
		}
		#cnt .conditional-content[data-label="progress"],
		#cnt .conditional-content[data-label="success"],
		#cnt .conditional-content[data-label="failed"] {
			height:400px;
			text-align: center;
			outline: 1px dashed orange;
			outline: none;
		}
		#cnt .conditional-content .response {
			display:block;
			vertical-align:top;
			position:relative;
			top: 50%;
			left: 50%;
			transform:translate(-50%,-50%);
		}
		#cnt .conditional-content[data-label="progress"] .response {
			display:block;
			vertical-align:top;
			position:relative;
			top: 50%;
			left: 50%;
			transform:translate(-50%,-50%);
		}
		#cnt .conditional-content[data-label="progress"] .response i {
			display: block;
			position: relative;
			background-image: url("../../images/form/ajax-loader-16x16.gif");
			background-position: center;
			width: 200px;
			height: 12px;
			border-radius: 12px;
			margin: 0 auto;
			background-image: url("../../images/form/bar22.gif");
			background-size: 22px 100%;
			background-repeat: repeat-x;
			box-shadow: inset 0 0 10px 0 rgba(0,0,0,0.3);
			overflow: hidden;
			left: 3px;
		}
		#cnt .conditional-content[data-label="progress"] .response i .bar {
			display: block;
			position: absolute;
			inset:0;
			width: 50%;
			width: 10%;
			background-image: url("../../images/form/bar22-blue.gif");
			background-size: 22px 100%;
			background-repeat: repeat-x;
		}
		#cnt .conditional-content .response em {
			display: block;
			position: relative;
			margin: 0 0 0 30px;
			text-align: center;
			margin: 10px 0 0 0;
		}
		#cnt .conditional-content[data-label="success"] .response i,
		#cnt .conditional-content[data-label="failed"] .response i {
			display: block;
			position: relative;
			width:       40px;
			height:      40px;
			margin: 0 auto 5px auto;
			background-size: 40px;
			background-position: center;
			background-repeat: no-repeat;
		}
		#cnt .conditional-content[data-label="success"] .response i { background-image: url("../../images/form/progress-bar-circle-done.png"); }
		#cnt .conditional-content[data-label="failed"]  .response i { background-image: url("../../images/form/progress-bar-triangle-failed.png"); }		
		#cnt .conditional-content[data-label="failed"]  .response em { color:#BF0000; }		
		
		#cnt .progress { display: none; }
		
	/*					*/
	/* Űrlapok 			*/
	/*					*/

		.form {
			display: block;
			position: relative;
			border-radius: 5px;
			padding: 5px 15px 5px 15px;
			margin: 0 0 0 0;
			width: calc(100% - 0px);
			font-family: "Exo 2", sans-serif;
			font-size:1rem;
			line-height:1.2;
			font-weight: normal;
			font-style: normal;
		}
		/* default font size */

			.form .form-label em,
			.form .form-value input,
			.form .form-value textarea,
			.form .form-value select,
			.form .form-value i,
			.form .form-value em,
			.form .form-value .placeholder {
				font-size: 1.0rem;
				line-height: 1.2;
			}
		.form-elements {font-size: 0;line-height: 0;margin: 0;padding: 0;text-align: left;}
		.form-element {
			font-size: 0;
			line-height: 0;
			margin: 0 0 10px 0;
			padding: 0;
			position: relative;
		}
		.form-element .form-label {
			display: block;
			position: relative;
			height: 40px;
			margin-bottom: -40px;
			width: var(--label_size);
			left:-10px;
			text-align: right;
			color:var(
			--darkblue);
		}	
		.form-element .form-label em {
			display: block;
			font-size:0.9rem;
			font-style: 300;
		}
		.form-element .form-label em:hover {
			cursor: context-menu;
		}
		.form-element .form-value {
			display: inline-block;
			vertical-align: top;
			margin: 0;
			padding: 0;
		}
		.form .progress {
			position: absolute;
			inset:0;
			background-color: rgba(255,255,255,0.7);
			z-index: 999;
			backdrop-filter:blur(5px);
		}
		.form .progress:before,
		.form .progress:after {
			content:"";
			display: block;
			position: absolute;
			inset:0;
			background-repeat: no-repeat;
			background-position: center center;
			mix-blend-mode:multiply
		}
		.form .progress:before { background-size: 100px; background-image: url("../../images/elements/progress-forward.svg" ); animation: processing_forward  2.5s infinite; animation-timing-function:linear; }
		.form .progress:after  { background-size: 100px; background-image: url("../../images/elements/progress-backward.svg"); animation: processing_backward 2.5s infinite; animation-timing-function:linear; }

		@keyframes processing_forward {
			from	{ transform:rotate(0deg);  }
			to		{ transform:rotate(360deg) }
		}
		@keyframes processing_backward {
			from	{ transform:rotate(360deg);  }
			to		{ transform:rotate(0deg) }
		}
		/* states */

		form[name="registration"]                    .progress { display: none; }
		form[name="registration"][data-progress="1"] .progress { display: block; }

		.form .progress .message {}
		.form .progress .message i {}
		.form .progress .message em {}
		.form .form-label {}
		.form .form-element[data-type="text1row"] input {}
		.form .form-element[data-type="text3rows"] textarea {}
		.form .form-element[data-type="radios"] label {
			display: inline-block;
			margin: 0 10px 10px 0;
		}

		/* gaps */

		#admin .page .form .form-element[data-type="copy"][data-gap_before="0"]  { margin-top:0px; }
		#admin .page .form .form-element[data-type="copy"][data-gap_before="10"] { margin-top:10px; }
		#admin .page .form .form-element[data-type="copy"][data-gap_before="15"] { margin-top:15px; }
		#admin .page .form .form-element[data-type="copy"][data-gap_before="25"] { margin-top:25px; }

		#admin .page .form .form-element[data-type="copy"][data-gap_after="0"]  { margin-bottom:0px; }
		#admin .page .form .form-element[data-type="copy"][data-gap_after="10"] { margin-bottom:10px; }
		#admin .page .form .form-element[data-type="copy"][data-gap_after="15"] { margin-bottom:15px; }
		#admin .page .form .form-element[data-type="copy"][data-gap_after="25"] { margin-bottom:25px; }




	/*					*/
	/* RESPONSIVES		*/
	/*					*/

		/* Main grid */

		/* XXXXL   */ @media screen and (min-width:1600px)                        { .mirror { width: 1400px; } }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599px) { .mirror { width: 1200px; } }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439px) { .mirror { width: 1100px; } }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239px) { .mirror { width: 1000px; } }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039px) { .mirror { width: 900px; } }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959px) { .mirror { width: 800px; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859px) { .mirror { width: 650px; } }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699px) { .mirror { width: 560px; } }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579px) { .mirror { width: 500px; } }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519px) { .mirror { width: 400px; } }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439px) {
			.mirror { width: calc(100% - 50px); }
			.mirror h2 {
				text-align: center;
				font-size: 2rem;
				margin-bottom: 15px;
			}
			.mirror .inset {
				padding-inline:25px;
			}
			.mirror .inset.baseline-on-rule {
				padding-inline:0;
			}
			.mirror .inset h3 {
				margin-bottom: 10px;
				font-size: 1.0rem;
			}
			.mirror .inset p,
			.mirror .inset ul,
			.mirror .inset li {
				margin-right: -15px;
				hyphens: auto;
				font-size: 0.9rem;
			}
			.pictos-title h2 {
				font-size: 1.25rem;
			}
			.pictos-title:before {
				transform: translateY(-60%);
			}
			.picto-items[data-count="4"] > .scroller > ul {
				display: block;
				white-space: normal;
			}
			.picto-items[data-count="4"] > .scroller > ul > li {
				width: calc(50% - 2px);
				vertical-align:top;
			}
			.columns .column {}
			.columns[data-split="1-2"] .column:nth-child(1),
			.columns[data-split="1-2"] .column:nth-child(2) {
				display: block;
				width: 100%;
			}
			header .menu > .menu-body nav > .menu-items > .background::after { border-radius: 25px; }
			header .menu > .menu-head .logo a i {
				width: 100px; 
				margin-top:2px;
				margin-left: 5px;
			}
			header .menu > .menu-head .logo a em.slogan {
				display: inline-block;
				width: calc(100% - 165px);
				font-size: 0.83rem;
				line-height: 1.1;
				outline: 1px solid rgba(255,255,21,0.56);
				outline: none;
			}
			header .menu > .menu-head .logo a em.slogan .sl1 { font-size:1em; }
			header .menu > .menu-head .logo a em.slogan .sl2 { font-size:0.8em; }
			header .menu > .menu-body nav > .menu-items { 
				width: calc(100vw - 30px); 
				height:calc(100vh - 90px); 
				height:calc(100dvh - 90px); 
				height:calc(100svh - 90px); 
				right:15px; 
				top:75px; 
				opacity: 1; 
				border-radius: 15px; 
			}
			header .menu > .menu-body > nav > .menu-items > .background > ul {
				display: inline-block;
				z-index: 3;
				position: relative;
				left: calc(50% - 5vw);
				top: 50px;
				transform: translate(-50%, 0%);
				pointer-events: all;
				width: auto;			
			}
			header .menu > .menu-body nav > .menu-items > .background { width: 100%; border-radius: 20px; overflow: hidden; box-shadow:0 0 0 30px #0083e780, 0 0 15px 0 rgba(0,0,0,0.5); }
			header .menu > .menu-body nav > .menu-items > .background::after { border-radius: inherit; }
			
			header:has(label.show-menu input:checked) i.toggle-icon { right:25px; top:25px; }
			.inset.baseline-on-rule h2 {font-size: 1.1rem;transform: translate(-50%,-60%);}
			
			.creative-1,
			.creative-2 {
				display: none;
			}
			
			#int h3 { font-size: 1.25rem; margin-top: 30px; }
			#int p { font-size: 1rem; }
			
			#drn .picto-items > .scroller > ul { white-space: normal; }
			#drn .picto-items[data-count="4"] > .scroller > ul > li { width: calc(50% - 2px); }
			#drn .picto-items > .scroller > ul > li { vertical-align: top; }
			#drn h3 { font-size: 1.25rem; margin-top: 30px; }
			#drn p { font-size: 1rem; }
			#drn .list-items > ul { font-size: 1rem; }
			#drn .list-items > ul > li > i { width: 25px; height: 25px; margin-bottom: -25px; top: 0; }
			#drn .list-items > ul > li > span { margin: 0 0 0 30px; }
			#drn .list-items > ul > li > span > em { display: block; margin: 0 0 10px 0; }
			#drn .list-items > ul > li > span > em:before { content: ""; }
			
			#tec .background { padding-bottom: 20px; }
			#tec .inset {padding: 10px 30px 40px 30px;}
			#tec .columns[data-split="1-1"] { margin-block: 25px; }
			#tec .columns[data-split="1-1"] .column { width: 100%; display: block; }
			#tec .inner-mirror h4 {text-align: center;margin-top: 30px;margin-bottom: 15px;}
			#tec .inset.baseline-on-rule h2 { }
			
			#prc  .inset {padding: 10px 30px 40px 30px;}
			
			#srv .grid {padding: 0 10px 0 20px;}
			#srv .grid > ul { display: block; }
			#srv .grid > ul > li { margin-bottom: 30px; }
			#srv .grid > ul > li > .buttons { position: relative; }
			#srv .grid > ul > li > .picto {margin-bottom: 15px;height: auto;}
			#srv .grid > ul > li > .picto > i {margin: 0 auto;margin-bottom: 10px;}
			#srv .grid > ul > li > .picto > em { text-wrap:none; width: 100%; margin: 0; text-align: center; transform: none; top:0; }
			#srv .grid > ul > li > p { position: relative; top: 0; transform:none; margin: 15px 0 0 0; }
			#srv .grid > ul[data-buttons="0"] > li > p { padding:0; text-align:center; }
			
			#mnt .background { padding-bottom: 25px; }
			#mnt .inset {padding: 0px 30px 0px 30px;}
			#mnt .mirror .inset.baseline-on-rule {padding-inline:0;}
			#mnt .inset.has-picto { padding-bottom: 25px; }
			#mnt .inset.has-picto h3 { text-wrap:balance; }
			#mnt .inset.has-picto i { display: block; width: 100%; margin-bottom: 5px; }
			#mnt .inset.has-picto p { margin: 0; text-align: left; }
			
			#faq h2 { font-size: 2rem; line-height: 1.2; margin: 0 0 30px 0; }
			#faq .questions > .qa-items { columns:1; }
			#faq .questions > .qa-items > li > p.que { font-size: 1rem; color: var(--lightblue); }
			#faq .questions > .qa-items > li.expanded > p.que { color: var(--extralightblue); }
			#faq .questions > .qa-items > li.expanded > p.ans { font-size: 1rem; font-weight: 400; }
			#faq .background .creative { /* background-attachment:fixed; */ }
			
			#num .background { min-height: 50vh; padding-block:0; align-content: center; }
			#num .background .mirror {   }
			#num h2 { font-size: 2rem; line-height: 1; }
			#num .counters { padding:20px 0 10px 0; }
			#num .counters .counter-items h6 { font-size: 1.1rem; }
			#num .counters .counter-items > li { display: block; }
			#num .counters .counter-items > li .inner-mirror { padding:0 0 15px 0; }
			
			#cmp .background { padding-block: 30px 60px; }
			#cmp .inset { padding: 10px 0px 0 0px; }
			#cmp .inset .comparison { width: 100%; overflow: hidden; }
			#cmp .inset .comparison > ul.head { border-top:1px solid var(--lightblue); background-color: rgba(255,255,255,0.2);  }
			#cmp .inset .comparison > ul > li { margin: 0; }
			#cmp .inset .comparison > ul > li > .col { font-size: 0.8rem; line-height: 1.2; height: 35px; }
			#cmp .inset .comparison > ul.head > li > .col { padding: 5px 0; }
			#cmp .inset .comparison > ul.head > li:first-child > .col {  }
			#cmp .inset .comparison > ul.head > li > .col:nth-child(2) > em { display: block; padding-left: 5px; padding-right: 10px; }
			#cmp .inset .comparison > ul.head > li > .col:nth-child(3) > em { display: block; padding-left: 5px; padding-right: 10px; }
			#cmp .inset .comparison > ul > li > .col:nth-child(1) { width:calc(27.33% - 1px); margin-right:0; }
			#cmp .inset .comparison > ul > li > .col:nth-child(2) { width:calc(36.33% - 1px); margin-right:0; }
			#cmp .inset .comparison > ul > li > .col:nth-child(3) { width:calc(36.33% - 1px); margin-right:0; }
			#cmp .inset .comparison > ul > li > .col:nth-child(1) em { padding-left: 10px;}
			#cmp .inset .comparison > ul > li > .col em { hyphens: auto; }
			#cmp .inset .comparison > ul.body > li > .col > i { width: 15px; height: 15px; margin-bottom: -15px; left:5px; }
			#cmp .inset .comparison > ul.body > li > .col > em { margin: 0 0 0 30px; }
			#cmp .inset .comparison > ul.body > li > .col:nth-child(3) > em { padding-right: 10px; }
			
			#cnt .conditional-contents { width: 100%; }
			#cnt h2 { font-size: 2rem; line-height: 1.2; margin: 0 0 30px 0; }
			#cnt .columns[data-split="1-1"][data-gap="1"] .column:first-child,
			#cnt .columns[data-split="1-1"][data-gap="1"] .column:last-child { width: 100%;}
			#cnt .columns[data-rule="between"] .column:last-child:before { content:""; display: none; }
			#cnt .firm { text-align: center; margin-bottom: 30px; }
			#cnt .slogan { text-align: center; margin-bottom: 30px; text-wrap:balance; }
			#cnt .form { padding: 5px 0 5px 0; }
			#cnt .form .inset { padding: 0; }
			#cnt .form .form-element[data-type="button"] {  text-align: center; }
			#cnt .form .form-element[data-type="button"][data-input_size="100"] {width: 100%;}
			#cnt .form .form-element[data-type="button"] .form-label { display: none; }
			#cnt .form .form-element[data-type="button"] .form-value {width: auto;margin: 0 auto;text-align: center;display: inline-block;}
		}
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329px) { .mirror { width: calc(100% - 50px); } }

		/* Subgrid */

		/*   XXL4  */ @media screen and (min-width:1400px) and (max-width:1439px) {}
		/*   XXL3  */ @media screen and (min-width:1340px) and (max-width:1399px) {}
		/*   XXL2  */ @media screen and (min-width:1300px) and (max-width:1339px) {}
		/*   XXL1  */ @media screen and (min-width:1240px) and (max-width:1299px) {}
		/*    XL4  */ @media screen and (min-width:1200px) and (max-width:1239px) {}
		/*    XL3  */ @media screen and (min-width:1140px) and (max-width:1199px) {}
		/*    XL2  */ @media screen and (min-width:1100px) and (max-width:1139px) {}
		/*    XL1  */ @media screen and (min-width:1040px) and (max-width:1099px) {}
		/*     M2  */ @media screen and (min-width: 900px) and (max-width: 959px) {}
		/*     M1  */ @media screen and (min-width: 860px) and (max-width: 899px) {}
		/*     S2  */ @media screen and (min-width: 640px) and (max-width: 699px) {}
		/*     S1  */ @media screen and (min-width: 580px) and (max-width: 639px) {}
		/*  XXXS2  */ @media screen and (min-width: 400px) and (max-width: 439px) {}
		/*  XXXS1  */ @media screen and (min-width: 330px) and (max-width: 399px) {}

		/* Grouped grid */

		/*    -XL   */ @media screen and (min-width:   0px) and (max-width:1239px) {}
	





		
	/*					*/
	/* DEVELOPMENT		*/
	/*					*/

		.mirror { outline: 1px dotted orange; outline: none; }
	
		html[data-loc="site"] body:before,
		html[data-loc="testing"] body:before,
		html[data-loc="development"] body:before {
			display: block;
			position: fixed;
			right: 0;
			bottom: 25px;
			width: auto;
			background-color: #FFFFFFAA;
			box-shadow: 0 0 15px 0 #00000055;
			z-index: 9999999;
			font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
			font-size: 12px;
			line-height: 14px;
			color: black;
			padding: 10px 15px 10px 15px;
			border-left: 20px solid black;
		}

		html[data-loc="testing"] body:before,
		html[data-loc="site"] body:before { display: none; }

		/* Main grid */

		/* XXXXL   */ @media screen and (min-width:1600px)                        { body:before { content:" XXXXL  1600-9999px- "; border-left-color:#F8FF20; } }
		/*  XXXL   */ @media screen and (min-width:1440px) and (max-width:1599.8px) { body:before { content:" XXXL   1440-1599px ";  border-left-color:#00FF1B; } }
		/*   XXL   */ @media screen and (min-width:1240px) and (max-width:1439.8px) { body:before { content:" XXL    1240-1439px ";  border-left-color:#0085AA; } }
		/*    XL   */ @media screen and (min-width:1040px) and (max-width:1239.8px) { body:before { content:" XL     1040-1139px ";  border-left-color:#02CEB5; } }
		/*     L   */ @media screen and (min-width: 960px) and (max-width:1039.8px) { body:before { content:" L       960-1039px ";  border-left-color:#0ED773; } }
		/*     M   */ @media screen and (min-width: 860px) and (max-width: 959.8px) { body:before { content:" M       860- 959px ";  border-left-color:#44D70E; } }
		/*    MS   */ @media screen and (min-width: 700px) and (max-width: 859.8px) { body:before { content:" MS      700- 859px ";  border-left-color:#A0D70E; } }
		/*     S   */ @media screen and (min-width: 580px) and (max-width: 699.8px) { body:before { content:" S       580- 699px ";  border-left-color:#D7CC0E; } }
		/*    XS   */ @media screen and (min-width: 520px) and (max-width: 579.8px) { body:before { content:" XS      520- 579px ";  border-left-color:#D7A60E; } }
		/*   XXS   */ @media screen and (min-width: 440px) and (max-width: 519.8px) { body:before { content:" XXS     440- 519px ";  border-left-color:#BDD70E; } }
		/*  XXXS   */ @media screen and (min-width: 330px) and (max-width: 439.8px) { body:before { content:" XXXS    330- 439px ";  border-left-color:#B1570B; } }
		/* XXXXS   */ @media screen and (min-width:   0px) and (max-width: 329.8px) { body:before { content:" XXXXS     0- 329px ";  border-left-color:#B10B6D; } }

		/* Subgrid */

		/*   XXL4  */ @media screen and (min-width:1400px) and (max-width:1439.8px) { body:before { content:" XXL    1240-1439px (XXL4 1400-1439px) "; border-left-color:#2CD0FF; } }
		/*   XXL3  */ @media screen and (min-width:1340px) and (max-width:1399.8px) { body:before { content:" XXL    1240-1439px (XXL3 1340-1399px) "; border-left-color:#A34FFF; } }
		/*   XXL2  */ @media screen and (min-width:1300px) and (max-width:1339.8px) { body:before { content:" XXL    1240-1439px (XXL2 1300-1339px) "; border-left-color:#FF1594; } }
		/*   XXL1  */ @media screen and (min-width:1240px) and (max-width:1299.8px) { body:before { content:" XXL    1240-1439px (XXL1 1240-1299px) "; border-left-color:#00E47C; } }
		/*    XL4  */ @media screen and (min-width:1200px) and (max-width:1239.8px) { body:before { content:" XL     1040-1239px (XL4  1200-1239px) "; border-left-color:#19FDE1; } }
		/*    XL3  */ @media screen and (min-width:1140px) and (max-width:1199.8px) { body:before { content:" XL     1040-1239px (XL3  1140-1199px) "; border-left-color:#0BB8FF; } }
		/*    XL2  */ @media screen and (min-width:1100px) and (max-width:1139.8px) { body:before { content:" XL     1040-1239px (XL2  1100-1139px) "; border-left-color:#006CFF; } }
		/*    XL1  */ @media screen and (min-width:1040px) and (max-width:1099.8px) { body:before { content:" XL     1040-1239px (XL1  1040-1099px) "; border-left-color:#3500FF; } }
		/*     M2  */ @media screen and (min-width: 900px) and (max-width: 959.8px) { body:before { content:" M       860- 959px (M2    900- 959px) "; border-left-color:#0EC2D7; } }
		/*     M1  */ @media screen and (min-width: 860px) and (max-width: 899.8px) { body:before { content:" M       860- 959px (M1    860- 899px) "; border-left-color:#0ED7A5; } }
		/*     S2  */ @media screen and (min-width: 640px) and (max-width: 699.8px) { body:before { content:" S       640- 699px (S2    640- 699px) "; border-left-color:#C6BD17; } }
		/*     S1  */ @media screen and (min-width: 580px) and (max-width: 639.8px) { body:before { content:" S       580- 639px (S1    580- 639px) "; border-left-color:#BEB517; } }
		/*  XXXS2  */ @media screen and (min-width: 400px) and (max-width: 439.8px) { body:before { content:" XXXS    330- 439px (XXXS2 400- 439px) "; border-left-color:#E77616; } }
		/*  XXXS1  */ @media screen and (min-width: 330px) and (max-width: 399.8px) { body:before { content:" XXXS    330- 439px (XXXS1 330- 399px) "; border-left-color:#F2C512; } }

		html[data-loc="site"] body:before { content:""!important; }
