* {
	margin: 0;
}

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

body {
	font-family: var(--font-default-family);
	font-weight: var(--font-default-weight);
	font-size: var(--font-default-size);
	background-color: var(--color-white);
	color: var(--color-text);
	-webkit-font-smoothing: antialiased;
	min-width: var(--content-min-width);
}

img, picture, video, canvas, svg {
	display: block;
	max-width: 100%;
	height: auto;
}

b, strong {
	font-weight: var(--font-default-weight-bold);
}

i, em {
	font-style: var(--font-default-italic);
}

input, button, textarea, select {
	font: inherit;
	box-sizing: border-box;
	border-radius: 0;
}


input,
textarea,
button,
select {
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	font: inherit;
	background: var(--color-white);
	color: var(--color-black);
	border: 1px solid var(--color-black);
	padding: 10px;
}

	input[type="submit"],
	button {
		cursor: pointer;
		width: auto;
		background: transparent;
	}

	select {
		width: auto;
	}

	input[type="checkbox"] {
		width: auto;
	}

	input:required:user-invalid,
	select:required:user-invalid,
	textarea:required:user-invalid {
		outline: 2px solid var(--color-red);
	}

input[type="submit"],
button,
.button {
	display: inline-block;
	text-decoration: none;
	color: var(--color-text);
	border: 2px solid var(--color-text);
	border-radius: 4px;
	padding: 9px 26px 7px;
	text-align: center;
	text-transform: uppercase;
	position: relative;
	z-index: 5;
	font-size: 15px;
	font-weight: var(--font-default-weight-bold);

	-webkit-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

	.content .button {
		text-decoration: none;
	}

	input[type="submit"]:hover,
	button:hover,
	.button:hover {
		padding: 9px 32px 7px 20px;
		border-color: transparent;
		color: var(--color-background);
	}

		.button.button-arrow-left:hover {
			padding: 9px 20px 7px 32px;
		}

		.button.button-no-arrow:hover {
			padding: 9px 26px 7px;
		}

	input[type="submit"]:hover {
		background: var(--color-text) no-repeat center center / 100% 100%;
		border-width: 0px;
		border-color: rgba(255,255,255,0);
		padding: 11px 28px 9px;
	}

	input[type="submit"]:before,
	button:before,
	.button:before {
		content: '\2192';
		position: absolute;
		right: 10px;
		top: 50%;
		margin-top: calc(-0.5em + 1px);
		line-height: 1em;
		color: var(--color-background);
		z-index: 5;
		opacity: 0;

		-webkit-transition: opacity 300ms ease-in-out;
		-o-transition: opacity 300ms ease-in-out;
		transition: opacity 300ms ease-in-out;
	}

		input[type="submit"]:hover:before,
		button:hover:before,
		.button:hover:before {
			opacity: 1;
		}

		.contentblock-downloads .button:before {
			content: '\2193';
		}

		.button.button-arrow-left:before {
			right: auto;
			left: 10px;
			content: '\2190';
		}

		.button.button-no-arrow:before {
			display: none;
		}

	button:after,
	.button:after {
		content: "";
		display: block;
		position: absolute;
		left: -2px;
		top: -2px;
		width: calc(100% + 4px);
		height: calc(100% + 4px);
		border-radius: 4px;
		background: var(--color-text) no-repeat center center / 100% 100%;
		opacity: 0;
		z-index: -1;

		-webkit-transition: opacity 300ms ease-in-out;
		-o-transition: opacity 300ms ease-in-out;
		transition: opacity 300ms ease-in-out;
	}

		button:hover:after,
		.button:hover:after {
			opacity: 1;
		}

.width {
	width: 100%;
	max-width: var(--content-max-width);
	padding: 0 20px;
	box-sizing: border-box;
	margin: 0 auto;
}

.screen-reader-text {
	position: absolute;
	top: -100px;
	left: 0;
	z-index: 9999;
	padding: 10px 20px;
	background-color: var(--color-black);
	color: var(--color-white);
}

	.screen-reader-text:focus {
		top: 0;
	}

.content {
	line-height: var(--font-default-line-height);
}

	.content ul,
	.content ol {
		margin: 0;
		padding-left: 20px;
	}

		.content ul {
			list-style-type: disc;
		}

		.content ol {
			list-style-type: decimal;
		}

	.content ul.no-list-style,
	.content ol.no-list-style {
		padding: 0;
		list-style-type: none;
	}

	.content * + p,
	.content * + ul,
	.content * + ol,
	.content * + img,
	.content * + picture,
	.content * + svg,
	.content * + video,
	.content * + blockquote,
	.content * + dl,
	.content * + figure,
	.content * + form,
	.content * + h1,
	.content * + h2,
	.content * + h3,
	.content * + h4,
	.content * + h5,
	.content * + h6,
	.content * + hr,
	.content * + nav,
	.content * + pre,
	.content * + table {
		margin-top: 1em;
	}

	.content a {
		color: inherit;
		text-decoration: underline;
	}

		.content a:hover {
			text-decoration: none;
		}

	.content * + .headline-l,
	.content * + .headline-m,
	.content * + .columns {
		margin-top: var(--spacing-double);
	}

.columns {
	display: flex;
	justify-content: flex-start;
	gap: 20px;
}

	.columns .column {
		flex: 1;
	}

	.columns-reverse .column:first-child {
		order: 2;
	}

	.columns-reverse .column:last-child {
		order: 1;
	}

	@media ( max-width: 840px ) {

		.columns {
			flex-wrap: wrap;
		}

		.columns .column {
			width: 100%;
			flex-basis: 100%;
		}

		.columns .column-image {
			order: 1 !important;
		}

		.columns .column-text {
			order: 2 !important;
		}

	}

.footer {
	padding: var(--spacing) 0;
	box-sizing: border-box;
	height: var(--footer-height);
	--color-background: var(--color-black);
	--color-text: var(--color-white);
	background: var(--color-background);
	color: var(--color-text);
}

	.footer .menu {
		text-align: center;
		width: 100%;
		display: block;
		list-style-type: none;
		padding: 0;
	}

		.footer .menu li {
			display: inline;
		}

		.footer .menu a {
			display: inline-block;
			padding: 10px;
			color: inherit;
			text-decoration: underline;
		}

			.footer .menu a:hover {
				text-decoration: none;
			}

			.footer .menu .current-menu-item a {
				font-weight: var(--font-default-weight-bold);
				text-decoration: none;
			}

	@media ( max-width: 640px ) {

		.footer .menu li {
			display: block;
		}

	}

.block {
	padding: var(--spacing-double) 0;
	background: var(--color-background);
	color: var(--color-text);
}

.block-dark {
	--color-text: var(--color-white);
	--color-background: var(--color-black);
}

.np-uploader_wrapper {
	margin-top: var(--spacing);
}

	.np-uploader_wrapper #container {
		--gap: 10px;

		display: flex;
		gap: var(--gap);
		flex-wrap: wrap;
	}

	.np-uploader_wrapper .field-message {
		margin-top: 2em;
	}

		.np-uploader_wrapper .field-message:first-child {
			margin-top: 0;
		}

	.np-uploader_wrapper .label {
		display: block;
		width: 100%;
	}

		.np-uploader_wrapper .label.half {
			width: calc(50% - calc(var(--gap)/2));
		}

	.np-uploader_wrapper #file_description {
		width: 100%;
		height: 140px;
	}

	.np-uploader_wrapper .field-birthday select {
		width: calc(100% / 3 - 4px);
	}

	@media ( max-width: 640px ) {

		.np-uploader_wrapper .label.half {
			width: 100%;
		}

	}

