@font-face {
	font-display: block;
	font-family: "Eames Numerals PosterM";
	font-style: normal;
	font-weight: 900;
	src: url('../fonts/EamesNumerals-PosterM.woff2') format('woff2'),
		url('../fonts/EamesNumerals-PosterM.woff') format('woff');
}


@font-face {
	font-display: block;
	font-family: "Eames Numerals PosterS";
	font-style: normal;
	font-weight: 900;
	src: url('../fonts/EamesNumerals-PosterS.woff2') format('woff2'),
		url('../fonts/EamesNumerals-PosterS.woff') format('woff');
}

@font-face {
	font-display: block;
	font-family: "Eames Numerals PosterL";
	font-style: normal;
	font-weight: 900;
	src: url('../fonts/EamesNumerals-PosterL.woff2') format('woff2'),
		url('../fonts/EamesNumerals-PosterL.woff') format('woff');
}

@font-face {
	font-display: block;
	font-family: "Eames Century Modern";
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/EamesCenturyModern-Regular.woff2') format('woff2'),
		url('../fonts/EamesCenturyModern-Regular.woff') format('woff');
}

@font-face {
	font-display: block;
	font-family: "Eames Century Modern";
	font-style: normal;
	font-weight: 450;
	src: url('../fonts/EamesCenturyModern-Book.woff2') format('woff2'),
		url('../fonts/EamesCenturyModern-Book.woff') format('woff');
}

@font-face {
	font-family: 'Switzer';
	src: url('../fonts/Switzer-Regular.woff2') format('woff2'),
		url('../fonts/Switzer-Regular.woff') format('woff');
	font-weight: 400;
	font-display: block;
	font-style: normal;
}

@font-face {
	font-family: 'Switzer';
	src: url('../fonts/Switzer-Medium.woff2') format('woff2'),
		url('../fonts/Switzer-Medium.woff') format('woff');
	font-weight: 500;
	font-display: block;
	font-style: normal;
}

:root:has(body.frontend) {
	--fontSize8: 0.4rem;
	--fontSize9: 0.45rem;
	--fontSize10: 0.5rem;
	--fontSize11: 0.55rem;
	--fontSize12: 0.6rem;
	--fontSize13: 0.65rem;
	--fontSize14: 0.7rem;
	--fontSize15: 0.75rem;
	--fontSize16: 0.8rem;
	--fontSize17: 0.85rem;
	--fontSize18: 0.9rem;
	--fontSize19: 0.95rem;
	--fontSize20: 1rem;
	--fontSize21: 1.05rem;
	--fontSize22: 1.1rem;
	--fontSize23: 1.15rem;
	--fontSize24: 1.2rem;
	--fontSize25: 1.25rem;
	--fontSize26: 1.3rem;
	--fontSize27: 1.35rem;
	--fontSize28: 1.4rem;
	--fontSize29: 1.45rem;
	--fontSize30: 1.5rem;
	--fontSize31: 1.55rem;
	--fontSize32: 1.6rem;
	--fontSize33: 1.65rem;
	--fontSize34: 1.7rem;
	--fontSize35: 1.75rem;
	--fontSize36: 1.8rem;
	--fontSize37: 1.85rem;
	--fontSize38: 1.9rem;
	--fontSize39: 1.95rem;
	--fontSize40: 2rem;
	--fontSize41: 2.05rem;
	--fontSize42: 2.1rem;
	--fontSize43: 2.15rem;
	--fontSize44: 2.2rem;
	--fontSize45: 2.25rem;
	--fontSize46: 2.3rem;
	--fontSize47: 2.35rem;
	--fontSize48: 2.4rem;
	--fontSize49: 2.45rem;
	--fontSize50: 2.5rem;
	--fontSize51: 2.55rem;
	--fontSize52: 2.6rem;
	--fontSize53: 2.65rem;
	--fontSize54: 2.7rem;
	--fontSize55: 2.75rem;
	--fontSize56: 2.8rem;
	--fontSize57: 2.85rem;
	--fontSize58: 2.9rem;
	--fontSize59: 2.95rem;
	--fontSize60: 3rem;
	--fontSize61: 3.05rem;
	--fontSize62: 3.1rem;
	--fontSize63: 3.15rem;
	--fontSize64: 3.2rem;
	--fontSize65: 3.25rem;
	--fontSize66: 3.3rem;
	--fontSize67: 3.35rem;
	--fontSize68: 3.4rem;
	--fontSize69: 3.45rem;
	--fontSize70: 3.5rem;
	--fontSize71: 3.55rem;
	--fontSize72: 3.6rem;
	--fontSize73: 3.65rem;
	--fontSize74: 3.7rem;
	--fontSize75: 3.75rem;
	--fontSize76: 3.8rem;
	--fontSize77: 3.85rem;
	--fontSize78: 3.9rem;
	--fontSize79: 3.95rem;
	--fontSize80: 4rem;
	--fontSize81: 4.05rem;
	--fontSize82: 4.1rem;
	--fontSize83: 4.15rem;
	--fontSize84: 4.2rem;
	--fontSize85: 4.25rem;
	--fontSize86: 4.3rem;
	--fontSize87: 4.35rem;
	--fontSize88: 4.4rem;
	--fontSize89: 4.45rem;
	--fontSize90: 4.5rem;
	--fontSize91: 4.55rem;
	--fontSize92: 4.6rem;
	--fontSize93: 4.65rem;
	--fontSize94: 4.7rem;
	--fontSize95: 4.75rem;
	--fontSize96: 4.8rem;
	--fontSize97: 4.85rem;
	--fontSize98: 4.9rem;
	--fontSize99: 4.95rem;
	--fontSize100: 5rem;
	--fontSize101: 5.05rem;
	--fontSize102: 5.1rem;
	--fontSize103: 5.15rem;
	--fontSize104: 5.2rem;
	--fontSize105: 5.25rem;
	--fontSize106: 5.3rem;
	--fontSize107: 5.35rem;
	--fontSize108: 5.4rem;
	--fontSize109: 5.45rem;
	--fontSize110: 5.5rem;
	--fontSize111: 5.55rem;
	--fontSize112: 5.6rem;
	--fontSize113: 5.65rem;
	--fontSize114: 5.7rem;
	--fontSize115: 5.75rem;
	--fontSize116: 5.8rem;
	--fontSize117: 5.85rem;
	--fontSize118: 5.9rem;
	--fontSize119: 5.95rem;
	--fontSize120: 6rem;
	--fontSize121: 6.05rem;
	--fontSize122: 6.1rem;
	--fontSize123: 6.15rem;

	--sideSpacing: 2.8vw;
	--outerSpacing: calc(calc(100vw - 1584px) / 2);

	--headerHeight: 6.6rem;
	--newsBarHeight: 0rem;

	--borderRadiusSmall: 0.2rem;
	--borderRadiusMedium: .9375rem;
	--borderRadiusVeryBig: 8rem;



	--colorBlueLightest: #F1F2FF;
	--colorBlueLight: #E1E8FF;
	--colorBlueLightMedium: #B7CDF8;
	--colorBlueMedium: #777BA5;
	--colorBlueDark: #30227E;

	--colorGreenLight: #E6F5DB;
	--colorGreenMediumLight: #C3DDB7;
	--colorGreenMedium: #7C917F;
	--colorGreenDark: #336246;

	--colorBlack: #000;
	--colorWhite: #FFF;
	--colorRed: #E63030;


	@media only screen and (max-width: 768px) {
		--borderRadiusVeryBig: 2.6rem;
		--borderRadiusMedium: .3rem;

	}

	@supports (color: color(display-p3 1 0 0)) {

		--colorBlueLight: color(display-p3 0.8811 0.9108 1.0000);
		--colorBlueLightMedium: color(display-p3 0.733 0.800 0.957);
		--colorBlueMedium: color(display-p3 0.4667 0.4824 0.6471);
		--colorBlueDark: color(display-p3 0.1875 0.1333 0.4941);

		--colorGreenLight: color(display-p3 0.9037 0.9617 0.8594);
		--colorGreenMediumLight: color(display-p3 0.7633 0.8657 0.7159);
		--colorGreenMedium: color(display-p3 0.4863 0.5686 0.4980);

		--colorGreenDark: color(display-p3 0.2000 0.3843 0.2745);

		--colorRed: color(display-p3 0.9020 0.1882 0.1882);


	}

	&:has(header > .news-bar) {
		--newsBarHeight: 3.1rem;
		
		@media only screen and (max-width: 768px) {
			--newsBarHeight: 2.3rem;
		}
	}

	@media only screen and (max-width: 1584px) {
		--outerSpacing: 0rem;
	}

	@media only screen and (max-width: 768px) {
		--headerHeight: 4.25rem !important;
		--sideSpacing: 4.8vw !important;
	}
}



html:not(.wp-toolbar),
body.frontend {
	scrollbar-gutter: stable;
}

html:not(.wp-toolbar) {
	font-size: 22px;

	@media only screen and (max-width: 1584px) {
		font-size: 1.39vw;
	}

	@media only screen and (max-width: 768px) {
		font-size: 5.2vw;
	}
}

body.frontend,
.acfe-flexible-placeholder {
	margin: 0;
	padding: 0;
	text-align: left;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: var(--fontSize20);
	line-height: 1.275;
	-webkit-text-size-adjust: 100%;
	font-family: 'Switzer';
	background-color: var(--colorWhite);
	color: var(--colorBlueDark);

	/*
	&:not(.home) {
		.outerwrapper {
			padding-top: calc(var(--headerHeight) + var(--newsBarHeight));
		}
		
		@media only screen and (min-width: 769px) {
			header {
				background-color: var(--colorWhite);
			}
		}
	}*/

	&:not(:has(.section__start)) {
		.outerwrapper {
			padding-top: calc(var(--headerHeight) + var(--newsBarHeight));
		}

		@media only screen and (min-width: 769px) {
			header {
				background-color: var(--colorWhite);
			}
		}
	}

	input[type=text],
	input[type=email],
	input[type=tel],
	input[type=url],
	input[type=search],
	input[type=submit],
	button {
		appearance: none;
		-moz-appearance: none;
		-webkit-appearance: none;
		border-radius: 0;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
	}

	*,
	*:before,
	*:after {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	*:focus:not(:focus-visible) {
		outline: 0;
	}

	&:has(.header-color-white) {
		header {
			--headerColor: var(--colorWhite);
		}
	}

	section {
		position: relative;
		z-index: 1;

		p {
			&:first-child {
				margin-top: 0;
			}

			&:last-child {
				margin-bottom: 0;
			}
		}

		h1 {
			font-size: var(--fontSize123);
			margin: 0;
			font-family: "Eames Century Modern";
			font-weight: 400;
			line-height: 1;
			letter-spacing: 0.005em;
			color: var(--colorBlueDark);

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize59);
			}
		}
		
		&.section__text-description {
			h1 {
				font-size: var(--fontSize79);
				margin: 0;
				font-family: "Eames Century Modern";
				font-weight: 400;
				line-height: 1.02;
				letter-spacing: 0.03em;
			
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize38);
				}
			}
		}

		h2 {
			font-size: var(--fontSize79);
			margin: 0;
			font-family: "Eames Century Modern";
			font-weight: 400;
			line-height: 1.02;
			letter-spacing: 0.03em;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize38);
			}
		}

		h3 {
			font-size: var(--fontSize42);
			margin: 0;
			font-family: "Eames Century Modern";
			font-weight: 400;
			line-height: 1.02;
			letter-spacing: 0.03em;
		}
	}

	img {
		border: 0;
	}
}

body.frontend .outerwrapper {
	overflow-x: clip;
	background-color: var(--colorWhite);
}


.preview_check {
	position: fixed;
	left: 10px;
	top: 10px;
	z-index: 999999;
	/*display: none;*/
}

body:not(.wp-admin) .preview {
	width: 100%;
	position: absolute;
	left: 50%;
	top: 0;
	height: auto;
	z-index: 999999;
	pointer-events: none;
	opacity: 0.4;
	display: block;
	transform: translate(-50%, 0);
}

.preview_check:checked+.preview {
	display: none;
}


body.frontend .innerwrapper,
.acfe-flexible-placeholder .innerwrapper,
body.frontend .outerwrapper .woocommerce {
	margin: 0 auto;
	width: calc(100% - var(--sideSpacing) - var(--sideSpacing));
	max-width: 1494px;

	&.small {
		padding-inline: 3.9rem;
		
		@media only screen and (max-width: 768px) {
			padding-inline: 0;	
		}
	}
}




.cta__button,
.woocommerce .button {
	--buttonBackgroundColor: var(--colorWhite);
	--buttonColor: var(--colorBlueDark);
	background-color: var(--buttonBackgroundColor);
	color: var(--buttonColor);
	font-size: var(--fontSize24);
	line-height: 1;
	font-family: "Eames Century Modern";
	display: inline-flex;
	align-items: center;
	padding: 0.5em 1.1em;
	gap: 0 0.6em;
	height: 3em;
	text-decoration: none;
	border-radius: var(--borderRadiusSmall);
	cursor: pointer;
	border: 0;

	@media only screen and (max-width: 768px) {
		font-size: var(--fontSize17);
		font-weight: 450;
		height: 3em;
		padding: 0.4em 0.9em;
	}

	&[data-background="blue"] {
		--buttonBackgroundColor: var(--colorBlueDark);
		
		&[data-color="white"] {
			@media (hover: hover) {
				
				&:hover {
					--buttonBackgroundColor: var(--colorBlueLight);
					--buttonColor: var(--colorBlueDark);
				}	
			}
		}
	}

	&[data-background="blueLight"] {
		--buttonBackgroundColor: var(--colorBlueLight);
		
		@media (hover: hover) {
			
			&:hover {
				--buttonBackgroundColor: var(--colorWhite);
			}	
		}
		
	}

	&[data-background="white"] {
		--buttonBackgroundColor: var(--colorWhite);
		
		&[data-color="blue"] {
			@media (hover: hover) {
				
				&:hover {
					--buttonBackgroundColor: var(--colorBlueLight);
				}	
			}
		}
		
		&[data-color="green"] {
			@media (hover: hover) {
				
				&:hover {
					--buttonBackgroundColor: var(--colorGreenLight);
				}	
			}
		}
		
		
	}

	&[data-background="green"] {
		--buttonBackgroundColor: var(--colorGreenDark);
		
		&[data-color="white"] {
			@media (hover: hover) {
				
				&:hover {
					--buttonBackgroundColor: var(--colorGreenLight);
					--buttonColor: var(--colorGreenDark);
				}	
			}
		}
	}

	&[data-background="greenLight"] {
		--buttonBackgroundColor: var(--colorGreenLight);
		
		@media (hover: hover) {
			
			&:hover {
				--buttonBackgroundColor: var(--colorWhite);
			}	
		}
	}

	&[data-color="blue"] {
		--buttonColor: var(--colorBlueDark);
	}

	&[data-color="white"] {
		--buttonColor: var(--colorWhite);
	}

	&[data-color="green"] {
		--buttonColor: var(--colorGreenDark);
	}

	&[data-color="greenLight"] {
		--buttonColor: var(--colorGreenLight);
	}
	
	&[data-color="blueLight"] {
		--buttonColor: var(--colorBlueLight);
	}

	&.outline {
		border: 2px solid var(--colorBlueDark);
		color: var(--colorBlueDark);
		background-color: transparent;
		border-radius: .3125rem;
	}

	&.sans-serif {
		font-family: 'Switzer';
	}

	&.rounded {
		border-radius: 2em;

	}

	&.bigger {
		font-size: var(--fontSize27);

		@media only screen and (max-width: 768px) {
			font-size: var(--fontSize20);
			/* font-size: var(--fontSize17); */

		}

	}
	
	&.biggest {
		font-size: var(--fontSize32);
	
		@media only screen and (max-width: 768px) {
			//font-size: var(--fontSize24);
			font-size: var(--fontSize20);
			/* font-size: var(--fontSize17); */
	
		}
	
	}
	
	> span {
		margin-top: -0.1em;
	}

	>svg {
		width: 1.8em;
		height: auto;

		path {
			fill: var(--buttonColor);
		}
	}

	&:disabled {
		opacity: 0.5;
		cursor: not-allowed;
	}

}

.woocommerce .button {
	--buttonBackgroundColor: var(--colorBlueDark);
	--buttonColor: var(--colorWhite);
	background-color: var(--buttonBackgroundColor) !important;
	color: var(--buttonColor) !important;
	font-size: var(--fontSize24) !important;
	line-height: 1 !important;
	border-radius: 2em !important;
	font-family: "Eames Century Modern" !important;
	padding: 0.5em 1.1em !important;
	font-weight: 400 !important;
	display: inline-flex !important;
}

.woocommerce-cart {
	.woocommerce {
		padding-block: 2rem;

		.return-to-shop {
			display: flex;
			justify-content: center;
			display: none !important;
		}
	}
}


body.frontend header {
	--headerColor: var(--colorBlueDark);
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	right: 0;
	z-index: 99;

	@media only screen and (max-width: 768px) {
		background-color: var(--colorBlueDark);
		--headerColor: var(--colorWhite) !important;
	}

	.news-bar {
		background-color: var(--colorBlueDark);
		
		@media only screen and (max-width: 768px) {
			background-color: var(--colorBlueLight);
		}

		>.innerwrapper {
			height: var(--newsBarHeight);
			display: grid;
			grid-template-columns: 1fr auto;
			align-items: center;

			.news-content {
				text-align: left;
				color: var(--colorBlueLight);
				font-size: var(--fontSize20);
				letter-spacing: 0.025em;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize13);
					color: var(--colorBlueDark);
				}

				p {
					margin: 0;
				}
			}

			.close__news-bar {
				font-size: 0;
				line-height: 0;
				margin: 0;
				padding: 0;
				background: transparent;
				border: 0;
				width: 2.2rem;
				cursor: pointer;
				
				@media only screen and (max-width: 768px) {
					width: 1.5rem;	
				}

				svg {
					width: 100%;
					height: auto;
					
					@media only screen and (max-width: 768px) {
						path {
							fill: var(--colorBlueDark) !important;
						}
					}
				}
			}
		}
	}

	>.innerwrapper {
		height: var(--headerHeight);
		padding-bottom: 0.9rem;
		padding-top: 0.6rem;
		display: grid;
		grid-template-columns: auto 1fr;
		grid-template-rows: auto 1fr auto;

		@media only screen and (max-width: 768px) {
			display: flex;
			padding-bottom: 0.9rem;
			padding-top: 0.9rem;
		}

		.hamburger {
			margin: 0;
			padding: 0;
			border: 0;
			padding: 0;
			background-color: transparent;
			width: 1.85rem;
			font-size: 0;
			line-height: 0;
			margin-block: auto;
			display: none;

			@media only screen and (max-width: 768px) {
				display: block;
			}

			svg {
				width: 100%;
				height: auto;
				
				path {
					transform-box: fill-box;
					  transform-origin: center;
					  transition: transform .25s ease, opacity .2s ease;
				}
			}
			
			&.is-active {
				svg {
					path:nth-of-type(1) {
						transform: translateY(13.537px) rotate(45deg);
					}
				
					path:nth-of-type(2) {
						opacity: 0;
					}
				
					path:nth-of-type(3) {
						transform: translateY(-13.538px) rotate(-45deg);
					}
				}
			}
		}

		.logo {
			font-size: 0;
			line-height: 0;
			display: block;
			width: 18.1rem;
			margin-top: auto;
			grid-column: 1/2;
			grid-row: 3/4;

			@media screen and (max-width: 768px) {
				width: 10.9rem;
				margin-left: 1rem;
				transform: translateY(-0.15rem);
			}

			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;
				margin-block: auto;
				width: 10.9rem;
				margin-left: 1rem;
				transform: translateY(-0.15rem);

				.signet {
					display: none;
				}
			}

			svg {
				width: 100%;
				height: auto;

				path {
					fill: var(--headerColor) !important;
				}

			}
		}

		.header__top {
			grid-column: 2/3;
			grid-row: 1/2;
			margin-left: auto;
			display: flex;
			align-items: center;
			gap: 0 1.6rem;


			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;
				gap: 0 0.8rem;
			}

			.icon-link {
				display: inline-flex;
				align-items: center;
				font-size: var(--fontSize15);
				text-transform: uppercase;
				font-family: 'Switzer';
				color: inherit;
				text-decoration: none;
				align-items: center;
				gap: 0 0.5em;
				color: var(--headerColor);
				margin-top: auto;

				@media only screen and (max-width: 768px) {
					width: 1.4rem;
					margin-top: 0.3rem;
				}

				svg {
					width: 1.4em;
					height: auto;

					path {
						fill: var(--headerColor) !important;
					}

					@media only screen and (max-width: 768px) {
						width: 100%;
					}
				}

				@media only screen and (max-width: 768px) {
					margin-block: auto;

					span {
						display: none;
					}
				}
			}

			.header-cart {
				font-size: 0;
				line-height: 0;
				display: block;
				width: 1rem;
				position: relative;

				@media only screen and (max-width: 768px) {
					width: 1.09rem;
					margin-top: -0.2rem;
				}

				.header-cart__count {
					position: absolute;
					left: 50%;
					top: 56%;
					transform: translate(-50%, -50%);
					font-size: var(--fontSize12);
					font-weight: 500;
					line-height: 1;
					color: var(--headerColor);
				}

				svg {
					width: 100%;
					height: auto;

					path {
						fill: var(--headerColor) !important;
					}
				}
			}
		}

		nav {
			font-family: "Eames Century Modern";
			font-size: var(--fontSize25);
			grid-column: 2/3;
			grid-row: 3/4;
			margin-left: auto;
			margin-block: auto;
			color: var(--headerColor);

			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;
				position: fixed;
				left: 0;
				width: 100%;
				height: calc(100dvh - var(--headerHeight) - var(--newsBarHeight));
				top: calc(var(--headerHeight) + var(--newsBarHeight));
				background-color: var(--colorBlueDark);
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				padding-bottom: 4rem;
				opacity: 0;
				transform: translateX(-100%);
				pointer-events: none;
				transition: transform 300ms ease-out,opacity 300ms ease-out;
				
				&.is-active {
					opacity: 1;
					transform: translateX(0%);
					pointer-events: auto;
				}
			}

			ul {
				list-style-type: none;
				margin: 0;
				padding: 0;
				display: flex;
				gap: 0 1.1em;
				
				@media only screen and (max-width: 768px) {
					flex-direction: column;	
					text-align: center;
					gap: 1em 0;
				}

				li {
					list-style-type: none;
					margin: auto 0;
					padding: 0;

					a {
						text-decoration: none;
						color: inherit;
						display: inline-flex;
						position: relative;


					}

					&:not(.nav-button) {
						a {
							&:before {
								content: '';
								background-color: var(--headerColor);
								width: 0%;
								height: 0.1rem;
								position: absolute;
								left: 0;
								bottom: 0;
								transition: width 200ms ease-out;
							}

							@media (hover: hover) {
								&:hover {
									&:before {
										width: 100%;

									}
								}
							}
						}
					}

					&:not(.nav-button).current-menu-item {
						a {
							&:before {
								width: 100%;
							}
						}
					}

					&.nav-button {
						margin-left: 1.4em;
						cursor: pointer;
						
						@media only screen and (max-width: 768px) {
							margin-left: 0;	
						}

						a {
							border: 0.1rem solid var(--headerColor);
							border-radius: 0.25rem;
							padding: 0.3em 0.5em;
							pointer-events: none;
						}
					}
				}
			}
		}
	}
}

.section__start {
	position: relative;
	color: var(--color);

	&.banner {
		height: 34.3rem;
		/*
		height: auto;
		aspect-ratio: 1441/687;
		*/
		margin-top: var(--newsBarHeight);
		
		@media only screen and (max-width: 768px) {
			margin-top: calc(var(--headerHeight) + var(--newsBarHeight));	
			height: 12.3rem;
		}

		>.image {
			top: 0;
			height: 100%;

			img {
				object-position: center 35%;
			}
		}
	}

	.innerwrapper {
		padding-top: calc(var(--headerHeight) + var(--newsBarHeight));
		position: relative;
		z-index: 2;
		height: calc(var(--headerHeight) + var(--newsBarHeight) + 34.4rem);
		padding-bottom: 2rem;
		display: grid;
		grid-template-columns: 1fr auto;

		@media only screen and (max-width: 768px) {
			display: flex;
			flex-direction: column;
			padding-top: calc(var(--headerHeight) + var(--newsBarHeight) + 1rem);
			height: calc(var(--headerHeight) + var(--newsBarHeight) + 27.2rem);
			padding-bottom: 1rem;
		}


		.content {
			margin-top: 3.7rem;
			grid-column: 1/2;
			grid-row: 1/2;

			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;
				margin-top: 0;
			}
			
			h1 {
				color: var(--color);
			}

			.button__wrapper {
				display: flex;
				margin-top: 1.5rem;
				gap: 0 0.6rem;

				@media only screen and (max-width: 768px) {
					flex-direction: column;
					margin-top: 1.7rem;
					gap: 0.6rem 0;
				}

				p {
					margin: 0;
				}


			}
		}

		.start__teaser {
			grid-column: 2/3;
			grid-row: 2/3;
			margin-left: auto;
			width: 15.4rem;
			margin-top: auto;
			padding: 0.5rem;
			border-radius: var(--borderRadiusSmall);
			background-color: var(--colorWhite);
			position: relative;
			display: grid;
			grid-template-columns: 100%;
			grid-template-rows: auto;
			text-decoration: none;

			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;
				width: 6.8rem;
				margin-left: auto;
				padding: 0.2rem;
				margin-right: 0.5rem;
				margin-left: auto;
			}

			>span {
				grid-column: 1/2;
				grid-row: 1/2;
				display: inline-flex;
				font-size: var(--fontSize37);
				color: var(--colorWhite);
				position: relative;
				z-index: 5;
				text-decoration: none;
				font-family: "Eames Century Modern";
				margin: auto;
				gap: 0 0.3em;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize22);
				}

				svg {
					width: 1.4em;
					height: auto;

					@media only screen and (max-width: 768px) {
						display: none;
					}
				}
			}

			.image {
				width: 100%;
				font-size: 0;
				line-height: 0;
				grid-column: 1/2;
				grid-row: 1/2;

				@media only screen and (max-width: 768px) {}

				img {
					width: 100%;
					aspect-ratio: 286/209;
					height: auto;
					object-fit: cover;
					border-radius: var(--borderRadiusSmall);
					
					
				}

			}
		}
	}

	>.image {
		font-size: 0;
		line-height: 0;
		position: absolute;
		z-index: 1;
		width: 100%;
		height: calc(100% - var(--newsBarHeight));
		inset: 0;
		top: var(--newsBarHeight);

		@media only screen and (max-width: 768px) {
			height: calc(100% - var(--newsBarHeight) - var(--headerHeight));
			inset: 0;
			top: calc(var(--newsBarHeight) + var(--headerHeight));
		}

		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			
			&.only__desktop {
				display: block;
				
				@media only screen and (max-width: 768px) {
					display: none;	
				}
			}
			
			&.only__mobile {
				display: none;
				
				@media only screen and (max-width: 768px) {
					display: block;	
				}
			}
		}
	}
}

