/* main heading styling */

::selection {
    background: #ffb446;
    color: #000;
    text-shadow: none;
}

body {
	overflow-x: hidden;
	overflow-wrap: break-word;
}

body > h1 {
	position: relative;
	top: -3rem;
	text-align: center;
	font-size: .8rem;
	line-height: 2.5rem;

	display: none;
}
@media screen and (max-width: 60rem) {
	body > h1 {
		top: -13.4rem;
	}
}


/* accessible skip link */
.skiplink {
	position: absolute;
	left: -9999px;
	z-index: 999;
	padding: 1em;
	background-color: black;
	color: white;
	opacity: 0;
}
.skiplink:focus {
	left: 50%;
	transform: translateX(-50%);
	opacity: 1;
}

.hero:has(  + .frame-type-menu_pages_images ) {
	margin-block-end: 2rem;
}



#content {
	box-shadow: 0 0 32px #00000008;
	padding-block-start: 2rem;
}
main#content {
	padding-block-start: 0;
}

main#content .cta {
	margin-block-start: 8rem;
}
main#content .grey-bg + .cta {
	margin-block-start: 0;
}

.cta {
	border-top: 2px solid #eee;
	border-bottom: 2px solid #eee;
	padding: 10rem 0;
	margin: 0;
	text-align: center;
}
.cta h2 {
	font-size: 1.25rem;
	font-weight: 600;
}

.newsletter {
	text-align: center;
}

.newsletter a,
.cta p a {
	display: inline-block;
	color: #fff;
	text-decoration: none;
	margin-top: 1.5rem;
	padding-block: calc(var(--stack) / 1.5 );
	padding-inline: calc(var(--gutter) * 2.5 );
	font-size: .9rem;
	font-weight: 500;
	letter-spacing: .02rem;
	background-color: #666;
	border: 2px solid #666;
	border-radius: 1px;
		transition: .1s all ease-in-out;
}
.newsletter a {
	margin: .5rem auto 0;
	padding-block: calc(var(--stack) / 3 );
	padding-inline: calc(var(--gutter) * 2 );
}
a.newsletter:hover,
.cta p a:hover {
	background-color: #fff;
	color: #333;
}







/* --- */

#header {
	padding: 0;
	display: flex;
	flex-flow: column;
	align-items: center;
	z-index: 3;
	box-shadow: 0 0 10rem #0001;
}

#header .center {
	grid-column: page-start/page-end;
	display: grid;
	grid-template-columns: 1fr     1fr;
	grid-template-rows:    5.25rem 1fr;
	height: 8rem;
	width: 100%;
}

/* logo */

#logo {
	grid-area: 1 / 1 / 1 / 1;
	z-index: 123;
	margin-left: 0;
	z-index: 123;
	display: flex;
	align-items: bottom;
	line-height: 4.25rem;
	padding-left: 1rem;
}

#logo > a  {
	margin-top: .5rem;
	margin-right: .75rem;
	line-height: 4.25rem;
	text-decoration: none;
	display: flex;
	align-items: center;
}


#logo > a span.fair-gsi {
	position: relative;
	top: 0;
	display: inline-block;
	background: transparent url(../img/fair-gsi-logos-horizontal.svg) center top / 100% auto no-repeat;
	border: none;
	width: 12rem;
	height: 4rem;
	text-indent: -1000%;
	overflow: hidden;
	transition: all .2s ease-in-out;
	translate: 0;
}

