@import url("fonts.css");

/*
	Impressum & Datenschutz: content card on the homepage background.
*/

	html {
		background: #348cb2 url("images/bg.jpg") bottom left repeat-x fixed;
		min-height: 100%;
	}

	body {
		margin: 0;
		padding: 3em 1em 4em;
		color: #333;
		font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
		font-size: 17px;
		line-height: 1.6;
		-webkit-text-size-adjust: 100%;
	}

	a {
		color: #1d6a8c;
	}

		a:hover {
			color: #348cb2;
		}

/* Site header above the card */

	.site {
		max-width: 46rem;
		margin: 0 auto 1rem;
		font-size: 1.5em;
		font-weight: 700;
		letter-spacing: -0.025em;
	}

		.site a {
			color: #fff;
			text-decoration: none;
			text-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
		}

/* Content card */

	.page {
		max-width: 46rem;
		margin: 0 auto;
		padding: 2.5em 3em;
		background: #fff;
		border-radius: 6px;
		box-shadow: 0 1em 3em rgba(0, 0, 0, 0.2);
	}

	h1 {
		margin: 0 0 0.75em;
		color: #222;
		font-size: 2em;
		line-height: 1.2;
	}

	h2 {
		margin: 2em 0 0.5em;
		color: #222;
		font-size: 1.2em;
		line-height: 1.3;
	}

	p, ul {
		margin: 0 0 1em;
	}

	ul {
		padding-left: 1.25em;
	}

	.meta {
		color: #777;
		font-size: 0.9em;
	}

	.contact {
		display: grid;
		grid-template-columns: max-content 1fr;
		gap: 0.25em 1.5em;
		margin: 0 0 1em;
	}

		.contact dt {
			color: #777;
		}

		.contact dd {
			margin: 0;
		}

	.back {
		margin: 2em 0 0;
		padding-top: 1em;
		border-top: 1px solid #e5e5e5;
	}

/* Small screens */

	@media screen and (max-width: 600px) {

		body {
			padding: 1.25em 0.75em 2em;
			font-size: 16px;
		}

		.site {
			font-size: 1.25em;
		}

		.page {
			padding: 1.5em 1.25em;
		}

		h1 {
			font-size: 1.6em;
		}

	}

/* Print */

	@media print {

		html {
			background: none;
		}

		body {
			padding: 0;
		}

		.site, .back {
			display: none;
		}

		.page {
			max-width: none;
			padding: 0;
			box-shadow: none;
		}

	}