/* footer.css */

  html, body {
    height: 100%; /* Stellt die Höhe des HTML- und Body-Elements auf 100% */
    margin: 0; /* Entfernt die Standard-Margins */
    display: flex; /* Aktiviert Flexbox */
    flex-direction: column; /* Setzt die Flex-Richtung auf vertikal */
  }

.footer {
  display: flex;
  align-items: center; /* Elemente vertikal zentrieren */
  justify-content: space-between; /* Elemente gleichmäßig verteilen */
  padding: 20px;
  font-family: Arial, sans-serif; /* Konsistente Schriftart */
}

.footer-container {
  max-width: 1200px; /* Maximale Breite */
  margin: auto; /* Zentrieren des Containers */
  display: flex;
  justify-content: space-between; /* Gleichmäßige Verteilung */
}

.footer-links a {
  margin: 0 10px; /* Horizontaler Abstand */
}

/* Übernehmen des Hover-Effekts aus header.css */
.footer a:hover {
  opacity: 0.5;
}

.copyright {
  padding: 0 40px;
}

.scroll-to-top {
  position: fixed; /* Festpositionierung */
  bottom: 20px; /* Abstand vom unteren Rand */
  right: 10px; /* Abstand vom rechten Rand */
  font-size: 24px; /* Größe des Symbols */
  line-height: 40px; /* Höhe der Zeile für die vertikale Zentrierung des Symbols */
  width: 40px; /* Breite des Elements */
  height: 40px; /* Höhe des Elements */
  background-color: #f8f8f8; /* Hintergrundfarbe */
  color: black; /* Farbe des Symbols */
  text-align: center; /* Horizontale Zentrierung des Textes */
  border-radius: 50%; /* Runde Ecken für Kreisform */
  box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* Leichter Schatten für mehr Tiefe */
  opacity: 0.6;
}