

/* ############################################################
	FARBKLIMA
###############################################################
	
	1 Rot				#e30031 - rgba(227,0,49,1)
	  Weiss				#ffffff - rgba(255,255,255,1)
	  Schwarz			#000000 - rgba(0,0,0,1)
	
###############################################################
	ALLGEMEINES
############################################################ */

/* Resets */
* {
	margin: 0;
	padding: 0;
	outline: none;
}
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
img, table, tr, td {
	border: 0;
}


/* Variablen definieren */
:root {
	--main-color-1: #e30031;
	--main-color-white: #ffffff;
	--main-color-black: #000000;
	--main-color-black-30: rgba(0,0,0,0.3);
	--main-color-error: #eb4462;
	--main-color-successful: #4fa158;
	--ph-color: var(--main-color-1);
	--gap: 10px;
	--cubic-bezier: cubic-bezier(0.41,0,0.51,1) 0s;
	--cubic-bezier-explosiv: cubic-bezier(0.22, 1, 0.36, 1) 0s;
}
@media (min-width: 1024px) {
	:root {
		--gap: 17px;
	}
}


/* Allgemeines */
a, a:focus {
	outline: none;
}
/*header img, */main img {
	display: inline-block;
	max-width: 100%;
	height: auto;
	-ms-interpolation-mode: bicubic;
	image-rendering: optimizeQuality;
}
html, body {
	font-size: 100%;
	height: 100%;
}
html {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
body {
 	/*z-index: 0;*/
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
	background-color: var(--main-color-1);
}
body.blocked {
	overflow: hidden;
}
.hide {
	display: none !important;
}
.show {
	display: block !important;
}


/* Effekt: FadeIn / Lightning */
body:not(.cms-active) header, body:not(.cms-active) main, body:not(.cms-active) footer {
	opacity: 0;
}


/* Page-Loader */
#load-cover-spin {
	position: fixed;
	width: 100%;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.5);
	z-index: 9999;
	display: none;
}
	#load-cover-spin > .spin-wrapper {
		display: inline-block;
		position: absolute;
		top: calc(50% - (max(60px, 5.2083vw) / 2));
		left: calc(50% - (max(60px, 5.2083vw) / 2));
		width: max(60px, 5.2083vw);
		height: max(60px, 5.2083vw);
		overflow: hidden;
	}
		#load-cover-spin > .spin-wrapper svg {
			display: block;
			fill: var(--main-color-1);
			transform-origin: center center;
			transform: scale(1.15);
			animation: crazy-spinner 1.1s var(--cubic-bezier-explosiv) infinite;
		}
@keyframes crazy-spinner {
	0%   { transform: rotate(0deg) scale(1.15); }
	18%  { transform: rotate(-8deg) scale(1.15); }
	34%  { transform: rotate(6deg) scale(1.15); }
	52%  { transform: rotate(-5deg) scale(1.15); }
	73%  { transform: rotate(2deg) scale(1.15); }
	100% { transform: rotate(0deg) scale(1.15); }
}


/* Farben */
.color-black-30 {
	color: var(--main-color-black-30);
}


/* Show/Hide */
.show-mobile-inline {
	display: inline;
}
.show-desktop-inline {
	display: none;
}
@media (min-width: 1024px) {
	.show-mobile-inline {
		display: none;
	}
	.show-desktop-inline {
		display: inline;
	}
}


/* ############################################################
	SCHRIFTEN / TEXTE / ABSÄTZE / TITEL
############################################################ */

/* Allgemeines */
body {
	font-family: "Google Sans";
	font-style: normal;
	font-weight: 500;
	color: var(--main-color-black);
	font-size: max(20px, 1.5625vw); /* 20px (Mobile), 1.5625vw (Desktop: 100vw / 1920px * 30px) */
	line-height: 1.25;
	letter-spacing: min(-0.1px, -0.0078125vw);
}
footer {
	font-size: max(14px, 1.04167vw);
	line-height: 1.25;
	letter-spacing: min(-0.07px, -0.0052083vw);
}


