:root {
	--fontsize-26: 26px;

	--fontsize-22: 22px;

	--fontsize-20: 20px;
	--fontsize-18: 18px;
	--fontsize-17: 16px;

	--font-extralarge: 46px;

	--separatormultiplier: 1;
	--font-size-large: 32px;
}






:root {
	--dist_-10: 0.10737rem;
	--dist_-9: 0.13422rem;
	--dist_-8: 0.16777rem;
	--dist_-7: 0.20972rem;
	--dist_-6: 0.26214rem;
	--dist_-5: 0.32768rem;
	--dist_-4: 0.4096rem;
	--dist_-3: 0.512rem;
	--dist_-2: 0.64rem;
	--dist_-1: 0.8rem;
	--dist_0: 1rem;
	--dist_1: 1.25rem;
	--dist_2: 1.5625rem;
	--dist_3: 1.95312rem;
	--dist_4: 2.44141rem;
	--dist_5: 3.05176rem;
	--dist_6: 3.8147rem;
	--dist_7: 4.76837rem;
	--dist_8: 5.96046rem;
	--dist_9: 7.45058rem;
	--dist_10: 9.31323rem;
	--dist_11: 11.64153rem;
	--dist_12: 14.55192rem;
	--dist_13: 18.18989rem;
	--dist_14: 22.73737rem;
	--dist_15: 28.42171rem;
	--dist_16: 35.52714rem;
	--dist_17: 44.40892rem;
	--dist_18: 55.51115rem;
	--dist_19: 69.38894rem;
	--dist_20: 86.73617rem;
	--dist_21: 108.42022rem;
	--dist_22: 135.52527rem;
	--dist-alt_-10: 0.38554rem;
	--dist-alt_-9: 0.4241rem;
	--dist-alt_-8: 0.46651rem;
	--dist-alt_-7: 0.51316rem;
	--dist-alt_-6: 0.56447rem;
	--dist-alt_-5: 0.62092rem;
	--dist-alt_-4: 0.68301rem;
	--dist-alt_-3: 0.75131rem;
	--dist-alt_-2: 0.82645rem;
	--dist-alt_-1: 0.90909rem;
	--dist-alt_0: 1rem;
	--dist-alt_1: 1.1rem;
	--dist-alt_2: 1.21rem;
	--dist-alt_3: 1.331rem;
	--dist-alt_4: 1.4641rem;
	--dist-alt_5: 1.61051rem;
	--dist-alt_6: 1.77156rem;
	--dist-alt_7: 1.94872rem;
	--dist-alt_8: 2.14359rem;
	--dist-alt_9: 2.35795rem;
	--dist-alt_10: 2.59374rem;
	--dist-alt_11: 2.85312rem;
	--dist-alt_12: 3.13843rem;
	--dist-alt_13: 3.45227rem;
	--dist-alt_14: 3.7975rem;
	--dist-alt_15: 4.17725rem;
	--dist-alt_16: 4.59497rem;
	--dist-alt_17: 5.05447rem;
	--dist-alt_18: 5.55992rem;
	--dist-alt_19: 6.11591rem;
	--dist-alt_20: 6.7275rem;
	--dist-alt_21: 7.40025rem;
	--dist-alt_22: 8.14027rem;
	--dist-alt_23: 8.9543rem;
	--dist-alt_24: 9.84973rem;
	--dist-alt_25: 10.83471rem;
	--dist-alt_26: 11.91818rem;
	--dist-alt_27: 13.10999rem;
	--dist-alt_28: 14.42099rem;
	--dist-alt_29: 15.86309rem;
	--dist-alt_30: 17.4494rem;
	--dist-alt_31: 19.19434rem;
	--dist-alt_32: 21.11378rem;
	--dist-alt_33: 23.22515rem;
	--dist-alt_34: 25.54767rem;
	--dist-alt_35: 28.10244rem;
	--dist-alt_36: 30.91268rem;
	--dist-alt_37: 34.00395rem;
	--dist-alt_38: 37.40434rem;
	--dist-alt_39: 41.14478rem;
	--dist-alt_40: 45.25926rem;
	--dist-alt_41: 49.78518rem;
	--dist-alt_42: 54.7637rem;
	--dist-alt_43: 60.24007rem;
	--dist-alt_44: 66.26408rem;
	--dist-alt_45: 72.89048rem;
	--dist-alt_46: 80.17953rem;
}