#logo > a span.fair {
	position: relative;
	top: 0;
	display: inline-block;
	background: transparent url(../img/FAIR_Logo.svg) center top .05rem / 120% auto no-repeat;
	border: none;
	width: 3.25rem;
	height: 2.75rem;
	text-indent: -1000%;
	overflow: hidden;
	transition: all .2s ease-in-out;
	translate: 0;
}
#logo > a i {
	display: inline-block;
	text-indent: -200%;
	height: 2.5rem;
	width: 0;
	margin: 0 .375rem 0 .5rem;
	border-left: 1px solid #ddd;
	overflow: hidden;
}
#logo > a span.gsi {
	position: relative;
	top: 0;
	display: inline-block;
	background: transparent url(../img/GSI_Logo.svg) center top .25rem / auto 60% no-repeat;
	border: none;
	width: 5rem;
	height: 2.75rem;
	text-indent: -1000%;
	overflow: hidden;
	transition: all .2s ease-in-out;
	translate: 0;
}

#logo > a em {
	font-family: Verdana, Geneva, sans-serif;
	font-weight: normal;
	font-size: 1.125rem;
	font-style: normal;
	margin-left: .33rem;
	margin-bottom: -.75rem;
}
@media screen and (max-width: 60rem) {
	#logo {
		width: 85%;
		height: 100%;
		line-height: 3.25rem;
	}
	#logo > a {
		background-size: auto 80%;
	}
	#logo > a em {
		font-size: 1rem;
	}
}


#menu {
	grid-row-start: 1;
	grid-row-end: 2;
	grid-column-start: 1;
	grid-column-end: 4;
	background-color: #fff;
	height: 6rem;
}

/* header nav layout */

#nav {
	--nav-gap: 0rem;
	display: grid;
	grid-template-columns: 1fr    auto;
	grid-template-rows:    3.25rem  1fr;
	grid-template-areas:
"utilities utilities"
"primary   secondary";
	grid-row-gap: var(--nav-gap);
	padding: 0;
	height: 8rem;
	font-size: .925rem;
}
@media screen and (max-width: 60rem) {
	#nav {
		display: none;
	}
}

#nav ul {
	margin: 0;
	padding: 0;
	width: auto;
}

#nav .primary {
	grid-area: primary;
	justify-self: initial;
	align-self: end;

	margin-left: .5rem;
}

#nav .primary #n04 ul ul {
	min-width: 19rem;
}

#nav .secondary {
	grid-area: secondary;
	justify-self: end;
	align-self: end;
}
#nav .utilities {
	grid-area: utilities;
	justify-self: end;
	list-style: none;
}
#nav .utilities li {
	display: inline;
}

#nav .utilities li a {
	display: inline-block;
	padding: .6rem 1rem;
	font-size: .7rem;
	text-decoration: none;
	transition: .1s opacity ease-in-out;
}

#nav .utilities a::before {
	content: " ";
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 1.1rem;
	display: inline-block;
	width: 1.5rem;
	height: 1rem;
	right: 0;
	transform: translateY(25%);
	cursor: pointer;
}
#nav .utilities a:hover {
	opacity: 0.5;
}

#nav .utilities a[href*="account"]::before {
	background-image: url('../icons/profile.svg'); /* found here: https://iconmonstr.com/user-circle-thin-svg/ */
}
#nav .utilities a[href*="login"]::before {
	background-image: url('../icons/login.svg'); /* found here: https://www.svgrepo.com/svg/348131/entrance */
}
#nav .utilities a[href*="logout"]::before {
	background-image: url('../icons/logout.svg'); /* found here: https://www.svgrepo.com/svg/348136/exit */
}
#nav .utilities a[href*="suche"]::before,
#nav .utilities a[href*="search"]::before {
	background-image: url('../icons/search.svg'); /* found here: https://iconmonstr.com/magnifier-lined-svg/ */
	background-size: 1.25rem;
}
#nav .utilities #langswitch a::before {
	background-image: url('../icons/language.svg'); /* found here: https://www.svgrepo.com/svg/348179/language */
	background-size: .95rem;
}