.section__intro-with-teaser {

	background-color: var(--backgroundColor);
	color: var(--color);

	.innerwrapper {
		padding-top: 4.5rem;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-bottom: 4.2rem;

		@media only screen and (max-width: 768px) {
			padding-top: 1.5em;

		}

		.content {
			font-size: var(--fontSize27);
			max-width: 35em;
			text-align: center;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize21);
				max-width: 100%;
			}

			h2 {
				text-align: center;
				margin-inline: auto;
				max-width: 11em;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize33);
					
					br {
						display: none;
					}
				}

			}

			p {
				margin-top: .9rem;
				line-height: 1.2;
			}
		}

		.teaser__wrapper {
			--itemsPerRow: 4;
			--gap: 1rem;
			margin-top: 3.6rem;
			display: flex;
			justify-content: center;
			gap: 0 var(--gap);
			width: 100%;
			
		

			@media only screen and (max-width: 768px) {
				--gap: .6rem;
				margin-top: 2.93rem;
				flex-direction: column;
				gap: var(--gap) 0;
				align-items: center;
				width: 100%;
			}

			.single__teaser {
				width: calc((100% - ((var(--itemsPerRow) - 1) * var(--gap))) / var(--itemsPerRow));
				flex-shrink: 0;
				clip-path: polygon(50% 0, 0 14%, 0 86%, 50% 100%, 100% 86%, 100% 14%);
				position: relative;
				flex-shrink: 0;
				flex-grow: 0;


				@media only screen and (max-width: 768px) {
					width: 100%;
					display: flex;
					flex-direction: row-reverse;
					align-items: center;
					justify-content: flex-end;
					clip-path: none;
					text-decoration: none;
					position: relative;

					background-image: url("../images/mask-5.svg");
					background-repeat: no-repeat;
					background-position: center right;
					background-size: 85% 100%;
					padding-right: 1.6rem;
					/* -webkit-mask: url("../images/mask-4.svg") no-repeat center / 100% 100%;
					mask: url("../images/mask-4.svg") no-repeat center / 100% 100%; */

				}

				&:nth-child(even) {
					@media screen and (max-width: 768px) {
						flex-direction: row;
						background-image: url("../images/mask-4.svg");
						background-position: center left;

						padding-right: 0;
						padding-left: 1.6rem;
					}

					& .title {
						@media screen and (max-width: 768px) {
							/* margin-right: 1rem; */

						}
					}
				}

				.title {
					position: absolute;
					bottom: 0;
					left: 0;
					right: 0;
					background-color: var(--color);
					font-family: "Eames Century Modern";
					font-size: var(--fontSize25);
					text-align: center;
					display: flex;
					align-items: center;
					justify-content: center;
					color: var(--colorWhite);
					min-height: 4.4em;
					padding-bottom: 1.3em;

					@media only screen and (max-width: 768px) {
						position: relative;
						padding-bottom: 0;
						min-height: 2.8em;
						background-color: transparent;
						/* border:1px solid var(--color); */
						color: var(--color);
						font-size: var(--fontSize17);
						text-decoration: none;
						margin: 0 auto;
						/* margin-left: 1rem; */
						/* margin: 0 1rem; */
					}
				}

				.image {
					font-size: 0;
					line-height: 0;

					@media only screen and (max-width: 768px) {
						width: 4.9rem;
						clip-path: polygon(80.46% 100%, 100% 79.46%, 100% 20.04%, 80.46% 0%, 21.04% 0%, 0% 20.04%, 0% 79.46%, 21.04% 100%);
					}

					img {
						width: 100%;
						height: auto;
						aspect-ratio: 325/328;
						object-fit: cover;

						@media only screen and (max-width: 768px) {
							aspect-ratio: 99/71;

						}
					}
				}
			}
		}

	}
}

.innerwrapper .tags,
.kursfinder-products .tags {
	display: flex;
	gap: 0 0.3rem;
	margin-bottom: 0.7rem;

	>a,
	>span {
		color: inherit;
		text-decoration: none;
		line-height: 1;
		font-weight: 500;
		font-size: var(--fontSize11);
		text-transform: uppercase;
		padding: 0.6em 1em;
		border: 1px solid currentColor;
		text-decoration: none;

		@media only screen and (max-width: 768px) {
			font-size: var(--fontSize8);
			padding: 0.6em 1em;

		}

		&.rounded {
			border-radius: 1.5em;

		}
	}
}

.product__teaser {
	width: 100%;
	border-radius: var(--borderRadiusSmall);
	overflow: clip;
	padding: 0.45rem 0.45rem 0.7rem 0.45rem;
	text-decoration: none;
	display: flex;
	flex-direction: column;

	@media only screen and (max-width: 768px) {
		width: 16rem;
		flex: 0 0 13.7rem;

		&:first-child {
			margin-left: .875rem;
		}
	}

	&[data-type="bikeschule"] {
		background-color: #e6f5db;
		color: var(--colorGreenDark);

		.image {
			img {
				-webkit-clip-path: url(#clip_path_border_bike);
				clip-path: url(#clip_path_border_bike);
			}
		}

		.description {
			color: var(--colorGreenMedium);
		}

		.price {
			color: var(--colorGreenDark);
		}
		
		.dates {
			svg {
				path {
					fill: var(--colorGreenDark) !important;
				}
			}
		}
		
		@media (hover: hover) {
			&:hover {
				background-color: #d3e5cb;
			}	
		}
	}

	&[data-type="skischule"] {
		background-color: #f1f2ff;
		color: var(--colorBlueDark);

		.image {
			img {
				-webkit-clip-path: url(#clip_path_border_ski);
				clip-path: url(#clip_path_border_ski);
			}
		}

		.description {
			color: var(--colorBlueMedium);
		}

		.price {
			color: var(--colorBlueDark);
		}
		
		.dates {
			svg {
				path {
					fill: var(--colorBlueDark) !important;
				}
			}
		}
		
		@media (hover: hover) {
			&:hover {
				background-color: #e1e8ff;
			}	
		}
	}

	.image {
		font-size: 0;
		line-height: 0;
		width: 100%;
		position: relative;

		.start_badge {
			background-color: var(--colorRed);
			color: var(--colorWhite);
			font-size: var(--fontSize11);
			text-transform: uppercase;
			position: absolute;
			left: 0;
			top: 0;
			z-index: 5;
			line-height: 1;
			font-weight: 500;
			padding: 0.66em 1.4em;
		}

		img {
			width: 100%;
			height: auto;
			aspect-ratio: 268/194;
			object-fit: cover;
		}
	}

	.content {
		padding: 0.8rem 0.4rem 0 0.4rem;
		display: flex;
		flex-direction: column;
		flex: 1;



		h3 {
			margin: 0;
			font-family: "Eames Century Modern";
			font-size: var(--fontSize24);
			font-weight: 500;
			letter-spacing: -0.02em;
			line-height: 1.03;
			margin-bottom: 0.2rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize21);
			}
		}

		.description {
			font-size: var(--fontSize15);
			line-height: 1.3;
			margin-bottom: 0.3rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize12);
			}
		}

		.dates {
			display: grid;
			font-size: var(--fontSize15);
			grid-template-columns: 1em 1fr;
			gap: 0 0.3em;
			align-items: center;
			margin-bottom: 0.8rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize12);
				margin-bottom: .75rem;
			}

			svg {
				width: 100%;
				height: auto;
			}
		}

		.price {
			margin-top: auto;
			display: grid;
			grid-template-columns: auto 1fr;
			grid-template-rows: auto 1fr;
			gap: 0 0.5em;
			font-size: var(--fontSize15);
			line-height: 1;

			>span:first-child {
				grid-column: 1/3;
				grid-row: 1/2;
			}

			>strong {
				grid-column: 1/2;
				grid-row: 2/3;
				font-size: var(--fontSize35);
				font-family: "Eames Numerals PosterM";
				font-style: normal;
				font-weight: 900;
				display: flex;
				gap: 0 0.3em;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize27);
				}

				>span {
					font-family: "Eames Numerals PosterS";
				}

			}

			>span:last-child {
				grid-column: 2/3;
				grid-row: 2/3;
				margin-bottom: auto;
				margin-top: 0.2em;
			}
		}
	}



}

.section__product-teaser-list {

	background-color: var(--backgroundColor);
	color: var(--color);


	&.shape-breaker-top {
		--offset: 3.6rem;
		--pathDown: 3.5rem;
		--pathOuterSide: calc(var(--outerSpacing));
		--pathFirstPeak: calc(var(--pathOuterSide) + 10.15rem);
		--pathSecondPeak: calc(var(--pathOuterSide) + 10.15rem + 9.3rem);
		padding-top: var(--offset);
		margin-top: calc(var(--offset) * -1);
		clip-path: polygon(0 var(--pathDown), var(--pathOuterSide) var(--pathDown), var(--pathFirstPeak) 0%, var(--pathSecondPeak) var(--pathDown), 50% 0%, calc(100% - var(--pathSecondPeak)) var(--pathDown), calc(100% - var(--pathFirstPeak)) 0%, calc(100% - var(--pathOuterSide)) var(--pathDown), 100% var(--pathDown), 100% 100%, 0 100%);

		@media only screen and (max-width: 768px) {
			padding-top: 2.1rem;
			padding-bottom: .3rem;
			--offset: 1rem;
			--pathDown: .8rem;
			--pathOuterSide: calc(var(--outerSpacing));
			--pathFirstPeak: calc(var(--pathOuterSide) + 2.15rem);
			--pathSecondPeak: calc(var(--pathOuterSide) + 9.15rem + -3.7rem);
		}
	}


	&:has(+ .shape-breaker-top) {
		.innerwrapper {
			padding-bottom: 10rem;
			
			@media only screen and (max-width: 768px) {
				padding-bottom: 2.5rem;	
			}
		}
	}

	&.top-text {
		.teaser__top {
			display: flex;
			justify-content: space-between;
			align-items: center;



			h2 {
				margin-right: 1rem;
			}

			p {
				font-size: var(--fontSize25);
				line-height: 1.2;
				max-width: 20rem;
				letter-spacing: 0.01em;

				@media only screen and (max-width: 768px) {
					display: none;

				}
			}
		}
	}

	&.bottom-rounded {
		padding-bottom: 4rem;
		border-radius: 0 0 var(--borderRadiusVeryBig) var(--borderRadiusVeryBig);
		overflow: hidden;
	}

	.innerwrapper {
		padding-top: 3.5rem;

		padding-bottom: 4.5rem;

		@media screen and (max-width: 768px) {
			padding-top: 0;
			padding-bottom: 0;

		}



		&:has(.bottom__line) {
			padding-bottom: 1rem;
		}

		&.small {
			//padding-inline: 0 !important;
		}

		.single__product-teaser-list {

			&:not(:first-child) {
				border-top: 0.25rem solid var(--borderColor);
				margin-top: 1.2rem;
				padding-top: 2.5rem;
			}

			
			.headlines {
				display: grid;
				grid-template-columns: 1fr auto;
				
				@media only screen and (max-width: 768px) {
					grid-template-columns: 100%;
				}
				
				
				h2 {
					min-width: 8.2em;
				}
				
				.description {
					text-align: right;
					margin-top: 0.4rem;
					max-width: 28em;
					opacity: 0.8;
					
					@media only screen and (max-width: 768px) {
						text-align: left;
						font-size: var(--fontSize16);
						margin-top: 0.6rem;	
					}
				}
			}

			.teaser__wrapper {
				display: grid;
				grid-template-columns: repeat(4, 1fr);
				gap: 1rem 1rem;
				margin-top: 1.9rem;
				padding-bottom: 1.25rem;

				@media only screen and (max-width: 768px) {
					display: flex;
					gap: .875rem;
					overflow-x: auto;
					overflow-y: hidden;
					scroll-behavior: smooth;
					-ms-overflow-style: none;
					scrollbar-width: none;
					margin-right: calc(var(--sideSpacing) * -1);
					margin-left: calc(var(--sideSpacing) * -1);
					padding-right: var(--sideSpacing);
				}

			}


		}

		.bottom__line {
			display: flex;
			padding-block: 1.25rem;
			justify-content: space-between;

			@media only screen and (max-width: 768px) {
				flex-direction: column;
				padding-block: 0;

			}

			.bottom-title {
				font-size: var(--fontSize48);
				font-family: "Eames Century Modern";
				letter-spacing: 0.008em;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize25);
					margin-bottom: .7rem;

				}
			}

			.button__wrapper {
				display: flex;
				margin-top: 0;
				gap: 0 0.6rem;
				
				@media only screen and (max-width: 768px) {
					display: grid;
					grid-template-columns: repeat(2,1fr);
					
					.cta__button {
						width: 100%;
						justify-content: center;
					}	
				}

				p {
					margin: 0;
				}


			}
		}
	}
}

.section__sub-header {
	background-color: var(--backgroundColor);
	color: var(--color);

	.innerwrapper {
		display: flex;
		flex-direction: column;
		padding-top: 4.3rem;
		padding-bottom: 6.1rem;

		@media only screen and (max-width: 768px) {
			padding-top: 2.3rem;
			padding-bottom: 3.5rem;
		}
		
		.content {
			margin-inline: auto;
			text-align: center;
			font-size: var(--fontSize27);
			
			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize20);
			}


			>p {
				max-width: 33em;
				margin-inline: auto;
			}

			h1 {
				text-align: center;
				max-width: 12em;
				color: inherit;
			}
		}
	}

	+.section__product-teaser-list {
		.innerwrapper {
			padding-top: 2.5rem;
			
			@media only screen and (max-width: 768px) {
				padding-top: 0.5rem;	
			}
		}
	}

}

.swiper {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: hidden;
	list-style: none;
	padding: 0;
	/* Fix of Webkit flickering */
	z-index: 1;
	display: block;
}

.swiper-vertical>.swiper-wrapper {
	flex-direction: column;
}

.swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: flex;
	transition-property: transform;
	transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
	box-sizing: content-box;
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
	transform: translate3d(0px, 0, 0);
}

.swiper-horizontal {
	touch-action: pan-y;
}

.swiper-vertical {
	touch-action: pan-x;
}

.swiper-slide {
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative;
	transition-property: transform;
	display: block;
}

.swiper-slide-invisible-blank {
	visibility: hidden;
}

/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
	height: auto;
}

.swiper-autoheight .swiper-wrapper {
	align-items: flex-start;
	transition-property: transform, height;
}

.swiper-backface-hidden .swiper-slide {
	transform: translateZ(0);
	backface-visibility: hidden;
}

/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
	perspective: 1200px;
}

.swiper-3d .swiper-wrapper {
	transform-style: preserve-3d;
}

.swiper-3d {
	perspective: 1200px;

	.swiper-slide,
	.swiper-cube-shadow {
		transform-style: preserve-3d;
	}
}

/* CSS Mode */
.swiper-css-mode {
	>.swiper-wrapper {
		overflow: auto;
		scrollbar-width: none;
		/* For Firefox */
		-ms-overflow-style: none;

		/* For Internet Explorer and Edge */
		&::-webkit-scrollbar {
			display: none;
		}
	}

	>.swiper-wrapper>.swiper-slide {
		scroll-snap-align: start start;
	}

	&.swiper-horizontal {
		>.swiper-wrapper {
			scroll-snap-type: x mandatory;
		}

		>.swiper-wrapper>.swiper-slide:first-child {
			margin-inline-start: var(--swiper-slides-offset-before);
			scroll-margin-inline-start: var(--swiper-slides-offset-before);
		}

		>.swiper-wrapper>.swiper-slide:last-child {
			margin-inline-end: var(--swiper-slides-offset-after);
		}
	}

	&.swiper-vertical {
		>.swiper-wrapper {
			scroll-snap-type: y mandatory;
		}

		>.swiper-wrapper>.swiper-slide:first-child {
			margin-block-start: var(--swiper-slides-offset-before);
			scroll-margin-block-start: var(--swiper-slides-offset-before);
		}

		>.swiper-wrapper>.swiper-slide:last-child {
			margin-block-end: var(--swiper-slides-offset-after);
		}
	}

	&.swiper-free-mode {
		>.swiper-wrapper {
			scroll-snap-type: none;
		}

		>.swiper-wrapper>.swiper-slide {
			scroll-snap-align: none;
		}
	}

	&.swiper-centered {
		>.swiper-wrapper::before {
			content: '';
			flex-shrink: 0;
			order: 9999;
		}

		>.swiper-wrapper>.swiper-slide {
			scroll-snap-align: center center;
			scroll-snap-stop: always;
		}
	}

	&.swiper-centered.swiper-horizontal {
		>.swiper-wrapper>.swiper-slide:first-child {
			margin-inline-start: var(--swiper-centered-offset-before);
		}

		>.swiper-wrapper::before {
			height: 100%;
			min-height: 1px;
			width: var(--swiper-centered-offset-after);
		}
	}

	&.swiper-centered.swiper-vertical {
		>.swiper-wrapper>.swiper-slide:first-child {
			margin-block-start: var(--swiper-centered-offset-before);
		}

		>.swiper-wrapper::before {
			width: 100%;
			min-width: 1px;
			height: var(--swiper-centered-offset-after);
		}
	}
}

/* Slide styles start */
/* 3D Shadows */
.swiper-3d {

	.swiper-slide-shadow,
	.swiper-slide-shadow-left,
	.swiper-slide-shadow-right,
	.swiper-slide-shadow-top,
	.swiper-slide-shadow-bottom,
	.swiper-slide-shadow,
	.swiper-slide-shadow-left,
	.swiper-slide-shadow-right,
	.swiper-slide-shadow-top,
	.swiper-slide-shadow-bottom {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		pointer-events: none;
		z-index: 10;
	}

	.swiper-slide-shadow {
		background: rgba(0, 0, 0, 0.15);
	}

	.swiper-slide-shadow-left {
		background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}

	.swiper-slide-shadow-right {
		background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}

	.swiper-slide-shadow-top {
		background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}

	.swiper-slide-shadow-bottom {
		background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}
}

.swiper-lazy-preloader {
	width: 42px;
	height: 42px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -21px;
	margin-top: -21px;
	z-index: 10;
	transform-origin: 50%;
	box-sizing: border-box;
	border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
	border-radius: 50%;
	border-top-color: transparent;
}

.swiper:not(.swiper-watch-progress),
.swiper-watch-progress .swiper-slide-visible {
	.swiper-lazy-preloader {
		animation: swiper-preloader-spin 1s infinite linear;
	}
}

.swiper-lazy-preloader-white {
	--swiper-preloader-color: #fff;
}

.swiper-lazy-preloader-black {
	--swiper-preloader-color: #000;
}

@keyframes swiper-preloader-spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

/* Slide styles end */


.section__quote-slider {
	background-color: var(--backgroundColor);
	color: var(--color);
	border-radius: 0 0 var(--borderRadiusVeryBig) var(--borderRadiusVeryBig);



	.innerwrapper {
		padding-top: 4.6rem;
		padding-bottom: 4rem;

		@media screen and (max-width: 768px) {
			padding-top: 1.3rem;
			padding-bottom: 1rem;

		}

		.quote__slider-holder {
			position: relative;
			display: block;
			width: calc(100% + 2rem);
			margin-inline: -1rem;
			overflow: visible;

			@media only screen and (max-width: 768px) {
				/* margin: 0 2.2rem;
				margin-inline: auto;
				width: 79.5% !important; */
				/* padding: 0 2.2rem; */
				/* overflow: hidden; */
				width: calc(100% - 3rem);
				margin-inline: auto;

			}

			.quote-slider-arrow {
				font-size: 0;
				line-height: 0;
				background: transparent;
				border: 0;
				padding: 0;
				width: 4rem;
				margin-block: auto;
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				z-index: 9;
				cursor: pointer;

				@media only screen and (max-width: 768px) {
					width: 1.7rem;
				}

				svg {
					width: 100%;
					height: auto;
					opacity: 0.2;
					
					path {
						fill: var(--color) !important;
					}
				}

				&.quote-slider-prev {
					left: 0;

					@media screen and (max-width: 768px) {
						left: -2.1rem;
					}
				}

				&.quote-slider-next {
					right: 0;

					@media screen and (max-width: 768px) {
						right: -2.1rem;
					}
				}
				
				@media (hover: hover) {
					&:hover {
						svg {
							opacity: 1;
						}
					}	
				}
			}

			.quote__slider-wrapper {
				display: flex;
				align-items: center;
				width: 100%;

				@media only screen and (max-width: 768px) {}

				.single__quote-slider {
					aspect-ratio: 582/587;
					display: flex;
					flex-direction: column;
					background-color: var(--colorWhite);
					color: var(--color);
					width: 29rem;
					clip-path: polygon(50% 0, 0 14%, 0 86%, 50% 100%, 100% 86%, 100% 14%);
					align-items: center;
					padding-top: 2.2rem;
					padding-bottom: 4.7rem;
					transform: scale(0.47);
					height: auto;
					transform-origin: 50% 50%;
					flex-shrink: 0;
					transition: transform 500ms cubic-bezier(0.65, 0, 0.35, 1), color 500ms ease, background-color 500ms ease;

					@media only screen and (max-width: 768px) {
						padding-top: 1.2rem;
						padding-bottom: 1.7rem;
						/* width: 79.5% !important; */
					}

					&.swiper-slide-prev {
						transform: translateX(22%) scale(0.47);

						@media only screen and (max-width: 768px) {
							transform: none;
						}
					}

					&.swiper-slide-next {
						transform: translateX(-22%) scale(0.47);

						@media only screen and (max-width: 768px) {
							transform: none;
						}
					}

					.icon {
						font-size: 0;
						line-height: 0;
						margin-inline: auto;
						width: 4rem;

						@media only screen and (max-width: 768px) {
							width: 1.5rem;
						}

						svg {
							width: 100%;
							height: auto;
							aspect-ratio: 1/1;
							object-fit: contain;

							path {
								fill: var(--backgroundColor) !important;
							}
						}
					}

					.quote__holder {
						flex: 1;
						display: flex;
						align-items: center;
						padding-inline: 1.7rem;
						padding-top: 1rem;

						@media screen and (max-width: 768px) {
							padding-top: .5rem;
							padding-inline: 1rem;

						}

						.quote {
							font-size: var(--fontSize25);
							text-align: center;
							font-family: "Eames Century Modern";
							line-height: 1.095;

							@media only screen and (max-width: 768px) {
								font-size: var(--fontSize21);
							}
						}
					}

					.name {
						text-align: center;
						font-size: var(--fontSize22);
						line-height: 1.181;

						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize15);
						}

					}

					&.swiper-slide-active {
						transform: scale(1);
						background-color: var(--color);
						color: var(--backgroundColor);
					}



				}

			}
		}



	}
}

.section__siteplan {
	background-color: var(--backgroundColor);
	padding-block: var(--borderRadiusVeryBig);
	margin-block: calc(var(--borderRadiusVeryBig) * -1);
	position: relative;
	z-index: 0 !important;

	.innerwrapper {
		display: grid;
		grid-template-columns: 32rem 1fr;
		gap: 0 3.2rem;
		padding-top: 3rem;
		align-items: center;
		padding-bottom: 3rem;
		padding-left: 2rem;

		@media only screen and (max-width: 768px) {
			width: 100%;
			margin-left: 0;
			grid-template-columns: 1fr;
			gap: 1.1rem 0;
			align-items: start;
			padding-top: 1rem;
			padding-bottom: .9rem;
			padding-left: 0;
		}

		.image {
			font-size: 0;
			line-height: 0;
			width: 100%;

			@media only screen and (max-width: 768px) {
				width: 100%;
				margin-left: 0;

			}

			img,
			svg {
				width: 100%;
				height: auto;
				
				path[fill="#30227e"]{
					fill: var(--backgroundColor) !important;
				}
			}
		}

		.content {
			color: var(--color);
			font-size: var(--fontSize22);
			line-height: 1.25;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize21);

			}

			h3 {
				margin-bottom: 0.7em;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize21);
					
					br {
						display: none;
					}

				}
			}

			p {
				max-width: 21em;
				
				&:has(.cta__button){
					margin-top: 1.5em;
				}

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize15);
					max-width: 100%;
					margin: .4rem 0 .8rem;
				}
			}
		}
	}
}

