* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: #fff3e7;
  font-family: Arial, Helvetica, sans-serif;
}

.site {
  width: 100%;
  display: flex;
  justify-content: center;
  background: #fff3e7;
}

.homepage {
  position: relative;
  width: min(100%, 1024px);
  background: white;
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.15);
}

.homepage-img {
  display: block;
  width: 100%;
  height: auto;
}

.hotspot {
  position: absolute;
  z-index: 10;
  display: block;
}

/* Navigation oben */
.nav-about   { left: 28.0%; top: 2.9%; width: 7.2%; height: 2.2%; }
.nav-ape     { left: 38.2%; top: 2.9%; width: 9.0%; height: 2.2%; }
.nav-events  { left: 51.0%; top: 2.9%; width: 7.0%; height: 2.2%; }
.nav-gallery { left: 61.5%; top: 2.9%; width: 7.5%; height: 2.2%; }
.nav-contact { left: 72.0%; top: 2.9%; width: 7.5%; height: 2.2%; }

/* Buttons */
.btn-top  { left: 78.7%; top: 1.4%; width: 19.1%; height: 4.8%; }
.btn-hero { left: 5.7%;  top: 43.8%; width: 22.4%; height: 4.6%; }

/* Kontakt unten */
.instagram { left: 59.0%; top: 82.0%; width: 24.0%; height: 4.3%; }
.whatsapp  { left: 59.0%; top: 88.0%; width: 25.0%; height: 4.4%; }

.seo {
  position: absolute;
  left: -99999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

@media (max-width: 700px) {
  .homepage {
    width: 100%;
    box-shadow: none;
  }
}