#nav li.watchlist a {
	box-sizing: border-box;
	background-color: #666;
	border: 2px solid #666;
	color: #fff;
	margin: .25rem .5rem .25rem .25rem;
	padding: .4rem 3rem .6rem 3rem;
	text-transform: uppercase;
	display: inline-block;
	text-decoration: none;
	font-size: .7em;
	letter-spacing: 1px;
	min-width: 20em;
	text-align: center;
	transition: .1s all ease-in-out;
}
#nav .watchlist a::before {
  content: " ";
  margin-right: 5px;
  transform: translateY(3px);
	background: transparent center center no-repeat url(../icons/idea-full.svg); /*from here: https://www.svgrepo.com/svg/520525/arrow-right */
	background-size: 1rem auto;
	display: inline-block;
	width: 1rem;
	height: 1rem;

}
#nav .watchlist a:hover {
	background-color: #fff;
	color: #333;
	opacity: 1;

}
#nav .watchlist a:hover:before {
	filter: invert(1);
}







/* hero */
.hero {
	grid-column: screen-start/screen-end;
	z-index: 1;
	display: block;
	margin: 0 auto;
	aspect-ratio: 4/1;
	width: 100%;
	/*max-width: 1920px;*/
	min-height: 120px;
	/*max-height: 40vh;*/
	background: var(--bgimg) center center / 100% auto no-repeat;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
}

.hero .splide__slide {
	background: var(--bgimg) center center / 100% auto no-repeat;
	aspect-ratio: 4/1;
	width: 100%;
	/*max-width: 1920px;*/
	min-height: 120px;
	/*max-height: 40vh;*/
	background: var(--bgimg) center center / 100% auto no-repeat;
}







/* above header message area */
@media (min-width:60rem) {
	body > aside {
		z-index: 23;
	}
}









#footer {
	padding: 0;
	background:#000;
}
#footer .center {
	grid-column: screen-start/screen-end;
	width: 100%;
}

#footer .row {
	z-index: 1;
}

#footer .logolist ul {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
}
#footer .logolist li {
	display: flex;
	justify-content: center;
	padding: 0;
	margin: 0;
}
#footer .logolist a {
	display: block;
	width: 20px;
	height:20px;
	opacity: 0.85;
	transition: all 0.1s ease-out;
	overflow: hidden;
	text-indent: -1000%;
	background-repeat: no-repeat;
	background-position: center center;
}
#footer .logolist li a:hover {
	opacity: 1;
}


/* footer newsletter */

#footer .newsletter {
	padding: 2rem 1rem;
	text-align: center;
}



/* footer associates */

#footer .associates {
	background-color: #fff;
	padding: 6rem 1rem 3rem;
	display: none;
}

#footer .associates .center ul {
	display: flex;
	justify-content: center;
	gap: 5rem;
}
@media screen and (max-width: 60rem) {
	#footer .associates .center ul {
		flex-flow: column;
		align-items: center;
		gap: 2rem;
	}
}

#footer .associates ul {
	list-style: none;
	display: flex;
	gap: 2rem;
	margin: 0;
	padding: 0;
}

#footer .associates li {
	margin: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

#footer .associates a {
	text-decoration: none;
	display: inline-block;
	background: transparent center center / 100% auto no-repeat;
	border: none;
	text-indent: -1000%;
	overflow: hidden;
	transition: all .1s ease-in-out;
}

#footer .associates li a.fair { width:  7rem; height: 5rem; background-image: url(../img/FAIR_Logo.svg); }
#footer .associates li a.him  { width:  7.5rem; height: 5rem; background-image: url(../img/HI-Mainz_d.svg); }
#footer .associates li a.hij  { width:  6.75rem; height: 5rem; background-image: url(../img/HI-Jena-2_d.svg); }

@media screen and (max-width: 60rem) {
	#footer .associates .memberships ul {
		flex-flow: column;
		gap: 0;
	}
}


/* footer associates */

#footer .sponsors {
	background-color: #fff;
	padding: 1rem 1rem 4rem;
}

#footer .sponsors p {
	text-align: center;
	font-size: 0.75rem;
	padding: 1rem 0;
}