.toggle-area.inited {
	padding: 0;
}

	.toggle-area.inited .toggle-head {
		cursor: pointer;
		position: relative;
	}

	.toggle-area.inited .toggle-content {
		display: none;
	}

		.toggle-area.inited.open .toggle-content {
			display: block;
		}

.main {
	padding: var(--spacing-double) 0;
	box-sizing: border-box;
	min-height: calc(100vh - var(--footer-height));
}

.homepage.main {
	padding-top: 0;
	padding-bottom: 0;
}

	.homepage .block-intro {
		background: var(--color-background) url('../img/header/homepage.svg') no-repeat center center / cover;
		padding: var(--spacing-tripple) 0;
		text-align: center;
		text-wrap: balance;
	}

		.homepage .block-intro .intro-logo {
			display: block;
			color: transparent;
			width: 450px;
			max-width: 100%;
			padding-top: 7%;
			height: 0;
			background: url(../img/logo.svg?v2) no-repeat center center / contain;
			margin: 0 auto;
		}

		.homepage .block-intro .intro-headline {
			font-size: 4.1em;
		}
		
		.homepage .block-intro .intro-subheadline {
			font-size: 1.43em;
			text-transform: none;
			margin: 0 0 var(--spacing-double);
		}

		.homepage .block-intro .intro-text {
			font-size: 1.3em;
		}

		.homepage .block-intro .intro-buttons {
			margin-top: var(--spacing);
		}

			.homepage .block-intro .button + .button {
				margin-left: var(--spacing-double);
			}

	.homepage .block-about ul .button {
		margin-bottom: 1em;
		min-width: 150px;
	}

	@media ( max-width: 1040px ) {

		.homepage .block-intro .intro-headline {
			font-size: 2.4em;
		}

		.homepage .block-intro .intro-subheadline {
			font-size: 1.3em;
		}

		.homepage .block-intro .intro-text {
			font-size: 1.15em;
		}
		
	}

	@media ( max-width: 840px ) {

		.homepage .block-intro {
			padding-top: var(--spacing-double);
			padding-bottom: var(--spacing-double);
		}

		.homepage .block-intro .intro-headline {
			font-size: 2em;
		}

		.homepage .block-intro .intro-subheadline {
			font-size: 1.2em;
		}

		.homepage .block-intro .intro-text {
			font-size: 1em;
		}
		
	}

	@media ( max-width: 640px ) {

		.homepage .block-intro .intro-subheadline {
			margin-bottom: var(--spacing);
		}

		.homepage .block-intro .button + .button {
			margin-left: 1em;
		}

	}

	@media ( max-width: 440px ) {

		.homepage .block-intro .intro-headline {
			font-size: 1.7em;
		}

		.homepage .block-intro .intro-subheadline {
			font-size: 1.05em;
		}

		.homepage .block-intro .button {
			margin: 0.5em !important;
		}

	}
