/* ===== SCHRIFTEN ===== */

@font-face {
  font-family: 'SPD TheSans';
  src: url('/resources/ltw2026/SPD_TheSans_light.woff2') format('woff2');
  font-weight:  200;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-family: 'SPD TheSans';
  src: url('/resources/ltw2026/SPD_TheSans_regular.woff2') format('woff2');
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-family: 'SPD TheSans';
  src: url('/resources/ltw2026/SPD_TheSans_bold.woff2') format('woff2');
  font-weight:  700;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-family: 'SPD TheSans Versal';
  src: url('/resources/ltw2026/SPD_TheSans_V_bold.woff2') format('woff2');
  font-weight:  700;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-family: 'SPD TheSans Versal';
  src: url('/resources/ltw2026/SPD_TheSans_V_extrabold.woff2') format('woff2');
  font-weight:  900;
  font-style:   normal;
  font-stretch: normal;
}



/* ===== ALLGEMEIN ===== */

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	font-family: 'SPD TheSans', sans-serif;
	background: none;
	height: 100%;
	position: relative;
	overflow-x: hidden;
}

p, ul {
	font-size: 15pt;
	margin-bottom: 0.5em;
	line-height: 1.4em;
	color: #000000;
}

a:link, a:active, a:visited, a:hover {
	font-size: 15pt;
	color: #E3000F;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

@media screen and (max-width: 1500px) {
	p, a, a:link, a:active, a:visited, a:hover, ul  {
		font-size: 12pt;
	}
}

b, strong {
	font-weight: bold;
}

i, em {
	font-style: italic;
}

sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

h1 {
	font-family: 'SPD TheSans Versal';
	font-size: 60pt;
	font-weight: 900;
	color: #ffffff;
	z-index: 1;
	display: inline-block;
	margin-bottom: 0.5em;
}

h1 span {
	line-height: 60pt;
	background-color: #000000;
	display: inline;
	padding: 0 0.15em;
}

h2 {
	font-family: 'SPD TheSans Versal';
	font-size: 30pt;
	font-weight: 900;
	color: #ffffff;
	margin-bottom: 0.5em;
	display: inline-block;
}

h2 span {
	line-height: 1.4em;
	background: #E3000F;
	display: inline;
	padding: 0 0.15em;
}

h2.black span {
	background: #000000;
}

h3 {
	font-family: 'SPD TheSans';
	font-size: 20pt;
	font-weight: bold;
	color: #E3000F;
	margin: 0.5em 0 0.25em;
	line-height: 1.4em;
}

h4 {
	font-family: 'SPD TheSans';
	font-size: 15pt;
	font-weight: bold;
	color: #E3000F;
	margin: 0.5em 0 0.25em;
	line-height: 1.4em;
}

h5 {
	font-size: 12pt;
	color: #555555;
	margin: 0;
}

@media screen and (max-width: 1500px) {
	h2 {font-size: 27pt;}
	h2 {font-size: 18pt;}
	h3 {font-size: 12pt;}
	h4 {font-size: 12pt;}
	h5 {font-size: 10pt;}
}

@media screen and (max-width: 768px) {	
	h1 {font-size: 40pt; line-height: 40pt; margin-bottom: 0; width: 100%;}
	h1 span {background-color: unset;line-height: 40pt; padding: 0;}
}

ul {
	list-style-type: none;
	list-style-position: inside;
}

ol {
	list-style-type: decimal;
	list-style-position: inside;
}

li  {
	position:relative;
	margin-left: 1em;
	line-height: 1.25em;
}

li:before  {
	content: "\2022";
	line-height: 0;
	position: absolute;
	top: 0.625em;
	left: -1em;
}

img {
	max-width: 100%;
}

label {
	font-size: 14pt;
	margin-bottom: 0.5em;
	line-height: 1.25em;
	color: #000000;
}

figcaption {
	position: absolute;
	top: 10px;
	right: 10px;
	color: white;
	font-size: 8pt;
	z-index: 10;
}

.br-mobile {display: none;}
@media screen and (max-width: 768px) {
	.br-mobile {display: initial;}
	.br-desktop {display: none;}
}
.embeddedcontent {
	max-height: 50vh;
	overflow-y: scroll;
	margin-top: 3em;
}
@media screen and (max-width: 768px) {.embeddedcontent {max-height: unset; overflow-y: initial;}}



/* ===== HEADER ====== */

.header-bg {
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	z-index: -10;
}

.header-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.portrait {
	height: 100%;
	width: 50%;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}

.portrait img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top
}

.header-text {
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	padding: 40px 80px 40px 0;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	text-align: left;
}

.header-text .name {
	margin-bottom: 1em;
}