.section__team-teaser {
	background-color: var(--backgroundColor);
	color: var(--color);
	border-radius: var(--borderRadiusVeryBig) var(--borderRadiusVeryBig) 0 0;

	.innerwrapper {
		display: grid;
		grid-template-columns: 1fr 28rem 1fr;

		@media only screen and (max-width: 768px) {
			width: 100%;
			grid-template-columns: 1fr;
			align-items: start;
			padding-top: 1.9rem;
			padding-bottom: 7.2rem;
			position: relative;


		}

		.content {
			display: flex;
			flex-direction: column;
			justify-content: center;
			text-align: center;
			gap: 1.5rem 0;
			padding-top: 0;

			@media only screen and (max-width: 768px) {
				max-width: 80%;
				margin: 0 auto;
				gap: 1rem 0;
			}

			h3 {
				font-size: var(--fontSize48);
				text-align: center;
				line-height: 1.166;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize27);
					line-height: 1;

				}
			}

			.name {
				font-size: var(--fontSize22);

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize15);
					width: 55%;
					margin: 0 auto;
				}
			}
		}

		.image {
			font-size: 0;
			line-height: 0;
			width: calc(100% + 19.3rem);
			margin-top: -2.7rem;

			@media only screen and (max-width: 768px) {
				margin-top: 0;
				position: absolute;
				bottom: 0;
				left: -6.1rem;
				width: 78%;

			}

			&:first-child {
				margin-left: calc(calc(19.3rem - 7.4rem) * -1);
				margin-right: auto;

				@media only screen and (max-width: 768px) {
					margin-left: 0;

				}
			}

			&:last-child {
				margin-left: -4.4rem;
				margin-right: auto;

				@media only screen and (max-width: 768px) {
					margin-left: 0;
					left: auto;
					right: -6.3rem;

				}
			}

			img {
				width: 100%;
				height: auto;
			}
		}
	}
	
	&.summer {
		.innerwrapper {
			.image {
				width: calc(100% + 9.2rem);
				margin-top: auto;
				
				@media only screen and (max-width: 768px) {
					margin-top: 0;
					position: absolute;
					bottom: 0;
					left: -2.8rem;
					width: 63%;
				
				}
				
				&:first-child {
					margin-left: -2rem;
					
					@media only screen and (max-width: 768px) {
						margin-left: 0;
					
					}
				}
				
				&:last-child {
					margin-left: -4.4rem;
					margin-right: auto;
				
					@media only screen and (max-width: 768px) {
						margin-left: 0;
						left: auto;
						right: -3.3rem;
				
					}
				}
				
			}
		}
	}
}

.section__rounded-shapes-extended {
	background-color: var(--color);
	color: var(--backgroundColor);

	@media only screen and (max-width: 768px) {
		/* display: none; */

	}

	.innerwrapper {
		.box__wrapper {
			width: calc(100% + var(--sideSpacing) + var(--sideSpacing));
			margin-inline: calc(var(--sideSpacing) * -1);
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			--borderRadius: 12rem;
			position: relative;

			@media only screen and (max-width: 768px) {
				display: flex;
				flex-direction: column;
			}

			/*
			&:before {
				content: '';
				display: block;
				right: 100%;
				top: 0;
				width: 33.33%;
				aspect-ratio: 1/1;
				background-color: var(--backgroundColor);
				border-radius: var(--borderRadius) var(--borderRadius) 0 0;
				position: absolute;
			}
		
			&:after {
				content: '';
				display: block;
				left: 100%;
				top: 0;
				width: 33.33%;
				aspect-ratio: 1/1;
				background-color: var(--backgroundColor);
				border-radius: var(--borderRadius) var(--borderRadius) 0 0;
				position: absolute;
			}
			*/

			.image {
				font-size: 0;
				line-height: 0;
				width: 100%;
				aspect-ratio: 1 / 0.97;
				overflow: clip;

				@media only screen and (max-width: 768px) {
					overflow: visible;
					margin-bottom: 1.0625rem;
				}


				img {
					aspect-ratio: 1/1;
					width: 100%;
					height: 100%;
					object-fit: cover;
				}

				&:nth-child(1) {
					grid-column: 1/2;
					grid-row: 1/2;
					border-radius: 0 0 var(--borderRadius) var(--borderRadius);
				}

				&:nth-child(2) {
					grid-column: 3/4;
					grid-row: 1/2;
					border-radius: 0 0 var(--borderRadius) var(--borderRadius);
				}

				&:nth-child(3) {
					grid-column: 1/2;
					grid-row: 2/3;
					border-radius: var(--borderRadius) var(--borderRadius) 0 0;

					@media only screen and (max-width: 768px) {
						height: 15.7rem;
					}
				}

				&:nth-child(4) {
					grid-column: 3/4;
					grid-row: 2/3;
					border-radius: var(--borderRadius) var(--borderRadius) 0 0;
				}


				&:nth-child(1),
				&:nth-child(2),
				&:nth-child(4) {
					@media only screen and (max-width: 768px) {
						display: none;
					}

				}
			}

			.content {
				grid-column: 2/3;
				grid-row: 1/3;
				background-color: var(--backgroundColor);
				border-radius: var(--borderRadius) var(--borderRadius) 0 0;
				color: var(--textColor);
				display: flex;
				flex-direction: column;
				align-items: center;
				font-size: var(--fontSize27);
				line-height: 1.185;
				text-align: center;
				justify-content: center;
				padding-top: 9rem;

				@media only screen and (max-width: 768px) {
					position: relative;
					font-size: var(--fontSize21);
					padding-bottom: 2rem;
					padding-top: 6.5rem;
				}
				
				> svg {
					width: 8.5rem;
					height: auto;
					margin-top: -7rem;
					
					@media only screen and (max-width: 768px) {
						width: 3.7rem;
					}
				}
				
				/*
				>.content-icon {
					width: 10rem;
					position: absolute;
					top: 3rem;

					@media only screen and (max-width: 768px) {
						width: 3.7rem;
						top: 2rem;
					}

					svg {
						height: auto;
					}
				}
				*/

				>p {
					max-width: 15em;
					margin-inline: auto;

					@media only screen and (max-width: 768px) {
						max-width: 17em;
					}
				}

				h3 {
					font-size: var(--fontSize79);
					line-height: 1.018;
					text-align: center;
					margin-top: 0.4em;

					@media only screen and (max-width: 768px) {
						font-size: var(--fontSize38);
					}

					+p {
						margin-top: 1.3em;

						@media only screen and (max-width: 768px) {
							margin-top: .8em;
						}
					}
				}
			}
		}
	}
}

.section__rounded-shapes {
	background-color: var(--color);
	color: var(--backgroundColor);

	.innerwrapper {
		@media screen and (max-width: 768px) {
			padding-top: .8rem;
			padding-bottom: .5rem;

		}

		.box__wrapper {
			width: calc(100% + var(--sideSpacing) + var(--sideSpacing));
			margin-inline: calc(var(--sideSpacing) * -1);
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			--borderRadius: 12rem;
			position: relative;

			@media only screen and (max-width: 768px) {
				grid-template-columns: 1fr;
				align-items: start;
				height: 18.4rem;
				padding-top: .8rem;
				padding-bottom: .5rem;
				border-radius: var(--borderRadius) var(--borderRadius) 0 0;
				background-color: var(--backgroundColor);
			}

			&:before {
				content: '';
				display: block;
				right: 100%;
				top: 0;
				width: 33.33%;
				aspect-ratio: 1/1;
				background-color: var(--backgroundColor);
				border-radius: var(--borderRadius) var(--borderRadius) 0 0;
				position: absolute;

				@media only screen and (max-width: 768px) {
					display: none;
				}
			}

			&:after {
				content: '';
				display: block;
				left: 100%;
				top: 0;
				width: 33.33%;
				aspect-ratio: 1/1;
				background-color: var(--backgroundColor);
				border-radius: var(--borderRadius) var(--borderRadius) 0 0;
				position: absolute;

				@media only screen and (max-width: 768px) {
					display: none;
				}
			}
		}

		.box {
			width: 100%;
			aspect-ratio: 1/1;
			background-color: var(--backgroundColor);
			border-radius: 0 0 var(--borderRadius) var(--borderRadius);
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			font-size: var(--fontSize27);
			line-height: 1.185;
			text-align: center;
			color: var(--color);

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize21);
				background-color: transparent;
				justify-content: center;
			}

			.icon {
				font-size: 0;
				line-height: 0;
				width: 11.5rem;
				margin-top: -1.5rem;

				@media screen and (max-width: 768px) {
					width: 3.3rem;
					margin-top: -13rem;
				}

				svg {
					width: 100%;
					height: auto;

					path {
						fill: var(--color) !important;
					}

					g {
						fill: var(--color);


					}
				}
			}

			h3 {
				font-size: var(--fontSize79);
				line-height: 1.018;
				text-align: center;
				margin-top: 0.4em;

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

					font-size: var(--fontSize38);

				}

				+p {
					margin-top: 1.3em;

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

						margin-top: .5rem;

					}

				}
			}


			& .cta__button {
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize17);
				}
			}

			&:nth-child(even) {
				border-radius: var(--borderRadius) var(--borderRadius) 0 0;
			}

			&:nth-child(1),
			&:nth-child(2) {
				@media only screen and (max-width: 768px) {
					/* display: none; */
					position: absolute;
					top: 0;
					left: 50%;
					transform: translateX(-50%);
					background-color: transparent;
					z-index: 1;
				}
			}

			&:nth-child(1) {
				@media screen and (max-width: 768px) {}
			}

			&:nth-child(2) {
				@media screen and (max-width: 768px) {
					width: 14rem !important;
					top: 2.2rem;
				}
			}

			&:nth-child(3) {
				@media screen and (max-width: 768px) {
					position: absolute;
					top: 6.4rem;
				}
			}
			
			.cta__button {
				@media (hover: hover) {
					&:hover {
						--buttonBackgroundColor: var(--colorWhite);
					}	
				}
			}

		}
	}
}


.fade_out-background {
	position: fixed;
	left: 0;
	bottom: 0;
	right: 0;
	top: 0;
	z-index: 100;
	background-color: rgba(00, 00, 00, 0.2);
	backdrop-filter: blur(0.2rem);

	pointer-events: none;
	opacity: 0;
}

.koennerstufe__wrapper {
	background-color: var(--colorWhite);
	border-radius: var(--borderRadiusVeryBig) var(--borderRadiusVeryBig) 0 0;
	position: fixed;
	left: 50%;
	bottom: 0;
	height: calc(100svh - 2rem);
	z-index: 101;
	overflow-y: auto;
	max-width: calc(1494px + var(--sideSpacing) + var(--sideSpacing));
	width: 100%;

	scrollbar-width: none;
	/* Firefox */
	-ms-overflow-style: none;
	/* IE 10+ */
	overflow-y: scroll;
	overflow-x: hidden;
	overscroll-behavior: none;

	&::-webkit-scrollbar {
		display: none;
		/* Chrome Safari */
	}

	pointer-events: none;
	transform: translateY(100%) translateX(-50%);

	.innerwrapper {
		/*height: 50rem;*/
		padding-top: 3.6rem;
		padding-bottom: 3.6rem;
		position: relative;

		.close__koennerstufe {
			font-size: 0;
			line-height: 0;
			display: block;
			width: 2.3rem;
			border: 0;
			background: transparent;
			margin: 0;
			position: absolute;
			right: 4.5rem;
			top: 3.8rem;
			cursor: pointer;
			padding: 0;
			
			@media screen and (max-width: 768px) {
				width: 1.5rem;
				right: 0.5rem;
				top: 1rem;
			}

			svg {
				width: 100%;
				height: auto;
			}
		}

		.ks__header {
			font-size: var(--fontSize27);
			line-height: 1.194;
			font-weight: 400;
			
			@media screen and (max-width: 768px) {
				text-align: center;
				font-size: var(--fontSize21);	
			}

			h2 {
				font-size: var(--fontSize79);
				font-weight: 400;
				font-family: "Eames Century Modern";
				line-height: 1.018;
				margin: 0;
				letter-spacing: 0.03em;
				
				@media screen and (max-width: 768px) {
					font-size: var(--fontSize38);	
				}

				+p {
					margin-top: 1.6em;
					
					@media screen and (max-width: 768px) {
						margin-top: 0.75em;	
					}
				}
			}

			p {
				max-width: 26em;
			}
			
			&.ski {
				
			}
			
			&.bike {
				color: var(--colorGreenDark);
			}
		}

		.ks__listing {
			display: flex;
			flex-direction: column;
			margin-top: 4.9rem;
			gap: 1rem 0;
			
			@media screen and (max-width: 768px) {
				margin-top: 1.5rem;	
			}

			.single__list {
				background-color: var(--backgroundColor);
				color: var(--color);
				padding: 1.3rem 1.6rem;
				position: relative;
				border-radius: 0.25rem;
				
				@media screen and (max-width: 768px) {
					font-size: var(--fontSize15);
					padding: 1rem 1rem;	
				}

				h3 {
					font-size: var(--fontSize24);
					font-weight: 450;
					font-family: "Eames Century Modern";
					line-height: 1.018;
					margin: 0 0 0.2em 0;
					
					@media screen and (max-width: 768px) {
						font-size: var(--fontSize16);
					}
				}

				>p {
					margin: 0;
					opacity: 0.6;
				}

				.goal {
					display: grid;
					grid-template-columns: 1.3em 1fr;
					gap: 0 1.1em;
					margin-top: 0.5rem;

					>svg {
						width: 100%;
						height: auto;
						margin-left: 0.3em;
					}

					.goal_inner {
						>strong {
							display: block;
							font-weight: 500;
						}

						.goal_description {
							opacity: 0.7;
						}
					}


				}
			}
		}
	}


}


.section__events-voucher {
	background-color: var(--backgroundColor);
	color: var(--color);
	
	&.summer {
		.innerwrapper .events .events__list .single__event .meta >p {
			color: var(--colorGreenMedium);	
		}
		.innerwrapper .events .events__list .single__event .arrow {
			svg {
				circle {
					fill: #E6F5DB !important;
				}
				g path {
					fill: var(--colorGreenDark) !important;
				}
			}
		}
		.innerwrapper .events .events__list .single__event,
		.innerwrapper .events .events__list {
			border-color: var(--colorGreenLight);
		}
	}

	.innerwrapper {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 0 4.4rem;
		padding-top: 3.6rem;
		padding-bottom: 3rem;

		@media only screen and (max-width: 768px) {
			padding-top: 1.7rem;
			grid-template-columns: 1fr;
		}

		h2 {
			font-size: var(--fontSize48);
			letter-spacing: 0;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize38);


			}
		}

		.events {
			display: flex;
			flex-direction: column;

			p:has(.cta__button) {
				margin-top: auto;

				@media only screen and (max-width: 768px) {
					display: none;
				}
			}

			.events__list {
				border-top: 2px solid var(--colorBlueLight);
				display: flex;
				flex-direction: column;
				margin-top: 2rem;
				margin-bottom: 1rem;

				@media only screen and (max-width: 768px) {
					margin-top: 1.9rem;

				}

				.single__event {
					border-bottom: 2px solid var(--colorBlueLight);
					display: grid;
					grid-template-columns: 8.5rem 1fr 5.2rem;
					color: inherit;
					text-decoration: none;
					font-size: var(--fontSize15);
					padding-top: 0.5rem;
					padding-bottom: 0.5rem;

					@media only screen and (max-width: 768px) {
						grid-template-columns: 4.4rem 12.9rem;
						align-items: start;
					}
					
					@media (hover: hover) {
						&:hover {
							.meta {
								h3 {
									text-decoration: underline;
								}
							}
						}	
					}

					.date {
						font-family: "Eames Numerals PosterM";
						font-style: normal;
						font-weight: 900;
						font-size: var(--fontSize42);
						margin-block: auto;

						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize24);
							margin-block: 0;
						}
					}

					.meta {
						display: flex;
						flex-direction: column;

						.tags {
							margin-bottom: 0.2rem;

							>span {
								font-size: var(--fontSize8);
							}
						}

						h3 {
							font-size: var(--fontSize26);
							line-height: 1.169;
							letter-spacing: 0.0;

							@media only screen and (max-width: 768px) {
								font-size: var(--fontSize20);
							}

							+p {
								margin-top: 0;
							}
						}

						>p {
							color: var(--colorBlueMedium);
						}
					}

					.arrow {
						display: block;
						margin-right: auto;
						font-size: 0;
						line-height: 0;
						width: 2.1rem;
						margin-block: auto;

						@media only screen and (max-width: 768px) {
							display: none;
						}

						svg {
							width: 100%;
							height: auto;
						}
					}
				}

			}
		}

		.vouchers {
			display: flex;
			flex-direction: column;

			h3 {
				font-size: var(--fontSize25);
				line-height: 1.096;
				letter-spacing: 0.01em;
				margin-top: 0.4em;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize20);
				}
			}

			.image {
				font-size: 0;
				line-height: 0;
				display: block;
				width: calc(100% - 2.5rem);
				margin-left: 3.5rem;
				margin-top: auto;
				margin-bottom: auto;

				@media only screen and (max-width: 768px) {
					display: block;
					width: 126%;
					margin-left: 0rem;
					margin-top: 0;
					margin-bottom: 1rem;
				}


				img {
					width: 100%;
					height: auto;
				}
			}

			p:has(.cta__button) {
				margin-top: auto;
			}
		}
	}
}