/* Schnitte */
.font-space-grotesk {
	font-family: "Space Grotesk";
	font-style: normal;
	font-weight: 400;
}
b, strong, .bold {
	font-style: normal;
	font-weight: 700;
}


/* Titel, Schriftgrössen */
h1, h2, h3, h4, .h2-modultitel {
	position: relative;
	margin: 0;
	padding: 0;
	font-family: "Google Sans";
	font-style: normal;
	font-weight: 700;
	letter-spacing: normal;
	color: inherit;
}
h1, h2 {
	margin-bottom: max(40px, 6.25vw);
	text-transform: lowercase;
	font-size: max(40px, 6.25vw);
	line-height: 1.0;
	letter-spacing: min(-1.2px, -0.1875vw);
}
h2.modultitel {
	display: flex;
	align-items: center;
	width: 100%;
	margin-bottom: max(10px, 1.5625vw);
	gap: 0 1.8229167vw;
}
	h2.modultitel span.first, h2.modultitel span.last {
		flex: 0 0 auto;
	}
	h2.modultitel span.arrow-ui {
		display: flex;
		align-items: center;
		flex: 1 1 auto; /* Linie wächst und schrumpft */
		min-width: 0; /* nur diese Länge ändert sich */
	}
		h2.modultitel .arrow-ui__line {
			flex: 1 1 auto; /* Linie wächst und schrumpft */
			min-width: 0; /* nur diese Länge ändert sich */
			height: max(3.8467px, 0.60104167vw); /* 11.54px */
			background: #000;
		}
		h2.modultitel .arrow-ui__head {
			width: max(14.51px, 2.2671875vw); /* 43.53px */
			height: max(29.0767px, 4.543229164vw); /* 87.23px */
			display: block;
			flex: 0 0 max(14.51px, 2.2671875vw); /* 43.53px */
			margin-left: -0.5px;
		}
			h2.modultitel .arrow-ui__head path {
				fill: #000;
			}
		h2.modultitel span.last img {
			position: relative;
			width: max(28px, 4.48802083vw);
			height: auto;
		}
h3 {
	font-size: max(20px, 1.5625vw);
	line-height: 1.25;
	letter-spacing: min(-0.1px, -0.0078125vw);
}
h3:not(.font-size-small) {
	margin-bottom: max(25px, 1.927083333333333vw);
}
h3.line {
	padding-bottom: max(9px, 0.46875vw);
	border-bottom: 1px solid var(--main-color-black);
}
footer h3.line {
	margin-bottom: max(9px, 0.46875vw);
}
.font-size-medium {
	font-size: max(14px, 1.04167vw);
	line-height: 1.25;
	letter-spacing: min(-0.07px, -0.0052083vw);
}
.font-size-small {
	font-size: max(10px, 0.677vw);
	line-height: 1.0;
	letter-spacing: max(0.5px, 0.033854167vw);
}
.font-size-reset {
	font-size: 0;
	line-height: 0;
}


/* Absätze */
p + h2 {
	margin-top: 40px;
}
ul + h3, ul + p, p + ul {
	margin-top: max(25px, 1.927083333333333vw);
}
p {
	margin-bottom: max(25px, 1.927083333333333vw);
}
div > p:last-of-type, h3.nodistance-bottom, .nodistance-bottom {
	margin-bottom: 0;
}


/* Tab-Einrückung (text-indent) */
.indent-normal {
	text-indent: max(25.739%, 7.96875vw);
}


