* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

@font-face {
  font-family: "SCW";
  src: url("SCW.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap; /* zeigt sofort eine Ersatzschrift, bis die eigene geladen ist */
}

@font-face {
  font-family: "SCW";
  src: url('Capture_It.ttf') format('truetype');
  unicode-range: U+0030-0039, U+0026;
}

h1, h2, h3, h4, h5 {
	font-family: 'SCW', sans-serif;
	color: #fff;
	padding-bottom: 1em;
	letter-spacing: 1px;
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small {
	letter-spacing: 2px;
}

p, li, a {
	color: #fff;
	font-family: sans-serif;
}

p {
	padding: 1em 0;
}

body {
	background: url("bg.webp");
	background-size: cover;
}

header {
	padding: 2em;
	text-align: right;
	max-width: 1280px;
	margin: 0 auto;
}

section {
	padding: 2em;
	max-width: 1280px;
	margin: 0 auto;
}

.page {
	background: url("header.png") no-repeat;
	background-size: 100% auto;
	min-height: 100vh;	
	width: 100%;
}

.social-links {
	list-style: none;
}

.social-links svg {
	width: 32px;
}

.hero {
	width: 100%;
	text-align: center;
	padding-top: 1em;
}

@media screen and (min-width: 960px) {	
	.hero {
		padding-top: 3em;
	}
}

.hero img {
	width: 100%;
	max-width: 480px;
	height: auto;
	margin-bottom: 2em;
}

.hero h1 {
	font-size: 48px;
	margin: 0;
	padding: 0;
}

@media screen and (min-width: 960px) {	

}

@media screen and (min-width: 960px) {	
	.hero h1 {
		font-size: 64px;
	}
}

.links ul {
	list-style: none;
	text-align: center;
}

.links ul li a {
	font-family: 'SCW';
	font-size: 48px;
	text-decoration: none;
}

hr {
	max-width: 1280px;
	margin: 2em auto;
}