.section__product-detail {
	background-color: var(--colorWhite);
	color: var(--colorBlueDark);

	.innerwrapper {
		padding-top: 2.3rem;
		padding-bottom: 4rem;
		
		@media only screen and (max-width: 768px) {
			padding-top: 0.8rem;	
		}

		.product {
			display: grid;
			grid-template-columns: 1fr 21.8rem;
			gap: 0 1rem;
			grid-template-rows: auto auto auto 1fr;

			@media only screen and (max-width: 768px) {
				display: flex;
				flex-direction: column;
			}
		}

		.product__top {
			display: flex;
			flex-direction: column;
			gap: 2.2rem 0;
			grid-column: 1/3;
			grid-row: 1/2;

			@media only screen and (max-width: 768px) {
				gap: .6875rem 0;
				grid-column: auto;
				grid-row: auto;
			}

			h1 {
				font-size: var(--fontSize79);
				line-height: 1.018;
				letter-spacing: 0.025em;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize38);
				}
			}

			.tags {
				margin-bottom: 1rem;
			}
		}




		.product__images {
			display: grid;
			grid-template-columns: 66.4% 1fr;
			gap: 0 0.5rem;
			grid-column: 1/2;
			grid-row: 2/3;
			margin-bottom: 1.9rem;
			position: relative;

			@media only screen and (max-width: 768px) {
				margin-bottom: -2rem;
				grid-template-columns: 1fr;

			}
			
			
			&:not(:has(.image:nth-child(2))) {
				grid-template-columns: 100%;
			}
			
			.more_images {
				position: absolute;
				display: inline-grid;
				grid-template-columns: 1em 1fr;
				font-size: var(--fontSize15);
				background-color: var(--colorWhite);
				border-radius: 2em;
				right: 0.5rem;
				bottom: 0.5rem;
				align-items: center;
				padding: 0.2em 0.6em;
				gap: 0 0.3em;
				box-shadow: 0 0.2rem 0.2rem rgba(0, 0, 0, 0.25);
				color: inherit;
				text-decoration: none;
				
				@media only screen and (max-width: 768px) {
					bottom: auto;
					top: 0.75rem;
					right: 0;
				}
				
				svg {
					width: 100%;
					height: auto;
				}
			}

			.image {
				font-size: 0;
				line-height: 0;

				@media only screen and (max-width: 768px) {
					margin-inline: calc(var(--sideSpacing) * -1);
				}

				&:not(:first-child) {

					@media only screen and (max-width: 768px) {
						display: none;
					}
				}

				img {
					width: 100%;
					height: auto;
					object-fit: cover;
					aspect-ratio: 603/402;
					border-radius: var(--borderRadiusSmall);
					
					@media only screen and (max-width: 768px) {
						border-radius: 0;	
						aspect-ratio: 603/402;
					}
				}

				&:nth-child(1) {
					grid-column: 1/2;
					grid-row: 1/3;
				}

				&:nth-child(3) {
					margin-top: auto;
				}
			}
		}



		.product__description {
			font-size: var(--fontSize24);
			line-height: 1.166;
			font-family: 'Switzer';
			font-weight: 500;
			grid-column: 1/2;
			grid-row: 3/4;
			letter-spacing: 0.02em;
			margin-bottom: 3.3rem;

			@media only screen and (max-width: 768px) {
				border-radius: calc(var(--borderRadiusVeryBig) * 0.75) calc(var(--borderRadiusVeryBig) * 0.75) 0 0;
				background-color: var(--colorWhite);
				overflow: hidden;
				margin-inline: calc(var(--sideSpacing) * -1);
				padding: 1.2rem var(--sideSpacing) 0;
				text-align: center;
				position: relative;
				font-size: var(--fontSize19);
				margin-bottom: 1.6rem;
			}

			p {
				max-width: 28em;
			}

		}

		.product__sidebar-wrapper {
			grid-column: 2/3;
			grid-row: 2/5;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;
				width: calc(100% + 1rem);
				margin-inline: -0.5rem;
			}

			.product__sidebar {
				width: 100%;
				border: 1px solid #BBCCF4;
				border-radius: var(--borderRadiusSmall);
				/*min-height: 40rem;*/
				padding: 1rem;
				box-shadow: 0.2rem -0.2rem 1.345rem 0.25rem rgba(0, 0, 0, 0.09);
				
				@media only screen and (max-width: 768px) {
					box-shadow: none;
					border-radius: 	calc(var(--borderRadiusSmall) * 2);
					padding: 0.5rem;
				}
				
				.nyp {
					margin-bottom: 0.5rem;
				}
				
				form .form-row .input-text, 
				form .form-row select,
				.nyp .nyp-input{
					width: 100%;
					height: 2.5rem;
					border: 1px solid var(--colorBlueDark);
					font-weight: 400;
					font-size: var(--fontSize15);
					font-family: 'Switzer';
					display: flex;
					align-items: center;
					border-radius: var(--borderRadiusSmall);
					color: var(--colorBlueDark);
					
					&:focus {
						outline: 0;
					}
				}
				
				form .form-row textarea {
					resize: none;
					height: 5lh !important;
				}
				
				form .form-row label,
				.nyp label {
					margin: 0;
					font-weight: 500;
					font-size: var(--fontSize15);
					font-family: 'Switzer';
					line-height: 1.275;
					margin-bottom: 0.3rem;
					
					.woocommerce-Price-currencySymbol {
						display: none !important;
					}
				}
				
				.variations select.is-visually-hidden {
				  position: absolute !important;
				  left: -9999px !important;
				  width: 1px !important;
				  height: 1px !important;
				  opacity: 0 !important;
				  pointer-events: none !important;
				}
				
				.variation-buttons {
				  display: grid;
				  grid-template-columns: repeat(3, 1fr);
				  gap: 0.5rem;
				  margin-top: 0.5rem;
				  
				}
				
				.variation-button {
				  appearance: none;
				  border: 1px solid var(--colorBlueDark);
				  background: transparent;
				  color: var(--colorBlueDark);
				  padding: 0.75rem 1rem;
				  cursor: pointer;
				  transition: 0.2s ease;
				  border-radius: var(--borderRadiusSmall);
				  font-size: var(--fontSize20);
				  line-height: 1.275;
				  
				  &[data-value="Eigener Wert"]{
					  grid-column: span 2;
				  }
				}
				
				.variation-button:hover {
				  background: var(--colorBlueDark);
				  color: #fff;
				}
				
				.variation-button.is-active {
				  background: var(--colorBlueDark);
				  color: #fff;
				}
				
				.variation-button.is-disabled,
				.variation-button:disabled {
				  opacity: 0.35;
				  cursor: not-allowed;
				  pointer-events: none;
				}
				
				.quantity {
					display: none !important;
				}
				
				
				
				.variations {
					th,
					td {
						display: block;
						
						select {
							position: absolute !important;
							left: -9999px !important;
							width: 1px !important;
							height: 1px !important;
							opacity: 0 !important;
							pointer-events: none !important;
						}
					}
					
					th.label {
						label {
							font-family: "Eames Century Modern";
							font-weight: 400;
							font-size: var(--fontSize42);
							
							@media only screen and (max-width: 768px) {
								font-size: var(--fontSize32);	
							}
						}
					}
				}
				
				.reset_variations {
					display: none !important;
				}
				
				.single_variation_wrap {
					display: flex;
					flex-direction: column;
					
					.single_variation {
						display: none !important;
					}
				}
				
				.voucher-fields {
					.voucher-image-options {
						display: grid;
						grid-template-columns: repeat(2,1fr);
						gap: 1rem;
						margin-top: 1.5rem;
						
						&:before {
							content: 'Welche Vorlage möchten Sie für Ihren Gutschein verwenden?';
							grid-column: span 2;
						}
						
						.voucher-image-option {
							float: none;
							margin: 0;
							padding: 0.5rem;
							border: 1px solid var(--colorBlueLight);
							position: relative;
							border-radius: var(--borderRadiusSmall);
							display: grid;
							grid-template-columns: 2rem 1fr;
							align-items: center;
							gap: 0;
							
							> a {
								pointer-events: none;
							}
							
							img {
								max-width: none;
								width: 100%;
							}
							
							> input {
								margin: 0;
								width: 100%;
								position: absolute;
								inset: 0;
								height: 100%;
								opacity: 0;
							}
							
							&:has(>input:checked){
								background-color: var(--colorBlueLight);
								border-color: var(--colorBlueDark);
							}
							
							&:first-child {
								&:after {
									content: 'Winter';
								}
							}
							
							&:nth-child(2) {
								&:after {
									content: 'Sommer';
								}
							}
						}
					}
				}

				.summary {
					float: none;
					width: 100%;
					margin: 0;

					>.price {
						display: none;
					}

					.cart {
						margin-bottom: 0;

						.single_add_to_cart_button {
							--buttonBackgroundColor: var(--colorBlueDark);
							--buttonColor: var(--colorWhite);
							background-color: var(--buttonBackgroundColor);
							color: var(--buttonColor);
							font-size: var(--fontSize24);
							line-height: 1;
							font-family: "Eames Century Modern";
							display: flex;
							align-items: center;
							padding: 0.5em 1.1em 0.6em 1.1em;
							gap: 0 0.6em;
							height: 3rem;
							text-decoration: none;
							border-radius: 2em;
							width: 100%;
							justify-content: center;
							font-weight: 450;

							&:after {
								content: '';
								display: block;
								width: 1.66em;
								height: auto;
								aspect-ratio: 40/26;
								background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='26' fill='none' viewBox='0 0 40 26'><path fill='%23fff' d='M0 11.431h25v2.37H0z' style='fill:%23fff;fill-opacity:1'/><path fill='%23fff' d='M25 25.216c.046-5.738 1.815-9.6 4.815-11.477h-7.092v-2.277h7.092c-3-1.815-4.77-5.692-4.815-11.477h.046c5.138 6.739 9.415 10.2 14.954 12.57v.092c-5.539 2.37-9.816 5.83-14.954 12.57z' style='fill:%23fff;fill-opacity:1'/></svg>");
								background-repeat: no-repeat;
								background-size: 98% auto;
								transform: translateY(0.1em);

							}

							@media only screen and (max-width: 768px) {
								font-size: var(--fontSize17);
								font-weight: 450;
							}
						}
					}
				}

				.product_meta {
					display: none;
				}

				.wc-bookings-booking-form {
					border: 0;
					padding: 0;
					margin: 0;

					p.form-field {
						display: grid;
						grid-template-columns: 1fr auto;
						background-color: var(--colorBlueLight);
						align-items: center;
						padding-inline: 0.5rem;
						padding-block: 0.5rem;
						border-radius: var(--borderRadiusSmall);
						font-size: 0;
						line-height: 0;
						margin-bottom: 1rem;
						
						&.wc_bookings_field_resource {
							display: none;
						}

						>label {
							font-size: var(--fontSize20);
							font-family: 'Switzer';
							font-weight: 450;
							color: var(--colorBlueDark);
							line-height: 1.275;
						}

						input {
							font-size: var(--fontSize24);
							font-family: 'Switzer';
							font-weight: 450;
							color: var(--colorBlueDark);
							background-color: rgba(255, 255, 255, 0.6);
							border: 0;
							text-align: center;
							line-height: 1;
							display: flex;
							height: 1.8rem;
							padding: 0 0 0 0;
							border-radius: var(--borderRadiusSmall);


							&[type="number"] {
								width: 2em;


								&::-webkit-outer-spin-button,
								&::-webkit-inner-spin-button {
									-webkit-appearance: none;
									margin: 0;
								}

							}

							&:focus {
								outline: 0;
							}
						}

						.custom-number-wrapper {
							display: inline-flex;
							align-items: center;
							gap: 0.2rem;
						}



						.num-btn {
							width: 1.8rem;
							height: auto;
							aspect-ratio: 1/1;
							border: 0;
							background: transparent;
							padding: 0;
							margin: 0;
							cursor: pointer;
							font-size: var(--fontSize20);
							line-height: 1;
							padding: 0;
							border: 1px solid var(--colorBlueLightest);
							border-radius: var(--borderRadiusSmall);
						}

						.num-btn:hover {
							background: #f5f5f5;
						}

					}

					div.form-field {
						display: flex;
						background-color: var(--colorBlueLight);
						align-items: center;
						padding-inline: 0.5rem;
						padding-block: 0.5rem;
						border-radius: var(--borderRadiusSmall);
						font-size: var(--fontSize15);

						/*
						font-size: 0;
						line-height: 0;
						padding: 0;
						height: 0;
						visibility: hidden;
						*/

						.wc-bookings-time-block-picker {
							width: 100%;

							select {
								width: 100%;
								height: 2.5rem;
								border: 1px solid var(--colorBlueDark);
								font-weight: 400;
								font-size: var(--fontSize15);
								font-family: 'Switzer';
								display: flex;
								align-items: center;
								border-radius: var(--borderRadiusSmall);
								color: var(--colorBlueDark);
							}
						}

						ul.block-picker {
							display: flex;
							flex-direction: column;
							width: 100%;

							li.block {
								float: none;
								width: 100%;

								>a {
									width: 100% !important;
									height: auto !important;
									justify-content: center;
									display: flex;
									align-items: center;
									gap: 0 0.5em;

									border-radius: var(--borderRadiusSmall);
									background-color: var(--colorWhite) !important;
									color: var(--colorBlueDark) !important;

									&.selected {
										background-color: var(--colorBlueDark) !important;
										color: var(--colorWhite) !important;
									}
								}
							}
						}
					}

					.ui-widget {
						font-family: 'Switzer';
						font-weight: 400;
					}

					.wc-bookings-date-picker {
						padding: 0;
						border: 0;
						
						.ui-datepicker {
							min-width: 0px;
						}

						.wc-bookings-date-picker-timezone-block {
							display: none;
						}

						.ui-widget-content {
							box-shadow: none;
						}

						.picker.hasDatepicker {


							.ui-datepicker {
								table {
									font-size: var(--fontSize15);
								}

								.ui-datepicker-header {
									padding: 0;
									border-radius: 0;
									background: none;
									border: 0;
									text-transform: none;
									height: 2.1rem;
									display: flex;
									align-items: center;

									.ui-datepicker-title {
										padding: 0;
										font-size: var(--fontSize24);
										font-family: "Eames Century Modern";
										font-weight: 400;
										color: var(--colorBlueDark);
										text-align: center;
										width: 100%;
										
										@media only screen and (max-width: 768px) {
											font-size: var(--fontSize20);
										}
									}

									.ui-datepicker-prev,
									.ui-datepicker-next {
										width: 2.1rem;
										aspect-ratio: 1/1;
										height: auto;
										background: transparent;
										top: 0;
										background-size: 98% auto;
										background-repeat: no-repeat;

										&:before {
											display: none !important;
										}

										>span {
											display: none !important;
										}
									}

									.ui-datepicker-prev {
										left: 0;
										background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='42' height='42' fill='none' viewBox='0 0 42 42'><circle cx='21' cy='21' r='21' fill='%23e1e8ff' style='fill:%23e1e8ff;fill:color(display-p3 .8811 .9108 1);fill-opacity:1' transform='rotate(-180 21 21)'/><g fill='%2330227e' clip-path='url(%23a)'><path d='M35.684 22.229H17.132v-1.758h18.552z' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/><path d='M17.133 12c-.035 4.258-1.348 7.123-3.574 8.516h5.263v1.69H13.56c2.226 1.347 3.54 4.224 3.574 8.517h-.035c-3.813-5-6.987-7.57-11.097-9.328v-.068c4.11-1.758 7.284-4.327 11.097-9.328z' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/></g><defs><clipPath id='a'><rect width='29.683' height='18.712' fill='%23fff' style='fill:%23fff;fill-opacity:1' transform='matrix(-1 0 0 -1 35.684 30.712)'/></clipPath></defs></svg>");
									}

									.ui-datepicker-next {
										right: 0;
										background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='42' height='42' fill='none' viewBox='0 0 42 42'><circle cx='21' cy='21' r='21' fill='%23e1e8ff' style='fill:%23e1e8ff;fill:color(display-p3 .8811 .9108 1);fill-opacity:1'/><g fill='%2330227e' clip-path='url(%23a)'><path d='M6 20.483h18.552v1.758H6z' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/><path d='M24.551 30.713c.034-4.259 1.347-7.124 3.573-8.517h-5.263v-1.69h5.263c-2.226-1.347-3.539-4.224-3.573-8.517h.034c3.813 5 6.987 7.57 11.097 9.328v.068c-4.11 1.758-7.284 4.327-11.097 9.328z' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/></g><defs><clipPath id='a'><rect width='29.683' height='18.712' fill='%23fff' style='fill:%23fff;fill-opacity:1' transform='translate(6 12)'/></clipPath></defs></svg>");
									}
								}

								.ui-datepicker-calendar {
									th {
										border: 0;
										background: var(--colorWhite);
										color: var(--colorBlueDark);
									}

									td {
										background: var(--colorWhite) !important;
										border: 0 !important;
										color: var(--colorBlueDark) !important;

										a {
											border-radius: var(--borderRadiusSmall);
										}

										&.bookable {
											a {
												background-color: transparent !important;
												color: var(--colorBlueDark) !important;
											}
										}

										&.ui-datepicker-current-day a,
										&.bookable-range .ui-state-default {
											background-color: var(--colorBlueDark) !important;
											color: var(--colorWhite) !important;
										}
									}
								}
							}
						}
					}
				}

				.pewc-cloned-group {
					margin-top: 1rem;
					padding-top: 1rem;
					border-color: var(--colorBlueMedium);
				}

				.pewc-product-extra-groups-wrap {
					.pewc-group-wrap {

						.pewc-group-heading-wrapper,
						.pewc-remove-clone {
							display: none;
						}

						.pewc-group-content-wrapper {
							ul.pewc-product-extra-groups {
								padding: 0;
								margin: 0;
								list-style-type: none;
								display: grid;
								grid-template-columns: repeat(2, 1fr);
								gap: 0.5rem;

								li.pewc-item {
									padding: 0;
									margin: 0;
									list-style-type: none;
									grid-column: span 2;

									&.half-width {
										grid-column: span 1;
									}

									.pewc-item-field-wrapper {
										display: flex;
										flex-direction: column;
										gap: 0.3rem 0;
										margin: 0;
										
										.pewc-description {
											font-size: var(--fontSize15);
											margin-top: 0;
										}

										h4.pewc-field-label {
											margin: 0;
											font-weight: 500;
											font-size: var(--fontSize15);
											font-family: 'Switzer';
											/*order: 1;*/
										}

										.pewc-select-wrapper {
											border: 0;
											border-radius: 0;
											padding: 0;
											line-height: 1;
										}

										input:not([type="radio"]):not([type="checkbox"]),
										select {
											width: 100%;
											height: 2.5rem;
											border: 1px solid var(--colorBlueDark);
											font-weight: 400;
											font-size: var(--fontSize15);
											font-family: 'Switzer';
											display: flex;
											align-items: center;
											border-radius: var(--borderRadiusSmall);
											color: var(--colorBlueDark);
										}

										ul.pewc-checkbox-group-wrapper {
											display: flex;
											gap: 0 1rem;

											li {
												margin: 0;

												>label {
													margin-bottom: 0;
													font-size: var(--fontSize15);

													padding-left: 1.8em;

													.pewc-theme-element {
														height: 1.3em;
														width: 1.3em;

														&:after {
															width: 0.5em;
															height: 0.5em;
															left: 50%;
															top: 50%;
															transform: translate(-50%, -50%);
														}
													}

													input:checked~span.pewc-theme-element {
														background-color: var(--colorBlueDark);
													}
												}
											}
										}
									}
								}
							}
						}
						
						/* Tannheimer Tal Gästekarte */
						&.pewc-group-wrap-476 {
							margin-top: 1.5rem;
							
							.pewc-group-content-wrapper {
								ul.pewc-product-extra-groups {
									grid-template-columns: 100%;
									
									li.pewc-item {
										grid-column: unset;
										
										.pewc-item-field-wrapper {
											.pewc-checkbox-form-label {
												margin: 0;
												padding: 0;
												font-size: 0;
												line-height: 0;
												
												input {
													position: absolute;
													visibility: hidden;
												}
												
												> span:not(.pewc-theme-element){
													font-size: var(--fontSize20);
													line-height: 1.2;
													display: block;
													position: relative;
													padding-left: 3.5em;
													max-width: 15em;
													
													&:before {
														content: '';
														display: block;
														position: absolute;
														width: 2.8em;
														height: auto;
														aspect-ratio: 51/26;
														background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='51' height='26' fill='none' viewBox='0 0 51 26'><rect width='51' height='26' fill='%23e1e8ff' rx='13'/><rect width='22' height='22' x='2' y='2' fill='%2330227e' rx='11'/></svg>");	
														background-repeat: no-repeat;
														background-size: 98% auto;
														left: 0;
														top: 50%;
														transform: translateY(-50%);
													}
												}
												
												input:checked + span:not(.pewc-theme-element) {
													&:before {
														background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='51' height='26' fill='none' viewBox='0 0 51 26'><rect width='51' height='26' fill='%2330227e' rx='13'/><rect width='22' height='22' x='27' y='2' fill='%23e1e8ff' rx='11'/></svg>");	
													}
												}
												
												.pewc-theme-element {
													display: none !important;
												}
											}
										}
									}
								}
							}
							
						}

					}

					.pewc-repeat-group {
						display: none;
					}
				}

				.wc-bookings-booking-cost.price {
					/*display: none !important;*/
					/*outline: 1px solid red;*/

					font-size: 0;
					line-height: 0;
					height: 0;
					visibility: hidden;
					padding: 0;
					border: 0;


				}

				.pewc-total-field-wrapper {

					/*
					p:has(#pewc-per-product-label){
						outline: 1px solid red;
					}
					p:has(#pewc-options-total-label){
						outline: 1px solid red;
					}
					*/
					


					
					p:has(#pewc-per-product-label) {
						font-size: 0;
						line-height: 0;
						margin: 0;
						visibility: hidden;
					}

					p:has(#pewc-options-total-label) {
						font-size: 0;
						line-height: 0;
						margin: 0;
						visibility: hidden;
					}
					

					p:has(#pewc-grand-total) {
						display: flex;
						align-items: center;
						justify-content: space-between;
						margin-top: 0;
					}

					#pewc-grand-total {
						bdi {
							font-size: var(--fontSize35);
							font-family: "Eames Numerals PosterM";
							font-style: normal;
							font-weight: 900;
							display: flex;
							gap: 0 0.3em;

							.woocommerce-Price-currencySymbol {
								font-family: "Eames Numerals PosterS";
							}
						}
					}


				}
			}
		}

		.product__details {
			grid-column: 1/2;
			grid-row: 4/5;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;	
				margin-top: 2.5rem;
			}

			h2 {
				font-size: var(--fontSize42);
				line-height: 1.09;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize22);	
				}
				
			}
			
			> h2 {
				@media only screen and (max-width: 768px) {
					display: none;	
				}
			}

			.product__info-list {
				display: flex;
				flex-direction: column;
				margin-top: 2.6rem;
				margin-bottom: 2.6rem;
				
				@media only screen and (max-width: 768px) {
					margin-top: 0;	
				}

				.single__list {
					display: grid;
					grid-template-columns: 1.4rem 1fr;
					gap: 0 0.7rem;
					position: relative;

					@media only screen and (max-width: 768px) {
						border-top: 1.5px solid var(--colorBlueLight);
						margin-inline: calc(var(--sideSpacing) * -1);
						padding: 0 var(--sideSpacing);

						&:last-child {
							border-bottom: 1.5px solid var(--colorBlueLight);
						}
					}

					>svg {
						width: 100%;
						height: auto;
						aspect-ratio: 1/0.9;
						object-fit: contain;
						margin-top: 1.2rem;
						
						@media only screen and (max-width: 768px) {
							margin-top: 0.7rem;	
						}
					}

					.open_koennerstufe {
						background: transparent;
						color: var(--colorBlueDark);
						padding: 0;
						border: 0;
						margin: 0;
						font-size: var(--fontSize16);
						font-family: 'Switzer';
						position: absolute;
						right: 0;
						top: 1.1rem;
						cursor: pointer;
						z-index: 5;
						
						@media only screen and (max-width: 768px) {
							right: var(--sideSpacing);	
							font-size: var(--fontSize15);
							top: 0.7rem;
						}

						&:before {
							content: '';
							display: block;
							position: absolute;
							left: 0;
							bottom: 0;
							width: 100%;
							height: 1px;
							background-color: var(--colorBlueDark);
						}
					}

					.single__list-description {
						border-top: 1.5px solid var(--colorBlueLight);
						padding-top: 1.1rem;
						color: var(--colorBlueMedium);
						padding-bottom: 1.1rem;
						position: relative;

						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize15);
							padding-top: .775rem;
							padding-bottom: .775rem;
							border-top: 0;
						}



						h3 {
							font-size: var(--fontSize26);
							letter-spacing: 0.0;
							color: var(--colorBlueDark);

							@media only screen and (max-width: 768px) {
								font-size: var(--fontSize19);
							}

							+p {
								margin-top: 0.5em;
							}
						}

						p {
							/*max-width: 28em;*/
						}

						&.rhythmus {
							p {
								max-width: 28em;
							}
						}
					}
				}
			}

			.product__info-box {
				background-color: var(--colorBlueLightest);
				border-radius: var(--borderRadiusSmall);
				padding: 1.3rem 1.7rem;
				margin-bottom: 1.2rem;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize15);
					padding: 1rem;
				}

				&:last-child {
					margin-bottom: 0;
				}

				h2 {

					@media only screen and (max-width: 768px) {
						font-size: var(--fontSize21);
					}

				}

				.content {
					margin-top: 1.2em;

					@media only screen and (max-width: 768px) {
						margin-top: 1em;
					}

					ul:first-child {
						margin-top: 0;
					}

					strong {
						font-weight: 500;
					}

					a {
						color: inherit;
					}
				}

				.content>ul {
					list-style-type: none;
					margin-inline: 0;
					padding: 0;
					display: flex;
					flex-direction: column;
					gap: 0.8em 0;

					&:last-child {
						margin-bottom: 0;
					}

					>li {
						list-style-type: none;
						margin-inline: 0;
						padding: 0;
						position: relative;
						padding-left: 2.1em;

						&:before {
							content: '';
							display: block;
							position: absolute;
							top: 0.35em;
							left: 0;
							background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='13' fill='none' viewBox='0 0 15 13'><path fill='%2330227e' d='M3.229 12.106 1.906 9.808 1.19 8.562l-.47-.816-.53-.9c-.276-.467-.243-.813.043-1.28l.599-.976.88-1.529.99-1.716L3.505 0h7.329l1.568 2.676 1.697 2.897c.266.454.404.786.092 1.299l-.648 1.059-.95 1.64-1.776 3.045-7.18.007c-.162 0-.323-.365-.409-.517' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/></svg>");
							background-repeat: no-repeat;
							background-size: 98% auto;
							width: 0.8em;
							height: auto;
							aspect-ratio: 1/1;
						}

						>ul {
							list-style-type: none;
							margin-inline: 0;
							padding: 0;
							display: flex;
							flex-direction: column;
							gap: 0em 0;

							>li {
								list-style-type: none;
								margin-inline: 0;
								padding: 0;
								position: relative;
								padding-left: 0.7em;

								&:before {
									content: '';
									display: block;
									position: absolute;
									top: 0.55em;
									left: 0;
									background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='13' fill='none' viewBox='0 0 15 13'><path fill='%2330227e' d='M3.229 12.106 1.906 9.808 1.19 8.562l-.47-.816-.53-.9c-.276-.467-.243-.813.043-1.28l.599-.976.88-1.529.99-1.716L3.505 0h7.329l1.568 2.676 1.697 2.897c.266.454.404.786.092 1.299l-.648 1.059-.95 1.64-1.776 3.045-7.18.007c-.162 0-.323-.365-.409-.517' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/></svg>");
									background-repeat: no-repeat;
									background-size: 98% auto;
									width: 0.4em;
									height: auto;
									aspect-ratio: 1/1;
								}
							}
						}
					}
				}
			}
		}
	}
}

body.frontend footer {
	--backgroundColor: var(--colorBlueLight);
	--foregroundColor: var(--colorBlueDark);
	--mediumColor: var(--colorBlueMedium);
	
	background-color: var(--backgroundColor);
	
	&.summer {
		--backgroundColor: var(--colorGreenLight);
		--foregroundColor: var(--colorGreenDark);
		--mediumColor: var(--colorGreenMedium);
	}

	@media only screen and (max-width: 768px) {
		/* display: none; */
	}

	.box__wrapper {
		display: grid;
		grid-template-columns: 15.375rem 1fr 17.2rem;
		column-gap: 4rem;
		align-items: center;
		padding: 4.1rem 0 6.5rem 0;

		@media only screen and (max-width: 768px) {
			display: flex;
			flex-direction: column;
			width: calc(100% - 2.8rem);
			gap: 1rem 0;
			margin: 0 auto;
			padding: 2rem 0 1.4375rem;
		}

		.box {
			
			svg:not(.brand-logo) {
				path {
					fill: var(--foregroundColor) !important;
				}
			}

			&:nth-child(1) {
				aspect-ratio: 452/457;
				display: flex;
				flex-direction: column;
				background-color: var(--colorWhite);
				color: var(--foregroundColor);
				width: 15.3rem;
				clip-path: polygon(50% 0, 0 14%, 0 86%, 50% 100%, 100% 86%, 100% 14%);
				align-items: center;
				justify-content: center;
				padding: 2.5rem 2rem 2.5rem 2rem;
				text-align: center;

				@media only screen and (max-width: 768px) {
					order: 2;
					height: 11rem;
					width: 100%;
					justify-content: center;
					padding-top: 1.9rem;
					padding-bottom: 1.9rem;
				}

				span {
					font-family: "Eames Century Modern";
					font-size: var(--fontSize42);
					line-height: 2.3rem;
					margin-bottom: .8rem;

					@media only screen and (max-width: 768px) {
						font-size: var(--fontSize27);
						max-width: 5em;
						line-height: 1.15;
						margin-bottom: 0.4em;
					}
				}

				a {
					font-size: var(--fontSize22);
					margin-bottom: 1.6rem;
					display: inline-block;
					color: var(--foregroundColor);

					@media only screen and (max-width: 768px) {
						font-size: var(--fontSize15);
						margin-bottom: 0.5rem;
					}
				}

				ul {
					list-style-type: none;
					margin: 0;
					padding: 0;
					display: flex;
					gap: 0 0.5rem;

					li {
						margin-right: .6rem;
						
						@media only screen and (max-width: 768px) {
							margin-right: 0;	
						}

						&::last-child {
							margin-right: 0;
						}

						a {
							margin-bottom: 0;
							font-size: 0;
							line-height: 0;
							display: block;
							width: 2rem;
							
							@media only screen and (max-width: 768px) {
								width: 1.3rem;	
							}

							svg {
								width: 100%;
								height: auto;
							}
						}
					}
				}
			}

			&:nth-child(2) {
				grid-column: 2/3;
				display: flex;
				align-items: center;
				position: relative;

				@media only screen and (max-width: 768px) {
					order: 3;
					margin-top: 3.7rem;
				}

				.brand-name {
					position: relative;
					z-index: 1;
					width: 100%;
					height: auto;
					margin-top: 0.6rem;
					
					@media only screen and (max-width: 768px) {
						width: 92%;
						margin-inline: auto;
					}
					
					path {
						fill: var(--foregroundColor) !important;
					}

				}

				.brand-logo {
					/* position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);   
					z-index: 0;
					max-width: 82%; */

					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-43%, -40%);
					z-index: 0;
					/* max-width: 102%; */
					/* width: 99%; */
					width: 45%;
					height: auto;
					
					@media only screen and (max-width: 768px) {
						transform: translate(-50%, -42%);	
						width: 41%;
					}

				}
			}

			&:nth-child(3) {
				grid-column: 3/4;
				text-align: center;
				padding: .5rem 1rem 1.2rem;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				width: 100%;
				height: 13.1rem;
				background: var(--colorWhite);
				clip-path: url(#fancyShape);
				-webkit-clip-path: url(#fancyShape);
				align-items: center;
				margin-top: -0.5rem;
				color: var(--foregroundColor);

				@media only screen and (max-width: 768px) {
					padding: 1.5rem 2rem 1.6rem 2rem;
					margin-top: 0;
					height: 10.5rem;
					justify-content: start;
				}


				h5 {
					font-family: "Eames Century Modern";
					font-size: var(--fontSize42);
					font-weight: 400;
					margin: 0 auto 0.5rem auto;
					color: var(--foregroundColor);

					@media only screen and (max-width: 768px) {
						font-size: var(--fontSize27);
					}
				}

				p {
					margin: auto;
					font-size: var(--fontSize22);
					line-height: 1.2;

					@media only screen and (max-width: 768px) {
						font-size: var(--fontSize15);
						margin: 0;
					}
				}

				.cta__button {
					font-size: var(--fontSize16);
					
					border-color: var(--colorGreenDark);
					color: var(--colorGreenDark);
					
					@media only screen and (max-width: 768px) {
						margin-top: auto;	
					}
				}
			}
		}
	}

	.nav__wrapper {
		display: grid;
		justify-content: space-between;
		grid-template-columns: 18.5rem 20.2rem 20.2rem 1fr;
		margin-bottom: 6.5rem;

		@media only screen and (max-width: 768px) {
			grid-template-columns: 1fr 1fr;
			margin-top: 2.6rem;
			margin-bottom: 0;
			gap: 0 1rem;
		}

		.nav__item {
			width: 100%;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize19);
				margin-bottom: 1.6rem;
			}


			h6 {
				font-size: var(--fontSize24);
				font-weight: 500;
				margin: 0 0 0.9rem;
				color: var(--foregroundColor);

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize19);
					//margin-bottom: 1.6rem;

				}
			}

			ul {
				list-style-type: none;
				margin: 0;
				padding: 0;

				li {
					margin-bottom: .5rem;
					
					@media only screen and (max-width: 768px) {
						max-width: 15em;
					}

					a {
						font-size: var(--fontSize15);
						color: var(--foregroundColor);

						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize16);
						}

						&:hover {
							color: var(--mediumColor);
						}

						&:last-child {
							margin-bottom: 0;
						}

						&:not(.all) {
							font-family: "Eames Century Modern";
							font-size: var(--fontSize25);
							line-height: 1.096;
							text-decoration: none;
							color: var(--foregroundColor);
							
							@media only screen and (max-width: 768px) {
								font-size: var(--fontSize20);
							}
						}
					}
				}
			}

			>span {
				margin-bottom: 0.5rem;
				margin-top: 0.6rem;
				font-size: var(--fontSize15);
				color: var(--foregroundColor);
				font-weight: 400;
				display: inline-block;
			}

			.payment-list {
				display: flex;
				flex-wrap: wrap;
				gap: .3rem 1.2rem;
				max-width: 14rem;

				/* gap: .5rem 0; */
				@media only screen and (max-width: 768px) {
					max-width: 100%;
					gap: .3rem .7rem;
				}

				svg {
					max-width: 100%;
					height: auto;
					width: 2.2rem;

					@media only screen and (max-width: 768px) {
						width: 1.2rem;
					}


					&:nth-child(1) {}

					&:nth-child(2) {
						width: 2.55rem;

						@media only screen and (max-width: 768px) {
							width: 1.55rem;
						}
					}

					&:nth-child(3) {
						width: 3.55rem;

						@media only screen and (max-width: 768px) {
							width: 2.55rem;
						}
					}

					&:nth-child(4) {
						width: 2.85rem;

						@media only screen and (max-width: 768px) {
							width: 2rem;
						}
					}

					&:nth-child(5) {
						width: 2.9rem;

						@media only screen and (max-width: 768px) {
							width: 2rem;
						}
					}
				}
			}
			
			/*
			&:nth-child(3) {
				padding-top: 2rem;
				border-top: 1px solid var(--colorBlueDark);
			}
			*/
			
			&:nth-child(1),
			&:nth-child(2) {
				@media only screen and (max-width: 768px) {
					grid-column: span 2;	
				}
			}
			
			&:nth-child(2) {
				@media only screen and (max-width: 768px) {
					padding-bottom: 0.8rem;
					border-bottom: 1px solid var(--mediumColor);
					margin-bottom: 1.2rem;
				}
			}

			&:nth-child(3),
			&:nth-child(4) {
				
				@media only screen and (max-width: 768px) {
					display: flex;
					flex-direction: column;
					
					> span {
						margin-top: auto;
						margin-bottom: 0.4rem;
					}	
				}

				h6,
				ul li {
					margin-bottom: 1.1rem;
					
					@media only screen and (max-width: 768px) {
						margin-bottom: 0.7rem;
					}

					&:last-child {
						margin-bottom: 0;
					}

					a {
						font-family: 'Switzer';
						font-weight: 500;
						font-size: var(--fontSize24);
						
						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize19);	
						}	
					}
				}

			}
		}
	}

	.banner__wrapper {
		background-color: var(--backgroundColor);
		border-radius: var(--borderRadiusVeryBig) var(--borderRadiusVeryBig) 0 0;
		display: grid;
		grid-template-columns: 100%;
		grid-template-rows: auto;
		overflow: clip;

		.image {
			font-size: 0;
			line-height: 0;
			grid-column: 1/2;
			grid-row: 1/2;

			img {
				width: 100%;
				height: auto;
				aspect-ratio: 1441/655;
				object-fit: cover;
			}
		}

		.innerwrapper {
			display: flex;
			justify-content: center;
			display: flex;
			grid-column: 1/2;
			grid-row: 1/2;
			position: relative;
			z-index: 5;

			svg {
				max-width: 86%;
				width: 100%;
				height: auto;
				margin-top: 2rem;
			}
		}
	}

	.bottom__wrapper {
		background-color: var(--colorWhite);

		.innerwrapper {
			padding: 1.3rem 0 1.1rem;
			background-color: var(--colorWhite);
			display: flex;
			align-items: center;
			justify-content: space-between;
			font-weight: 400;
			font-size: var(--fontSize15);

			@media only screen and (max-width: 768px) {
				padding: .7rem 0;
				font-size: var(--fontSize14);

			}

			ul {
				list-style-type: none;
				margin: 0;
				padding: 0;
				display: flex;
				justify-content: space-between;

				max-width: 65%;
				width: 100%;

				@media only screen and (max-width: 768px) {
					max-width: 100%;
				}

				li {
					margin-right: .625rem;

					&:last-child {
						margin-right: 0;
					}

					a {
						text-decoration: none;
						color: var(--foregroundColor);
					}
				}
			}

			.copy {
				color: var(--foregroundColor);
				
				@media only screen and (max-width: 768px) {
					display: none;
				}
			}
		}

	}
}