.header-text .name span {
	font-size: 40pt;
	line-height: 40pt;
	font-weight: bold;
	color: black;
	background-color: #ffffff;
	display: inline-block;
	padding: 0 0.1em;
	display: inline;
}

.header-text div.subheading {
	width: 100%;
	color: #ffffff;
	font-weight: bold;
}

.header-text div.subheading p {
	color: #ffffff;
	font-size: 26pt;
}

.header-logo {
	z-index: 10;
	width: 10vw;
	position: absolute;
	bottom: 40px;
	left: 50%;
}

.header-logo img {
	height: 100%;
}

@media screen and (max-width: 1000px) {	
	.header-text div.subheading p {
		font-size: 20pt;
	}
}

@media screen and (max-width: 768px) {
	.portrait {
		width: 100%;
		height: 100%;
		left: 0;
	}
	
	.portrait img {
		position: relative;
		width: 150%;
		max-width: unset;
		transform: translate(-50%,-20%);
		top: 30%;
		left: 50%;
	}
	
	.header-text {
		width: 100%;
		height: 100%;
		padding: 10vh 0 15vh;
		display: flex;
		align-content: space-between;
		text-align: center;
	}
	
	.header-text .name {
		text-align: center;
		width: 100%;
	}
	
	.header-text .name span {
		font-size: 25pt;
		line-height: 37.5pt;
	}
	
	.subheading {
		display: none;
	}
	
	.header-logo {
		width: 30vw;
		max-width: 130px;
		transform: translateX(-50%);
	}
}



/* ===== RASTER ===== */

.container {width: 100%; display: flex; justify-content: center;}
.row {width: 100%; max-width: 1080px; text-align: left; display: flex; justify-content: space-between; align-items: stretch;}

.grid_col {padding: 0; float: left;}

.col_100_1 {width: 100%}

.col_50-50_1 {width: calc(((100% - 4em) / 2) + 2em); padding-right: 2em;}
.col_50-50_2 {width: calc(((100% - 4em) / 2) + 2em); padding-left: 2em;}

.col_33-33-33_1 {width: calc(((100% - 8em) / 3) + 2em); padding-right: 2em;}
.col_33-33-33_2 {width: calc(((100% - 8em) / 3) + 4em); padding-left: 2em; padding-right: 2em;}
.col_33-33-33_3 {width: calc(((100% - 8em) / 3) + 2em); padding-left: 2em;}

.col_25-25-25-25_1 {width: calc(((100% - 12em) / 4) + 2em); padding-right: 2em;}
.col_25-25-25-25_2 {width: calc(((100% - 12em) / 4) + 4em); padding-left: 2em; padding-right: 2em;}
.col_25-25-25-25_3 {width: calc(((100% - 12em) / 4) + 4em); padding-left: 2em; padding-right: 2em;}
.col_25-25-25-25_4 {width: calc(((100% - 12em) / 4) + 2em); padding-left: 2em;}

.col_75-25_1 {width: calc(((100% - 4em) * (3 / 4)) + 2em); padding-right: 2em;}
.col_75-25_2 {width: calc(((100% - 4em) / 4) + 2em); padding-left: 2em;}

.col_25-75_1 {width: calc(((100% - 4em) / 4) + 2em); padding-right: 2em;}
.col_25-75_2 {width: calc(((100% - 4em) * (3 / 4)) + 2em); padding-left: 2em;}

.col_50-25-25_1 {width: calc(((100% - 8em) / 2) + 2em); padding-right: 2em;}
.col_50-25-25_2 {width: calc(((100% - 8em) / 4) + 4em); padding-left: 2em; padding-right: 2em;}
.col_50-25-25_3 {width: calc(((100% - 8em) / 4) + 2em); padding-left: 2em;}

.col_25-50-25_1 {width: calc(((100% - 8em) / 4) + 2em); padding-right: 2em;}
.col_25-50-25_2 {width: calc(((100% - 8em) / 2) + 4em); padding-left: 2em; padding-right: 2em;}
.col_25-50-25_3 {width: calc(((100% - 8em) / 4) + 2em); padding-left: 2em;}

.col_25-25-50_1 {width: calc(((100% - 8em) / 4) + 2em); padding-right: 2em;}
.col_25-25-50_2 {width: calc(((100% - 8em) / 4) + 4em); padding-left: 2em; padding-right: 2em;}
.col_25-25-50_3 {width: calc(((100% - 8em) / 2) + 2em); padding-left: 2em;}

.col_66-33_1 {width: calc(((100% - 4em) * (2 / 3)) + 2em); padding-right: 2em;}
.col_66-33_2 {width: calc(((100% - 4em) / 3) + 2em); padding-left: 2em;}

.col_33-66_1 {width: calc(((100% - 4em) / 3) + 2em); padding-right: 2em;}
.col_33-66_2 {width: calc(((100% - 4em) * (2 / 3)) + 2em); padding-left: 2em;}

