/* ##################################################################### */
/* #### Fonts ########################################################## */

	/* inter-300 - latin */
	@font-face {
		font-display: swap;
		font-family: 'Inter';
		font-style: normal;
		font-weight: 300;
		src: url('../Fonts/inter-v13-latin-300.woff2') format('woff2'),
			url('../Fonts/inter-v13-latin-300.ttf') format('truetype');
	}
	/* inter-regular - latin */
	@font-face {
		font-display: swap;
		font-family: 'Inter';
		font-style: normal;
		font-weight: 400;
		src: url('../Fonts/inter-v13-latin-regular.woff2') format('woff2'),
			url('../Fonts/inter-v13-latin-regular.ttf') format('truetype');
	}
	/* inter-700 - latin */
	@font-face {
		font-display: swap;
		font-family: 'Inter';
		font-style: normal;
		font-weight: 700;
		src: url('../Fonts/inter-v13-latin-700.woff2') format('woff2'),
			url('../Fonts/inter-v13-latin-700.ttf') format('truetype');
	}
  

/* ##################################################################### */
/* #### HTML5 display definitions ###################################### */

	article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display:block; }


/* ##################################################################### */
/* #### Base ########################################################### */

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

	html{
		color:rgb(82,85,91);
		background-color:#fff;
		font-size: clamp(1rem, 0.9rem + 0.5vw, 1.5rem);
		line-height:1.4;
		/*
		Prevents iOS text size adjust after orientation change, without disabling user zoom
		www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
		*/
		-webkit-text-size-adjust:100%;
		-ms-text-size-adjust:100%;
		/* OS-X fonts like Windows */
		-webkit-font-smoothing:antialiased;
		-moz-osx-font-smoothing:grayscale;
	}

	html, button, input, select, textarea{
		/* addresses font-family inconsistency between form elements. */
		font-family:'Inter', sans-serif;
	}

	body{ margin:0; }


/* ##################################################################### */
/* #### Allg. Formatierungen ########################################### */

	/* Remove text-shadow in selection highlight. These selection declarations have to be separate. */
	::-moz-selection{ background:#b3d4fc; text-shadow:none; }
	::selection{ background:#b3d4fc; text-shadow:none; }
		

	/*###
	//# Links
	###*/

	a{ color:inherit; }
	a:focus, button:focus{ outline:thin dotted; } /* Addresses outline displayed oddly in Chrome */
	a:hover, a:active{ outline:0; }
	
	/*###
	//# Typography
	###*/

    h1, h2{ line-height:1.2; font-weight:300; }

	h1{ font-size:1.7rem; }
	
	h2{ font-size:1.4rem; margin:1em 0 0.5em 0; }
	.legal h2{ font-size:1.15em; margin-top:1.5em; font-weight:bold; } /* Impressum + Datenschutz */
	.legal h3{ font-size:1em; font-weight:bold; }


	p{ margin:0 0 1em 0; }


	b, strong{ font-weight:bold; }
	i, em{ font-style:normal; }

	small{ font-size:85%; }


	/*###
	//# Lists
	###*/

	ul, ol{ margin:1em 0; padding:0 0 0 40px; }

	

	/*###
	//# Tables
	###*/

	table{ border-collapse:collapse; border-spacing:0; width:100%; }
		td{ vertical-align:top; padding-bottom:5px; }
		td:nth-child(2){ text-align:right; padding-left:5px; }




/* ##################################################################### */
/* #### Gestaltungsraster ############################################## */


		.section{ padding:5vh 0; }

		.colored-bg{
			background-color:#43975B; color:#fff;
			background-image: linear-gradient(255deg, #AFE1A1 0%, #43975B 100%);
		}

		.centered{ margin-right:5vw; margin-left:5vw; position:relative; }
		

		.grid-1-2{
			display: -ms-grid;
			-ms-grid-columns: 1fr 2fr;
			display: grid;
			grid-template-columns: 1fr 2fr;
		}
			.grid-1-2 > div:nth-child(1) {
				grid-column: 2/3;
				grid-row: 1/2;
				-ms-grid-column: 2;
				-ms-grid-row: 1;
			}
			.grid-1-2 > div:nth-child(2) {
				grid-column: 1/2;
				grid-row: 1/2;
				-ms-grid-column: 1;
				-ms-grid-row: 1;
				position:relative;

				background-color:#efefef;
			}
				.grid-1-2 > div:nth-child(2) img {
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					height: 100%;
					object-fit:cover; object-position: center top;
				}


	@media screen and (min-width:1333px){
		.centered{ margin-right:auto; margin-left:auto; width:1200px; }
		.grid-1-2 .centered{ width:755px; }
	}
	@media screen and (max-width:700px){
		.grid-1-2{ display:block; }
			.grid-1-2 > div:nth-child(2){ padding-bottom:75%; }
	}


	/*###
	//# Header
	###*/

		header .logo{ position:absolute; z-index:1; top:3rem; left:2rem; }
			header .logo img{ max-width:40vw; height:auto; }


	/*###
	//# Stage
	###*/

		/*###
		//# Titelbild
		###*/

			.frontispiece{ position:relative; }
				.frontispiece img{ display:block; width:100%; height:auto; object-fit:cover; object-position:right middle; min-height:40vw; max-height:60vh; }
			.frontispiece::after{
				content:""; position:absolute; bottom:0; left:0; height:40px; width:100%; opacity:0.5;
				background-image: linear-gradient(255deg, #AFE1A1 0%, #43975B 100%);
			}

	/*###
	//# Footer
	###*/

		#footer{
			padding:3.5em 0 1.5em 0; font-size:0.8rem;
			
			text-align:center;
		}
			#footer a{ font-weight:bold; text-decoration:none; }
			#footer a:hover{ text-decoration:underline; }

			#footer .logo{ margin-bottom:3rem; }

			
			#footer span{ margin:0; padding:0; }
			#footer span:after{ content:"|"; }
			#footer span:nth-child(2):after { content:"\A"; white-space:pre; }
			#footer span:last-child:after{ content:""; }

		@media screen and (max-width:800px){
			#footer span:after { content:"\A"; white-space:pre; }
			#footer span:nth-child(3):after { content:","; white-space:pre; }
		}


/* ##################################################################### */
/* #### Print styles (Inlined to avoid the additional HTTP request) #### */
	
	@media print {
		*,
		*:before,
		*:after,
		*:first-letter,
		*:first-line {
			background:transparent !important;
			color:#000 !important; /* Black prints faster */
			box-shadow:none !important;
			text-shadow:none !important;
		}

		pre, blockquote{ border:1px solid #999; page-break-inside:avoid; }
		thead{ display:table-header-group; }
		tr, img{ page-break-inside:avoid; }
		img{ max-width:100% !important; }
		p, h2, h3{ orphans:3; widows:3; }
		h2, h3{ page-break-after:avoid; }
	}