.youtube-embed {
    width: 100%;
    /* Verhindert, dass das Video breiter als der Container wird */
    max-width: 100%; 
}

.youtube-embed iframe {
    width: 100%;
    /* Moderne Methode: */
    aspect-ratio: 16 / 9;
    height: auto;
}

.slideshow-slogan {
  color: #ffffff;
}

.slideshow-h1 {
  color: #ffffff; 
  text-transform: uppercase;
}

.slideshow-h4 {
  color: #ffffff !important;
  font-weight: bold;
  font-size: large;
}

/* Slideshow – Smartphone */
@media (max-width: 575.98px) {

  .slideshow-h1 {
    font-size: 28px !important;
    line-height: 1.1 !important;
    overflow-wrap: break-word;
  }

  .slideshow-h4 {
    font-size: 16px !important;
    line-height: 1.3 !important;
  }

  .slideshow-slogan {
    font-size: 14px !important;
    line-height: 1.3 !important;
  }

}

/* Erzwungene Zentrierung für das horizontale Footer-Menü */
.footer-4-position ul.navHorizontalView {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Sorgt dafür, dass die Listenelemente selbst als Inline-Flex agieren */
.footer-4-position ul.navHorizontalView li {
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Setzt das gewünschte Trennzeichen | zwischen die Menüpunkte mit exakt gleichem Abstand */
.footer-4-position ul.navHorizontalView li + li::before {
    content: "|" !important;
    padding: 0 12px !important; /* Exakter Abstand links und rechts vom Strich */
    color: #4a5f41 !important;  
    font-weight: normal !important;
}

/* Setzt die störenden Standard-Abstände der Links zurück */
.footer-4-position ul.navHorizontalView li a {
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block !important;
}

/* Bilder in der Leistungstabelle */
.leistungen img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Smartphone */
@media (max-width: 575.98px) {

  .leistungen,
  .leistungen tbody,
  .leistungen tr {
    display: block;
    width: 100% !important;
  }

  .leistungen td {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .leistungen img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* Hauptüberschrift */
  .item-page h1 {
    font-size: 30px !important;
    line-height: 1.1 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

  /* Überschriften der einzelnen Leistungen */
  .leistungen h2,
  .leistungen h3,
  .leistungen h4 {
    font-size: 27px !important;
    line-height: 1.15 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

}