

/**
 * general and font settings
 */

@font-face { font-family: 'Open Sans';           font-weight: normal; font-style: normal; src: url("/s/general/open-sans-r.woff?h=DpJGLkAsFSlTZtkSp7i-MD0CV9g") format('woff'); }
@font-face { font-family: 'Open Sans';           font-weight: bold;   font-style: normal; src: url("/s/general/open-sans-b.woff?h=tfedGTTaecikujgQktrYL_sFgss") format('woff'); }
@font-face { font-family: 'Open Sans Condensed'; font-weight: normal; font-style: normal; src: url("/s/general/open-sans-condensed-r.woff?h=wFkjnT9u9DbBOKP-PlJL992wCe8") format('woff'); }

body {
	font-size: 19px; font-family: 'Open Sans', Helvetica, sans-serif;
	letter-spacing: 0.2px; line-height: 1.45;
	color: #424a44;
	overflow-wrap: break-word;
}
*, *::before, *::after {
	transition: color .16s, border-color .16s, background-color .24s, border-color .24s, opacity .24s, transform .24s, filter .16s;
}
.no-transitions, .no-transitions *, .no-transitions ::before, .no-transitions ::after {
	transition: none !important; /* disable transitions e.g. during page load */
}

/* links */
:link, :visited { text-decoration: none; outline: none; }
.link, :link, :visited { color: #4FA3DB; }
.link:hover, :link:hover, :visited:hover { color: #A15084; }
.link:focus, :link:focus, :visited:focus { text-decoration: underline; text-decoration: underline dotted; text-decoration-skip-ink: none; }
.current-page { color: #A15084; /*filter: hue-rotate(103deg) saturate(106%) brightness(66%);*/ }

.button {
	filter: saturate(1);
	text-decoration: none !important;
	color: white !important;
	text-align: center;
	background-color: #4FA3DB;
	border: 0px solid #4FA3DB;
}
.button:hover,
.button:focus {
	filter: saturate(1.25);
	background-color: #95B4E0;
	border-color: #95B4E0;
}

i, em {
	font-style: normal;
	color: #A15084;
}

/**
 * utility classes
 */

.hidden {
	display: none;
}
.inline {
	display: inline-block;
}
.small {
	font-size: smaller;
}
.no-select {
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
}


/* .if-active/.else */
:not(.active)>.if-active { display: none; }
.active>.if-active + .else { display: none; }

.modal:not(:target) {
	display: none;
}


/**
 * better defaults + fixes
 */

p, ul, ol {
	margin: .5em 0;
}

main pre, main code {
	/* we don't need <code>, so lets use `this`{style="..."} to style inline elements and ``` fences blocks for text with line breaks */
	font-family: inherit; white-space: pre-wrap;
}

main, figcaption {
	display: block;
}
img {
	border: none; /* IE 10 */
}
input {
	border-radius: 0;
	border-width: 1px;
}


/**
 * layout
 */

html, body {
	background-color: white;
}

body #page-wrap {
	min-height: 100vh; /* always keep the footer just out of view */
}

.page-width {
	margin: 0 auto;
	max-width: 1280px;
}

body #page-wrap, #page-wrap>header, body>footer {
	float: left; width: 100%; /* make stuff float within */
}
#page {
	overflow: hidden; /* make stuff float, */
	z-index: 0; /* and stack within */
	width: 100%; padding: 0 35px;
}
body:not(.content-scroll) #page {
	margin-bottom: 20px;
}
@media (max-width: 1000px) { #page {
	padding: 0 3.5vw;
} }

body #page-wrap>header {
	padding: 45px 0px 0px 0px;
}

/* #logo and #nav positioning to each other */
header #logo, header #nav {
	display: inline-block;
	vertical-align: middle;
}
header #logo {
	width: 390px;
}
header #nav {
	width: calc(100% - 390px);
	text-align: right;
}
@media (max-width: 1320px) {
	body #page-wrap>header {
		padding: 25px 0px 0px 0px;
	}
	header #logo, header #nav {
		width: 100%;
	}
	header #nav {
		text-align: center;
	}
}

/* #logo internal positioning */
header #logo {
	padding: 6px 10px 13px 10px;
}
@media (max-width: 800px) { header #logo {
	padding-bottom: calc(3.4px + 1.2vw);
} }
header #logo>div {
	width: 340px; margin: auto;
}
@media (max-width: 1320px) { header #logo>div {
	width: calc(230px + 15vw);
} }
header #logo>div>div {
	padding-bottom: 9.72%;
	background-image: url("/r/_common/jik8PrUxpe8pYNhKaUQh1U_NduQ/logo-header.svg");
	background-position: center center; background-size: contain; background-repeat: no-repeat;
}

/* #nav internal positioning */
header #nav {
	padding: 3px 18px 9px 18px;
	font-size: 21px;
}
@media (max-width: 500px) { header #nav {
	font-size: calc(9px + 2vw);
} }
@media (max-width: 350px) { header #nav {
	font-size: 16px;
} }
header #nav>*>* {
	padding: 5px 13px;
	display: inline-block;
}
@media (max-width: 1320px) { header #nav>*>* {
	padding: 5px calc(4px + .9vw);
} }