/* -------------IMPRINT START---------------  */
.section__imprint {
	background-color: var(--colorWhite);
	padding: 5.8rem 0 4.6rem;
	background-image: url(../images/logo-xl.png);
	background-size: 47rem;
	background-position: center 2rem;
	background-repeat: no-repeat;

	@media only screen and (max-width: 768px) {
		padding: 1.5rem 0 2.8rem;
		background-size: 17rem;

	}

	.innerwrapper {
		display: flex;
		flex-direction: column;
		align-items: center;

		@media only screen and (max-width: 768px) {
			align-items: flex-start;
		}

		h1 {
			font-size: var(--fontSize79);
			font-weight: 400;
			margin: 0 0 4.2rem;
			font-family: "Eames Century Modern";
			text-align: center;
			letter-spacing: 0.03em;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize38);
				letter-spacing: 0.02em;
				margin: 0 0 1.5625rem;
				text-align: left;
			}
		}
		
		h3:not(:first-child) {
			margin-top: 1em;
		}
		
		h3 {
			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize24);
			}	
		}
	}



	.info__wrapper {
		font-size: var(--fontSize22);
		line-height: 1.2;
		max-width: 71%;
		
		@media only screen and (max-width: 768px) {
			max-width: none;
			font-size: var(--fontSize15);	
		}
		
		a {
			color: inherit;
		}
		
		.text_block {
			padding-left: 5.8rem;
			position: relative;
			margin: 1em 0;
			min-height: 3lh;
			display: flex;
			flex-direction: column;
			justify-content: center;
			
			@media only screen and (max-width: 768px) {
				min-height: 0;	
			}
			
			
			&:first-child {
				margin-top: 0;
			}
			
			@media only screen and (max-width: 768px) {
				padding-left: 0;
				background-image: none !important;
			}
			
			&.address {
				background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='51' height='57' fill='none' viewBox='0 0 51 57'><path stroke='%2330227e' stroke-linecap='round' stroke-width='2.7' d='M20.852 30.132c-11.596.882-19.5 6.083-19.5 12.368 0 6.903 10.745 12.5 24 12.5 13.254 0 24-5.597 24-12.5 0-6.285-7.905-11.486-19.5-12.368M25.703 19v22' style='stroke:%2330227e;stroke:color(display-p3 .1875 .1333 .4941);stroke-opacity:1'/><circle cx='25.852' cy='9.5' r='8.15' stroke='%2330227e' stroke-width='2.7' style='stroke:%2330227e;stroke:color(display-p3 .1875 .1333 .4941);stroke-opacity:1'/></svg>");	
				background-repeat: no-repeat;
				background-size: 2.5em auto;
				background-position: 1em 0.5em;
			}
			
			&.phone {
				background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'><path fill='%2337227e' d='M28.849 2.986a1.44 1.44 0 0 1 1.764-1.02 20.22 20.22 0 0 1 14.46 14.46 1.44 1.44 0 1 1-2.784.745 17.36 17.36 0 0 0-12.42-12.42 1.44 1.44 0 0 1-1.02-1.765m-.9 9.445c3.492.931 5.729 3.168 6.66 6.66a1.44 1.44 0 0 0 2.784-.744c-1.2-4.49-4.21-7.5-8.7-8.7a1.44 1.44 0 1 0-.744 2.784m19.066 23.28a13.02 13.02 0 0 1-12.934 11.33C15.288 47.04 0 31.75 0 12.958A13.02 13.02 0 0 1 11.321.025a3.36 3.36 0 0 1 3.495 2.013l5.064 11.305a3.36 3.36 0 0 1-.27 3.187q-.046.072-.1.137l-5.057 6.015a.45.45 0 0 0 0 .4c1.839 3.764 5.784 7.68 9.6 9.517a.45.45 0 0 0 .403-.014l5.926-5.04q.063-.056.135-.102a3.36 3.36 0 0 1 3.187-.292l11.338 5.08a3.36 3.36 0 0 1 1.973 3.488zm-2.854-.354a.48.48 0 0 0-.29-.48l-11.34-5.082a.46.46 0 0 0-.385.024l-5.923 5.04q-.066.055-.134.102a3.36 3.36 0 0 1-3.305.24c-4.407-2.13-8.799-6.48-10.928-10.846a3.36 3.36 0 0 1 .219-3.296q.045-.072.103-.137L17.23 14.9a.48.48 0 0 0 0-.4L12.178 3.193a.48.48 0 0 0-.442-.315h-.055a10.14 10.14 0 0 0-8.8 10.08c0 17.205 13.996 31.202 31.2 31.202a10.14 10.14 0 0 0 10.08-8.803' style='fill:%2337227e;fill:color(display-p3 .2157 .1333 .4941);fill-opacity:1'/></svg>");	
				background-repeat: no-repeat;
				background-size: 2.5em auto;
				background-position: 1em 0.5em;
			}
			
			&.mail {
				background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='49' height='46' fill='none' viewBox='0 0 49 46'><path fill='%2337227e' d='M48.144 15.663 25.188.243a1.43 1.43 0 0 0-1.593 0L.638 15.663A1.44 1.44 0 0 0 0 16.868v25.057c0 .895.353 1.753.98 2.385.628.633 1.48.988 2.368.988h42.087c.888 0 1.74-.355 2.367-.988.628-.632.98-1.49.98-2.385V16.868a1.46 1.46 0 0 0-.638-1.205M17.74 30.36 2.869 40.937V19.675zm2.934 1.446h7.437l14.895 10.6H5.777zm10.37-1.446 14.87-10.685v21.262zM24.392 3.185l20.43 13.733-16.716 11.997h-7.427L3.962 16.909z' style='fill:%2337227e;fill:color(display-p3 .2157 .1333 .4941);fill-opacity:1'/></svg>");	
				background-repeat: no-repeat;
				background-size: 2.5em auto;
				background-position: 1em 0.5em;
			}
			
			
		}

		/*
		@media only screen and (max-width: 768px) {
			max-width: 100%;
		}

		p {
			margin: 0 0 1.3rem;
			letter-spacing: -0.01em;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize15);
			}
		}

		.adress,
		.phone,
		.mail,
		.director,
		.disclaimer {
			padding-left: 5.8rem;
			position: relative;

			@media only screen and (max-width: 768px) {
				padding-left: 0;
			}

			.icon {
				position: absolute;
				left: 3.8%;
				top: 0;

				@media only screen and (max-width: 768px) {
					display: none;
				}

				svg {
					width: 2.53rem;
					height: auto;
				}
			}
		}

		.phone {
			margin-bottom: 1.3rem;

			@media only screen and (max-width: 768px) {
				margin-bottom: 1rem;
			}
		}

		.contact {
			margin-bottom: 2.7rem;

			@media only screen and (max-width: 768px) {
				margin-bottom: 2rem;
			}
		}

		.director {
			margin-bottom: 2.3rem;

			@media only screen and (max-width: 768px) {
				margin-bottom: 2rem;
			}

			p {
				margin: 0;
			}
		}

		.adress {
			@media only screen and (max-width: 768px) {
				margin-bottom: 1rem;
			}
		}
		*/
	}



}

/* -------------IMPRINT END---------------  */



/* -------------ABOUT START---------------  */

.section__start.banner + .section__text-description {
	padding-top: 2.8rem;	
	
	@media only screen and (max-width: 768px) {
		padding-top: 1.8rem;
	}
}

.section__text-description {
	padding-top: 4.2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 4.2rem;
	background-color: var(--backgroundColor);
	color: var(--color);

	@media only screen and (max-width: 768px) {
		padding-top: 5.7rem;
		padding-bottom: 1.6rem;
	}

	.innerwrapper {
		display: flex;
		flex-direction: column;
		align-items: center;

		@media only screen and (max-width: 768px) {
			align-items: flex-start;
		}
	}

	.content {
		font-size: var(--fontSize27);
		max-width: 43em;
		line-height: 1.18;
		text-align: center;

		@media only screen and (max-width: 768px) {
			max-width: 100%;
			font-size: var(--fontSize21);
			text-align: left;
		}

		> span {
			font-size: var(--fontSize20);
			display: inline-block;
			margin-bottom: 1.3rem;
			font-family: "Eames Century Modern";

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize16);
				line-height: 1.3;
			}
		}

		h2,
		h1 {
			text-align: center;
			margin-inline: auto;
			margin-bottom: 0.7em !important;
			color: var(--color);

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize38) !important;
				margin-bottom: 1.3rem !important;
				text-align: left;
			}
		}

		p {
			margin: 0 0 1rem;
			max-width: 80%;
			display: inline-block;

			@media only screen and (max-width: 768px) {
				max-width: 100%;
			}

			&:last-child {
				margin: 0;
			}
		}
	}
	
	&.muehlwald_trails {
		.innerwrapper {
			.content {
				h2 {
					&:before {
						content: '';
						display: block;
						width: 5rem;
						aspect-ratio: 1/1;
						height: auto;
						background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='98' height='99' fill='none' viewBox='0 0 98 99'><path fill='%23336246' d='M50.88 98.45h-4.7l-2.11-7.28c-3.3-.4-6.42-1.03-9.69-2.23l-5.11 5.66-4.21-2.03 1.25-7.49c-2.8-1.78-5.36-3.8-7.79-6.22l-7.02 2.91-2.93-3.68 4.4-6.21a41 41 0 0 1-4.32-8.96l-7.59-.44L0 57.89l6.64-3.68c-.36-3.33-.41-6.52.02-9.94L0 40.55l1.05-4.57 7.57-.44c1.12-3.15 2.5-6.11 4.34-8.95l-4.4-6.21 2.91-3.69 7.05 2.91c2.36-2.38 4.89-4.41 7.78-6.2l-1.27-7.5 4.23-2.04 5.09 5.65c3.2-1.15 6.41-1.82 9.7-2.22L46.18 0h4.69l2.14 7.31c3.43.33 6.5 1.08 9.69 2.19l5.07-5.67 4.24 2.07-1.27 7.47c2.86 1.8 5.42 3.82 7.78 6.23l7.04-2.91 2.94 3.66-4.39 6.24c1.8 2.88 3.2 5.68 4.29 8.95L96 36l1.07 4.55-6.66 3.71c.37 3.34.38 6.6 0 9.95l6.63 3.68-1.02 4.59-7.58.43c-1.13 3.15-2.51 6.13-4.34 8.96l4.4 6.22-2.91 3.66-7.03-2.89a45.7 45.7 0 0 1-7.81 6.23l1.27 7.47-4.23 2.04-5.07-5.64c-3.12 1.06-6.28 1.83-9.71 2.19l-2.12 7.3zM29.37 55.21c0 2.92.57 5.18 3.48 5.55l3.5.03v7.82l-17.93-.05c6.37 9.84 16.99 15.95 28.57 16.4 5.81.22 11.36-.82 16.61-3.28 6.11-2.86 11.26-7.31 15.02-13.11l-24.54.04.02-7.81h1.41c3.57-.03 3.45-4.08 3.45-7.51V38.14l-.03-10.18 18.32-.02a35.72 35.72 0 0 0-28.81-14.48c-11.29.02-21.94 5.4-28.62 14.47l21.8-.07 8.98 16.29c1.53-3.06 2.65-6.09 4.38-9.11l.1 11.12-8.97 18.89-3.26-.03-12.42-22.93a16.1 16.1 0 0 0-3.48-4.36c-1.51-1.34-3.4-2.14-5.43-2.15l-6.05-.02c-3.33 8.09-3.58 16.99-.8 25.24l6.39-.04c1.68 0 3.28-1.63 3.3-3.46l.15-17.25c3.38 1.44 4.89 6.21 4.88 9.76v5.42zm45.6 3.86c.44 1.02 1.27 1.68 2.38 1.68h5.05c2.78-8.32 2.49-17.16-.81-25.21h-3.57c-2.21 0-3.43 2.05-3.49 4.25-.15 5.54-.14 10.94.02 16.48l.42 2.79z' style='fill: color(display-p3 0.2000 0.3843 0.2745);' /></svg>");	
						background-repeat: no-repeat;
						background-size: 98% auto;
						background-position: center center;
						margin: 0 auto;
						
						@media only screen and (max-width: 768px) {
							display: none;	
						}
						
					}
				}
			}
		}
	}
}

.section__instruktors {
	background-color: var(--colorBlueLight);
	/*padding: 10.3125rem 0 13.375rem;*/
	color: var(--color);



	&.shape-breaker-top {
		--offset: 3.6rem;
		--pathDown: 1.5rem;
		--pathOuterSide: calc(var(--outerSpacing));
		--pathFirstPeak: calc(var(--pathOuterSide) + 11.15rem);
		--pathSecondPeak: calc(var(--pathOuterSide) + 10.15rem + 10.3rem);
		padding-top: 8.5rem;
		padding-bottom: 2.9rem;
		/*margin-top: calc(var(--offset) * -1);*/
		clip-path: polygon(0 var(--pathDown), var(--pathOuterSide) var(--pathDown), var(--pathFirstPeak) 0%, var(--pathSecondPeak) var(--pathDown), 50% 0%, calc(100% - var(--pathSecondPeak)) var(--pathDown), calc(100% - var(--pathFirstPeak)) 0%, calc(100% - var(--pathOuterSide)) var(--pathDown), 100% var(--pathDown), 100% 100%, 0 100%);

		@media only screen and (max-width: 768px) {
			padding-top: 2.1rem;
			padding-bottom: 2rem;
			--offset: -1rem;
			--pathDown: .8rem;
			--pathOuterSide: calc(var(--outerSpacing));
			--pathFirstPeak: calc(var(--pathOuterSide) + 2.15rem);
			--pathSecondPeak: calc(var(--pathOuterSide) + 9.15rem + -3.7rem);
		}
	}

	.card__holder {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 2.125rem;
		margin-bottom: 3.7rem;


		@media only screen and (max-width: 768px) {
			grid-template-columns: 1fr;
			gap: .7rem 0;
			margin-bottom: 1.7rem;
		}


		.card {
			background-color: var(--backgroundColor);
			color: var(--color);
			padding: 1.75rem 1.875rem 1.6rem;
			border-radius: var(--borderRadiusMedium);

			@media only screen and (max-width: 768px) {
				padding: 0.75rem 0.875rem 0.9rem;
			}




			.image-holder {
				margin-bottom: 1.7rem;
				width: 100%;
				height: 28.53rem;
				overflow: hidden;

				-webkit-mask-image: url('../images/mask-1.svg');
				-webkit-mask-repeat: no-repeat;
				-webkit-mask-size: cover;
				-webkit-mask-position: center;

				mask-image: url('../images/mask-1.svg');
				mask-repeat: no-repeat;
				mask-size: cover;
				mask-position: center;
				overflow: hidden;

				@media only screen and (max-width: 768px) {
					height: 15.3rem;
					margin-bottom: 1rem;
				}

				img {
					max-width: 100%;
					height: auto;
					width: 100%;
					height: 100%;
					object-fit: cover;
					display: block;
				}
			}

			&:nth-child(2) .image-holder {
				-webkit-mask-image: url('../images/mask-2.svg');
				mask-image: url('../images/mask-2.svg');


				img {
					@media only screen and (max-width: 768px) {
						//transform: scale(4.5) translateY(4.4rem);
					}
				}

			}

			.content-holder {
				font-family: Switzer;
				font-weight: 400;
				font-size: var(--fontSize22);
				line-height: 1.2;
				letter-spacing: -.01em;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize15);

				}

				.content-holder-top {
					display: flex;
					flex-direction: column;
					margin-bottom: 2rem;
					position: relative;
					padding-left: 4rem;

					@media only screen and (max-width: 768px) {
						padding-left: 1.7rem;
						margin-bottom: .3rem;
					}

					.icon {
						position: absolute;
						left: 1.1rem;
						top: 0;

						@media only screen and (max-width: 768px) {
							left: 0;
						}

						svg {
							width: 2.2rem;
							height: auto;

							@media only screen and (max-width: 768px) {
								width: 1.2rem;
							}
						}
					}

					.desc {
						font-weight: 500;
						font-size: var(--fontSize16);
						line-height: 1.2;
						margin-bottom: 1.1rem;
						text-transform: uppercase;
						display: inline-block;
						max-width: 65%;

						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize11);
							margin-bottom: .3rem;
							max-width: 80%;
						}
					}

					.name {
						font-family: "Eames Century Modern";
						font-size: var(--fontSize45);
						line-height: 1.2rem;
						letter-spacing: 0.03em;
						margin-bottom: .8rem;

						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize27);

						}
					}
				}

				p {
					display: block;
					max-width: 95%;
					margin: 0 auto 0 !important;
					letter-spacing: -.01em;

					@media only screen and (max-width: 768px) {
						max-width: 89%;
						margin: 0 0 0 auto !important;
					}

					&:last-child {
						margin: 0;
					}
				}
			}

		}


	}

	.box {
		display: flex;
		justify-content: center;
		gap: 0 1rem;
		
		@media only screen and (max-width: 768px) {
			flex-direction: column;
			gap: 1rem 0;
			align-items: center;
		}
		
		p {
			margin: 0;
		}
	}

	.cta__button.rounded {}
}

.section__banner {
	position: relative;
	height: 25rem;

	@media only screen and (max-width: 768px) {
		height: 16rem;
	}
	
	&.extended {
		height: 48rem;
		
		@media only screen and (max-width: 768px) {
			height: 16rem;
		}
	}

	.image {
		font-size: 0;
		line-height: 0;
		position: absolute;
		z-index: 1;
		width: 100%;
		height: 100%;
		inset: 0;
		
		> svg {
			width: auto;
			height: 69%;
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%,-50%);
		}

		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
	}
}


.section__mission {
	background-color: var(--backgroundColor);
	color: var(--color);
	border-radius: 0 0 var(--borderRadiusVeryBig) var(--borderRadiusVeryBig);
	padding: 4.7rem 0 4.6rem;

	@media only screen and (max-width: 768px) {
		padding: 1.7rem 0 1.8rem;
	}

	.mission-holder {
		display: flex;
		align-items: center;
		justify-content: center;
		max-width: 96%;
		gap: 4rem;

		@media only screen and (max-width: 768px) {
			flex-direction: column;
			gap: 1.5rem;
			max-width: 100%;
		}

		.icon {
			max-width: 15rem;

			@media only screen and (max-width: 768px) {
				max-width: 4rem;
			}

			svg {
				max-width: 100%;
				height: auto;
				
				path {
					fill: var(--color) !important;
				}
			}
		}

		.text {
			max-width: 33rem;
			font-family: "Eames Century Modern";
			font-size: var(--fontSize42);
			line-height: 1.2;
			letter-spacing: 0.01em;
			margin-bottom: .8rem;
			text-align: center;

			@media only screen and (max-width: 768px) {
				max-width: 100%;
				font-size: var(--fontSize27);
				line-height: 1;

			}

			p:last-child {
				margin: 0;
			}
		}
	}
}

.section__playground {
	background-color: var(--backgroundColor);
	color: var(--color);
	padding: 2.75rem 0 2.3rem;

	.playground-holder {
		display: grid;
		grid-template-columns: 33rem 28rem;
		gap: 3.3rem;

		.img {
			svg {
				width: 100%;
				height: auto;
			}
		}

		.text {
			padding: 3.4rem 0 0;

			h3 {
				font-family: "Eames Century Modern";
				font-size: var(--fontSize42);
				line-height: 1.2;
				letter-spacing: 0.01em;
				margin-bottom: .7rem;
			}

			p {
				font-size: var(--fontSize22);
				line-height: 1.2;
				letter-spacing: -0.01em;

				margin: 0 0 1.1rem;
			}

			.box p a.cta__button {}
		}
	}
}

.section__experience {
	background-color: var(--backgroundColor);
	color: var(--color);
	border-radius: var(--borderRadiusVeryBig) var(--borderRadiusVeryBig) 0 0;
	padding: 4.1rem 0 3.5rem;

	@media only screen and (max-width: 768px) {
		padding: 2.1rem 0 2.3rem;
	}

	.experience-holder {
		display: grid;
		grid-template-columns: 48rem 16.3rem;
		gap: 2.5rem;

		@media only screen and (max-width: 768px) {
			grid-template-columns: 1fr;
		}

		.img {
			@media only screen and (max-width: 768px) {
				display: none;
			}

			svg {
				width: 100%;
				height: auto;
			}
		}

		.text {
			padding: 0 0 0 4.4rem;

			@media only screen and (max-width: 768px) {
				padding: 0;
				text-align: center;
			}

			h3 {
				font-family: "Eames Century Modern";
				font-size: var(--fontSize42);
				line-height: 1.2;
				letter-spacing: 0.01em;
				margin-bottom: 1.4rem;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize37);
					margin-bottom: .8rem;
				}
			}

			p,
			ul {
				font-size: var(--fontSize27);
				line-height: 1.2;
				/* letter-spacing: -0.01em; */
				//margin: 0 0 .1rem 0;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize21);
					letter-spacing: -0.02em;
					//line-height: 1.1;
					//margin: 0;
				}
			}
			
			ul {
				padding-inline: 1em 0;
				
				@media only screen and (max-width: 768px) {
					text-align: left;	
				}
			}

			/*
			ul {
				list-style-type: none;
				margin-inline: 0;
				padding: 0;
				display: flex;
				flex-direction: column;
				gap: 0.2em 0;
				
				&:last-child {
					margin-bottom: 0;
				}

				@media only screen and (max-width: 768px) {
					padding-left: 0;
					list-style-position: inside;
					display: flex;
					flex-direction: column;
					text-align: center;
					width: 89%;
					margin: 0 auto 1.2rem;
				}

				>li {
					list-style-type: none;
					margin-inline: 0;
					padding: 0;
					position: relative;
					padding-left: 2.1em;
				
					&:before {
						content: '';
						display: block;
						position: absolute;
						top: 0.35em;
						left: 0;
						background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='13' fill='none' viewBox='0 0 15 13'><path fill='%2330227e' d='M3.229 12.106 1.906 9.808 1.19 8.562l-.47-.816-.53-.9c-.276-.467-.243-.813.043-1.28l.599-.976.88-1.529.99-1.716L3.505 0h7.329l1.568 2.676 1.697 2.897c.266.454.404.786.092 1.299l-.648 1.059-.95 1.64-1.776 3.045-7.18.007c-.162 0-.323-.365-.409-.517' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/></svg>");
						background-repeat: no-repeat;
						background-size: 98% auto;
						width: 0.8em;
						height: auto;
						aspect-ratio: 1/1;
					}
				
					>ul {
						list-style-type: none;
						margin-inline: 0;
						padding: 0;
						display: flex;
						flex-direction: column;
						gap: 0em 0;
				
						>li {
							list-style-type: none;
							margin-inline: 0;
							padding: 0;
							position: relative;
							padding-left: 0.7em;
				
							&:before {
								content: '';
								display: block;
								position: absolute;
								top: 0.55em;
								left: 0;
								background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='13' fill='none' viewBox='0 0 15 13'><path fill='%2330227e' d='M3.229 12.106 1.906 9.808 1.19 8.562l-.47-.816-.53-.9c-.276-.467-.243-.813.043-1.28l.599-.976.88-1.529.99-1.716L3.505 0h7.329l1.568 2.676 1.697 2.897c.266.454.404.786.092 1.299l-.648 1.059-.95 1.64-1.776 3.045-7.18.007c-.162 0-.323-.365-.409-.517' style='fill:%2330227e;fill:color(display-p3 .1875 .1333 .4941);fill-opacity:1'/></svg>");
								background-repeat: no-repeat;
								background-size: 98% auto;
								width: 0.4em;
								height: auto;
								aspect-ratio: 1/1;
							}
						}
					}
				}
			}
			*/

			.box p a.cta__button {}
		}
	}
}