/* Elemente */
span.icon-dot::after, span.icon-arrow::after {
	content: "";
	display: inline-block;
	position: relative;
	width: max(15px, 1.14583vw);
	height: max(15px, 1.14583vw);
	margin-left: 1px;
	margin-right: 1px;
	background-image: url("../Images/Elemente/Icon_Dot.svg");
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 100%;
}
.color-black-30 > span.icon-dot::after {
	background-image: url("../Images/Elemente/Icon_Dot_30.svg");
}
span.icon-arrow::after {
	width: max(14px, 1.09375vw);
	height: max(16px, 1.25vw);
	background-image: url("../Images/Elemente/Icon_Arrow.svg");
}
.color-black-30 > span.icon-arrow::after {
	background-image: url("../Images/Elemente/Icon_Arrow_30.svg");
}
.font-size-medium span.icon-dot::after {
	width: max(11px, 0.78125vw);
	height: max(11px, 0.78125vw);
}
.font-size-medium span.icon-arrow::after {
	width: max(10px, 0.729167vw);
	height: max(12px, 0.833vw);
}
@media (min-width: 1024px) {
	a span.icon-arrow::after {
		transition: background 300ms var(--cubic-bezier);
	}
	a:hover span.icon-arrow::after {
		background-image: url("../Images/Elemente/Icon_Arrow_Weiss.svg");
	}
}


