.sprungmarke {
    visibility: hidden;
    height: 0px !important;
    position: absolute;
    margin: -150px;
}


@media (min-width: 1200px) {
   /*.grid-child, container-component {
      max-width: 1000px;
      margin: 0 auto;
    }*/
  
    /*.site-grid, .grid-child, .navbar, .navbar-brand {
        max-width: 1000px;
        margin: 0 auto;
    }*/
}

/* Navigationsbar */
.container-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "top below"
                       "logo logo"
                       "nav nav";
 
}

.container-header .container-topbar {
  padding: .5em;
}
.container-header .container-topbar {
  grid-area: top;
}
.container-header .container-below-top {
  grid-area: below;
  justify-content: flex-end;
}
.container-header .grid-child:has(.navbar-brand) {
  grid-area: logo;
}
.container-header .container-nav {
  grid-area: nav;
}

@media (width >= 991.98px) {
  .container-header {
   grid-template-columns:
    [full-start] minmax(0,1fr)
    [main-start] repeat(4,minmax(0,19.875rem))
    [main-end] minmax(0,1fr)[full-end];
   grid-template-areas: ". logo nav nav nav .";
   gap: 0 1rem;
   
   
  
  .container-header:has(.container-below-top, .container-topbar) {
   grid-template-areas: ". top top below below ."
                        ". logo nav nav nav .";
   
   
  }
}

/* Banner */

/* Standardhöhe für Desktops (hier z. B. 350px) */
.banner-overlay,
.mod-custom.custom.banner-overlay {
    height: 350px; /* Passen Sie diesen Wert nach Wunsch an */
}

@media screen and (max-height:740px) {
    .container-banner .banner-overlay {
          height:100vh;
    }
}

.container-banner .banner-overlay {
   height:39vh !important;
}

@media screen and (height <= 740px) {
  .container-banner .banner-overlay {
    height: 39vh !important;
  }
}








/*Inhalt*/
/* 1. Den Grid-Child-Container ausbrechen lassen auf 100% Bildschirmbreite */
.site-grid > .grid-child.container-component {
    grid-column: full-start / full-end !important;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

/* 2. Den inneren Inhalt der Komponente (Beiträge/Blog) auf 1000px begrenzen und zentrieren */
.container-component > main {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;  /* Sicherheitsabstand für Mobilgeräte */
    padding-right: 20px; /* Sicherheitsabstand für Mobilgeräte */
    width: 100%;
}