/* Variablen */
:root {
	/* Farben: Blau */
	--color-blue-darker: #002947;
	--color-blue-dark: #00477c;
	--color-blue-main: #005eb2;
	--color-blue-light: #1582fc;
	/* Farben: Türkis */
	--color-turquoise-darker: #065d5d;
	--color-turquoise-dark: #0da0a0;
	--color-turquoise-main: #31eff4;
	--color-turquoise-light: #abf4f4;
	/* Farben: Grün */
	--color-green-dark: #008e3d;
	--color-green-main: #00db63;
	--color-green-light: #82f442;
	/* Farben: Grau */
	--color-grey-dark: #5b5b5b;
	--color-grey-main: #7f7f7f;
	--color-grey-medium: #a3a3a3;
	--color-grey-light: #bcbcbc;
}

/* Fonts: Überschriften */
@font-face {
	font-family: 'headline';
	src: url('/webfonts/lexenddeca/lexenddeca-bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-stretch: normal;
}

@font-face {
	font-family: 'headline';
	src: url('/webfonts/lexenddeca/lexenddeca-light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
	font-stretch: normal;
}

/* Fonts: Fließtext */
@font-face {
	font-family: 'body';
	src: url('/webfonts/lexenddeca/lexenddeca-regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
}

@font-face {
	font-family: 'body';
	src: url('/webfonts/lexenddeca/lexenddeca-bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-stretch: normal;
}

/* Common */
body {
	position: relative;
	font-family: "body";
	font-weight: 400;
	font-size: 15px;
}

strong {
	font-weight: 700;
}

p {
	/*text-align: justify;*/
}

img {
	width: 100%;
}

/* Links */

a, a:hover, a:focus, .button, .button:hover {
	font-weight: 600;
	transition: all 0.3s ease;
	text-decoration: none;
}

/* Headlines */

h1, h2, h3 {
	font-family: "headline";
	font-weight: 900;
	line-height: 1;
	hyphens: manual;
	-webkit-hyphens: manual;
}

h1 {
	font-size: 42px;
}

h2 {
	font-size: 40px;
}

h3 {
	font-size: 36px;
}

/* Loader */
#app {
	overflow: hidden;
}

/* Loader */
#app > .loader {
	height: 100vh;
	font-size: 64px;
	text-align: center;
	background-size: cover;
	color: #ffffff;
	transition: all 1s;
}

#app > .loader img {
	margin-bottom: 50px;
}

.modal-content {
	backdrop-filter: blur(25px) saturate(2);
	-webkit-backdrop-filter: blur(25px) saturate(2);
	background: #074a8180;
	color: #ffffff
}

/* Misc */
#blazor-error-ui {
	display: none;
}