/* Lange Sätze abschneiden */
.text-overflow-ellipsis {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* Zeichen */
.text-uppercase {
	text-transform: uppercase;
}
.text-lowercase {
	text-transform: lowercase;
}


/* Silbentrennung */
.silbentrennung {
	hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphenate-limit-chars: auto 3; /* wirkt in Chrome/Edge/Firefox, Safari ignoriert */
	/* Safari/iOS Safari Fallback (non-standard) */
	-webkit-hyphenate-limit-before: 3;
	-webkit-hyphenate-limit-after: 3;
	-webkit-hyphenate-limit-lines: 3;
}


/* ############################################################
	HYPERLINKS
############################################################ */

/* Allgemeines */
a {
	position: relative;
	text-decoration: none;
	text-decoration-color: transparent;
}
a.underline {
	text-decoration: underline;
}
a, a:hover {
	color: var(--main-color-black);
}
@media (min-width: 1024px) {
	a.underline, footer a:not(.komplizen-email) {
		transition: text-decoration 300ms var(--cubic-bezier);
	}
	a.underline:hover, footer a:not(.komplizen-email):hover {
		text-decoration: underline;
		text-decoration-color: var(--main-color-white);
	}
	footer a:not(.komplizen-email):hover {
		text-underline-offset: 2px;
	}
}


/* Link: E-Mail */
a.komplizen-email {
	display: inline-block;
	font-weight: 700;
	font-size: max(20px, 3.125vw);
	line-height: 1.25;
	letter-spacing: min(-0.4px, -0.0625vw);
}
a.komplizen-email .email-arrow {
	display: inline-block;
	width: max(14px, 2.1875vw);
	height: max(16px, 2.4479167vw);
	margin-right: max(6px, 1.041666666666667vw);
	vertical-align: baseline;
	background-image: url("../Images/Elemente/Icon_Email.svg");
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% 100%;
}
@media (min-width: 1024px) {
	a.komplizen-email::after {
		content: "";
		pointer-events: none;
		position: absolute;
		top: max(25px, 2.34375vw);
		left: max(44px, 4.375vw);
		width: max(250px, 24.427083vw);
		height: max(15px, 1.40625vw);
		background-image: url("../Images/Elemente/Link_Element_Email.svg");
		background-repeat: no-repeat;
		background-position: 0 0;
		background-size: 100% 100%;
		clip-path: inset(0 100% 0 0);
		transition: clip-path 700ms var(--cubic-bezier-explosiv);
	}
	a.komplizen-email:hover::after {
		clip-path: inset(0 0 0 0);
	}
}


/* Link: Bandmitglieder */
.hover-preview-link {
	cursor: pointer;
}
.hover-preview-box {
	position: fixed;
	left: 0;
	top: 0;
	width: max(200px, 15.10416666666667vw);
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transform: translate3d(0, 0, 0);
	transition: opacity 150ms ease, visibility 150ms ease;
	z-index: 2;
}
.hover-preview-box.is-visible {
	opacity: 1;
	visibility: visible;
}


/* Hover-Effekte */
.no-hover,
.no-hover:hover,
.no-link,
.no-link:hover {
	cursor: default;
	color: inherit;
	text-decoration: none;
}
.pointer {
	cursor: pointer;
}


/* Lange Hyperlinks */
@media (max-width: 767.98px) {
	main a {
		hyphens: auto;
		hyphenate-limit-chars: auto 3; /* wirkt in Chrome/Edge/Firefox, Safari ignoriert */
		/* Safari/iOS Safari Fallback (non-standard) */
		-webkit-hyphenate-limit-before: 3;
		-webkit-hyphenate-limit-after: 3;
		-webkit-hyphenate-limit-lines: 3;
	}
}


/* Anker */
a.nav-anchor {
	position: relative;
	visibility: hidden;
	display: block;
	width: 0;
	height: 0;
	font-size: 0;
	line-height: 0;
	scroll-margin-top: max(50px, 4.6875vw);
}
/* @media (min-width: 1280px) {
	a.nav-anchor {
		top: -193px !important;
	}
} */


/* ############################################################
	PANELS/BOXEN
############################################################ */

/* Allgemein */
header, main, footer,
.main-header, .main-content,
.header-box, .nav-box, .content-box, .footer-box,
.header-inline, .nav-inline, .content-inline, .footer-inline,
.mdl-container, .nav-line-1 {
	position: relative;
	width: 100%;
}
.header-box, .nav-box, .content-box, .footer-box {
	padding-right: 24px;
	padding-left: 24px;
}
.header-inline, .nav-inline, .content-inline, .footer-inline {
	margin: 0 auto;
}

/* Kopfzeile */
header {
	z-index: 10;
	position: fixed;
	top: 0;
	height: 50px;
	background-color: var(--main-color-1);
}
body[class^="cms-"] header {
	z-index: 210;
	top: 51px;
}
	.header-inline {
		height: 50px;
	}

/* Inhalt */
main {
	flex: 1 0 auto;
	padding-top: 50px;
}
body[class^="cms-"] main {
	padding-top: 101px;
}

/* Fusszeile */
footer {
	flex-shrink: 0;
	padding-top: px;
	padding-bottom: px;
}
	footer .footer-box.line-2 {
		padding-top: 10px;
	}
	footer .footer-box.line-3 {
		padding-top: max(35px, 8.333vw);
	}
	footer .footer-box.line-4 {
		padding-top: max(35px, 4.6875vw);
		padding-bottom: max(25px, 2.34375vw);
	}
@media (max-width: 1023.98px) {
	/* Fusszeile */
	footer .item-email {
		padding-top: 120px;
	}
}
@media (max-width: 767.98px) {
	/* Fusszeile */
	footer .item-kontoangaben {
		padding-bottom: 30px;
	}
}
@media (min-width: 1024px) {
	/* Allgemein */
	.header-box, .nav-box, .content-box, .footer-box {
		padding-left: 50px;
		padding-right: 50px;
	}

	/* Kopfzeile */
	header, .header-inline {
		height: 80px;
	}

	/* Inhalt */
	main {
		padding-top: 80px;
	}
	body[class^="cms-"] main {
		padding-top: 131px;
	}

	/* Fusszeile */
	footer .footer-box.line-2 {
		padding-top: max(0px, 3.125vw);
	}
}


/* ############################################################
	NAVIGATIONSBOXEN
############################################################ */

/* Navigation */
@media (max-width: 1023.98px) {
	.nav-desktop-bar {
		display: none;
	}
	/* Hamburger */
	.nav-button {
		cursor: pointer;
		display: block;
		position: absolute;
		top: 13px;
		right: 0;
		width: 31px;
		height: 24px;
		overflow: hidden;
	}
	body[class^="cms-"] .nav-button {
		z-index: 205;
	}
		.nav-button svg {
			display: block;
			width: 31px;
			height: 24px;
			fill: var(--main-color-black);
		}
	/* Navigationsbox */
	.nav-mobile-bar, .nav-mobile-bar.open {
		transition: top 400ms var(--cubic-bezier), visibility 400ms var(--cubic-bezier);
	}
	.nav-mobile-bar {
		z-index: 9;
		opacity: 0;
		position: fixed;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		top: -100vh;
		right: 0;
		width: 100%;
		height: auto;
		background-color: var(--main-color-1);
	}
	.nav-mobile-bar.open {
		opacity: 1;
		top: 50px;
	}
	body[class^="cms-"] .nav-mobile-bar {
		z-index: 209;
	}
	body[class^="cms-"] .nav-mobile-bar.open {
		top: 101px;
	}
		.nav-mobile-bar .nav-line-1 {
			flex-shrink: 0;
			height: auto;
			padding-top: 10px;
			padding-bottom: 15px;
		}
}
@media (min-width: 1024px) {
	/* Hamburger */
	.nav-button {
		display: none !important;
	}
	/* Navigationsbox */
	.nav-mobile-bar {
		display: none;
	}
	.nav-desktop-bar {
		position: absolute;
		top: 24px;
		right: 0;
		width: auto;
	}
}


/* ############################################################
	BILDER/ICONS
############################################################ */

/* Schriftzug (Header) */
header a.link-schriftzug {
	position: absolute;
	top: 9px;
	left: 0;
	font-size: 1.5rem; /* 24px */
	line-height: 1.25;
	letter-spacing: -0.24px;
	text-transform: lowercase;
}
@media (min-width: 1024px) {
	header a.link-schriftzug {
		top: 24px;
	}
	header a.link-schriftzug::after {
		content: "";
		pointer-events: none;
		position: absolute;
		top: 4px;
		left: 16px;
		width: 112px;
		height: 43px;
		background-image: url("../Images/Elemente/Nav_Element_Home.svg");
		background-repeat: no-repeat;
		background-position: 0 0;
		background-size: 100% 100%;
		clip-path: inset(0 100% 0 0);
		transition: clip-path 700ms var(--cubic-bezier-explosiv);
	}
	header a.link-schriftzug:hover::after {
		clip-path: inset(0 0 0 0);
	}
}


/* Logo (Footer) */
footer a.link-logo {
	display: inline-block;
	width: max(60px, 5.2083vw);
	height: max(60px, 5.2083vw);
	overflow: hidden;
}
	footer a.link-logo img {
		display: block;
		transform-origin: center center;
		transform: scale(1.15);
	}
@media (min-width: 1024px) {
	footer a.link-logo:hover img {
		animation: crazy-tilt 1.1s var(--cubic-bezier-explosiv) infinite;
	}
}
@keyframes crazy-tilt {
	0%   { transform: rotate(0deg) scale(1.15); }
	18%  { transform: rotate(-8deg) scale(1.15); }
	34%  { transform: rotate(6deg) scale(1.15); }
	52%  { transform: rotate(-5deg) scale(1.15); }
	73%  { transform: rotate(2deg) scale(1.15); }
	100% { transform: rotate(0deg) scale(1.15); }
}


/* ############################################################
	MODULE/TEMPLATES
############################################################ */

/* Trennlinie */
.border-top {
	border-top: 1px solid var(--main-color-black) !important;
}
.border-abstand-medium {
	padding-top: max(30px, 4.427083vw);
}


/* Modulabstände: Vertikal */
.mdl-container.inner-abstand-top {
	margin-top: max(50px, 4.6875vw);
}
.mdl-container.inner-abstand-topbottom {
	margin-top: max(50px, 4.6875vw);
	margin-bottom: max(75px, 10.4167vw);
}
.mdl-container.inner-abstand-bottom {
	margin-bottom: max(75px, 10.4167vw);
}


/* Grid-Abstände */
@media (max-width: 1023.98px) {
	.mdl-container .grid > div + div {
		margin-top: max(50px, 4.6875vw);
	}
}


/* Animationstext */
.script-block {
	z-index: 5;
	display: inline-block;
	position: absolute;
	transform-origin: left top;
	transform: rotate(-12deg);
	width: auto;
	pointer-events: none;
}
	.write-text {
		display: inline-block;
		position: relative;
		white-space: normal;
		word-break: normal;
		overflow-wrap: normal;
		hyphens: none;
		font-family: "Infamous-Regular";
		font-size: max(40px, 4.6875vw);
		line-height: max(34px, 4.375vw);
		letter-spacing: normal;
		color: var(--main-color-white);
		text-transform: uppercase;
	}
	.write-text .word {
		display: inline-block;
		white-space: nowrap;
	}
	.write-text .space {
		display: inline;
		white-space: pre;
	}
	.write-text .char {
		display: inline-block;
		opacity: 0;
		transform: translateY(0.25em);
		will-change: opacity, transform, filter;
	}
	.write-text.is-visible .char {
		animation: writeChar 0.5s forwards;
	}
@keyframes writeChar {
	0% { opacity: 0; transform: translateY(0.25em); }
	60% { opacity: 1; transform: translateY(0); }
	100% { opacity: 1; transform: translateY(0); }
}

/* Textpositionen: */
.script-block.header-text {
	bottom: -140px;
	left: max(15px, 1.5625vw);
}
.script-block.content-text-1 {
	top: min(-20px, -4.6875vw);
	left: max(30px, 3.90625vw);
}
.script-block.content-text-2 {
	top: min(-50px, -4.6875vw);
	left: max(20px, 15.9375vw);
}
.script-block.content-text-3 {
	top: min(-43px, -6.25vw);
	left: max(20px, 2.604167vw);
}
.script-block.footer-text {
	top: 0;
	left: 0;
}
@media (min-width: 1024px) {
	.script-block.header-text {
		bottom: -4.167vw;
		left: max(15px, 1.5625vw);
	}
	.script-block.footer-text {
		top: min(-43px, -4.167vw);
		left: max(30px, 3.125vw);
	}
}


/* Template 1: 2 Textspalten (auto) über 12 Spalten */
.template-1 {
	position: relative;
	display: flex;
	width: 100%;
	container-type: inline-size;
}
	.template-1 .inline-item {
		width: 100%;
	}
@media (min-width: 1024px) {
	.template-1 .inline-item {
		--grid-col: 8.333333cqw; /* 1 von 12 Spalten der Containerbreite */
		width: calc((11 * var(--grid-col)) + var(--gap));
		column-count: 2;
		column-gap: calc(var(--gap) + var(--grid-col));
		column-fill: balance;
	}
		.template-1 .inline-item p {
			break-inside: avoid; /* Absatz möglichst nicht über Spalten splitten */
			orphans: 3; /* mind. 3 Zeilen am Spaltenende */
			widows: 3; /* mind. 3 Zeilen am Spaltenanfang */
		}
}


/* Video-Integration */
.embed-video-box {
	position: relative;
	overflow: hidden;
	max-width: 100%;
	height: 0;
	padding-bottom: 56.25%;
}
	.embed-video-box iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}


