body {
    background-color: #D3D3D3;  /*This is a light gray color. You can replace it with any color you like. */
    display: block;
    flex-direction: column;
    min-height: 100vh;
}



.navbar-custom {
    background-color: #4E9DBB;
    background: linear-gradient(to bottom, #4E9DBB, #6A90B5);
  }
  .navbar-custom .navbar-nav .nav-link {
    color: white;
  }


  .navbar-custom .navbar-nav .nav-link:not(.dropdown-toggle)::after {
    content: '';
    display: block;
    width: 1px;
    height: 100%;
    background-color: #fdf7f7e7;
    margin-left: 10px;
  }
  .navbar-custom .navbar-nav .nav-item:last-child .nav-link:not(.dropdown-toggle)::after {
    display: none;
  }

  .navbar-nav .nav-item:not(:last-child) {
    border-right: 1px solid #fff; /* Macht senkrechte Striche zwischen den Menüpunkten */
    }

    nav a.active {
      color: red;
      font-weight: bold;
    }

 
  .content-wrapper {
    background-color: #f3ecdb;
    border-radius: 30px;
    border: 12px solid #0567a9a7; /* This adds a 5px thick black border. */
    padding: 20px;
    margin: 20px auto;
    max-width: 900px;
    text-align: center;
    min-height: 80vh; /* Adjust this value as needed */
  }
  
  .logo {
    margin-bottom: 20px;
  }
  .page-background {
        background-color: #c9b7b78f;
        padding: 20px;
  }
  .navbar-brand {
    font-size: 18px; /* Adjust the font size as needed */
  }

  .logo img {
    margin: 0 auto;
  }

  .h1-custom-color {
    color: #17548d;
}

.h1-custom-header {
    font-size: 30px;
    margin-bottom: 20px;
}

.h4-custom-header {
    font-size: 20px;
    margin-bottom: 6px;
}

.text-left {
    text-align: left;
}

.home-icon {
    font-size: 26px; /* Adjust as needed */
}


table {
  border-collapse: collapse;
  text-align: left;
}

th, td {
  padding: 8px;
  border: 1px solid black;
  text-align: left;
}

table.osm th, table.my-table td {
  text-align: left;
}

.centered-table {
  margin-left: auto;
  margin-right: auto;
}

.main {
  flex: 1;
}


#carouselSerie {
  width: 100%; /* Volle Breite */
  height: auto; /* Feste Höhe */
  object-fit: cover;
}

.carousel-inner {
  height: auto; /* Feste Höhe, die zu deinen Bildern passt */
  object-fit: cover;
}


.carousel-item {
  height: auto; /* oder eine andere Höhe, die du möchtest */
  object-fit: cover;
}

.carousel-item img {
  width: 100%;
  height: auto; /* Höhe anpassen, um das Seitenverhältnis zu bewahren */
  object-fit: cover; /* Füllt den Container aus, ohne das Seitenverhältnis zu verzerren */
}

/* Standardgröße für größere Bildschirme */
#carouselSerie {
  width: 100%;
  height: 600px; /* Feste Höhe für größere Bildschirme */
}

/* Für kleinere Bildschirme, z.B. Smartphones */
@media (max-width: 768px) {
  #carouselSerie {
    height: 200px; /* Kleinere Höhe für mobile Geräte */
  }

  .pdf-container {
    width: 100%;          
    height: 100vh;          /* Volle Bildschirmhöhe */
    margin-bottom: 50px;    /* Abstand zwischen PDFs optional */
}

.pdf-container iframe {
    width: 100%;            /* Volle Breite */
    height: 100%;           /* Volle Höhe des Containers */
    border: none;           /* Rand entfernen */
}