/**
 * Designstylesheet
 *
 * Typographie und Layout Stylesheet
 *
 * @project bernhardgut.de
 * @version 1.0
 * @author Lisa Gut
 */

@font-face {
	font-family: "Nunito Sans";
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: local("Nunito Sans Light"),
		local("NunitoSans-Light"),
		url("fonts/NunitoSans-Light.ttf") format("truetype");
}

@font-face {
	font-family: "Nunito Sans";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: local("Nunito Sans Regular"),
		local("NunitoSans-Regular"),
		url("fonts/NunitoSans-Regular.ttf") format("truetype");
}

@media screen, projection {

	/**
	 * @section Layoutstyling
	 */

	body {
		background-color: #181c21;
	}

	#horizon {
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%;
		transform: translateY(-50%);
	}

	#header {
		float: none;
		margin: 0 auto 1em;
		height: auto;
		display: flex;
		align-items: center;
		justify-content: center;
		background: none;
		text-indent: 0;
	}

	#header h1 {
		margin: 0;
		width: 100%;
		font-family: "Nunito Sans", "Poppins", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
		font-weight: 300;
		font-size: 3.6rem;
		letter-spacing: 0.2em;
		word-spacing: 0.22em;
		text-align: center;
		text-transform: none;
		color: #ffffff;
		text-rendering: optimizeLegibility;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	#header .header-accent--blue {
		color: #5db0e6;
	}

	#header .header-accent--orange {
		color: #ffb430;
	}

	#header .header-accent--gray {
		color: #8d8d8d;
	}

	#activities {
		margin-bottom: 2em;
	}

	#addresses {
		margin-bottom: 3em;
	}

	#cooperation p#link {
		margin-top: 0.2em;
	}

	/**
	 * @section Textstyling
	 */

	body {
		font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif !important;
		color: #ffffff;
	}

	a {
		color: #ffffff;
		text-decoration: none;
	}

	a:hover {
		text-decoration: underline;
	}

	h2 {
		color: #5db0e6;
		font-size: 1em;
		line-height: 1.4em;
	}

	#activities {
		font-size: 1em;
		color: #8d8d8d;
		text-align: center;
		line-height: 1.4em;
	}

	#activities li {
		display: inline;
	}

	#activities li:nth-child(odd) {
		color: #c0c0c1;
	}

	#addresses {
		font-size: 1em;
		line-height: 1.4em;
	}

	#cooperation {
		text-align: center;
		font-size: 0.9em;
		line-height: 1.3em;
	}

	#cooperation span.small {
		font-size: 0.75em;
	}

	#cooperation > a {
		display: inline-block;
		margin-top: 1.2em;
	}

	h3 {
		color: #ffb430;
		line-height: 2em;
		font-size: 1.1em;
	}

	/**
	 * @section Allgemeine Klassen
	 */

	.clear { display: block; width: 100%; clear: both; }
	.left { float: left; }
	.right { float: right; }

}