@media screen and (max-width: 768px) {
	.row {
		flex-wrap: wrap;
	}
	.grid_col {
		width: 100% !important;
		padding: 0 !important;
		margin-bottom: 1em;
	}
	
	.col_25-25-25-25_1, .col_25-25-25-25_3 {
		width: calc(50% - 2em) !important;
		margin-right: 1em;
	} 
	
	.col_25-25-25-25_2, .col_25-25-25-25_4 {
		width: calc(50% - 2em) !important;
		margin-left: 1em;
	}
}



/* ===== TEXT/BILD ===== */

.ueberschrift {margin-bottom: 15pt;}
.text {width: 100%;}
.image {width: 100%; height: 100%; overflow: hidden; position: relative; }
.pic-minheight .image {min-height: calc((540px - 2em) * (3 / 4));}
.image img {position: absolute; top: 50%; left: 50%; max-width: none; min-width: 100%; object-fit: cover; min-height: 100%;}

@media screen and (min-width: 768.01px) {
	.nopicresize {max-height: 80vh; text-align: center;}
	.nopicresize img {height: unset !important; min-height: unset; max-height: 100%; width: unset !important; min-width: unset; max-width: 100%; transform: none !important; position: initial !important; top: 50%;}
}

@media screen and (max-width: 768px) { 
	.image {min-height: 30vh;}
	.mobile-flex-1 {order: 1;}
	.mobile-flex-2 {order: 2;}
	.nopicresize img {transform: translate(-50.0%,-33.333%) !important}
}



/* ===== FULLPAGE ===== */
.section {z-index: 0;}
#fp-nav {position: fixed; z-index: 100; top: 50%; opacity: 1; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translate3d(0,-50%,0); pointer-events: none;}
#fp-nav ul li:before, .fp-slidesNav ul li:before {display: none;}
#fp-nav ul li a span, .fp-slidesNav ul li a span {background: #E3000F !important;}
.fp-slidesNav ul {text-align:center;}
.fp-controlArrow.fp-prev, .fp-controlArrow.fp-next {border: none !important;height:4em;width:4em !important;}
.fp-controlArrow.fp-prev {background-image: url('/resources/ltw2026/arrow-left.svg');background-size: contain;background-repeat: no-repeat;background-position: center;}
.fp-controlArrow.fp-next {background-image: url('/resources/ltw2026/arrow-right.svg');background-size: contain;background-repeat: no-repeat;background-position: center;}
.fp-tableCell {padding: 8em 5em 3em; text-align: center;}
.fp-tableCell .container, .fp-tableCell .row {display: inline-flex;}
@media screen and (max-width: 768px) {
	.fp-tableCell {padding: 3em 2em;}
	.fp-slides {padding: 0 2em;}
	.fp-controlArrow.fp-next {right: 0.75em; height: 2em !important; width: 2em !important;}
	.fp-controlArrow.fp-prev {left: 0.75em; height: 2em !important; width: 2em !important;}
}


/* ===== MENÜ ===== */
#menu {position: fixed; top: 40px; right: 50%; transform: translateX(100%); background: rgba(255, 255, 255, 0.7); box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); z-index: 100; transition: all 0.5s ease;}
#menu li {display: inline-block; font-family: 'SPD TheSans Versal'; font-weight: 900; margin: 0; padding: 0.5em 2em; transition: all 0.2s ease;}
#menu li {color: #000000 !important;}
#menu a:hover li {text-decoration: none !important;}
#menu li:before {display: none;}
#menu li.active {background: #000000;}
#menu li.active {color: #ffffff !important;}
#menu li:hover {background: #E3000F;}
#menu li.active:hover {background: #444444 !important;}
#menu li:hover {color: #ffffff !important;}
#fp-nav li {z-index: 100;}
@media screen and (max-width: 1100px) {
	.hamburger {display: block !important;}
	#menu {width: 0; top: 0; right: 0; height: 100vh; display: flex; transform: unset; overflow: hidden; flex-wrap: wrap; align-content: flex-start; padding-top: 5em; transition: all 0.2s ease;}
	#menu a {width: 100%; height: 30pt;}
	#menu li.active {background: none;}
	#menu a li,#menu a:hover li {font-size: 15pt; line-height: 15pt; padding: 7.5pt; color: #000000 !important;}
	#menu a li.active, a:hover #menu li.active {color: #000000 !important;}
	#menu li:hover {background: none;}
	#menu li:hover a {color: #000000 !important;}
}
.hamburger-inner, .hamburger-inner:before, .hamburger-inner:after {background-color: #ffffff; transition: all 0.2s ease;}
.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner:before, .hamburger.is-active .hamburger-inner:after {background-color: #000000;}