@charset "UTF-8";
/* CSS Document Berechnung der ein- ausblend zeiten im Libreoffic Document Slidshow berechnen */
/*  Für 8 Bilder mit 1s übergang: */
#bilderslide {
  overflow: hidden;
  max-width: 650px;
  margin-block: 1em;
  margin-inline: auto;
  border: 3px solid var(--clr-article-400);
  border-radius: 6px;
}
#bilderslide .slider {
  position: relative;
  width: 800%;
  font-size: 0;
}
#bilderslide .slider figure {
  width: 12.5%;
  height: auto;
  display: inline-block;
  position: inherit;
}

#bilderslide .animate1 {
  animation: bild1 40s linear infinite;
}
#bilderslide .animate2 {
  animation: bild2 40s linear infinite;
}
#bilderslide .animate3 {
  animation: bild3 40s linear infinite;
}
#bilderslide .animate4 {
  animation: bild4 40s linear infinite;
}
#bilderslide .animate5 {
  animation: bild5 40s linear infinite;
}
#bilderslide .animate6 {
  animation: bild6 40s linear infinite;
}
#bilderslide .animate7 {
  animation: bild7 40s linear infinite;
}
#bilderslide .animate8 {
  animation: bild8 40s linear infinite;
}

@keyframes bild1 {
  0%, 10%, 100% {
    left: 0px;
    opacity: 1;
  }
  12.5%, 97.5% {
    opacity: 0;
  }
}
@keyframes bild2 {
  0%, 10%, 25%, 100% {
    left: -12.5%;
    opacity: 0;
  }
  12.5%, 22.5% {
    opacity: 1;
  }
}
@keyframes bild3 {
  0%, 22.5%, 37.5%, 100% {
    left: -25%;
    opacity: 0;
  }
  25%, 35% {
    opacity: 1;
  }
}
@keyframes bild4 {
  0%, 35%, 50%, 100% {
    left: -37.5%;
    opacity: 0;
  }
  37.5%, 47.5% {
    opacity: 1;
  }
}
@keyframes bild5 {
  0%, 47.5%, 62.5%, 100% {
    left: -50%;
    opacity: 0;
  }
  50%, 60% {
    opacity: 1;
  }
}
@keyframes bild6 {
  0%, 60%, 75%, 100% {
    left: -62.5%;
    opacity: 0;
  }
  62.5%, 72.5% {
    opacity: 1;
  }
}
@keyframes bild7 {
  0%, 72.5%, 87.5%, 100% {
    left: -75%;
    opacity: 0;
  }
  75%, 85% {
    opacity: 1;
  }
}
@keyframes bild8 {
  0%, 85%, 100% {
    left: -87.5%;
    opacity: 0;
  }
  87.5%, 97.5% {
    opacity: 1;
  }
}/*# sourceMappingURL=bilderslide.css.map */