/* -------------ABOUT END---------------  */

/* -------------LOCATION START---------------  */
.location {
	.section__text-description {
		padding-top: 2.4rem;

		.content h2 {
			margin-bottom: 2.7rem;
		}
	}

}

.section__location {
	background-color: var(--backgroundColor);
	color: var(--color);
	padding: 1.4rem 0 1.4rem 0;

	@media only screen and (max-width: 768px) {
		padding: 1rem 0 .8rem;
	}

	.location-holder {
		/* display: grid; */
		/* grid-template-columns: 28.5rem 34rem; */
		gap: 5.5rem;
		display: flex;

		@media only screen and (max-width: 768px) {
			gap: 0;
			width: 90%;
			margin: 0 auto;
		}

		.content {
			aspect-ratio: 494 / 499;
			display: flex;
			flex-direction: column;
			align-items: revert;
			background-color: var(--colorWhite);
			color: var(--color);
			width: 24.7rem;
			clip-path: polygon(50% 0, 0 14%, 0 86%, 50% 100%, 100% 86%, 100% 14%);
			align-items: center;
			justify-content: flex-start;
			padding: 2.5rem 2rem 3.6rem 2rem;
			margin-left: 3.8rem;
			text-align: center;

			@media only screen and (max-width: 768px) {
				margin-left: 0;
				width: 100%;
				padding: 1.8rem 1.2rem 2.2rem;
				aspect-ratio: 514 / 498;
			}

			.icon {
				width: 1.64rem;
				margin-bottom: 0.6rem;

				@media only screen and (max-width: 768px) {
					width: 1.1rem;
					margin-bottom: 0rem;
				}

				svg {
					width: 100%;
					height: auto;
					fill: var(--color);
				}
			}

			h3 {
				font-family: "Eames Century Modern";
				font-size: var(--fontSize42);
				line-height: 1.2;
				letter-spacing: 0.01em;
				margin-bottom: 2rem;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize27);
					margin-bottom: .8125rem;
				}
			}

			>p{
				font-size: var(--fontSize27);
				line-height: 1.2;
				margin: auto auto;
			
				
				&:has(.cta__button){
					margin-top: auto;
				}
				
				

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize17);

				}
			}
			
			.maps__link {
				color: inherit;
				font-family: "Eames Century Modern";
				font-size: var(--fontSize24);
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize16);	
				}
			}
			
			
			
			/*
			span {
				display: inline-block;
				margin-bottom: 1.6rem;

				@media only screen and (max-width: 768px) {
					margin-bottom: 1rem;

				}

				a {
					display: inline-block;
					text-decoration: none;
					color: inherit;
				}
			}
			*/
			
			
			.cta__button {
				font-size: var(--fontSize20);
				/*padding: 0.5em .7em;
				gap: 0 0.4em;*/
				--buttonBackgroundColor: var(--color) !important;
				--buttonColor: var(--colorWhite);
				margin-top: 0;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize16);	
				}
				
				&.maps__button {
					margin-top: 2rem;
				}


			}
		}
		
		.image {
			font-size: 0;
			line-height: 0;
			width: 50%;
			
			@media only screen and (max-width: 768px) {
				display: none;
			}
			
			img {
				width: 100%;
				height: auto;
				aspect-ratio: 681/498;
				object-fit: cover;
			}
		}

		.map {
			position: relative;
			width: 50%;

			@media only screen and (max-width: 768px) {
				display: none;
			}

			iframe {
				position: absolute;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
			}
		}
	}

	&.reverse {

		.location-holder {
			flex-direction: row-reverse;

		}

		.content {
			color: var(--color);
			margin-left: 0;
			margin-right: 3.8rem;

			@media only screen and (max-width: 768px) {
				margin-right: 0;
			}
		}
	}

	&.secondary {
		padding: 0;

		@media screen and (max-width: 768px) {
			padding: 1rem 0;
		}

		.innerwrapper {
			width: 100%;

			@media only screen and (max-width: 768px) {
				width: calc(100% - var(--sideSpacing) - var(--sideSpacing));

			}
		}

		.location-holder {
			display: grid;
			grid-template-columns: 2fr 1fr;
			gap: 2.625rem;

			@media only screen and (max-width: 768px) {
				grid-template-columns: 1fr;
				gap: 0;

			}

			.content {
				width: 92%;
				height: 26.3rem;
				overflow: hidden;
				background-color: var(--colorGreenLight);
				color: var(--color);
				-webkit-mask-image: url(../images/mask-3.svg);
				-webkit-mask-repeat: no-repeat;
				-webkit-mask-size: cover;
				-webkit-mask-position: center;
				mask-image: url(../images/mask-3.svg);
				mask-repeat: no-repeat;
				mask-size: contain;
				-webkit-mask-position-x: center;
				aspect-ratio: auto;
				clip-path: none;
				margin-left: 0;
				margin: 1.75rem 0 1.75rem 2.625rem;
				justify-content: center;

				@media only screen and (max-width: 768px) {
					width: 100%;
					height: 17rem;
					margin: 0;
				}
			}
		}
	}
}

/* -------------LOCATION END---------------  */

.section__anreise {
	.innerwrapper {
		padding-block: 4rem;
		
		display: grid;
		grid-template-columns: 50% 1fr;
		gap: 0 2.6rem;
		
		@media only screen and (max-width: 768px) {
			grid-template-columns: 100%;
			padding-block: 2rem;
			gap: 2rem 0;	
		}
		
		.map {
			width: 100%;
			height: auto;
			aspect-ratio: 681/531;
		}
		
		.content {
			font-size: var(--fontSize22);
			line-height: 1.18;
			
			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize17);	
			}
			
			h2 {
				font-size: var(--fontSize48);
				margin-bottom: 0.8em;
				
				+ h3 {
					margin-top: 0;
				}
			}
			h3 {
				font-family: 'Switzer';
				font-weight: 500;
				font-size: var(--fontSize24);
				margin-top: 2.2em;
				margin-bottom: 0.1em;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize20);	
				}
				
				+ p {
					margin-top: 0;
				}
			}
		}
	}
}

.map-info-window {
  font-family: inherit;
  font-size: 14px;
  line-height: 1.2;
  color: #30227e;
  padding: 2px 4px;
}

.map-info-window strong {
  font-weight: 600;
}



/* -------------TRAILS START---------------  */
.section__info {
	background-color: var(--backgroundColor);
	color: var(--color);
	
	.innerwrapper {
		padding: 3.2rem 0 3.7rem 0;
		
		@media only screen and (max-width: 768px) {
			/*padding: 1.1rem 0 2.25rem;*/
			padding-block: 2.5rem;
		
		}
	}

	.info-top {
		max-width: 67%;
		margin: 0 auto 1rem;
		text-align: center;

		@media only screen and (max-width: 768px) {
			max-width: 100%;
			margin: 0 auto 1rem;
		}

		h2 {
			font-size: var(--fontSize79);
			font-family: "Eames Century Modern";
			font-weight: 400;
			line-height: 1.2;
			letter-spacing: 0.03em;
			margin: 0;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize38);
				margin: 0;
			}

		}

	}

	.info-wrapper {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: .625rem 0;

		@media only screen and (max-width: 768px) {
			gap: .9375rem 0;
		}

		.info-item {
			padding: 1.3rem 1.875rem 1.3rem 1.875rem;
			width: 67%;
			background-color: var(--colorBgCards);
			color: var(--color);
			/*display: grid;
			grid-template-columns: 10.8rem 1fr;*/
			gap: 0;
			border-radius: 0.5rem;
			display: flex;
			flex-direction: column;

			@media only screen and (max-width: 768px) {
				width: 100%;
				padding: .7rem 1rem;
				/*grid-template-columns: 1fr;*/
				gap: 0;
				position: relative;
			}
			
			&.is-open {
				.info-item-column:nth-child(1){
					> svg {
						transform: rotate(180deg);
					}
				}
			}

			.info-item-column {
				font-size: var(--fontSize20);
				line-height: 1.3;
				letter-spacing: 0;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize15);
				}
				
				&:nth-child(1){
					display: grid;
					grid-template-columns: 1fr 1em;
					align-items: center;
					position: relative;
					cursor: pointer;
					
					&:before {
						content: '';
						display: block;
						position: absolute;
						width: calc(100% + 1.875rem + 1.875rem);
						left: -1.875rem;
						right: -1.875rem;
						height: calc(100% + 1.3rem + 1.3rem);
						top: -1.3rem;
						bottom: -1.3rem;
						
						@media only screen and (max-width: 768px) {
							width: calc(100% + 1rem + 1rem);
							left: -1rem;
							right: -1rem;
							height: calc(100% + 0.7rem + 0.7rem);
							top: -0.7rem;
							bottom: -0.7rem;
						}
					}
				}
				
				&:nth-child(2){
					padding-top: 1rem;
					display: none;
				}
				
				h4 {
					font-size: var(--fontSize30);
					letter-spacing: -0.02em;
					font-family: Eames Century Modern;
					font-weight: 400;
					margin: -0.1em 0 0 0;

					@media only screen and (max-width: 768px) {
						font-size: var(--fontSize21);
					}
				}
				
				> svg {
					width: 100%;
					height: auto;
					transition: transform 200ms ease-out;
					
					path {
						fill: var(--color) !important;
					}
				}

				p,
				a,
				ul {
					&:last-child {
						margin: 0;
					}
				}
				
				ul {
					list-style-type: none;
					margin-inline: 0;
					padding: 0;
					display: flex;
					flex-direction: column;
					gap: 0.8em 0;
					
					&:first-child {
						margin-top: 0;
					}
					
					li {
						list-style-type: none;
						margin-inline: 0;
						padding: 0;
						position: relative;
						padding-left: 1.5em;
						
						&:before {
							content: '';
							display: block;
							position: absolute;
							top: 0.35em;
							left: 0;
							background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='13' fill='none' viewBox='0 0 15 13'><path fill='%23336246' d='M3.229 12.106 1.906 9.808 1.19 8.562l-.47-.816-.53-.9c-.276-.467-.243-.813.043-1.28l.599-.976.88-1.529.99-1.716L3.505 0h7.329l1.568 2.676 1.697 2.897c.266.454.404.786.092 1.299l-.648 1.059-.95 1.64-1.776 3.045-7.18.007c-.162 0-.323-.365-.409-.517' style='fill:%23336246;fill:color(display-p3 0.2000 0.3843 0.2745);fill-opacity:1'/></svg>");
							background-repeat: no-repeat;
							background-size: 98% auto;
							width: 0.8em;
							height: auto;
							aspect-ratio: 1 / 1;
						}
					}
				}

				a {
					text-decoration: underline;
					display: inline-block;
					color: inherit;
				}
				
				ol {
					list-style-type: none;
					margin: 0;
					padding: 0;
					display: flex;
					flex-direction: column;
					width: 100%;
					
					li {
						list-style-type: none;
						margin: 0;
						padding: 0;
						border-bottom: 1px solid var(--color);
						padding: 0.2em 0;
					}
				}

			}

		}
	}
}

.section__banner-slider {

	&.radius-top-xl {
		border-radius: var(--borderRadiusVeryBig) var(--borderRadiusVeryBig) 0 0;
		overflow: hidden;
	}

	.banner-slider {
		position: relative;
		
		&.ski {
			.swiper-button-prev,
			.swiper-button-next {
				svg {
					path {
						fill: var(--colorBlueLightest) !important;
					}
				}	
			}
			.swiper-pagination {
				background-color: var(--colorBlueDark) !important;
			}
			.swiper-pagination-bullet {
				background-color: var(--colorBlueMedium) !important;
				
				&.swiper-pagination-bullet-active {
					background-color: var(--colorWhite) !important;
				}
			}
		}
		
		&.bike {
			.swiper-button-prev,
			.swiper-button-next {
				svg {
					path {
						fill: var(--colorGreenLight) !important;
					}
				}	
			}
			.swiper-pagination {
				background-color: var(--colorGreenDark) !important;
			}
			.swiper-pagination-bullet {
				background-color: var(--colorGreenMedium) !important;
				
				&.swiper-pagination-bullet-active {
					background-color: var(--colorWhite) !important;
				}
			}
		}

		.swiper-wrapper {
			.swiper-slide {
				height: 34.3rem;

				@media screen and (max-width: 768px) {
					height: 16rem;
				}

				img {
					position: absolute;
					top: 0;
					left: 0;
					bottom: 0;
					right: 0;
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
			}
		}

		.swiper-button-prev,
		.swiper-button-next {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			width: 3.9rem;
			height: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			z-index: 1;
			left: 2.5rem;
			right: auto;
			cursor: pointer;

			@media only screen and (max-width: 768px) {
				width: 2rem;
				left: 1rem;
			}

			svg {
				width: 100%;
				height: auto;
			}
		}

		.swiper-button-next {
			left: auto;
			right: 2.5rem;

			@media only screen and (max-width: 768px) {
				right: 1rem
			}
		}

		.swiper-pagination {
			position: absolute;
			z-index: 2;
			bottom: 2.2rem;
			left: 50%;
			transform: translateX(-50%);

			display: flex;
			align-items: center;
			justify-content: center;
			gap: .5rem;

			padding: .6rem 1.3125rem;
			background: #336246;
			border-radius: 4.6875rem;

			@media only screen and (max-width: 768px) {
				padding: .3125rem .625rem;
				bottom: 1rem;
			}
		}

		.swiper-pagination-bullet {
			width: .6rem;
			height: .6rem;
			background: #83B373;
			aspect-ratio: 1/1;
			opacity: 1;
			border-radius: 50%;
			transition: all 0.3s ease;

			@media only screen and (max-width: 768px) {
				width: .5rem;
				height: .5rem;
			}
		}

		.swiper-pagination-bullet-active {
			width: .6rem;
			height: .6rem;
			aspect-ratio: 1/1;
			background: var(--colorWhite);

			@media only screen and (max-width: 768px) {
				width: .5rem;
				height: .5rem;
			}
		}
	}
}

.section__banner-slider + .section__description-cards {
	padding-block: 3.5rem;
	margin-top: 0;
	
	@media screen and (max-width: 768px) {
		padding-block: 2.5rem;
	}
}


.section__description-cards {
	background-color: var(--backgroundColor);
	color: var(--color);
	padding-bottom: 9rem;
	padding-top: 0;
	margin-top: -1rem;


	@media screen and (max-width: 768px) {
		padding-top: 1.5rem;
		padding-bottom: 3.5rem;
	}

	.cards-holder {
		display: flex;
		gap: 1.25rem;
		margin: 0 calc(calc(var(--sideSpacing) + var(--outerSpacing)) * -1);
		padding-inline: var(--sideSpacing);
		overflow-x: auto;
		overflow-y: hidden;
		scroll-behavior: smooth;
		-ms-overflow-style: none;
		scrollbar-width: none;
		width: calc(100% + var(--sideSpacing) + var(--sideSpacing) + var(--outerSpacing) + var(--outerSpacing));
		padding-left: calc(var(--outerSpacing) + var(--sideSpacing));
		
		&::-webkit-scrollbar {
			display: none;
		}

		.card-item {
			flex: 0 0 27.1rem;
			padding: 2.2rem 1.6rem 2rem;
			background-color: var(--cardBgColor);
			background-color: var(--cardBgColor);
			text-align: center;


			@media only screen and (max-width: 768px) {
				max-width: 15.04rem;
				padding: 1.7rem 1.375rem 1rem;
			}

			.img {
				position: relative;
				text-align: center;
				padding-top: 0;
				margin-bottom: .8rem;

				@media only screen and (max-width: 768px) {
					padding-top: 0;
					margin-bottom: .4rem;
				}

				.badge {
					font-size: var(--fontSize11);
					font-weight: 500;
					line-height: 1;
					padding: .4375rem .83rem;
					background-color: var(--color);
					color: var(--backgroundColor);
					border-radius: 6.1875rem;
					position: absolute;
					top: 0;
					left: 50%;
					transform: translateX(-50%);
					text-transform: uppercase;

					@media only screen and (max-width: 768px) {
						padding: .3rem .4rem .3rem;
					}
				}

				svg {
					fill: var(--color);
					//width: auto;
					//height: 6rem;
					//max-width: 11rem;
					height: auto;
					max-width: none;
					width: 11rem;
					aspect-ratio: 1.8 / 1;
					object-fit: contain;

					@media only screen and (max-width: 768px) {
						width: 6.3rem;

					}
					
					path {
						fill: var(--color);
					}
				}
			}

			h3 {
				font-size: var(--fontSize48);
				letter-spacing: .01em;
				font-family: "Eames Century Modern";
				font-weight: 400;
				margin: 0 0 1.4rem;
				line-height: 1.16;

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize27);
					margin: 0 0 .6875rem;
				}
			}

			p {
				font-size: var(--fontSize22);
				line-height: 1.2;
				letter-spacing: -0.01em;
				margin: 0 0 1.6rem;
				
				a {
					color: inherit;
				}

				&:last-child {
					margin: 0;
				}
				
				em {
					font-family: "Eames Century Modern";
					font-weight: 450;
					font-style: normal;
				}

				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize15);
					margin: 0 0 .6875rem;
					line-height: 1.25;
				}
			}
		}
	}
}

.section__destination {
	background-color: var(--backgroundColor);
	color: var(--color);
	padding: 5.625rem 0 5.625rem;

	@media only screen and (max-width: 768px) {
		padding: 2.3rem 0 1.3rem;

	}

	.destination-top {
		text-align: center;
		margin: 0 auto 5.75rem;
		width: 46rem;

		@media only screen and (max-width: 768px) {
			width: 100%;
			margin: 0 auto 5.5rem;
		}

		h2 {
			font-size: var(--fontSize79);
			letter-spacing: .01em;
			font-family: "Eames Century Modern";
			font-weight: 400;
			letter-spacing: .03em;
			margin: 0 0 2.875rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize38);
				margin: 0 0 1.5rem;

			}
		}

		p {
			font-size: var(--fontSize27);
			line-height: 1.2;
			letter-spacing: 0;
			margin: 0 0 1.6rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize21);
				margin: 0 0 1.75rem;

			}

			&:last-child {
				margin: 0;
			}
		}
	}

	.info-holder {
		margin: 0 auto 2.25rem;
		width: 46rem;
		text-align: center;

		@media only screen and (max-width: 768px) {
			width: 100%;
			margin: 0 auto 1.25rem;
		}

		svg {
			fill: var(--color);

			@media screen and (max-width: 768px) {
				width: 1.5rem;

			}
		}

		h6 {
			font-size: var(--fontSize24);
			line-height: 1.2;
			letter-spacing: .02em;
			margin: 0 0 .5rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize19);
				margin: 0 0 .1rem;

			}
		}

		p {
			font-size: var(--fontSize24);
			line-height: 1.2;
			letter-spacing: .02em;
			margin: 0 0 1.6rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize15);
				margin: 0 0 1rem;
			}

			&:last-child {
				margin: 0;
			}
		}
	}
}

/* -------------TRAILS END---------------  */


/* -------------EVENTS END---------------  */

.section__text-description.events {
	padding-bottom: 1.2rem;
	padding-top: 3.2rem;

	@media only screen and (max-width: 768px) {
		padding-top: 5.7rem;
	}

	.content h2 {
		margin-bottom: 1.7rem;

		@media only screen and (max-width: 768px) {
			padding-top: 1.3rem;
			padding-bottom: 1.8rem;
		}
	}
}

.section__events {
	background-color: var(--backgroundColor);
	color: var(--color);
	padding-bottom: 5.3rem;

	@media only screen and (max-width: 768px) {
		padding-bottom: 1.5rem;
	}

	.events__wrapper {
		padding-bottom: 1.5rem;
	}

	.events-grid {
		display: grid;
		align-items: center;
		grid-template-columns: 6.8rem 15.05rem 6.5rem 17.63rem 9.5rem 2.3rem;
		gap: 2rem;
		padding: 1rem 0 1.2rem;
		border-bottom: 1px solid #BBCCF4;
		font-size: var(--fontSize15);
		line-height: 1.2;
		letter-spacing: 0;

		&:nth-child(2) {
			border-top: 1px solid #BBCCF4;
		}

		@media only screen and (max-width: 768px) {
			/* grid-template-columns: 2.4rem 1fr; */
			grid-template-columns: 3.3rem 1fr;

			grid-template-areas:
				"date type"
				"date offer"
				"date location"
				"date description"
				"date btn";
			align-items: start;
			gap: .2rem 1rem;
			padding: .625rem 0 0;
			position: relative;
		}

		&.active .description {
			opacity: 1;
		}

		&.header {
			grid-template-columns: 6.8rem 23.6rem 17.5rem 14rem;
			padding: 1.25rem 0 .3rem;
			border-bottom: 1px solid var(--colorBlueDark);

			@media only screen and (max-width: 768px) {
				display: none;
			}
		}

		.date {
			font-family: "Eames Numerals PosterM";
			font-size: var(--fontSize42);
			line-height: 1;
			font-weight: 900;

			@media only screen and (max-width: 768px) {
				grid-area: date;
				font-size: var(--fontSize27);
			}
		}

		.offer {
			font-family: Eames Century Modern;
			font-size: var(--fontSize25);
			line-height: 1.1;
			letter-spacing: .01em;
			display: flex;
			align-items: center;
			max-width: 11em;

			@media only screen and (max-width: 768px) {
				grid-area: offer;
				font-size: var(--fontSize23);
			}
		}

		.type {
			display: flex;
			flex-wrap: wrap;

			@media only screen and (max-width: 768px) {
				grid-area: type;
			}

			.badge {
				margin-bottom: .1875rem;

				&:last-child {
					margin-bottom: 0;
				}
			}
		}


		.description,
		.location {
			font-size: var(--fontSize15);
			line-height: 1.2;
			letter-spacing: 0;
		}

		.location {
			@media only screen and (max-width: 768px) {
				grid-area: location;
				color: #777BA5;
			}
		}

		.description {
			@media only screen and (max-width: 768px) {
				height: 0;
				overflow: hidden;
				opacity: 0;
				transition: height .35s ease, opacity .25s ease;
			}
		}


		.btn {
			.btn-arrow {
				width: 2.625rem;
				height: 2.625rem;
				border-radius: 50%;
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;


				@media only screen and (max-width: 768px) {
					position: absolute;
					top: .5rem;
					right: .3rem;
					width: 1rem;
					height: 1rem;
				}

				&.btn-arrow-blue {
					background-color: var(--colorBlueLight);

					@media only screen and (max-width: 768px) {
						background-color: transparent;
					}

					svg {
						fill: var(--colorBlueDark);
						width: 1.6875rem;
						height: auto;
					}
				}
			}
		}

		&.active {
			.description {
				display: block;
			}

			.btn {
				.btn-arrow {
					transform: rotate(-90deg);
				}
			}
		}


		.badge {
			font-size: var(--fontSize11);
			line-height: 1;
			padding: .3rem .6rem .3rem;
			border-radius: .125rem;
			border: 1px solid var(--color);
			display: inline-block;
			text-transform: uppercase;
			margin-bottom: .1rem;

			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize8);
				margin-bottom: 0 !important;
				margin-right: .3125rem;
			}

			&:last-child {
				margin-bottom: 0;
			}

			&.rounded {
				border-radius: 6.1875rem;
			}

			&.favourite {
				background-color: var(--colorRed);
				color: var(--colorWhite);
				border: none;
				font-size: var(--fontSize11);
				font-family: 'Switzer';
				margin-block: auto;
				margin-left: 0.5em;
				padding: 0.4em 0.8em;
				margin-bottom: 0.2em;

				@media only screen and (max-width: 768px) {
					margin-bottom: 0;
					font-size: var(--fontSize8);
					padding: .3rem .6rem .3rem;
					margin-block: 0;
				}
			}
		}
	}

	.links__holder {
		display: flex;
		justify-content: flex-end;

		@media only screen and (max-width: 768px) {
			justify-content: space-between;
		}

		a {
			font-size: var(--fontSize15);
			line-height: 1.2;
			letter-spacing: 0;
			text-decoration: underline;
			color: var(--color);
			margin-right: 3.2rem;

			&:last-child {
				margin-right: 0;
			}
		}
	}
	
	.button__holder {
		display: flex;
		justify-content: center;
		margin-top: 2rem;
	}
}

/* -------------EVENTS START---------------  */

.woocommerce-notices-wrapper {
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
	border-radius: var(--borderRadiusMedium) !important;
	background-color: var(--colorBlueLightest) !important;
	color: var(--colorBlueDark) !important;
	border-top: 0 !important;
	max-width: none !important;
	text-align: center !important;
	margin-inline: auto !important;
	//display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	
	&:has(.button){
		display: flex !important;
	}
	
	a {
		color: inherit;
	}
	
	&:before {
		color: var(--colorBlueDark) !important;
	}
	
	&:focus {
		outline: 0 !important;
	}
	
	.button {
		margin-top: 1rem !important;
		float: none !important;
	}
}