#footer .sponsors .center ul {
	display: flex;
	justify-content: space-evenly;
	/* gap: 2rem; */
}
@media screen and (max-width: 60rem) {
	#footer .sponsors .center ul {
		align-items: center;
	}
}

#footer .sponsors li a.bmbf  { width: 17rem;  height: 5rem; background-image: url(../img/BMBF_Logo.svg);   background-size: 50%; }
#footer .sponsors li a.hmwk  { width: 17rem;  height: 5rem; background-image: url(../img/hessen_logo_wissenschaft.svg);  background-size: 100%; }
#footer .sponsors li a.rmwg  { width: 17rem;  height: 5rem; background-image: url(../img/MWG-RP-Logo.png); background-size: 47.5%; }
#footer .sponsors li a.tmwwg { width: 17rem;  height: 5rem; background-image: url(../img/tmwwdg-logo.svg); background-size: 82.5%; }





/* footer bottom */

#footer .bottom {
	font-size: 0.75rem;
	font-weight: 600;
	padding: 1rem;
	color: var(--color-dim);
	background-color: #000;
}
#footer .bottom a {
	text-decoration: none;
	color: inherit;
}
#footer .bottom a:hover {
	color: #fff;
}

#footer .bottom .center {
	display: grid;
	grid-template-columns: 4fr 2fr 4fr;
	grid-template-areas:
		"copy social legal";
}

#footer .legal {
	grid-area: legal;
	justify-self: end;
}
#footer .social {
	grid-area: social;
}
#footer .copy {
	grid-area: copy;
}

#footer .copy abbr {
	letter-spacing: .05rem;
	text-decoration: none;
}

@media screen and (max-width: 60rem) {
	#footer .bottom {
		padding: 1.5rem 1rem;
		font-size: .95rem;
		font-weight: 500;
	}
	#footer .bottom .center {
		grid-template-columns: 1fr;
		grid-template-areas:
			"legal"
			"social"
			"copy";
	}
	#footer .legal,
	#footer .copy {
		justify-self: center;
	}
	#footer .social {
		margin-block: 2rem;
	}
	#footer .bottom {
		font-size: 1rem;
		color: var(--color-text-invert);
	}
}



#footer .bottom ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .8rem;
}
#footer .bottom li {
	margin: 0;
}
#footer .bottom li a {
	display: inline-block;
	transition: color .1s ease-in-out;
}


/* social icons */

#social {
	display: flex;
	justify-content: center;
	/*padding: 2em 0;*/
}

