@font-face {
  font-family: "ABCStefan";
  src: url("ABCStefan-Simple-Trial.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
}
/* {
  outline: 1px solid red;
}*/

.header-blume{
  padding: 10px;

}
.header-blume:hover{
  width: 70px;
}
body {
  position: relative;
  z-index: 1;
  background-color:hsl(32, 100%, 94%);
}
.h1,h1,h2{
   font-family: ABCStefan;
   justify-content: center;
   display: flex;   
   text-align: center; 
}
.h1 h1 {
  background-color: #7a6cb8;
  padding: 50px;   
}
figure{
   display: flex;
   justify-content: center;
   height: 200px;
   z-index: -1;
   margin-top: 150px;
   margin-bottom: 60px;
}
.erde{
  margin-top: -135px;
  margin-bottom: -135px;
}
p {
  font-family: ABCStefan;
  padding: 20%;
  padding-top: 0%;
  padding-bottom: 0%;
  color: black;
  text-align: center;
}
a:hover{
  font-size: 20px;
  color: green;

}
/* Slider */
#geweachshaus{
  margin: 10em;
}
.swiper-slide figcaption{
  caption-side: top;
  display: table-caption;
}
.swiper-slide figure{
  display: table;
 }
.swiper {
  width: 100%;
  max-width: 600px;
  height:650px;
}
.swiper-slide {
  display: flex;
  justify-content: center;
  align-content: center;
}
.swiper-slide img {
  display: block;
  margin: auto;
  width: 70%;
  height: auto;
}

/* Lauschen - Ton & Animation*/
.lausch-animation {
  width: 100%;
  height: 300px;
  background-color: #9d8771;
  border: var(--rahmen);
}

@keyframes lauschen {
  0% { background-color: #9d8771; }
  10% { background-color: #7a5f4b; }
  20% { background-color: #004e9d; }
  30% { background-color: #0a7db8; }
  40% { background-color: #1f9d8a; }
  50% { background-color: #6cbf57; }
  60% { background-color: #d0a63c; }
  70% { background-color: #c76b32; }
  80% { background-color: #a3474b; }
  90% { background-color: #7b4fa3; }
  100% { background-color: #bcb1aa; }
}

.lausch-animation.is-playing {
  animation: lauschen 10s infinite;

}

.lausch-animation.is-fullscreen {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
}