body.frontend .woocommerce {
	
	.woocommerce-order {
		.woocommerce-thankyou-order-received {
			text-align: center;
			margin: 4rem auto;
			font-size: var(--fontSize79);
			font-family: "Eames Century Modern";
			font-weight: 400;
			line-height: 1.02;
			letter-spacing: 0.03em;
			max-width: 9em;
			margin-inline: auto;
			
			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize36);
			}
		}
		.woocommerce-order-overview,
		.woocommerce-order-details,
		.woocommerce-customer-details {
			display: none !important;
		}
		
		> p:not(.woocommerce-notice) {
		
			display: none !important;
		
		}
	}
	
	.checkout.woocommerce-checkout {
		display: grid;
		grid-template-columns: repeat(2,1fr);
		grid-template-rows: auto 1fr;
		gap: 0 3rem;
		margin-bottom: 3rem;
		
		@media only screen and (max-width: 768px) {
			display: flex;
			flex-direction: column;	
		}
		
		.woocommerce-NoticeGroup-checkout {
			grid-column: span 2;
			margin-top: 2rem;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;	
			}
			
		}
		
		.form-row label {
			line-height: 1.2;
			margin-bottom: 0.4em;
		}
		
		h3 {
			margin: 1.5em 0 0 0;
			font-family: "Eames Century Modern";
			font-size: var(--fontSize38);
			font-weight: 500;
			letter-spacing: -0.02em;
			line-height: 1.03;
			margin-bottom: 0.5em;
			text-decoration: none;
			color: var(--colorBlueDark);
		}
		
		.col2-set {
			grid-column: 1/2;
			grid-row: 1/3;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;	
			}
			
			&:before,
			&:after {
				display: none;
			}
			
			.col-1,
			.col-2 {
				float: none;
				width: 100%;
			}
		}
		
		h3#order_review_heading {
			grid-column: 2/3;
			grid-row: 1/2;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;	
			}
		}
		
		#order_review {
			grid-column: 2/3;
			grid-row: 2/3;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;
				grid-row: unset;	
			}
			
			.shop_table {
				border-radius: var(--borderRadiusSmall);
				td.product-name {
					dl.variation {
						
						margin-left: 0;
						width: calc(100% + 10rem);
						
						@media only screen and (max-width: 768px) {
							width: calc(100% + 5rem);
						}
					}
				}
				td.product-total {
					width: 10rem;
					
					@media only screen and (max-width: 768px) {
						width: 5rem;	
					}
				}
				tfoot th {
					border-color: var(--colorBlueLight) !important;
				}
			}
			
			.woocommerce-checkout-payment {
				margin-top: 2rem;
				border-radius: var(--borderRadiusSmall);
				background-color: var(--colorBlueLightest);
				
				.payment_box.payment_method_cod {
					display: none !important;
				}
				
				div.payment_box {
					background-color: var(--colorWhite);
					border-radius: var(--borderRadiusSmall);
					color: var(--colorBlueDark);
					
					&:before {
						border: 1em solid var(--colorWhite);
						border-right-color: transparent;
						border-left-color: transparent;
						border-top-color: transparent;
					}
				}
				
				.woocommerce-privacy-policy-text {
					font-size: var(--fontSize16);
					
					p {
						&:first-child {
							margin-top: 0;
						}
						
						&:last-child {
							margin-bottom: 0;
						}
					}
					
					a {
						color: inherit;
					}
				}
			}
			
			
		}
		
		input[type="text"],
		input[type="email"],
		input[type="tel"],
		input[type="date"],
		select,
		textarea {
			width: 100%;
			border: 1px solid var(--colorBlueDark);
			border-radius: var(--borderRadiusSmall);
			font-size: var(--fontSize15);
			font-family: 'Switzer';
			font-weight: 400;
			height: 3.4em;
			padding: 0 1.1em;
			color: var(--colorBlueDark);
		
			&.wpcf7-not-valid {
				border-color: var(--colorRed);
			}
		
			&::-webkit-input-placeholder {
				color: var(--colorBlueDark);
				opacity: 0.7;
			}
		
			&::-moz-placeholder {
				color: var(--colorBlueDark);
				opacity: 0.7;
			}
		
			&:-ms-input-placeholder {
				color: var(--colorBlueDark);
				opacity: 0.7;
			}
		
			&:-moz-placeholder {
				color: var(--colorBlueDark);
				opacity: 0.7;
			}
		}
		
		textarea {
			height: 17em;
			resize: none;
			padding-top: 0.6em;
		}
		
	}
	
	.cart_totals {
		h2 {
			margin: 1.5em 0 0 0;
			font-family: "Eames Century Modern";
			font-size: var(--fontSize38);
			font-weight: 500;
			letter-spacing: -0.02em;
			line-height: 1.03;
			margin-bottom: 0.5em;
			text-decoration: none;
			color: var(--colorBlueDark);
		}
		
		.shop_table {
			td,
			th {
				padding: 1em 1em;
				
				@media only screen and (max-width: 768px) {
					padding: 0.5em 0.5em;
				}

			}
		}
		
		.wc-proceed-to-checkout {
			display: flex;
			justify-content: flex-end;
		}
	}
	
	.shop_table_responsive {
		tr td::before {
			margin-right: 0.5em !important;
		}
	}
	
	.shop_table {
		border: 1px solid var(--colorBlueLight);
		margin: 0 0 0 0;
		text-align: left;
		width: 100%;
		border-collapse: separate;
		border-spacing: 0;
		border-radius: 0;
		
		@media only screen and (max-width: 768px) {
			font-size: var(--fontSize16);
			
			thead {
				display: none !important;
			}
		}
		
		td {
			padding: 0;
			border-top: 1px solid var(--colorBlueLight);
			
			&.actions {
				button[name="update_cart"]{
					display: none !important;
				}
				.coupon {
					display: flex;
					gap: 0 0.2rem;
					
					@media only screen and (max-width: 768px) {
						flex-direction: column;	
						gap: 0.3rem 0;
					}
					
					input[name="coupon_code"]{
						width: 100%;
						max-width: 15em;
						border: 1px solid var(--colorBlueDark);
						border-radius: var(--borderRadiusSmall);
						font-size: var(--fontSize15);
						font-family: 'Switzer';
						font-weight: 400;
						height: unset;
						padding: 0 1.1em;
						color: var(--colorBlueDark);
						
						@media only screen and (max-width: 768px) {
							max-width: none;
							height: 2.5rem;	
						}
						
						&.wpcf7-not-valid {
							border-color: var(--colorRed);
						}
						
						&::-webkit-input-placeholder {
							color: var(--colorBlueDark);
							opacity: 0.7;
						}
						
						&::-moz-placeholder {
							color: var(--colorBlueDark);
							opacity: 0.7;
						}
						
						&:-ms-input-placeholder {
							color: var(--colorBlueDark);
							opacity: 0.7;
						}
						
						&:-moz-placeholder {
							color: var(--colorBlueDark);
							opacity: 0.7;
						}
					}
					button[name="apply_coupon"]{
						font-size: var(--fontSize18) !important;
						border-radius: var(--borderRadiusSmall) !important;
						font-family: 'Switzer' !important;
						white-space: nowrap;
						
							
						@media only screen and (max-width: 768px) {
							width: 100%;
							text-align: center;	
							justify-content: center;
						}
					}
				}
				
			}
		}
		
		td,
		th {
			padding: 0.3em 1em;
			text-align: left !important;
			
			&.product-price,
			&.product-subtotal {
				width: 10em;
				
				@media only screen and (max-width: 768px) {
					width: 100%;	
				}
			}
		}
		
		td {
			padding: 1em 1em;
			vertical-align: top;
			
			@media only screen and (max-width: 768px) {
				padding: 0.5em 0.5em;
			}
		}
		
		td.product-name {
			dl.variation {
				display: grid;
				grid-template-columns: auto 1fr;
				font-size: var(--fontSize16);
				line-height: 1.3;
				background-color: var(--colorBlueLightest);
				padding: 0.75rem;
				border-radius: var(--borderRadiusSmall);
				margin-left: -0.75rem;
				gap: 0 1em;
				
				@media only screen and (max-width: 768px) {
					margin-inline: 0;	
				}

				dt {
					margin: 0;
					float: none;
					max-width: 10em;

				}

				dt,
				dd {
					p {
						margin: 0;
					}

					&.variation-Buchungsdatum {
						margin-top: 2em;
					}
					
					/*
					&.variation-TannheimerTalGstekartevorhanden {
						margin-top: 2em;
						
						+ dt.variation-Buchungsdatum,
						+ dt.variation-Buchungsdatum + dd.variation-Buchungsdatum {
							margin-top: 0;
						}
					}
					*/
					
					&.variation-spanclasspewc-cart-group-headingTannheimerTalGstekartevorhandenspan{
						display: none !important;
						
						+ dt.variation-TannheimerTalGstekartevorhanden,
						+ dt.variation-TannheimerTalGstekartevorhanden + dd.variation-TannheimerTalGstekartevorhanden {
							display: none !important;
						}
					}
				}

				dt:has(.pewc-cart-group-heading),
				dt:has(.pewc-cart-group-heading)+dd {
					grid-column: span 2;
					font-weight: 600;
					display: block;
					margin-bottom: 0.2em;
					letter-spacing: 0.02em;
					max-width: none;
					
					.pewc-cart-group-heading {
						font-size: inherit;
						text-decoration: none;
						
					}
					
					&:not(:first-child):not(:empty){
						margin-top: 1rem;
					}
				}
			}
		}
		
		th.product-quantity,
		td.product-quantity,
		th.product-thumbnail,
		td.product-thumbnail {
			display: none;
		}
		
		th.product-remove,
		td.product-remove {
			padding-left: 1rem;
			padding-right: 0;
			width: 2.5rem;
			vertical-align: top;
			
			a.remove {
				display: block;
				font-size: 0;
				height: auto;
				width: 100%;
				aspect-ratio: 1 / 1.25;
				text-align: center;
				line-height: 0;
				border-radius: 0;
				color: transparent !important;
				text-decoration: none;
				font-weight: 700;
				border: 0;
				background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='45' height='52' fill='none' viewBox='0 0 45 52'><path fill='%23bbccf4' d='M22.436 17.322 34.686 5l10.24 10.26-12.249 12.267L44.872 39.74 34.63 50 22.381 37.732 10.241 49.89 0 39.63l12.14-12.158L0 15.314l10.241-10.26z' style='fill:%23bbccf4;fill:color(display-p3 .7334 .8004 .9566);fill-opacity:1'></path></svg>");	
				background-repeat: no-repeat;
				background-size: 98% auto;
				margin-top: -0.1rem;
				
				&:hover {
					background-color: transparent !important;
				}
			}
		}
		
		td.product-name {
			> a  {
				margin: 0;
				font-family: "Eames Century Modern";
				font-size: var(--fontSize24);
				font-weight: 500;
				letter-spacing: -0.02em;
				line-height: 1.03;
				margin-bottom: 0.2rem;
				text-decoration: none;
				color: var(--colorBlueDark);
			}
			
			dl.variation {
				
			}
		}
	}
}

.section__contact-form {
	.innerwrapper {
		padding-top: 4.3rem;
		padding-bottom: 2rem;
		border-bottom: 1px solid var(--colorBlueDark);
		
		@media only screen and (max-width: 768px) {
			padding-top: 1.6rem;	
		}

		.contact__intro {
			text-align: center;
			font-size: var(--fontSize22);
			line-height: 1.18;
			
			@media only screen and (max-width: 768px) {
				text-align: left;	
				font-size: var(--fontSize21);
			}

			h1 {
				font-size: var(--fontSize79);
				line-height: 1.018;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize38);	
				}

				+p {
					margin-top: 1.5em;
					
					@media only screen and (max-width: 768px) {
						margin-top: 1.3em;	
					}
				}


			}

			p {
				max-width: 20em;
				margin-inline: auto;
			}
		}

		.content {
			margin-top: 0.9rem;
			width: calc(100% - 23rem);
			margin-inline: auto;
			border-top: 1px solid var(--colorBlueDark);
			
			@media only screen and (max-width: 768px) {
				width: 100%;
				margin-top: 1.5rem;	
			}
		}
	}
}

.formular__wrapper {
	display: flex;
	flex-direction: column;

	.form__block {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 1.15rem 1rem;
		
		@media only screen and (max-width: 768px) {
			grid-template-columns: 100%;	
			gap: 1.1rem 0;
		}

		&:not(:first-child) {
			border-top: 1px solid var(--colorBlueLightMedium);
			margin-top: 2rem;
		}

		.form__block-header {
			display: flex;
			justify-content: space-between;
			padding-top: 2rem;
			grid-column: span 2;
			align-items: start;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;	
				margin-bottom: -0.2rem;
				flex-direction: column;
				gap: 0.5em 0;
			}

			h2 {
				font-size: var(--fontSize22);
				font-family: 'Switzer';
				font-weight: 500;
				letter-spacing: 0;
			}

			>p {
				margin: 0;
				font-size: var(--fontSize15);
				text-align: right;
				
				@media only screen and (max-width: 768px) {
					text-align: left;	
					font-size: var(--fontSize16);
					
					br {
						display: none;
					}
				}
			}
		}

		.form__column {
			grid-column: span 2;
			
			@media only screen and (max-width: 768px) {
				grid-column: unset;	
			}



			&.half-width {
				grid-column: span 1;
				
				@media only screen and (max-width: 768px) {
					grid-column: unset;	
				}
			}

			&.with-submit {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
				
				@media only screen and (max-width: 768px) {
					flex-direction: column;	
					gap: 1rem 0;
					align-items: start;
				}

				.submit__container {
					>p {
						display: flex;
						gap: 0 0.5rem;
						align-items: center;
						
						

						.wpcf7-spinner {
							order: 1;
							margin-inline: 0;
							
							@media only screen and (max-width: 768px) {
								order: 2;	
							}
						}

						button {
							order: 2;
							
							@media only screen and (max-width: 768px) {
								order: 1;	
								font-size: var(--fontSize24);
								padding-inline: 1.3em;
							}
						}
					}
				}


			}

			label {
				font-family: 'Switzer';
				font-weight: 500;
				font-size: var(--fontSize15);

			}

			&:has(.wpcf7-form-control.wpcf7-checkbox) {
				>p>label {
					font-size: var(--fontSize22);
					display: block;
					margin-top: -0.5rem;
					
					@media only screen and (max-width: 768px) {
						margin-top: 0;	
					}
				}
			}

			.wpcf7-not-valid-tip {
				display: none;
			}

			.wpcf7-form-control.wpcf7-checkbox {
				display: flex;
				flex-wrap: wrap;
				margin-top: 0.4rem;
				gap: 0.5rem 0.55rem;

				.wpcf7-list-item {
					margin: 0;

					>label {
						display: block;
						cursor: pointer;

						input {
							position: absolute;
							margin: 0;
							visibility: hidden;
						}

						.wpcf7-list-item-label {
							display: block;
							background-color: var(--colorBlueLightMedium);
							color: var(--colorBlueDark);
							font-size: var(--fontSize11);
							text-transform: uppercase;
							font-weight: 500;
							font-family: 'Switzer';
							padding: 0.6em 1.1em;
							border-radius: var(--borderRadiusSmall);
						}

						input:checked+.wpcf7-list-item-label {
							background-color: var(--colorBlueDark);
							color: var(--colorWhite);
						}
					}
				}
			}

			.wpcf7-form-control.wpcf7-acceptance {
				.wpcf7-list-item {
					margin: 0;

					>label {
						display: block;
						cursor: pointer;

						input {
							position: absolute;
							margin: 0;
							visibility: hidden;
						}

						.wpcf7-list-item-label {
							display: block;
							position: relative;
							padding-left: 2.5em;

							&:before {
								content: '';
								display: block;
								position: absolute;
								width: 1.5em;
								aspect-ratio: 1/1;
								height: auto;
								background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='50' fill='none' viewBox='0 0 50 50'><circle cx='25' cy='25' r='25' fill='%2330227e'/></svg>");
								background-repeat: no-repeat;
								background-size: 98% auto;
								left: 0;
								top: 0;
							}

						}

						input:checked+.wpcf7-list-item-label {
							&:before {
								background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='50' fill='none' viewBox='0 0 50 50'><circle cx='25' cy='25' r='25' fill='%2330227e'/><ellipse cx='25' cy='25' fill='%23fff' rx='16' ry='16.5'/></svg>");

							}
						}
					}
				}
			}

			input[type="text"],
			input[type="email"],
			input[type="tel"],
			input[type="date"],
			select,
			textarea {
				width: 100%;
				border: 1px solid var(--colorBlueDark);
				border-radius: var(--borderRadiusSmall);
				font-size: var(--fontSize15);
				font-family: 'Switzer';
				font-weight: 400;
				height: 3.4em;
				padding: 0 1.1em;
				color: var(--colorBlueDark);

				&.wpcf7-not-valid {
					border-color: var(--colorRed);
				}

				&::-webkit-input-placeholder {
					color: var(--colorBlueDark);
					opacity: 0.7;
				}

				&::-moz-placeholder {
					color: var(--colorBlueDark);
					opacity: 0.7;
				}

				&:-ms-input-placeholder {
					color: var(--colorBlueDark);
					opacity: 0.7;
				}

				&:-moz-placeholder {
					color: var(--colorBlueDark);
					opacity: 0.7;
				}
			}

			textarea {
				height: 17em;
				resize: none;
				padding-top: 0.6em;
			}

			>p {
				margin: 0;
				display: flex;
				flex-direction: column;
				gap: 0.2rem 0;
			}
		}
	}
	
	.required_fields {
		@media only screen and (max-width: 768px) {
			font-size: var(--fontSize17);	
		}
	}
}

.kursfinder__wrapper {
	--scaler: 0.8;
	height: calc(100dvh - var(--sideSpacing) - var(--sideSpacing));
	/*width: calc(100% - var(--sideSpacing) - var(--sideSpacing));
	width: 100%;*/
	width: calc(calc(100% - var(--sideSpacing)) * var(--scaler));
	
	max-height: 38rem;
	/*max-width: 70rem;*/
	max-width: calc(calc(1494px + var(--sideSpacing)) * var(--scaler));
	z-index: 101;
	background-color: var(--colorWhite);
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	pointer-events: none;
	opacity: 0;
	
	@media only screen and (max-width: 768px) {
		--scaler: 1;
		width: 100%;
		height: 100dvh;
		top: 0;
		transform: translate(0,0);
		left: 0;
		
	}
	
	.close__kursfinder {
		font-size: 0;
		line-height: 0;
		display: block;
		width: calc(2.3rem * var(--scaler));
		border: 0;
		background: transparent;
		margin: 0;
		position: absolute;
		right: calc(1.8rem * var(--scaler));
		top: calc(1.3rem * var(--scaler));
		cursor: pointer;
		padding: 0;
		
		@media only screen and (max-width: 768px) {
			width: 1.5rem;
			right: var(--sideSpacing);
			top: var(--sideSpacing);	
		}
	
		svg {
			width: 100%;
			height: auto;
		}
	}
	
	&:has(.screen.is-active[data-type="bikeschule"]){
		.close__kursfinder {
			svg {
				path {
					fill: #83B373 !important;
				}
			}	
		}
	}
	
	.screen {
		--backgroundColor: var(--colorBlueLight);
		--color: var(--colorBlueDark);
		width: 100%;
		height: 100%;
		background-color: var(--backgroundColor);
		color: var(--color);
		overflow-y: auto;
		display: none;
		
		&[data-type="bikeschule"]{
			--backgroundColor: var(--colorGreenLight);
			--color: var(--colorGreenDark);
			
			
		}
		
		&[data-type="bikeschule"]:not(.start):not(.finish){
			--backgroundColor: var(--colorGreenDark);
			--color: var(--colorWhite);
			
			--backButtonColor: var(--colorWhite);
			
			.screen__inner {
				.content {
					background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='524' height='670' fill='none' viewBox='0 0 524 670'><path fill='%2383B373' d='M262 0C186.547 0 93.434 6.742 0 19.262v83.79c91.186-12.841 183.015-20.225 256.863-20.225h10.595c51.052 0 111.094 3.531 173.383 9.952v264.854c0 112.683-131 194.226-178.841 220.23-47.841-26.004-178.84-107.547-178.84-220.23V231.787c62.609-6.42 122.651-9.952 173.703-9.952H262c20.549 0 42.703.642 66.142 1.605v-83.148c-23.118-.963-45.272-1.605-66.142-1.605-75.453-.642-168.566 6.421-262 19.262v199.363C0 548.007 234.709 657.48 244.662 661.974L262 670l17.338-8.026C289.291 657.48 524 547.686 524 357.312V19.583C456.895 10.273 358.323-.963 262 .321z' opacity='.18' style='fill:%2383B373;fill-opacity:1'/></svg>");
				}
			}
		}
		
		&[data-type="skischule"]:not(.start):not(.finish){
			--backgroundColor: var(--colorBlueDark);
			--color: var(--colorWhite);
			
			--backButtonColor: var(--colorWhite);
			
			.screen__inner {
				.content {
					background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='524' height='670' fill='none' viewBox='0 0 524 670'><path fill='%23BBCCF4' d='M262 0C186.547 0 93.434 6.742 0 19.262v83.79c91.186-12.841 183.015-20.225 256.863-20.225h10.595c51.052 0 111.094 3.531 173.383 9.952v264.854c0 112.683-131 194.226-178.841 220.23-47.841-26.004-178.84-107.547-178.84-220.23V231.787c62.609-6.42 122.651-9.952 173.703-9.952H262c20.549 0 42.703.642 66.142 1.605v-83.148c-23.118-.963-45.272-1.605-66.142-1.605-75.453-.642-168.566 6.421-262 19.262v199.363C0 548.007 234.709 657.48 244.662 661.974L262 670l17.338-8.026C289.291 657.48 524 547.686 524 357.312V19.583C456.895 10.273 358.323-.963 262 .321z' opacity='.18' style='fill:%23BBCCF4;fill-opacity:1'/></svg>");
				}
			}
		}
		
		&.is-active {
			display: flex;
		}
		
		.big_title {
			font-size: calc(var(--fontSize123) * var(--scaler));
			margin: 0;
			font-family: "Eames Century Modern";
			font-weight: 400;
			display: inline-block;
			line-height: 1.05;
			
			@media only screen and (max-width: 768px) {
				font-size: var(--fontSize59);	
			}
		}
		
		&.finish {
			.big_title {
				font-size: calc(var(--fontSize48) * var(--scaler));
				max-width: 13em;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize28);
					max-width: 10em;	
				}
			}
			.back__button {
				svg {
					circle {
						fill: var(--color) !important;
					}
				}
			}
			.content {
				font-size: calc(var(--fontSize22) * var(--scaler)) !important;
				line-height: 1.18;
				background-image: none !important;
				
				.content__inner {
					p {
						max-width: 38em;
					}
				}
			}
		}
		
		&.start-screen {
			
			
			/*justify-content: center;
			align-items: center;*/
			padding-block: calc(2rem * var(--scaler));
			justify-content: center;
			background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='524' height='670' fill='none' viewBox='0 0 524 670'><path fill='%23fff' d='M262 0C186.547 0 93.434 6.742 0 19.262v83.79c91.186-12.841 183.015-20.225 256.863-20.225h10.595c51.052 0 111.094 3.531 173.383 9.952v264.854c0 112.683-131 194.226-178.841 220.23-47.841-26.004-178.84-107.547-178.84-220.23V231.787c62.609-6.42 122.651-9.952 173.703-9.952H262c20.549 0 42.703.642 66.142 1.605v-83.148c-23.118-.963-45.272-1.605-66.142-1.605-75.453-.642-168.566 6.421-262 19.262v199.363C0 548.007 234.709 657.48 244.662 661.974L262 670l17.338-8.026C289.291 657.48 524 547.686 524 357.312V19.583C456.895 10.273 358.323-.963 262 .321z' opacity='.4' style='fill:%23fff;fill-opacity:1'/></svg>");	
			background-repeat: no-repeat;
			background-size: auto 79%;
			background-position: center center;
			
			@media only screen and (max-width: 768px) {
				background-size: 82% auto;	
			}
			
			
			
			.content {
				font-size: calc(var(--fontSize41) * var(--scaler));
				text-align: center;
				line-height: 1.19;
				margin-block: auto;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize21);	
					padding-inline: var(--sideSpacing);
				}
				
				
				p {
					max-width: 19em;
					margin-inline: auto;
					margin-block: 0;
				}
				
				.big_title {
					margin-bottom: 0.3em;
				}
				
				.big_title + p {
					margin-top: 0;
				}
				
				.button__wrapper {
					display: flex;
					margin-top: 0;
					gap: 0 calc(2rem * var(--scaler));
					justify-content: center;
					margin-top: calc(4rem * var(--scaler));
					
					@media only screen and (max-width: 768px) {
						flex-direction: column;
						margin-top: 3rem;
						flex-direction: column;
						gap: 1rem 0;
					}
				
					p {
						margin: 0;
					}
				
				
				}
			}
			
		}
		
		.screen__inner {
			display: grid;
			grid-template-columns: calc(10.8rem * var(--scaler)) 1fr;
			width: 100%;
			min-height: 100%;
			
			@media only screen and (max-width: 768px) {
				grid-template-columns:100%;
				grid-template-rows: 1fr;
			}
			
			> .image {
				width: 100%;
				height: 100%;
				position: relative;
				
				@media only screen and (max-width: 768px) {
					display: none;	
				}
				
				img {
					width: 100%;
					height: 100%;
					object-fit: cover;
					position: absolute;
					left: 0;
					top: 0;
				}
			}
			
			> .content {
				width: 100%;
				min-height: 100%;
				background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='524' height='670' fill='none' viewBox='0 0 524 670'><path fill='%23fff' d='M262 0C186.547 0 93.434 6.742 0 19.262v83.79c91.186-12.841 183.015-20.225 256.863-20.225h10.595c51.052 0 111.094 3.531 173.383 9.952v264.854c0 112.683-131 194.226-178.841 220.23-47.841-26.004-178.84-107.547-178.84-220.23V231.787c62.609-6.42 122.651-9.952 173.703-9.952H262c20.549 0 42.703.642 66.142 1.605v-83.148c-23.118-.963-45.272-1.605-66.142-1.605-75.453-.642-168.566 6.421-262 19.262v199.363C0 548.007 234.709 657.48 244.662 661.974L262 670l17.338-8.026C289.291 657.48 524 547.686 524 357.312V19.583C456.895 10.273 358.323-.963 262 .321z' opacity='.4' style='fill:%23fff;fill-opacity:1'/></svg>");	
				background-repeat: no-repeat;
				background-size: auto 79%;
				background-position: center center;
				font-size: var(--fontSize41);
				text-align: left;
				line-height: 1.19;
				padding: calc(1.5rem * var(--scaler)) calc(2.2rem * var(--scaler)) 0 calc(3.4rem * var(--scaler));
				display: flex;
				flex-direction: column;
				
				@media only screen and (max-width: 768px) {
					background-size: 82% auto;	
					font-size: var(--fontSize21);
					padding: calc(1.1rem * var(--scaler)) var(--sideSpacing) 0 var(--sideSpacing);
				}
				
				.content__inner {
					.big_title {
						margin-bottom: 0.4em;
					}
					
					p {
						margin: 0;
						max-width: 20em;
					}
					.steps {
						font-family: "Eames Numerals PosterL";
						font-size: calc(var(--fontSize123) * var(--scaler));
						font-weight: 900;
						margin-bottom: 0.05em;
						display: inline-block;
						
						@media only screen and (max-width: 768px) {
							font-size: var(--fontSize90);	
						}
						
						+ p {
							max-width: 18em;
						}
					}
				}
				
				.fields__wrapper {
					display: flex;
					flex-direction: column;
					margin-top: calc(1rem * var(--scaler));
					gap: calc(0.5rem * var(--scaler)) 0;
					
					.single__field {
						input {
							position: absolute;
							visibility: hidden;
						}
						
						span {
							display: grid;
							grid-template-columns: 2em 1fr;
							gap: 0 0.5em;
							align-items: center;
							position: relative;
							font-size: var(--fontSize27);
							
							@media only screen and (max-width: 768px) {
								font-size: var(--fontSize17);
							}
							
							&:before {
								content: '';
								display: block;
								width: 100%;
								aspect-ratio: 1/1;
								height: auto;
								background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='55' height='55' fill='none' viewBox='0 0 55 55'><rect width='55' height='55' fill='%23fff' rx='5'/></svg>");	
								background-repeat: no-repeat;
								background-size: 98% auto;
							}
						}
						
						input:checked + span {
							&:before {
								content: '';
								display: block;
								width: 100%;
								aspect-ratio: 1/1;
								height: auto;
								background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='55' height='55' fill='none' viewBox='0 0 55 55'><rect width='55' height='55' fill='%23fff' rx='5' /><path fill='%2330227e' d='m48.2 15.376-4.63-4.581a2.69 2.69 0 0 0-3.816 0L21.595 28.86l-7.352-7.176a2.7 2.7 0 0 0-1.91-.798 2.68 2.68 0 0 0-1.911.798L5.79 26.352a2.734 2.734 0 0 0 0 3.849l13.821 14.002a2.7 2.7 0 0 0 1.91.797 2.68 2.68 0 0 0 1.911-.797L48.21 19.235A2.73 2.73 0 0 0 49 17.304a2.74 2.74 0 0 0-.8-1.928m-1.63 2.206L21.788 42.553a.385.385 0 0 1-.542 0L7.425 28.552a.39.39 0 0 1 0-.549l4.631-4.667a.385.385 0 0 1 .433-.082.4.4 0 0 1 .133.092l8.172 7.988a1.153 1.153 0 0 0 1.62 0L41.396 12.45a.39.39 0 0 1 .427-.088q.071.03.126.088l4.632 4.581a.39.39 0 0 1-.012.55'/></svg>");	
								background-repeat: no-repeat;
								background-size: 98% auto;
								
								
							}
						}
					}
				}
				
				.button__holder {
					margin-top: auto;
					display: flex;
					justify-content: flex-end;
					padding-top: calc(1rem * var(--scaler));
					padding-bottom: calc(2rem * var(--scaler));
					
					@media only screen and (max-width: 768px) {
						flex-direction: row;
					}
					
					.cta__button {
						font-size: calc(var(--fontSize32) * var(--scaler));
						
						@media only screen and (max-width: 768px) {
							font-size: calc(var(--fontSize18));
						}
					}
					
					.back__button {
						display: inline-grid;
						grid-template-columns: 3.8em 1fr;
						align-items: center;
						font-size: calc(var(--fontSize24) * var(--scaler));
						line-height: 1.166;
						margin-right: auto;
						margin-left: 0;
						background: transparent;
						border: 0;
						margin-left: -0.3em;
						gap: 0 0.9em;
						color: var(--backButtonColor);
						font-family: 'Switzer';
						font-weight: 500;
						cursor: pointer;
						
						@media only screen and (max-width: 768px) {
							font-size: calc(var(--fontSize18));
							grid-template-columns: 100%;
							width: 2.7rem;
							padding: 0;
							margin-left: 0;
						}
						
						> span {
							@media only screen and (max-width: 768px) {
								display: none;	
							}
						}
						
						> svg {
							width: 100%;
							height: auto;
							
							circle {
								fill: var(--backButtonColor);
								
							}
							
							path {
								fill: var(--backgroundColor);
							}
						}
					}
				}
				
				.cta__button {
					margin-top: auto;
					margin-left: auto;
					
					&.is-disabled {
					  opacity: 0.4;
					  pointer-events: none;
					  cursor: not-allowed;
					}
				}
			}
			
			.kursfinder__results {
				margin-block: auto;
				
				.result-item {
					max-width: 32em;
				}
				
				.kursfinder-loading {
					font-size: 0;
					line-height: 0;
					min-height: calc(24rem * var(--scaler));
					background-image: url("data:image/svg+xml;utf8,<svg fill='%23322183' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,19a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z' opacity='.25'/><path d='M10.14,1.16a11,11,0,0,0-9,8.92A1.59,1.59,0,0,0,2.46,12,1.52,1.52,0,0,0,4.11,10.7a8,8,0,0,1,6.66-6.61A1.42,1.42,0,0,0,12,2.69h0A1.57,1.57,0,0,0,10.14,1.16Z'><animateTransform attributeName='transform' type='rotate' dur='0.75s' values='0 12 12;360 12 12' repeatCount='indefinite'/></path></svg>");	
					background-repeat: no-repeat;
					background-size: calc(4rem * var(--scaler)) auto;
					background-position: center center;
				}
				
				.kursfinder-products {
					display: grid;
					grid-template-columns: repeat(3, 1fr);
					gap: calc(1rem * var(--scaler)) calc(1rem * var(--scaler));
					
					@media only screen and (max-width: 768px) {
						display: flex;
						gap: .875rem;
						overflow-x: auto;
						overflow-y: hidden;
						scroll-behavior: smooth;
						-ms-overflow-style: none;
						scrollbar-width: none;
						margin-right: calc(var(--sideSpacing) * -1);
						margin-left: calc(var(--sideSpacing) * -1);
						padding-right: var(--sideSpacing);	
					}
					
					.product__teaser {
						background-color: var(--colorWhite) !important;
					}
				}
			}
		}
		
		/*
		&[data-type]{
			display: none;
		}
		
		&[data-type="skischule"][data-step="0"]{
			display: block;
			
		}
		*/
	}
	
}