/* icons from here: https://simpleicons.org/ */
#social a[href*="facebook"]  { height: 20px; background-size: 18px auto; background-image: url('data:image/svg+xml;charset=utf-8,<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Facebook icon</title><path style="fill:%23ffffff;" d="M23.9981 11.9991C23.9981 5.37216 18.626 0 11.9991 0C5.37216 0 0 5.37216 0 11.9991C0 17.9882 4.38789 22.9522 10.1242 23.8524V15.4676H7.07758V11.9991H10.1242V9.35553C10.1242 6.34826 11.9156 4.68714 14.6564 4.68714C15.9692 4.68714 17.3424 4.92149 17.3424 4.92149V7.87439H15.8294C14.3388 7.87439 13.8739 8.79933 13.8739 9.74824V11.9991H17.2018L16.6698 15.4676H13.8739V23.8524C19.6103 22.9522 23.9981 17.9882 23.9981 11.9991Z"/></svg>'); }
#social a[href*="instagram"] { height: 20px; background-size: 18px auto; background-image: url('data:image/svg+xml;charset=utf-8,<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Instagram</title><path style="fill:%23ffffff;" d="M12 0C8.74 0 8.333.015 7.053.072 5.775.132 4.905.333 4.14.63c-.789.306-1.459.717-2.126 1.384S.935 3.35.63 4.14C.333 4.905.131 5.775.072 7.053.012 8.333 0 8.74 0 12s.015 3.667.072 4.947c.06 1.277.261 2.148.558 2.913.306.788.717 1.459 1.384 2.126.667.666 1.336 1.079 2.126 1.384.766.296 1.636.499 2.913.558C8.333 23.988 8.74 24 12 24s3.667-.015 4.947-.072c1.277-.06 2.148-.262 2.913-.558.788-.306 1.459-.718 2.126-1.384.666-.667 1.079-1.335 1.384-2.126.296-.765.499-1.636.558-2.913.06-1.28.072-1.687.072-4.947s-.015-3.667-.072-4.947c-.06-1.277-.262-2.149-.558-2.913-.306-.789-.718-1.459-1.384-2.126C21.319 1.347 20.651.935 19.86.63c-.765-.297-1.636-.499-2.913-.558C15.667.012 15.26 0 12 0zm0 2.16c3.203 0 3.585.016 4.85.071 1.17.055 1.805.249 2.227.415.562.217.96.477 1.382.896.419.42.679.819.896 1.381.164.422.36 1.057.413 2.227.057 1.266.07 1.646.07 4.85s-.015 3.585-.074 4.85c-.061 1.17-.256 1.805-.421 2.227-.224.562-.479.96-.899 1.382-.419.419-.824.679-1.38.896-.42.164-1.065.36-2.235.413-1.274.057-1.649.07-4.859.07-3.211 0-3.586-.015-4.859-.074-1.171-.061-1.816-.256-2.236-.421-.569-.224-.96-.479-1.379-.899-.421-.419-.69-.824-.9-1.38-.165-.42-.359-1.065-.42-2.235-.045-1.26-.061-1.649-.061-4.844 0-3.196.016-3.586.061-4.861.061-1.17.255-1.814.42-2.234.21-.57.479-.96.9-1.381.419-.419.81-.689 1.379-.898.42-.166 1.051-.361 2.221-.421 1.275-.045 1.65-.06 4.859-.06l.045.03zm0 3.678c-3.405 0-6.162 2.76-6.162 6.162 0 3.405 2.76 6.162 6.162 6.162 3.405 0 6.162-2.76 6.162-6.162 0-3.405-2.76-6.162-6.162-6.162zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm7.846-10.405c0 .795-.646 1.44-1.44 1.44-.795 0-1.44-.646-1.44-1.44 0-.794.646-1.439 1.44-1.439.793-.001 1.44.645 1.44 1.439z"/></svg>'); }
#social a[href*="linkedin"]  { height: 20px; background-size: 18px auto; background-image: url('data:image/svg+xml;charset=utf-8,<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>LinkedIn icon</title><path style="fill:%23ffffff;" d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>'); }
#social a[href*="social"]    { height: 20px; background-size: 18px auto; background-image: url('data:image/svg+xml;charset=utf-8,<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Mastodon</title><path style="fill:%23ffffff;" d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"/></svg>'); }
#social a[href*="twitter"]   { height: 20px; background-size: 18px auto; background-image: url('data:image/svg+xml;charset=utf-8,<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Twitter icon</title><path style="fill:%23ffffff;"     d="M23.954 4.569c-.885.389-1.83.654-2.825.775 1.014-.611 1.794-1.574 2.163-2.723-.951.555-2.005.959-3.127 1.184-.896-.959-2.173-1.559-3.591-1.559-2.717 0-4.92 2.203-4.92 4.917 0 .39.045.765.127 1.124C7.691 8.094 4.066 6.13 1.64 3.161c-.427.722-.666 1.561-.666 2.475 0 1.71.87 3.213 2.188 4.096-.807-.026-1.566-.248-2.228-.616v.061c0 2.385 1.693 4.374 3.946 4.827-.413.111-.849.171-1.296.171-.314 0-.615-.03-.916-.086.631 1.953 2.445 3.377 4.604 3.417-1.68 1.319-3.809 2.105-6.102 2.105-.39 0-.779-.023-1.17-.067 2.189 1.394 4.768 2.209 7.557 2.209 9.054 0 13.999-7.496 13.999-13.986 0-.209 0-.42-.015-.63.961-.689 1.8-1.56 2.46-2.548l-.047-.02z"/></svg>'); }
#social a[href*="youtube"]   { height: 20px; background-size: 20px auto; background-image: url('data:image/svg+xml;charset=utf-8,<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>YouTube icon</title><path style="fill:%23ffffff;" d="M23.495 6.205a3.007 3.007 0 0 0-2.088-2.088c-1.87-.501-9.396-.501-9.396-.501s-7.507-.01-9.396.501A3.007 3.007 0 0 0 .527 6.205a31.247 31.247 0 0 0-.522 5.805 31.247 31.247 0 0 0 .522 5.783 3.007 3.007 0 0 0 2.088 2.088c1.868.502 9.396.502 9.396.502s7.506 0 9.396-.502a3.007 3.007 0 0 0 2.088-2.088 31.247 31.247 0 0 0 .5-5.783 31.247 31.247 0 0 0-.5-5.805zM9.609 15.601V8.408l6.264 3.602z"/></svg>'); }



