/* Stijl voor de slideshow container */
#slideshow {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  
  /* Stijl voor elke slide */
  .slide {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0; /* Begin met een doorzichtige slide */
    transition: opacity 1s ease-in-out; /* Soepele overgang voor de fade */
    z-index: 0; /* Zet slides op dezelfde z-index */
  }
  
  /* Zorgen dat de slide afbeeldingen de container vullen */
  .slide img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Zorgt voor schalen zonder vervorming */
  }
  
  /* Donkere overlay stijl */
  .dark-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5); /* Pas dekking aan voor donkerder of lichter effect */
    z-index: 1; /* Zet het tussen de afbeeldingen en de tekst */
  }
  
  /* Zet de u-sheet boven de slideshow */
  .u-sheet-1 {
    position: relative;
    z-index: 2; /* Voorgrond zetten */
  }
  
  /* Animatie voor de fade */
  @-webkit-keyframes fade {
    from {opacity: .4} 
    to {opacity: 1}
  }
  
  @keyframes fade {
    from {opacity: .4} 
    to {opacity: 1}
  }