* { box-sizing: border-box; }

html,
body {
	font-size: 62.5%;
	line-height: 1.5;
}

body {
	margin: 0;
	font-family: 'Roboto', system-ui, sans-serif;
	display: grid;
	padding: 1.5rem;
}

.wrapper {
	display: grid;
	max-width: 90rem;
	margin: 0 auto;
}

@media (min-width: 900px) {
	.wrapper {
		grid-template-columns: 1fr 0.7fr;
		gap: 5rem;
	}
}

img, video, canvas, audio, iframe, embed, object { 
	display: block;
	max-width: 100%;
	vertical-align: middle;
}

header,
main,
footer {
	
}

header {
	padding: 2rem 0;
}

@media (min-width: 900px) {
	header {
		padding: 5rem 0;
	}
}

header img {
	width: 40rem;
	margin: 0 auto;
}

main {
	padding: 2rem 0 0 2rem;
}

@media (min-width: 900px) {
	main {
		padding: 6.2rem 0 0 0;
	}
}


footer {
	padding-left: 2rem;
}

@media (min-width: 900px) {
	footer {
		padding-left: 0;
	}
}

h1 {
	font-size: 3rem;
	font-family: 'Roboto Condensed';
	font-weight: 700;
	color: #ae3345;
	margin-top: 0;
}

p {
	font-size: 1.6rem;
	font-weight: 100;
	margin-top: 0;
	margin-bottom: 3rem;
}

b {
	font-weight: 700;
}

a {
	color: #ae3345;
}

.mail {
	display: inline-block;
	background-image: url('../images/mail.svg');
	background-size: 1.8rem;
	background-repeat: no-repeat;
	background-position: center left;
	padding-left: 2.5rem;
}

.impressum {
	display: inline-block;
	background-image: url('../images/forward.svg');
	background-size: 1.8rem;
	background-repeat: no-repeat;
	background-position: center left;
	padding-left: 2.5rem;
}

.startseite {
	display: inline-block;
	background-image: url('../images/back.svg');
	background-size: 1.8rem;
	background-repeat: no-repeat;
	background-position: center left;
	padding-left: 2.5rem;
}