:root {
	--gutter-y: 1rem;

	--distance-responsive-big: var(--dist_7);
	--distance-responsive-big-sm: var(--dist_6);
	--distance-responsive-middle: var(--dist_4);
	--distance-responsive-small: var(--dist_2);

	--centered-width-maximized: 485px;

	--color-zf-green: #17803d;
}


:root {
	--fontsize-heading-larger: var(--dist-alt_8);
	--fontsize-heading: var(--dist-alt_6);
	--fontsize-heading-smaller: var(--dist_1);
	--fontsize-text: var(--dist-alt_0);
	--fontsize-middle: var(--dist-alt_-2);
	--fontsize-small: var(--dist-alt_-4);
}

@media (max-width: 992px) {
	:root {
		--distance-responsive-big: var(--dist_5);
		--distance-responsive-big-sm: var(--dist_4);
		--distance-responsive-middle: var(--dist_3);
	}
	:root {
		--fontsize-heading-larger: var(--dist-alt_7);
		--fontsize-heading: var(--dist-alt_4);
		--fontsize-heading-smaller: var(--dist_1);
		--fontsize-text: var(--dist_0);
		--fontsize-middle: var(--dist-alt_-3);
		--fontsize-small: var(--dist-alt_-4);
	}	
}

@media (max-width: 360px) {
	:root {
		--distance-responsive-big: var(--dist_4);
		--distance-responsive-big-sm: var(--dist_3);
		--distance-responsive-middle: var(--dist_2);
	}
	:root {
		--fontsize-heading-larger: var(--dist-alt_4);
		--fontsize-heading: var(--dist-alt_3);
		--fontsize-heading-smaller: var(--dist-alt_0);
		--fontsize-text: var(--dist-alt_-1);
		--fontsize-middle: var(--dist-alt_-3);
		--fontsize-small: var(--dist-alt_-4);
	}	
}






.zok-subpage {
	background: white;
	padding-top: 0;
	overflow-x: hidden;
}

#toTopArrow {
	display:  none !important;
}

.standardPageContent {
	overflow: hidden;
}