@media screen and (max-width: 60rem) {
	footer .logos li a {
		margin: 0 auto !important;
		transform: scale(1.2);
	}
}


#footer .row.hh {
	padding: 2rem 1rem;
	background-color: #005aa0;
}

#footer .helmholtz {
	justify-content: space-between;
	align-items: center;
}

#footer .hh li a.logo  { width: 6rem;    height: 1.75rem; background-image: url(../img/Helmholtz-Logo-White.svg); }
html[lang*="de"] #footer .hh li a.claim { width: 12rem;  height: 2rem;    background-image: url(../img/Helmholtz-Claim-White.svg); }
html[lang*="en"] #footer .hh li a.claim { width: 12rem;  height: 2rem;    background-image: url(../img/Helmholtz-Claim-White-en.svg); }





/* content */

main h1 {
	text-align: center;
}

main > header {
	margin-block-start: 2rem;
}

main > section:first-child {
	margin-block-start: 2rem;
}
main > section:first-child:not(.column-body) {
	margin-block-start: 4rem;
}
@media (max-width:70rem) {
	main > section:first-child:not(.column-body) {
		margin-block-start: 1rem;
	}
}


main > section.hero:first-child,
main > section.orange-bg:first-child {
	margin-block-start: 0;
	border-radius: 0;
}



main > section,
main > .column-body > * {
	margin-block-start: 2rem;
	clear: both;
}
main .column-body > section:first-child + .frame-type-header {
	margin-block-start: 1rem;
}

main > section.orange-bg,
main > section.plx {
	margin-block-start: 0;
}
main > section.plx + * {
	margin-block-start: 0;
}

h2, h3, h4, h5, h6 {
	font-weight: 500;
}

.column-page-left h2,
.column-page-left h3,
.column-page-left h4,
.column-page-left h5,
.column-page-left h6 {
	padding-top: 2rem;
	font-size: 2rem;
}

html[lang*="en"] .column-margin section > a + * {
	margin-block-start: 0;
}

.plx {
	transform-style: inherit;
	box-sizing: border-box;
	min-height: 40vh;
	max-height: 100vh;
	padding: 23.5vh 0 7.5vh;
	position: relative;
	width: 100%;
	overflow: hidden;
}

.plx, .plx:before {
	background: 50% 50% / cover;
}
.plx::before {
	bottom: 0;
	content: "";
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	display: block;
	background-color: #8a8;
	background-image: var(--bgImage);
	background-position: center center;
	transform-origin: center center 0;
	/* translate: 0 0 -1px; */
	/* scale: 1; */
	z-index: -1;
	/* min-height: 100vh; */
}
.plx h1 {
	color: #fff;
	text-align: left;
	font-size: 2rem;
	text-shadow: 0 0 32px #000;
	max-width: 1920px;
	margin: 0 auto;
	padding-block: clamp(var(--stack) * 1, 10vmax, var(--stack) * 2);
	padding-inline: 2.5rem;
}