.kursfinder__wrapper .screen[data-type="bikeschule"] .screen__inner > .content .fields__wrapper .single__field input:checked + span:before {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='55' height='55' fill='none' viewBox='0 0 55 55'><rect width='55' height='55' fill='%23fff' rx='5' /><path fill='%231e6344' d='m48.2 15.376-4.63-4.581a2.69 2.69 0 0 0-3.816 0L21.595 28.86l-7.352-7.176a2.7 2.7 0 0 0-1.91-.798 2.68 2.68 0 0 0-1.911.798L5.79 26.352a2.734 2.734 0 0 0 0 3.849l13.821 14.002a2.7 2.7 0 0 0 1.91.797 2.68 2.68 0 0 0 1.911-.797L48.21 19.235A2.73 2.73 0 0 0 49 17.304a2.74 2.74 0 0 0-.8-1.928m-1.63 2.206L21.788 42.553a.385.385 0 0 1-.542 0L7.425 28.552a.39.39 0 0 1 0-.549l4.631-4.667a.385.385 0 0 1 .433-.082.4.4 0 0 1 .133.092l8.172 7.988a1.153 1.153 0 0 0 1.62 0L41.396 12.45a.39.39 0 0 1 .427-.088q.071.03.126.088l4.632 4.581a.39.39 0 0 1-.012.55'/></svg>");	
}

.kursfinder__wrapper .screen[data-type="bikeschule"] .screen__inner > .content .kursfinder__results .kursfinder-loading {
	background-image: url("data:image/svg+xml;utf8,<svg fill='%231e6344' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M12,1A11,11,0,1,0,23,12,11,11,0,0,0,12,1Zm0,19a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z' opacity='.25'/><path d='M10.14,1.16a11,11,0,0,0-9,8.92A1.59,1.59,0,0,0,2.46,12,1.52,1.52,0,0,0,4.11,10.7a8,8,0,0,1,6.66-6.61A1.42,1.42,0,0,0,12,2.69h0A1.57,1.57,0,0,0,10.14,1.16Z'><animateTransform attributeName='transform' type='rotate' dur='0.75s' values='0 12 12;360 12 12' repeatCount='indefinite'/></path></svg>");	
}

.section__direct-contact {
	.innerwrapper {
		display: flex;
		flex-direction: column;
		padding-top: 4rem;
		gap: 3.7rem 0;
		padding-bottom: 3.8rem;
		
		@media only screen and (max-width: 768px) {
			padding-top: 3rem;	
			gap: 3rem 0;
			padding-bottom: 2.6rem;
		}
		
		.content {
			text-align: center;
			font-size: var(--fontSize22);
			line-height: 1.18;
			
			h2 + p {
				margin-top: 1.5em;
				
				@media only screen and (max-width: 768px) {
					margin-top: 1.1em;
				}
			}
			
			p {
				max-width: 21em;
				margin-inline: auto;
			}
		}
		
		.contact__box {
			width: 100%;
			max-width: 26.5rem;
			margin-inline: auto;
			background-color: var(--colorBlueLight);
			display: flex;
			flex-direction: column;
			padding: 3.4rem 2rem 3.4rem 3rem;
			gap: 3.7rem 0;
			clip-path: polygon(50% 0, 0 14%, 0 86%, 50% 100%, 100% 86%, 100% 14%);
			
			@media only screen and (max-width: 768px) {
				max-width: 13rem;	
				padding: 2.1rem 1.2rem 2.1rem 1.2rem;
				gap: 0.7rem 0;
			}
			
			.single__row {
				display: grid;
				grid-template-columns: 1.3em 1fr;
				gap: 0 0.7em;
				font-size: var(--fontSize42);
				line-height: 1.09;
				font-family: "Eames Century Modern";
				font-weight: 400;
				color: var(--colorBlueDark);
				text-decoration: none;
				align-items: start;
				
				@media only screen and (max-width: 768px) {
					font-size: var(--fontSize21);
				}
				
				> svg {
					width: 100%;
					height: auto;
				}
			}
		}
	}
}

.glightbox-container {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999999 !important;
  overflow: hidden;
  -ms-touch-action: none;
  touch-action: none;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  outline: none;
}

.glightbox-container.inactive {
  display: none;
}

.glightbox-container .gcontainer {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 9999;
  overflow: hidden;
}

.glightbox-hidden {
	display: none !important;
}

.glightbox-container .gslider {
  -webkit-transition: -webkit-transform 0.4s ease;
  transition: -webkit-transform 0.4s ease;
  transition: transform 0.4s ease;
  transition: transform 0.4s ease, -webkit-transform 0.4s ease;
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
  position: relative;
  overflow: hidden;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.glightbox-container .gslide {
  width: 100%;
  position: absolute;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  opacity: 0;
}

.glightbox-container .gslide.current {
  opacity: 1;
  z-index: 99999;
  position: relative;
}

.glightbox-container .gslide.prev {
  opacity: 1;
  z-index: 9999;
}

.glightbox-container .gslide-inner-content {
  width: 100%;
}

.glightbox-container .ginner-container {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-width: 100%;
  margin: auto;
  height: 100vh;
}

.glightbox-container .ginner-container.gvideo-container {
  width: 100%;
}

.glightbox-container .ginner-container.desc-bottom,
		.glightbox-container .ginner-container.desc-top {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.glightbox-container .ginner-container.desc-left,
		.glightbox-container .ginner-container.desc-right {
  max-width: 100% !important;
}

.gslide iframe,
	.gslide video {
  outline: none !important;
  border: none;
  min-height: 165px;
  -webkit-overflow-scrolling: touch;
  -ms-touch-action: auto;
  touch-action: auto;
}

.gslide:not(.current) {
  pointer-events: none;
}

.gslide-image {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.gslide-image img {
  max-height: 100vh;
  display: block;
  padding: 0;
  float: none;
  outline: none;
  border: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  max-width: 100vw;
  width: auto;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  -ms-touch-action: none;
  touch-action: none;
  margin: auto;
  min-width: 200px;
}

.desc-top .gslide-image img,
		.desc-bottom .gslide-image img {
  width: auto;
}

.desc-left .gslide-image img,
		.desc-right .gslide-image img {
  width: auto;
  max-width: 100%;
}

.gslide-image img.zoomable {
  position: relative;
}

.gslide-image img.dragging {
  cursor: -webkit-grabbing !important;
  cursor: grabbing !important;
  -webkit-transition: none;
  transition: none;
}

.gslide-video {
  position: relative;
  max-width: 100vh;
  width: 100% !important;
}

.gslide-video .plyr__poster-enabled.plyr--loading .plyr__poster {
  display: none;
}

.gslide-video .gvideo-wrapper {
  width: 100%;
		/* max-width: 160vmin; */
  margin: auto;
}

.gslide-video::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(255, 0, 0, 0.34);
  display: none;
}

.gslide-video.playing::before {
  display: none;
}

.gslide-video.fullscreen {
  max-width: 100% !important;
  min-width: 100%;
  height: 75vh;
}

.gslide-video.fullscreen video {
  max-width: 100% !important;
  width: 100% !important;
}

.gslide-inline {
  background: #fff;
  text-align: left;
  max-height: calc(100vh - 40px);
  overflow: auto;
  max-width: 100%;
  margin: auto;
}

.gslide-inline .ginlined-content {
  padding: 20px;
  width: 100%;
}

.gslide-inline .dragging {
  cursor: -webkit-grabbing !important;
  cursor: grabbing !important;
  -webkit-transition: none;
  transition: none;
}

.ginlined-content {
  overflow: auto;
  display: block !important;
  opacity: 1;
}

.gslide-external {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  min-width: 100%;
  background: #fff;
  padding: 0;
  overflow: auto;
  max-height: 75vh;
  height: 100%;
}

.gslide-media {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: auto;
}

.zoomed .gslide-media {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.desc-top .gslide-media,
	.desc-bottom .gslide-media {
  margin: 0 auto;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.gslide-description {
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex: 1 0 100%;
  flex: 1 0 100%;
}

.gslide-description.description-left,
	.gslide-description.description-right {
  max-width: 100%;
}

.gslide-description.description-bottom,
	.gslide-description.description-top {
  margin: 0 auto;
  width: 100%;
}

.gslide-description p {
  margin-bottom: 12px;
}

.gslide-description p:last-child {
  margin-bottom: 0;
}

.zoomed .gslide-description {
  display: none;
}

.glightbox-button-hidden {
  display: none;
}


/*
 * Description for mobiles
 * something like facebook does the description
 * for the photos
*/

.glightbox-mobile .glightbox-container .gslide-description {
  height: auto !important;
  width: 100%;
  position: absolute;
  bottom: 0;
  padding: 19px 11px;
  max-width: 100vw !important;
  -webkit-box-ordinal-group: 3 !important;
  -ms-flex-order: 2 !important;
  order: 2 !important;
  max-height: 78vh;
  overflow: auto !important;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.75)));
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
  -webkit-transition: opacity 0.3s linear;
  transition: opacity 0.3s linear;
  padding-bottom: 50px;
}

.glightbox-mobile .glightbox-container .gslide-title {
  color: #fff;
  font-size: 1em;
}

.glightbox-mobile .glightbox-container .gslide-desc {
  color: #a1a1a1;
}

.glightbox-mobile .glightbox-container .gslide-desc a {
  color: #fff;
  font-weight: bold;
}

.glightbox-mobile .glightbox-container .gslide-desc * {
  color: inherit;
}

.glightbox-mobile .glightbox-container .gslide-desc .desc-more {
  color: #fff;
  opacity: 0.4;
}

.gdesc-open .gslide-media {
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
  opacity: 0.4;
}

.gdesc-open .gdesc-inner {
  padding-bottom: 30px;
}

.gdesc-closed .gslide-media {
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
  opacity: 1;
}

.greset {
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.gabsolute {
  position: absolute;
}

.grelative {
  position: relative;
}

.glightbox-desc {
  display: none !important;
}

.glightbox-open {
  overflow: hidden;
}

.gloader {
  height: 25px;
  width: 25px;
  -webkit-animation: lightboxLoader 0.8s infinite linear;
  animation: lightboxLoader 0.8s infinite linear;
  border: 2px solid #fff;
  border-right-color: transparent;
  border-radius: 50%;
  position: absolute;
  display: block;
  z-index: 9999;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 47%;
}

.goverlay {
  width: 100%;
  height: calc(100vh + 1px);
  position: fixed;
  top: -1px;
  left: 0;
  background: #000;
  will-change: opacity;
}

.glightbox-mobile .goverlay {
  background: #000;
}

.gprev,
.gnext,
.gclose {
  z-index: 99999;
  cursor: pointer;
  width: 26px;
  height: 44px;
  border: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.gprev svg,
.gnext svg,
.gclose svg {
  display: block;
  width: 25px;
  height: auto;
  margin: 0;
  padding: 0;
}

.gprev.disabled,
.gnext.disabled,
.gclose.disabled {
  opacity: 0.1;
}

.gprev .garrow,
.gnext .garrow,
.gclose .garrow {
  stroke: #fff;
}

.gbtn.focused {
  outline: 2px solid #0f3d81;
}

iframe.wait-autoplay {
  opacity: 0;
}

.glightbox-closing .gnext,
	.glightbox-closing .gprev,
	.glightbox-closing .gclose {
  opacity: 0 !important;
}


/*Skin */

.glightbox-clean .gslide-description {
  background: #fff;
}

.glightbox-clean .gdesc-inner {
  padding: 22px 20px;
}

.glightbox-clean .gslide-title {
  font-size: 1em;
  font-weight: normal;
  font-family: arial;
  color: #000;
  margin-bottom: 19px;
  line-height: 1.4em;
}

.glightbox-clean .gslide-desc {
  font-size: 0.86em;
  margin-bottom: 0;
  font-family: arial;
  line-height: 1.4em;
}

.glightbox-clean .gslide-video {
  background: #000;
}

.glightbox-clean .gprev,
	.glightbox-clean .gnext,
	.glightbox-clean .gclose {
  background-color: rgba(0, 0, 0, 0.75);
  border-radius: 4px;
}

.glightbox-clean .gprev path,
.glightbox-clean .gnext path,
.glightbox-clean .gclose path {
  fill: #fff;
}

.glightbox-clean .gprev {
  position: absolute;
  top: -100%;
  left: 30px;
  width: 40px;
  height: 50px;
}

.glightbox-clean .gnext {
  position: absolute;
  top: -100%;
  right: 30px;
  width: 40px;
  height: 50px;
}

.glightbox-clean .gclose {
  width: 35px;
  height: 35px;
  top: 15px;
  right: 10px;
  position: absolute;
}

.glightbox-clean .gclose svg {
  width: 18px;
  height: auto;
}

.glightbox-clean .gclose:hover {
  opacity: 1;
}


/*CSS Animations*/

.gfadeIn {
  -webkit-animation: gfadeIn 0.5s ease;
  animation: gfadeIn 0.5s ease;
}

.gfadeOut {
  -webkit-animation: gfadeOut 0.5s ease;
  animation: gfadeOut 0.5s ease;
}

.gslideOutLeft {
  -webkit-animation: gslideOutLeft 0.3s ease;
  animation: gslideOutLeft 0.3s ease;
}

.gslideInLeft {
  -webkit-animation: gslideInLeft 0.3s ease;
  animation: gslideInLeft 0.3s ease;
}

.gslideOutRight {
  -webkit-animation: gslideOutRight 0.3s ease;
  animation: gslideOutRight 0.3s ease;
}

.gslideInRight {
  -webkit-animation: gslideInRight 0.3s ease;
  animation: gslideInRight 0.3s ease;
}

.gzoomIn {
  -webkit-animation: gzoomIn 0.5s ease;
  animation: gzoomIn 0.5s ease;
}

.gzoomOut {
  -webkit-animation: gzoomOut 0.5s ease;
  animation: gzoomOut 0.5s ease;
}

@-webkit-keyframes lightboxLoader {
  0% {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}

@keyframes lightboxLoader {
  0% {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}

@-webkit-keyframes gfadeIn {
  from {
	opacity: 0;
  }
  to {
	opacity: 1;
  }
}

@keyframes gfadeIn {
  from {
	opacity: 0;
  }
  to {
	opacity: 1;
  }
}

@-webkit-keyframes gfadeOut {
  from {
	opacity: 1;
  }
  to {
	opacity: 0;
  }
}

@keyframes gfadeOut {
  from {
	opacity: 1;
  }
  to {
	opacity: 0;
  }
}

@-webkit-keyframes gslideInLeft {
  from {
	opacity: 0;
	-webkit-transform: translate3d(-60%, 0, 0);
	transform: translate3d(-60%, 0, 0);
  }
  to {
	visibility: visible;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	opacity: 1;
  }
}

@keyframes gslideInLeft {
  from {
	opacity: 0;
	-webkit-transform: translate3d(-60%, 0, 0);
	transform: translate3d(-60%, 0, 0);
  }
  to {
	visibility: visible;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	opacity: 1;
  }
}

@-webkit-keyframes gslideOutLeft {
  from {
	opacity: 1;
	visibility: visible;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
  }
  to {
	-webkit-transform: translate3d(-60%, 0, 0);
	transform: translate3d(-60%, 0, 0);
	opacity: 0;
	visibility: hidden;
  }
}

@keyframes gslideOutLeft {
  from {
	opacity: 1;
	visibility: visible;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
  }
  to {
	-webkit-transform: translate3d(-60%, 0, 0);
	transform: translate3d(-60%, 0, 0);
	opacity: 0;
	visibility: hidden;
  }
}

@-webkit-keyframes gslideInRight {
  from {
	opacity: 0;
	visibility: visible;
	-webkit-transform: translate3d(60%, 0, 0);
	transform: translate3d(60%, 0, 0);
  }
  to {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	opacity: 1;
  }
}

@keyframes gslideInRight {
  from {
	opacity: 0;
	visibility: visible;
	-webkit-transform: translate3d(60%, 0, 0);
	transform: translate3d(60%, 0, 0);
  }
  to {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	opacity: 1;
  }
}

@-webkit-keyframes gslideOutRight {
  from {
	opacity: 1;
	visibility: visible;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
  }
  to {
	-webkit-transform: translate3d(60%, 0, 0);
	transform: translate3d(60%, 0, 0);
	opacity: 0;
  }
}

@keyframes gslideOutRight {
  from {
	opacity: 1;
	visibility: visible;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
  }
  to {
	-webkit-transform: translate3d(60%, 0, 0);
	transform: translate3d(60%, 0, 0);
	opacity: 0;
  }
}

@-webkit-keyframes gzoomIn {
  from {
	opacity: 0;
	-webkit-transform: scale3d(0.3, 0.3, 0.3);
	transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
	opacity: 1;
  }
}

@keyframes gzoomIn {
  from {
	opacity: 0;
	-webkit-transform: scale3d(0.3, 0.3, 0.3);
	transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
	opacity: 1;
  }
}

@-webkit-keyframes gzoomOut {
  from {
	opacity: 1;
  }
  50% {
	opacity: 0;
	-webkit-transform: scale3d(0.3, 0.3, 0.3);
	transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
	opacity: 0;
  }
}

@keyframes gzoomOut {
  from {
	opacity: 1;
  }
  50% {
	opacity: 0;
	-webkit-transform: scale3d(0.3, 0.3, 0.3);
	transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
	opacity: 0;
  }
}

@media (min-width: 769px) {
  .glightbox-container .ginner-container {
	width: auto;
	height: auto;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
  }
  .glightbox-container .ginner-container.desc-top .gslide-description {
	-webkit-box-ordinal-group: 1;
	-ms-flex-order: 0;
	order: 0;
  }
  .glightbox-container .ginner-container.desc-top .gslide-image,
				.glightbox-container .ginner-container.desc-top .gslide-image img {
	-webkit-box-ordinal-group: 2;
	-ms-flex-order: 1;
	order: 1;
  }
  .glightbox-container .ginner-container.desc-left .gslide-description {
	-webkit-box-ordinal-group: 1;
	-ms-flex-order: 0;
	order: 0;
  }
  .glightbox-container .ginner-container.desc-left .gslide-image {
	-webkit-box-ordinal-group: 2;
	-ms-flex-order: 1;
	order: 1;
  }
  .gslide-image img {
	max-height: 97vh;
	max-width: 100%;
  }
  .gslide-image img.zoomable {
	cursor: -webkit-zoom-in;
	cursor: zoom-in;
  }
  .zoomed .gslide-image img.zoomable {
	cursor: -webkit-grab;
	cursor: grab;
  }
  .gslide-inline {
	max-height: 95vh;
  }
  .gslide-external {
	max-height: 100vh;
  }
  .gslide-description.description-left,
	.gslide-description.description-right {
	max-width: 275px;
  }
  .glightbox-open {
	height: auto;
  }
  .goverlay {
	background: rgba(0, 0, 0, 0.92);
  }
  .glightbox-clean .gslide-media {
	-webkit-box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.65);
	box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.65);
  }
  .glightbox-clean .description-left .gdesc-inner,
.glightbox-clean .description-right .gdesc-inner {
	position: absolute;
	height: 100%;
	overflow-y: auto;
  }
  .glightbox-clean .gprev,
	.glightbox-clean .gnext,
	.glightbox-clean .gclose {
	background-color: rgba(0, 0, 0, 0.32);
  }
  .glightbox-clean .gprev:hover,
.glightbox-clean .gnext:hover,
.glightbox-clean .gclose:hover {
	background-color: rgba(0, 0, 0, 0.7);
  }
  .glightbox-clean .gprev {
	top: 45%;
  }
  .glightbox-clean .gnext {
	top: 45%;
  }
}

@media (min-width: 992px) {
  .glightbox-clean .gclose {
	opacity: 0.7;
	right: 20px;
  }
}

@media screen and (max-height: 420px) {
  .goverlay {
	background: #000;
  }
}