/* ############################################################
	LISTEN
############################################################ */

/* Aufzählungslisten */
.mdl-container ul:not([class^="cmsmodule-nav"]):not(.download-list) {
	list-style: none;
	position: relative;
	padding: 0;
}


/* - (&ndash;) */
.mdl-container ul:not([class^="cmsmodule-nav"]):not(.download-list) li {
	margin-left: 15px;
	padding-left: 0;
}
.mdl-container ul:not([class^="cmsmodule-nav"]):not(.download-list) {
	content: "\2013";
	position: absolute;
	margin-left: -15px;
}
@media (min-width: 768px) {
	.mdl-container ul:not([class^="cmsmodule-nav"]):not(.download-list) li {
		margin-left: 0;
	}
}
@media (min-width: 1280px) {
	.mdl-container ul:not([class^="cmsmodule-nav"]):not(.download-list) li:before {
		margin-left: -18px;
	}
}


/* Download-Liste */
ul.download-list {
	list-style: none;
}
	ul.download-list li {
		border-bottom: 1px solid var(--main-color-black);
	}
		ul.download-list li a {
			display: flex;
			justify-content: space-between;
			padding-top: max(5px, 0.364583vw);
			padding-bottom: max(4px, 0.3125vw);
		}
		ul.download-list li a::after {
			content: "\25BC";
			display: inline-block;
			position: relative;
		}
