*{
  box-sizing:border-box;
}

html,body{
  margin:0;
  padding:0;
  width:100%;
  height:100%;
  overflow:hidden;
  background:#f4ead8;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}

body{
  min-height:100vh;
}

/* Bild füllt die Seite, ohne dass wichtige Inhalte abgeschnitten werden.
   Die Dateien selbst enthalten bereits den verwaschenen Rand. */
.hero{
  width:100vw;
  height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f4ead8;
}

.hero picture,
.hero img{
  width:100%;
  height:100%;
  display:block;
}

.hero img{
  object-fit:cover;
}