@charset "UTF-8";
/* media CSS */


/*Medie Queries
############################################################################*/
@media only screen and (min-width: 1920px) {
	.inner {
		margin: 0 auto;
		width: 190.5em;
	}
}

@media only screen and (max-width: 1920px) {
	.inner {
		padding: 0 5.380577427821522%; /* 10.25/190.5 */
	}
	#footer .inner {
		padding-left: 30.157480314960626%; /* 57.45/190.5 */
	}
}

@media only screen and (max-width: 1700px) {
	/* TYPO */
	h1 {
		font-size: 2.8em;
	}
	h2, h3,
	#main p, #main ul,
	#nav ul > li > a,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:after {
		font-size: 2.45em;
	}
	#aside p {
		font-size: 2.25em;
	}
	
	/* HEADER */
	#header-top .inner {
		height: 24.2em;
	}
	#header-top .logo {
		width: 35.5em;
	}
	#header-banner .left,
	#header-banner .right img {
		height: 39em;
	}
	#nav ul {
		margin: 2.2em 0 0 0;
	}
	
	/* CONTENT */
	#content {
		background-position: right 7em;
		padding-bottom: 4.5em;
	}
	section {
		padding-top: 6.5em;
		margin-bottom: 4.5em;
	}
	#top {
		right: 2.5em;
		bottom: 4em;
		width: 5.5em;
	}
	
	/* FOOTER */
	#footer .inner {
		height: 13.5em;
	}
}

@media only screen and (max-width: 1500px) {
	/* TYPO */
	h1 {
		font-size: 2.6em;
	}
	h2, h3,
	#main p, #main ul,
	#nav ul > li > a,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:after {
		font-size: 2.3em;
	}
	#aside p {
		font-size: 2.1em;
	}
	hr {
		height: 0.3em;
	}
	
	/* HEADER */
	#header-top .inner {
		height: 21.4em;
	}
	#header-top .logo {
		width: 31em;
	}
	#header-banner .left,
	#header-banner .right img {
		height: 34.5em;
	}
	#nav ul {
		margin: 2em 0 0 0;
	}
	#nav ul > li,
	#nav ul > li:hover,
	#nav ul > li:active,
	#nav ul > li:focus {
		border-bottom-width: 0.3em;
	}
	
	/* CONTENT */
	#content {
		background-position: right 5em;
		padding-bottom: 4em;
	}
	#main {
		padding-right: 12%;
	}
	section {
		padding-top: 6em;
		margin-bottom: 4em;
	}
	#top {
		right: 2em;
		bottom: 3em;
		width: 5em;
	}
	
	/* FOOTER */
	#footer .inner {
		height: 11.6em;
	}
}

@media only screen and (max-width: 1370px) {
	/* TYPO */
	h1 {
		font-size: 2.4em;
	}
	h2, h3,
	#main p, #main ul,
	#nav ul > li > a,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:after {
		font-size: 2em;
	}
	#aside p {
		font-size: 1.8em;
	}
	
	/* HEADER */
	#header-top .inner {
		height: 19em;
	}
	#header-top .logo {
		width: 28em;
	}
	#header-banner .left,
	#header-banner .right img {
		height: 31.5em;
	}
	#nav ul {
		margin: 1.8em 0 0 0;
	}
	
	/* CONTENT */
	#content {
		background-position: right 5em;
		padding-bottom: 3em;
	}
	#main {
		padding-right: 12%;
	}
	section {
		padding-top: 5em;
		margin-bottom: 3em;
	}
	#top {
		right: 2em;
		bottom: 2.5em;
		width: 4.5em;
	}
	
	/* FOOTER */
	#footer .inner {
		height: 10em;
	}
}

@media only screen and (max-width: 1200px) {
	/* TYPO */
	h1 {
		font-size: 2.2em;
	}
	h2, h3,
	#main p, #main ul,
	#nav ul > li > a,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:after {
		font-size: 1.8em;
	}
	#aside p {
		font-size: 1.8em;
	}
	
	/* HEADER */
	#header-top .inner {
		height: 14em;
	}
	#header-top .logo {
		width: 24em;
	}
	#header-banner .left,
	#header-banner .right img {
		height: 26em;
	}
	#nav ul {
		margin: 0;
	}
	#nav ul > li {
		margin-right: 3em;
	}
	
	/* CONTENT */
	#content {
		background-position: right 5em;
		padding-bottom: 2.5em;
	}
	#main {
		padding-right: 12%;
	}
	section {
		padding-top: 4.5em;
		margin-bottom: 2.5em;
	}
}

@media only screen and (max-width: 1100px) {
	/* 1-SPALTER */
	#header-banner .left {
		width: 18.89763779527559%;
	}
	#nav ul > li.screen {
		display: none;
	}
	#nav ul > li.mobile {
		display: inline-block;
	}
	#nav ul > li {
		margin-right: 2.5em;
	}
	#nav ul > li:nth-child(4) {
		margin-right: 2.5em;
	}
	#nav ul > li:last-child {
		margin-right: 0;
	}
	#content .inner {
		flex-direction: column;
		justify-content: flex-start;
	}
	#main, #aside {
		width: 100%;
	}
	#aside .aside-kontakt {
		display: none;
	}
	#footer .inner {
		padding-left: 5.380577427821522%;
	}
}

@media only screen and (max-width: 940px) {
	/* RESPONSIVE NAV */
	#nav {
		display: none;
	}
	.impressum #nav {
		display: block;
	}
	.open-nav,
	#responsive-nav {
		display: block;
	}
	
	/* HEADER */
	#header-banner .left {
		display: none;
	}
	#header-banner .right img {
		height: auto;
	}
}

@media only screen and (max-width: 600px) {
	/* TYPO */
	h1 {
		font-size: 2em;
	}
	h2, h3,
	#main p, #main ul,
	.open-nav .toggle-button,
	#responsive-nav ul > li > a,
	#aside p,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:after {
		font-size: 1.7em;
	}
	h1, h2, h3, p, ul {
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}
	
	/* HEADER */
	#header-top .inner {
		height: 12em;
	}
	#header-top .logo {
		width: 21em;
	}
	
	/* CONTENT */
	#content {
		background-position: right 4em;
		padding-bottom: 2em;
	}
	#main {
		padding-right: 0;
	}
	section {
		padding-top: 4em;
		margin-bottom: 2em;
	}
}

@media only screen and (max-width: 400px) {
	/* TYPO */
	h1 {
		font-size: 1.8em;
	}
	h2, h3,
	#main p, #main ul,
	#responsive-nav ul > li > a,
	#aside p,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:after {
		font-size: 1.6em;
	}
	.open-nav .toggle-button {
		font-size: 1.5em;
	}
	
	/* HEADER */
	#header-top .inner {
		height: 10em;
	}
	#header-top .logo {
		width: 17.5em;
	}
	
	#top {
		right: 1em;
		bottom: 11em;
		width: 4em;
	}
}