html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}



a {
  text-decoration: none;
  font-weight: bold;
  color: #0033cc;
}

a:hover {
  text-decoration: none;
  font-weight: bold;
  color: #3366ff;
}


.bg-navbar {
  background-color: #0066CC;
}


#wrapper {
    padding: 2em;
}

body {
  background: #ABDCFF;
  background: linear-gradient(90deg, rgba(171, 220, 255, 1) 0%, rgba(204, 233, 252, 1) 50%, rgba(171, 220, 255, 1) 100%);

  font-family: 'Overpass', sans-serif;
  font-weight: normal;
  font-style: normal;
}



p {
   font-family: 'Overpass', sans-serif;
   font-weight: normal;
   font-style: normal;
   font-size: 16pt;
}

.img-90 {
  width: 90%;
  height: auto;
}


.carousel-container {
    position: relative;
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Verhindert, dass das Bild über den Container hinausragt */
}

.carousel-slide {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.carousel-slide img {
    max-height: 100%; /* Das Bild nimmt maximal die Höhe des Containers ein */
    width: auto; /* Behält das Seitenverhältnis des Bildes bei */
}