/* Allgemeine Stile und Layouts für verschiedene Bildschirmgrößen */
@media (max-width: 1080px) {
  .three-column-layout {
    grid-template-columns: 1fr; /* Bilder früher nach unten springen lassen */
    padding: 5%;
  }

  .two-column-layout {
    grid-template-columns: 1fr; /* Zwei-Spalten-Layout auf eine Spalte reduzieren */
    padding: 5%;
  }

  .two-column-layout.contact-costs-section {
    grid-template-columns: 1fr; /* Zwei-Spalten-Layout auf eine Spalte reduzieren */
    padding: 5%;
  }

  .welcome-section, .directions-section {
    display: block; /* Container auf Block-Layout einstellen */
    padding: 5%;
  }

  .welcome-section .column, .directions-section .column {
    width: 100%; /* Spalten auf volle Breite einstellen */
    padding: 20px 0;
  }

  .column img, .logo img {
    max-width: 100%; /* Bilder auf volle Breite einstellen */
    height: auto;
  }

  .jumping-button {
    display: none;
  }
}

@media (max-width: 768px) {
  body, html {
    font-size: 1em;
  }

  h1, h2, h3, ul, p {
    padding-left: 5%;
    padding-right: 5%;
  }

  .topnav {
    max-height: 0; /* Eingeklapptes Menü */
    overflow: hidden;
  }

  .topnav a {
    float: none;
    display: block;
    text-align: left;
  }

  .menu-icon {
    display: block;
  }

  .menu-toggle:checked ~ .topnav {
    max-height: 300px;
  }

  .topnav a {
    display: block;
    width: 100%;
  }

  .menu-icon {
    display: block;
  }

  .topnav {
    background-color: darkgrey; /* Weißer Hintergrund für das ausgeklappte Menü */
  }

  .topnav.show {
    max-height: 400px; /* Anpassung der Höhe nach Bedarf */
  }

  .close-btn {
    display: block; /* Schaltfläche zum Schließen in der mobilen Ansicht anzeigen */
    font-size: 14px;
    cursor: pointer;
    color: dimgrey;
  }
	
  .parallax-section {
    background-attachment: scroll; /* Deaktiviere Parallax auf mobilen Geräten */
    height: 50vh; /* Reduziere die Höhe für mobile Geräte */
  }
	
  .footer {
    position: static; /* Standardposition für mobile Geräte */
    height: 50px;
    padding-bottom: 7px;
  }
  
  .jumping-button {
    display: none; /* Button auf kleinen Bildschirmen ausblenden */
  }
  }
 