@charset "UTF-8";
#background {
  position: absolute;
  width: 100%;
  height: 100vh;
  top: 0px;
  z-index: 0;
  /* Video spezifische Styles */
  /* Wenn das Bild statt Video genutzt wird */
}
#background .inside, #background .content-player, #background figure {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: absolute;
  top: 0px;
  z-index: -3;
  margin: 0px;
}
#background video, #background img {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 120vh;
  /* Höhe auf 100% der Viewport-Höhe setzen */
  z-index: -5;
  max-width: unset;
  filter: hue-rotate(190deg) blur(10px);
  object-fit: cover;
  transition: all 0s 0s ease;
}
#background .content-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  /* Bild auf die Höhe des Viewports setzen */
  z-index: -5;
  object-fit: cover;
}
#background .content-player:before {
  content: "";
  position: fixed;
  width: 100vw;
  height: 100vh;
  z-index: -2;
  opacity: 0.9;
  transition: filter 0.5s ease;
  background-image: linear-gradient(to right, #141e30, #243b55);
  filter: brightness(1);
}
.dark-mode #background .content-player:before {
  filter: brightness(0.3);
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sources%22%3A%5B%22var%2Fwww%2Fvhosts%2Ffabiene-ahorner.de%2FWebseite%2Ffiles%2FBerning-Systems%2Fcss%2Flayout%2Fbackground.scss%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22%3BAAEA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAcA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAUA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaF%3BAAAA%3BAAAA%22%7D */