@charset "UTF-8";

:root {
	--schriftart: Arial, Helvetica, sans-serif;
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	font-family: var(--schriftart);
}
header {
	background-color: rgba(143, 143, 143, 0.219);
	height: 100px;
	min-width: 300px;
	display: flex;
	justify-content: center;
	align-items: center;
}
header a {
	height: 100px;
	position: relative;
	top: 10px;
}
header a img {
	height: 170%;
}
header span {
	font-weight: bold;
	font-size: 2.5em;
	padding: 10px;
}
main {
	margin: 20px;
	/* background-color: red; */
	min-width: 300px;
	min-height: calc(100vh - 90px);
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	text-align: center;
}
main.site {
	/* background-color: rebeccapurple; */
	padding: 10px;
	display: block;
	align-items: baseline;
	justify-content: left;
	text-align: left;
	margin: 0;
	margin-top: 10px;
	min-height: calc(100vh - 150px);
}
main.site .addr::after {
	content: "Finsterwalder Str. 9 \A 13435 Berlin \A Deutschland";
	white-space: pre-wrap;
}
main.site .tel::after {
	content: "030 473 708 00";
}
main.site .mail::after {
	content: "post@survivalschule-berlin.de";
}
main.site .steuer::after {
	content: "17/319/01280";
}
main.site h2 {
	margin-bottom: 20px;
}
main.site p {
	margin-bottom: 5px;
}
main.site .gap {
	margin-top: 20px;
}
main .logo {
	/* background-color: green; */
}
main h1 {
	margin-top: 20px;
}
main .kontakt {
	margin-top: 30px;
	font-weight: bold;
}
main .kontakt .symbol {
	font-size: 1.5em;
}
main .kontakt a {
	text-decoration: none;
	color: black;
}
footer {
	min-width: 300px;
	height: 50px;
	/* background-color: red; */
	padding-bottom: 5px;
	display: flex;
	justify-content: center;
	align-items: end;
	flex-wrap: wrap;
	text-align: center;
	font-size: 0.9em;
}
footer a {
	margin-bottom: 5px;
	text-decoration: none;
	color: black;
	font-weight: bold;
}
footer a:first-child {
	margin-right: 50px;
}
footer a:hover {
	color: rgba(143, 143, 143, 0.219);
}
@media (min-width: 822px) {
	main {
		display: block;
	}
}
@media (max-width: 375px) {
	main h1 {
		font-size: 1.5em;
	}
	main .kontakt {
		font-size: 0.88em;
	}
}
@media (min-width: 360px) and (max-width: 599px) {
	header {
		height: 80px;
	}
	header span {
		font-size: 1.5em;
	}
	header a {
		height: 70%;
		position: relative;
		top: -5px;
	}
	main.site {
		min-height: calc(100vh - 130px);
	}
}
@media (min-width: 600px) {
	main h1 {
		font-size: 3em;
	}
}
/*
main img{
  width: 50%;
  height: auto;
}

@media (orientation: portrait) {
	main {
		background-color: blue;
	}
}

@media (orientation: landscape) {
	main {
		background-color: rebeccapurple;
	}
}*/