.mod_navigation {
  border-bottom: 1px solid black; /* Dünne schwarze Linie am unteren Rand */
  width: 100%;
  height: 2.5rem; /* Festgelegte Höhe der gesamten Navbar */
}

.mod_navigation ul { 
  list-style: none; /* Entfernt die Standard-Punkte der Liste */
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  width: 100%; /* Die gesamte Breite wird genutzt */
}

.mod_navigation ul li {
  flex: 1; /* Jeder <li> nimmt den gleichen Platz ein */
  text-align: center; /* Zentriert den Text innerhalb jedes Feldes */

  height: 2.5rem; /* Höhe der Listenelemente */
  display: flex;
  align-items: center; /* Vertikale Zentrierung des Textes */
  justify-content: center; /* Horizontale Zentrierung des Textes */
}

.mod_navigation ul li:not(:last-child) {
  border-right: 1px solid black; /* Fügt eine vertikale Linie rechts vom Navigationspunkt hinzu */
}
.mod_navigation li a {
  text-decoration: none; /* Entfernt die Unterstreichung */
  color: black; /* Farbe des Textes */
  height: 100%; /* Links füllen die gesamte Höhe der Listenelemente */
  display: flex;
  align-items: center; /* Zentriert den Text vertikal */
  justify-content: center; /* Zentriert den Text horizontal */
}

.mod_navigation li a:hover {
  color: red; /* Farbe beim Hover-Effekt */
}

.mod_navigation li .active {
  color: red; /* Farbe für das aktive Element */
  font-weight: normal;
}




@media screen and (max-width:39.9999rem) {
.mod_navigation {
font-size: 13.5px;
}}