@font-face {
  font-family: 'DIN Next Rounded LT W04';
  src: url('fonts/DINNextRoundedLTW04-Medium.eot');
  src: url('fonts/DINNextRoundedLTW04-Medium.eot?#iefix') format('embedded-opentype'),
  url('fonts/DINNextRoundedLTW04-Medium.woff2') format('woff2'),
  url('fonts/DINNextRoundedLTW04-Medium.woff') format('woff'),
  url('fonts/DINNextRoundedLTW04-Medium.ttf') format('truetype'),
  url('fonts/DINNextRoundedLTW04-Medium.svg#DINNextRoundedLTW04-Medium') format('svg');
  font-weight: 500;
  font-style: normal;
}

body {
  font-family: 'DIN Next Rounded LT W04', sans-serif;
  font-size: 80%;
  margin: 0;
}

body, html {
  height: 100%;
  display: grid;
}

header {
  width: 100%;
  height: 50px;
  background-color: #f39b00;
}

header>img {
  margin: 20px;
}

h1, h2, h3 {
  font-weight: normal;
}

h1 {
  font-size: 2.25rem;
}

h2 {
  font-size: 1.5rem;
}

h3 {
  font-size: 1.125rem;
  margin-bottom: 0;
}

p {
  margin: 5px 0 0 0;
}

a:link, a:hover, a:visited {
  color: black;
}

.de, .en {
  margin-top: 40px;
}

.center {
  margin: auto;
  width: 768px;
  position: relative;
}

.obo-maennchen {
  position: absolute;
  top: 220px;
  right: 0;
}

.text {
  display: inline-block;
  box-sizing: border-box;
  padding-left: 23px;
  width: 570px;
}

.button {
  color: white;
  display: table;
  font-size: 1.25rem;
  background-color: #f39b00;
  padding: 20px;
}

.top img {
  display: inline-block;
}

.top .text {
  vertical-align: top;
  padding: 20px 0 0;
  width: 640px;
}

.top h1, .top h2, .top h3 {
  display: inline-block;
  margin: 0;
}