#breadcrumbs:not(:empty) {
	overflow: hidden; width: 100%;
	padding: 20px 20px 13px 20px;
	line-height: 27px;
}

#title {
	font-size: 32px; margin: 0;
	padding: 35px 0 10px 0;
	color: #a15084;
	text-transform: uppercase;
}
@media (max-width: 700px) {
	#title { padding-top: 5vw; }
}
#page #breadcrumbs + #title {
	padding-top: 0;
}

body>footer {
	overflow: hidden;
}
footer #footer-logo {
	background-color: #4fa3db;
	overflow: hidden;
}
footer #footer-logo>div {
	margin: 6px auto 14px auto;
	height: 87px; width: 93%;
	background-image: url("/r/_common/ISYgrxcY4rS7ULqjCavdVq0y6HE/logo-footer.svg");
	background-position: center center; background-size: contain; background-repeat: no-repeat;
}
footer #footer-links,
footer #footer-text {
	font-size: 75%;
	display: inline-block;
	padding: 10px 0 0 0;
}
footer #footer-links a {
	display: inline-block;
	padding: 0 12px 10px 12px;
}
footer #footer-text {
	float: right; text-align: right;
	padding: 10px 20px;
	color: #A15084;
}
@media (max-width: 1200px) {
	footer #footer-links,
	footer #footer-text {
		display: block;
		text-align: center; float: none;
	}
	footer #footer-text { padding-top: 3px; }
}


/**
 * basic-text page/section
 */


.basic-text #main h1, #main .basic-text h1 {
	margin: 28px 0 0 0;
	font-size: 140%;
}
.basic-text #main h2, #main .basic-text h2 {
	margin: 24px 0 0 0;
	font-size: 110%;
}
.basic-text #main h3, #main .basic-text h3 {
	margin: 14px 0 0 0;
	font-size: 107%;
}
.basic-text #main h4, #main .basic-text h4 {
	margin: 9px 0 0 0;
	font-size: 103%;
}
.basic-text #main p, #main .basic-text p,
.basic-text #main ul, #main .basic-text ul,
.basic-text #main ol, #main .basic-text ol {
	margin: 0 0 10px 0;
}
.basic-text figure {
	margin: 0;
}
.basic-text img {
	max-width: 100%;
}
.basic-text figure img {
	display: block; margin: 1em auto;
}
.basic-text figure.left {
	float: left;
}
.basic-text figure.right {
	float: right;
}
@media (max-width: 550px) { .basic-text figure.left:not(.never-center), .basic-text figure.right:not(.never-center) {
	float: none;
} }
.basic-text table {
	border-spacing: 20px 2px;
	margin: 0 -20px 1em -20px;
}
.basic-text table td {
	vertical-align: top;
}
.basic-text table strong, .basic-text table b {
	color: #4FA3DB;
}
.basic-text table em, .basic-text table i {
	font-weight: bold;
}
@media (max-width: 600px) { /* display tables as lists */
	.basic-text table.auto-collapse,
	.basic-text table.auto-collapse th,
	.basic-text table.auto-collapse td { display: inline; }
	.basic-text table.auto-collapse thead,
	.basic-text table.auto-collapse tbody,
	.basic-text table.auto-collapse tr { display: block; }
	.basic-text table.auto-collapse tbody tr { margin: 0 0 0 0.73em; }
	.basic-text table.auto-collapse td:first-child::before { content: '•'; margin: 0 .3em 0 -0.73em; }
	.basic-text table.auto-collapse td:first-child::after { content: ':'; }
}


/**
 * content-scroll page
 */

body.content-scroll, body.content-scroll #page-wrap {
	height: 100vh; overflow: hidden;
	display: flex; flex-direction: column;
}
body.content-scroll #page {
	flex: 1;
}

body.content-scroll #breadcrumbs:not(:empty) {
	padding: 6px 0px 7px 0px;
	line-height: 27px;
}
body.content-scroll #title {
	display: none;
}
body.content-scroll #page #main {
	flex: 1; height: 100%;
}
body.content-scroll #page #breadcrumbs ~ #main {
	height: calc(100% - 40px);
}
body.content-scroll #page #main #content {
	height: 100%;
}


/**
 * full-width page
 */

body.full-width #page {
	max-width: none;
}
body.full-width #title {
	display: none;
}


/**
 * login page
 */

body.login-page #login-form {
	text-align: center;
}
body.login-page #login-form .inputs {
	text-align: right;
}
body.login-page #login-form .inputs label {
	height: 32px; line-height: 32px;
}
body.login-page #login-form .inputs label::before {
	content: 'E-Mail-Adresse:'; padding: 0 5px;
}
body.login-page #login-form .domain,
body.login-page #login-form .inputs label span,
body.login-page #login-form .inputs label:last-child {
	display: none;
}
body.login-page #login-form .inputs input {
	padding: 0 4px; max-width: calc(100vw - 140px);
}
body.login-page #login-form input[type="submit"] {
	font-family: 'Open Sans Condensed';
	text-transform: uppercase;
	color: white; background-color: #A15084;
	padding: 10px 40px; border: none;
	cursor: pointer;
}


/**
 * error page
 */

body.error-page #main>h1:first-of-type {
	display: none;
}