@media (min-width: 1024px) {
	ul.download-list li a::after {
		transition: color 300ms var(--cubic-bezier);
	}
	ul.download-list li a:hover::after {
		color: var(--main-color-white);
	}
}


/* ############################################################
	NAVIGATION
############################################################ */

/* Allgemeines */
ul.nav-mainmenu, ul.nav-mainmenu ul, ul.nav-mainmenu li,
ul.nav-secondmenu, ul.nav-secondmenu ul, ul.nav-secondmenu li,
ul.nav-thirdmenu, ul.nav-thirdmenu ul, ul.nav-thirdmenu li {
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.nav-mainmenu li, ul.nav-secondmenu li, ul.nav-thirdmenu li {
	position: relative;
}


/*
1st-Menu
*/
ul.nav-mainmenu {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	font-weight: 700;
	font-size: 2.5rem; /* 40px */
	line-height: 1.25;
	letter-spacing: -1.2px;
	text-align: center;
	text-transform: lowercase;
}
	.nav-mobile-bar ul.nav-mainmenu li:not(:last-child) {
		border-bottom: 1px var(--main-color-black) solid;
	}

/* Hyperlink (Mobile) */
.nav-mobile-bar ul.nav-mainmenu a {
	display: block;
	padding-top: 10px;
	padding-bottom: 15px;
}

/* Hyperlink: Alle */
ul.nav-mainmenu li > a, ul.nav-mainmenu li > a:hover {
	color: var(--main-color-black);
}
@media (min-width: 1024px) {
	ul.nav-mainmenu {
		flex-direction: row;
		width: auto;
		font-weight: 500;
		font-size: 1.5rem; /* 24px */
		letter-spacing: -0.24px;
		text-align: left;
	}
		ul.nav-mainmenu li:not(:first-child) {
			margin-left: 24px;
		}
	
	/* Hyperlinks */
	ul.nav-mainmenu li a::after {
		content: "";
		pointer-events: none;
		position: absolute;
		background-repeat: no-repeat;
		background-position: 0 0;
		background-size: 100% 100%;
		clip-path: inset(0 100% 0 0);
		transition: clip-path 700ms var(--cubic-bezier-explosiv);
	}
	ul.nav-mainmenu li a:hover::after {
		clip-path: inset(0 0 0 0);
	}
	ul.nav-mainmenu li:nth-child(1) a::after {
		top: 26px;
		left: -8px;
		width: 48px;
		height: 7px;
		background-image: url("../Images/Elemente/Nav_Element_1.svg");
	}
	ul.nav-mainmenu li:nth-child(2) a::after {
		top: 27px;
		left: -9px;
		width: 71px;
		height: 8px;
		background-image: url("../Images/Elemente/Nav_Element_2.svg");
	}
	ul.nav-mainmenu li:nth-child(3) a::after {
		top: 27px;
		left: -4px;
		width: 118px;
		height: 10px;
		background-image: url("../Images/Elemente/Nav_Element_3.svg");
	}
	ul.nav-mainmenu li:nth-child(4) a::after {
		top: 25px;
		left: -1px;
		width: 56px;
		height: 11px;
		background-image: url("../Images/Elemente/Nav_Element_4.svg");
	}
	ul.nav-mainmenu li:nth-child(5) a::after {
		top: 22px;
		left: -5px;
		width: 77px;
		height: 20px;
		background-image: url("../Images/Elemente/Nav_Element_5.svg");
	}
	ul.nav-mainmenu li:nth-child(6) a::after {
		top: 21px;
		left: -14px;
		width: 117px;
		height: 25px;
		background-image: url("../Images/Elemente/Nav_Element_6.svg");
	}
}


/*
2nd-/3rd-Menu
*/
ul.nav-secondmenu, ul.nav-thirdmenu {
	display: flex;
	flex-direction: column;
}

