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


body {
  background: url("../images/achtergrondfoto.jpg") no-repeat center center;
  background-size: cover;
  background-position: center;
  height: 100vh;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  font-family: 'Poppins', sans-serif;
}

/* Middelste tekst-logo */
.logo-img {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 90vw;
  height: auto;
  z-index: 2;
  filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.25));
}

.tape {
  position: absolute;
  width: 120px; /* vaste breedte */
  height: auto; /* automatisch schalen als 't een img is */
  transition: transform 0.3s ease; /* dit is voor het klik effect */
   z-index: 2;
}
.tape:hover {
  transform: rotate(+5deg) translateY(-3px);/* dit is voor het hover effect */
}



/* posities tapejes) */
.tape-illustratie {
position: absolute;
  top: 52%;
  left: 10%;
  transform: rotate(+10deg) scale(0.8)
}
.tape-content {
  position: absolute;
  top: 12%;
  left: 62%;
  transform: rotate(+10deg) scale(0.8)
}
.tape-about {
  position: absolute;
  top: 65%;
  left: 72%;
  transform: rotate(-10deg)
}
/* Footer */
.footer {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  color: white;
  z-index: 2;
}

.footer strong {
  display: block;
  font-size: 30px;
  margin-bottom: 4px;
  color: black;
}

.footer a {
  color: #FFF3C1;
  text-decoration: none;
  font-size: 25px;
}

.foster-tekst {
  font-family: 'Poppins', sans-serif;
  font-weight: 600; /* of 400, 700 afhankelijk van wat je wilt */
}
@media (max-width: 768px) {

 .tape-illustratie {
    left: -15%;   /* verder naar links */
    top: 40%;   /* eventueel iets lager */
    transform: rotate(8deg) scale(0.4);
  }

  .tape-content {
    left: 45%;
    top: 5%;
    transform: rotate(10deg) scale(0.3);
  }

  .tape-about {
    left: 55%;
    top: 40%;
    transform: rotate(-10deg) scale(0.4);
  }
    .footer strong {
    font-size: 18px; /* naam kleiner */
  }

  .footer a {
    font-size: 16px; /* e-mail kleiner */
  }
}