.big-hero-block {

	background: white;
	min-height: 500px;
	overflow: visible;
	height: 70vh;
	max-height: 760px;
	padding-top: calc(2em + 75.242px);
	position: relative;
	
	padding-bottom: 2em;

	display: flex;
	justify-content: center;
	align-items: center;
	padding-left: 2rem;
	padding-right: 2rem;

	gap: 5em;

	@media (min-width: 1201px) {
		gap: 3em;
		max-width: calc(100% - 4rem);
		overflow: hidden;
		.mlogocut {
			max-height: 80px !important;
		}
	}

	@media (min-width: 1401px) {
		gap: 5em;
		.mlogocut {
			max-height: 120px !important;
		}
	}

	& > img.mlogocut {
		max-height: 128px;
		position: relative;
		z-index: 3;
	}

	& > img:not(.mlogocut) {
		position: absolute;
		z-index: 2;
	}

	ul {
		z-index: 3;
		position: relative;
		display: flex;
		flex-direction: row-reverse;
		height: 100%;

		gap: 2em;

		.type-logo {
			max-width: 230px;
			margin-right: 1rem;
			transform: translateX(-4.75%);
		}
		.logowrapper {
			text-align: center;
			img {
				margin: 0 auto;
			}
		}
		.evfolyamnak {
			max-width: 116px;
			transform: translateY(-6px);
		}
		.as-magonc .evfolyamnak {
			margin-bottom: 20px;
		}
		li {
			a {
				height: 100%;
				position: relative;				
				display: flex;
				justify-content: center;
				gap: 1em;
				flex-direction: column;
				align-items: center;				
				&:after {
					will-change: left, right;
					transition: all .6s ease-in-out;
					content: '';
	                display: block;
	                background: transparent;
	                left: 10%;
	                top: -8rem;
	                bottom: -4rem;
	                right: 10%;
	                z-index: -1;
	                position: absolute;
           
				}		
				&:hover {
					&:after {
						left: -10px;
						right: -10px;
					}
				}		
			}
			.as-magonc {
				flex-direction: column-reverse;
			}

			.as-tokmag {
				&:after {
				  background: linear-gradient(
				    to bottom,
				    #fb9406ff 0%, 
				    #fb940600 100%
				  );	     
				}
			}

			.as-magonc {
				&:after {
				  background: linear-gradient(
				    to top,
				    #00a6e4ff 0%, 
				    #00a6e400 100%
				  );	     					
				}
			}

			.as-palanta {
				&:after {
				  background: linear-gradient(
				    to bottom,
				    #61b92bff 0%, 
				    #61b92b00 100%
				  );	     					
				}
			}		

			a:hover picture {

			}	

			picture {
				transition: all .4s ease-in;
				min-width: 200px;
				width: 20vw;
				max-width: 300px;
				display: block;
				max-height: 300px;

				img {
					height: 100%;
					width: 100%;
					object-fit: contain;					
					display: block;
				}
			}
		}
	}

	.potty1 {top: 96%; right: 100%; transform: translate(50%, -30%);}
	.potty2 {bottom: 90%; left: 100%; transform: translate(-50%, 60%);}
	.potty3 {bottom: calc(100% - 4rem);
        left: calc(50% - 2rem);
        transform: translate(-70%, 20%);}
	.potty4 {top: 100%; left: 60%; transform: translate(-40%, -40%);}	

	.gradient {

	}
}


@media (max-width: 1200px) {
	.big-hero-block {
		flex-direction: column;
		height: auto !important;
		min-height: 0px;
		max-height: none !important;
		padding-left: 1rem;
		padding-right: 1rem;
		gap: clamp(4em, 6vw, 4em);
		& > img:not(.mlogocut) { 
			max-width: 60vw;
		}
		ul {
			flex-direction: column-reverse !important;
			max-width: 850px;
			flex-basis: 100%;
			gap: 1rem;
			li a {
justify-content: flex-start;
    padding-left: 2rem;				
    padding-right: 2rem;
				flex-direction: row !important;
				&:after { 
					left: 0;
					top: 0rem;
					bottom: 0rem;
					right: 0;
				}
			}

			.logowrapper {
				padding-bottom: 2rem;
				padding-top: 2rem;
				.type-logo {
					margin-top: -1rem;
				}
			}

			.as-tokmag {
				&:after {
				border-radius: 50rem 0 0 50rem;					
				  background: linear-gradient(
				    to right,
				    #fb9406ff 0%, 
				    #fb940600 100%
				  ) !important;	     
				}
			}

			.as-magonc {
				&:after {
				border-radius: 50rem 0 0 50rem;					
				  background: linear-gradient(
				    to right,
				    #00a6e4ff 0%, 
				    #00a6e400 100%
				  ) !important;	     					
				}
 			.evfolyamnak {
			margin-bottom: 0;
		}				
			}	

			.as-palanta {
				&:after {
					border-radius: 50rem 0 0 50rem;					
				  background: linear-gradient(
				    to right,
				    #61b92bff 0%, 
				    #61b92b00 100%
				  ) !important;	     					
				}
			}							
		}
		padding-top: 110px;		
		& > img.mlogocut { 
			max-width: 78vw;
		}
		picture {
			max-width: 160px !important;
			min-width: 0px !important;
		}
	}

}


@media (min-width: 1601px) {
	.big-hero-block {
		max-height: 600px !important;
	}
}

@media (max-width: 750px) {
	.big-hero-block {
		picture {
			display: none !important;
		}
		ul li a {
			&:after {
				border-radius: 10px !important;				
				opacity: .4;
			}
				&:hover {
					&:after {
						left: 0px;
						right: 0px;
					}
				}	
		}
	}
}


