
body {
  background-color: white;
  color: white;
  font-family: Verdana;
    background-image: url('1.png'); 
    background-size: cover;
    background-position: center;
    background-attachment: fixed; 
  }

.gesamt {
  position: relative;
  width: 880px;   /* Gesamtbreite des Containers */
  margin: 0 auto;
  margin-top: -5%;
}

.gesamt .missi {
  display: block;
  width: 100%;    /* Hintergrund nimmt die ganze Breite */
  height: auto;
}

.gesamt .taschebutton {
  position: absolute;
  top: 41%;       /* Abstand von oben */
  left: 12.2%;      /* Abstand von links */
  width: 41%;   /* Feste Breite für das obere Bild */
  height: auto;
  z-index: 10;    /* stellt sicher, dass es drüberliegt */
}

.gesamt .taschebutton {
  pointer-events: auto;  /* Klicks gehen durch auf das obere Bild */
  transition: transform 0.3s;
}

/* Hover-Zustand mit Animation */
.gesamt .taschebutton:hover {
  animation: shake 0.5s infinite;
}

/* Keyframes für das Zittern */
@keyframes shake {
  0% { transform: translate(0, 0) rotate(0deg); }
  10% { transform: translate(-2px, 2px) rotate(-2deg); }
  20% { transform: translate(2px, -2px) rotate(2deg); }
  30% { transform: translate(-2px, 2px) rotate(-2deg); }
  40% { transform: translate(2px, -2px) rotate(2deg); }
  50% { transform: translate(-2px, 2px) rotate(-2deg); }
  60% { transform: translate(2px, -2px) rotate(2deg); }
  70% { transform: translate(-2px, 2px) rotate(-2deg); }
  80% { transform: translate(2px, -2px) rotate(2deg); }
  90% { transform: translate(-2px, 2px) rotate(-2deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}