.orange-bg {
	background-color: #FFB446;
	padding-block: 2rem;
}

.grey-bg {
	background-color: #f4f4f4;
	padding-block: 2rem;
}

/* main search form */

.search-form {
	padding: 1rem 0;
}

.search-form fieldset {
	/* background-color: #20202088; */
	padding: 1rem;
}

fieldset.select-container {
	display: flex;
	gap: 1rem;
	justify-content: space-evenly;
}
fieldset.select-container > * {
	width: 33%;
}

fieldset.select-container > legend {
	width: auto;
	font-weight: normal;
}

.search-button {
	color: #fff;
	text-decoration: none;
}

.innovations-search-form .search-container {
	position: relative;
	padding: 1rem;
}

.innovations-search-form .search-container::after {
	content: "";
	background: no-repeat center center / 100% auto url('../img/icon-search.svg');
	position: absolute;
	top: 1.4rem;
	right: 1.33rem;
	width:  1.1rem;
	height: 1.1rem;
	transform: scaleX(-1); /* Standard */
}



:root {
  --select-border: #777;
  --select-focus: blue;
  --select-arrow: var(--select-border);
}

.select-container label {
	align-items: center;
	display: grid;
	grid-template-areas: "select";
}
.select-container select {
	  padding-inline-end: 1.75rem;
}

.select-container select,
.select-container label::after {
  grid-area: select;
}

.select-container label::after {
  content: "";
  width: 0.7em;
  height: 0.4em;
  margin-inline-end: .5rem;
  background-color: var(--select-arrow);
  clip-path: polygon(100% 0%, 0 0%, 50% 100%);
  justify-self: end;
}





/* offers */

.innovations-list-view h2 {
	/* border-bottom: var(--border-width) var(--border-style) #0008; */
	margin-block-end: 1rem;
}

.innovations-list-view .module {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}

.innovations-list-view .module article {
	width: calc(33% - .425rem);
	aspect-ratio: 16/9;
	border-radius: 1px;
	overflow: hidden;
}
@media (max-width:70rem) {
	.innovations-list-view .module article {
		width: 100%;
	}
}

.innovations-list-view .module article:hover {
}

.offer-item--teaser a {
  text-decoration: none;
	position: relative;
	aspect-ratio: 16/9;
	padding: 0;
	background-color: transparent;
	transition: background-color 3s ease-in-out;
}
.offer-item--teaser a:hover {
	background-color: #fcfcfc;
}

.offer-item--teaser figure {
  background-color: #fcfcfc;
  padding: 0;
	width: 100%;
	max-width: 60rem;
	position: relative;
	aspect-ratio: 16/9;
	overflow: hidden;
	background: var(--bgimg) center center no-repeat;
	background-size: 100% auto;
	transition: background-size .33s ease-in-out;
}
.offer-item--teaser a:hover figure {
	background-size: 110% auto;
}

.offer-item--teaser figure img {
  width: 100%;
  border-radius: 1px;
}