.big-hero-block.single-selected, .big-hero-block.as-standard {

	overflow: visible;
	/*height: 40vh !important;*/
	/*min-height: 340px;*/
	max-height: 450px !important;;

	& > img {
		opacity: .628;
		z-index: 0;
		pointer-events: none;
	}

	.evfolyamnak {
		display: none;
	}

	.mlogocut {
		display: none;
	}

	ul {
		gap: 0;
	}

	.logowrapper {
		margin-left: 2rem;
		margin-top: 23px;
	}

	&.single-tokmag {
		.as-tokmag {}
		.as-magonc,
		.as-palanta {
			display: none;
		}		
	}

	&.single-magonc {
		.as-magonc {}
		.as-tokmag,
		.as-palanta {
			display: none;
		}		
	}

	&.single-palanta {
		.as-palanta {}
		.as-tokmag,
		.as-magonc {
			display: none;
		}		
	}

	.type-logo {
		width: 280px;
		max-width: 100vw;
		margin-right: 1rem;
	}

	li a {
		flex-direction: row-reverse;
		&:after {
			display: none;
		}
	}

}


.big-hero-block.as-standard, .big-hero-block.single-selected.as-standard {

	height: auto !important;
	min-height: 0px !important;
	max-height: none !important;

	& > ul {
		display: none !important;
	}

	.as-magonc,
	.as-tokmag,
	.as-palanta { display:  none; }


}

.zok-subpage .main-prizes {
	background: white;
}	

.zok-subpage {
	background: white !important;
	.main-prizes.stdBlock h3 {color: #000; font-size: 2.2rem;}
	.main-prizes.stdBlock .std {color: #000;}
	.main-prizes.stdBlock .std.subtext {color: rgba(0,0,0,.9);}

	 & ~ #footer-links {
	 	background: #333;
	 	position: relative;
	 	z-index: 2;
		text-shadow: none !important;

		.footer.first {
			background: transparent !important;
		}
	}

	.stdBlock p.std a {
		color: #000;
	}

	h3 {
		display: block;
		font-size: var(--fontsize-heading-larger) !important;
		font-weight: 800;
	}
}

.zok-subpage .big-hero-block form {
	.centerized {
		padding-left: 0;
		padding-right: 0;
	}
}

.zok-subpage .std.center.subtext {
	font-weight: 600;
	font-size: var(--fontsize-middle);
}

.newtype-pagecontent {
	position: relative;
	z-index: 4;
	max-width: 960px;
	margin: 0 auto;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	padding-top: 0;
	margin-top: 0;
	em {
		font-weight: 700;
	}
	p {
		margin-top: 0;
		font-size: var(--fontsize-text);
		margin-bottom: 0;
		display: block;
		font-weight: 500;
		line-height: 1.62;
		text-align: left;
		padding-top: 0;
		font {
			white-space: nowrap;
		}
	}
	ul {margin-left: .5em;}
	li {
		font-size: var(--fontsize-text);
		font-weight: 500;
		line-height: 1.62;		
		text-align: left;
		line-height: 1.62;
		position: relative;
		padding-left: 1rem;
		&:before {
			content: "∙";
			display: block;
			position: absolute;
			right: calc(100% - 8px);
			top: 0px;
		}
	}

	.sectionwith-sides {
		padding-top: var(--distance-responsive-middle);
		display: grid;
		grid-template-columns: .5fr 1fr;
		gap: 1rem;
		column-gap: 2rem;
		&:first-child {padding-top: 0; margin-top: 0;}
		& > h2 {
			grid-row: 1;
			grid-column: 1;
			text-align: left;
			text-transform: uppercase;
			font-weight: 700;
			font-size: var(--fontsize-text);
			line-height: 1.62;
			font {
				white-space: nowrap;
			}
		}

		&>*:not(h2) {
			grid-column: 2;
		}

		.toleft {
			text-align: left;
			display: grid;
			gap: 1em;	
			grid-template-columns: auto auto;		
			justify-content: flex-start;
		}
	}



}


	.zoldre-szinezd + p.std span {
		max-width: 740px;
	}
	.szeretnel-feliratkozni p.std {
		font-size: var(--fontsize-heading-smaller);
	}


@media (max-width: 930px) {
	.newtype-pagecontent {

		.sectionwith-sides {
			grid-template-columns: 1fr;

			&>*:not(h2) {
				grid-column: 1;
			}

			& > h2 {
				font-size: var(--fontsize-heading-smaller);
			}
		}
		
	}
}

@media (max-width: 630px) {

	.big-hero-block.single-selected {

		min-height: 220px;
		padding-top:  48px;
		height: 220px !important;

		.logowrapper {
			margin-left: 1em;
		}

	}

	.newtype-pagecontent {

		.sectionwith-sides {
			.toleft {
				grid-template-columns: 1fr;
				.button {
					width: calc(100% - 4em);
					max-width: 320px;
				}
			}
		}
	}
}

.main-kapcsolat {
	margin-top: var(--distance-responsive-big-sm);
	background: #f4f4f4;
	margin-bottom: var(--distance-responsive-middle);
	h3 {
		color: #000;
	}
	p.std {
		color: #000;
	}
}


.fordulo-section-wrapper h3 {
	color: #000;
	margin-bottom: var(--distance-responsive-middle);
}

.fordulo-section-wrapper {
	padding-top: var(--distance-responsive-big-sm);
}


.new-main-verseny-wrapper {
	margin-top: var(--distance-responsive-middle);
}

.stdBlock.main-secondary .centerized h1.zoldre-szinezd {
	font-weight: 900;
	font-size: var(--fontsize-heading-larger) !important;
}

.valakiszamara {
	display: flex;
	padding-left:  1rem;
	padding-right: 1rem;
	gap: 2em;
	margin-top: var(--distance-responsive-middle);
	margin-bottom: var(--distance-responsive-big);
	justify-content: center;
	flex-direction: row-reverse;
	@media (max-width: 900px) {
		flex-direction: column-reverse;
	}
	& > div {
		text-align: center;
		span {
			display: block;
			font-size: 16px;
			color: #333;
			font {
				font-weight:  900;
				display: block;
				margin-bottom: .333rem;
				font-size: var(--fontsize-heading);
			}
		}
		a {
			margin-left: 0;
			margin-top: 1rem !important;
		}
	}
}





.newregsmaller a.button.stdbutton-facelifted {
	background: var(--inputborder);
	font-weight:  600;
	color:  white;
	transition: all .2s ease-in-out;
	margin-right: -0.5px;
	border-radius: 1px;
	&:hover {
		color: white !important;
		opacity: .85 !important;
	}
}


.inputLabel.nemrendelkezik {
	margin-top: 2rem;
	font-weight: 400;
	line-height: 1.5;
	font-size: var(--fontsize-middle);
	padding-right: 12px;
	font-style: italic;
}


.reg-tipus {
	margin-top: .5em;
}

.astartalmazza {
	margin-top: -1rem;
}


.is-in-progress h3 {
	padding-top: calc(var(--distance-responsive-small) / 2);
	padding-bottom: var(--dist_3);
}



.letolthetoanyagoksection {
	em {
		display: block;
		padding-bottom: 1.5em;
	}
	span {
		display: flex;
		gap: .5em;
		vertical-align: middle;
		flex-grow: 0;
	}
	input {
		border: 2px solid var(--inputborder);
	    transition: all .3s;
	    color: var(--inputwhite);
	    font-size: 20px;
	    background: rgba(255, 255, 255, .2);
	    display: inline-block;
	    padding: 10px;
	    border-radius: 4px;
	    width: 200px;
	    font-weight: 800;
	    font-family: Montserrat;

	    @media (max-width: 500px) {
	    	width: calc(100% - 2 * 4em);
	    	margin: 0 auto;
	    }

	    & + .button {
	    	max-height: 22.5px;
		    top: 0;
		    position: relative;
		    line-height: 22px;
		    flex-grow: 0;
		    margin:  0;
	    }
	}
}