.offer-item--teaser figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
	height: 100%;
  padding: 2rem .5rem;
  color: #ffffff;
	font-family: inherit;
  font-weight: 300;
  border-radius: 0 0 1px 1px;
  background: linear-gradient(to bottom,#18181811 0%,#00000088 100%);
	display: flex;
	justify-content: center;
	align-items: flex-end;
}
.offer-item--teaser:hover figure figcaption {
	background: linear-gradient(to bottom,#18181833 0%,#00000033 100%);
}


.offer-item--teaser .info {
}

.offer-item--teaser .category {
	margin-bottom: 0;
	text-transform: uppercase;
}

.offer-item--teaser h3 {
	margin-top: .5rem;
  line-height: 1.5rem;
	font-size: 1.1rem;
}




.offer.detail .mediaelement-image {
	width: 100%;
	margin-bottom: 1rem;
}
.offer.detail img {
	width: 100%;
	max-width: 100%;
	height: auto;
}

.offer.detail + .functions {
	margin-top: 4rem;
}




/* blogs */

h2:has(+ .news-list-view) {
	margin-block-end: 1rem;
	text-align: center;
}


.blogs h2 {
	/* border-bottom: var(--border-width) var(--border-style) #0008; */
	margin-block-end: 1rem;
}

.tx-blog-post-list-startpage,
.news-list-view {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr));
	gap: 1rem;

}
.pagets__subpage2cols .news-list-view {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
	gap: 1rem;

}

.post {
  padding: 0;
  background-color: #ffffff;
	border: 1px solid #ddd;
  border-radius: 1px;
  transition: all 0.2s;
	overflow: hidden;
}
.post:hover {
	background-color: #eee;
}


.post a {
  text-decoration: none;
}

.post a .more {
	display: inline;
	padding: 0;
	float: right;
}
.post a .more:after {
	content: "";
	padding-left: .33rem;
	font-size: .8rem;
	transition: ease-in all .25s;
	background: transparent center center no-repeat url(../icons/arrow-right.svg); /*from here: https://www.svgrepo.com/svg/520525/arrow-right */
	background-size: 1.5rem auto;
	display: inline-block;
	width: 1.5rem;
	height: .75rem;
}



.post .post-container {
  display: flex;
	flex-flow: column;
}

.post .post-container .image {
  min-width: calc(33.33% - .666rem);
  max-width: 100%;
}

.post-container .image img {
  width: 100%;
  height: auto;
  object-fit: cover;
	aspect-ratio: 16/9;
}

.post .post-container .content {
	padding: 1rem;
}

.post .post-container .content .category {
  margin-bottom: 0;
  text-transform: uppercase;
}

.post .post-container .content .title {
  display: block;
  margin-top: 0;
  font-weight: bold;
}

.post .post-container .content .teasertext {
  margin-top: 10px;
}


.entry-meta {
  margin-top: 0;
  font-size: .8rem;
  color: #333333;
}


.module-contentwrap {
	margin: 2rem 0;
	text-align: center;
}

.module-contentwrap a {
  color: #fff;
  text-decoration: none;
  padding-block: calc(var(--stack) / 1.5 );
  padding-inline: calc(var(--gutter) * 2.5 );
  font-size: .9rem;
  font-weight: 500;
  letter-spacing: .02rem;
  background-color: #000;
  border: 1px solid #000;
  transition: .1s all ease-in-out;
}
.module-contentwrap a:hover {
	background-color: #fff;
	color: #000;
}




/* detail */


.offer.detail {
	/* padding-inline: calc( .5 * var(--page-padding-inline)); */
	margin-top: 2rem;
	min-height: 120vh;
}

.offer.detail > div {
	min-width: 100%;
}

.teaser {
	font-size: 1.33rem;
	margin-block-end: calc(var(--stack) * 2);
}

.teaser + img {
	width: 100%;
	height: auto;
}

.offer.detail > .functions {
	min-width: 15rem;
}

.functions > div > div {
	background-color: #eee;
	padding: 1rem;
	margin-block-start: calc(var(--stack) * 3);
	margin-block-end: calc(var(--stack) * 3);
	border-radius: 1px;
}






/* sticky margin: WIP */

.column-margin.functions > div {
	position: sticky;
	top: 11rem;
	max-height: 300vh;
	margin-top: 0;
}
@media (max-width:70rem) {
	.column-margin.functions {
		position: static;
		top: 0;
		margin-top: 0;
	}
}