/* @media (max-width: 767px){ */
@media (max-width: 400px){

/* #header .inside, */
#main .inside,
.inside{
    width: 90% !important;
}

#reihe img{
    display: none;
    /* border: 4px solid green;  /* aug, 05.12.2018 */
}

.slider-wrapper .ce_text {
  /* height: 350px; */
  height: 100%;
}

#logo, #logo svg {
  margin: 0 auto;
}
     /* border: 4px solid green;  /* aug, 05.12.2018 */


#wrapper {
  margin: 0;
  width: auto;
}

/*
img{
    width: 100%;
    height: auto;
}
    /* border: 4px solid red;  /* aug, 05.12.2018 */

}

/* ===== Footer Mobile: Zentrierung + Reihenfolge ===== */
@media (max-width: 767px){
  #footer .inside .footer-row{
    display: grid !important;
    grid-template-columns: 1fr !important;
    row-gap: 10px !important;
    justify-items: center !important;
  }

  /* Titel zentrieren (grid3/floats aushebeln) */
  #footer .inside .footer-row > h4,
  #footer .inside .footer-row .footer-title{
    float: none !important;
    width: auto !important;
    max-width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
    justify-self: center !important;
  }

  /* Navigation zentriert */
  #footer .inside .footer-row .footer-nav{
    width: 100% !important;
    padding-right: 0 !important;
    text-align: center !important;
  }
  #footer .inside .footer-row .footer-nav ul{
    justify-content: center !important;
  }

  /* Bild ganz unten und zentriert */
  #footer .inside .footer-row > img.footer-sponsor,
  #footer .inside img.footer-sponsor{
    float: none !important;
    justify-self: center !important;
    margin: 0 auto !important;
    display: block !important;
    height: 80px !important;
    max-width: 90% !important;
  }
}

/* Footer Mobile: jeden Navigationspunkt in eigene Zeile */
@media (max-width: 767px){
  #footer .inside .footer-row ul.level_1{
    display: block !important;      /* statt inline-flex */
    text-align: center !important;
  }

  #footer .inside .footer-row ul.level_1 > li{
    display: block !important;
    float: none !important;
    margin: 4px 0 !important;       /* Abstand zwischen den Links */
  }
}

/* Header Mobile: jeden Menüpunkt in eigene Zeile */
@media (max-width: 767px){
  #header .mod_navigation ul.level_1{
    display: block !important;
    text-align: center !important;
  }

  #header .mod_navigation ul.level_1 > li{
    display: block !important;
    float: none !important;
    margin: 6px 0 !important;
  }

  /* Links auf volle Breite, damit sie nicht „nebeneinander“ wirken */
  #header .mod_navigation ul.level_1 > li > a,
  #header .mod_navigation ul.level_1 > li > span,
  #header .mod_navigation ul.level_1 > li > strong{
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }
}

/* Header Mobile: Untermenüs (Level 2) zentrieren */
@media (max-width: 767px){

  /* Container des Untermenüs */
  #header .mod_navigation ul.level_2{
    position: static !important;     /* kein absolutes Positionieren */
    width: 100% !important;
    text-align: center !important;
    margin: 6px 0 10px 0 !important;
    padding: 0 !important;
  }

  /* Einträge im Untermenü */
  #header .mod_navigation ul.level_2 > li{
    display: block !important;
    float: none !important;
    text-align: center !important;
    margin: 4px 0 !important;
  }

  #header .mod_navigation ul.level_2 > li > a,
  #header .mod_navigation ul.level_2 > li > span,
  #header .mod_navigation ul.level_2 > li > strong{
    display: block !important;
    text-align: center !important;
    width: 100% !important;
  }
}


@media (max-width: 767px){
  #saechsisch{
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    top: 0 !important;          /* ggf. anpassen: z.B. 6px */
    margin: 0 !important;
  }
}

@media (max-width: 767px){

  /* Header-Grid/Floats auf Mobile deaktivieren */
  #header .inside [class^="grid"],
  #header .inside [class*=" grid"]{
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* Vereinslogo als eigener Block */
  #logo{
    display: block !important;
    float: none !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto 14px auto !important;
    position: relative !important;
    z-index: 2 !important;
  }
  #logo img, #logo svg{
    display: block !important;
    margin: 0 auto !important;
  }

  /* Navigation sicher UNTER das Logo zwingen */
  #header .mod_navigation{
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    top: auto !important;
    z-index: 3 !important;
  }
}

@media (max-width: 767px){

  /* Header bekommt oben Platz für das Sachsen-Wappen */
  #header .inside{
    position: relative !important;
    padding-top: 48px !important;   /* ggf. 40–60 testen */
  }

  /* Sachsen-Wappen oben zentriert im Header */
  #saechsisch{
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    top: 6px !important;
    z-index: 1 !important;
  }

  /* Vereinslogo und Navigation liegen sicher darunter */
  #logo{
    position: relative !important;
    z-index: 2 !important;
    margin-top: 0 !important;
    margin-bottom: 64px !important; /* Abstand zur Navigation */
  }

  #header .mod_navigation{
    position: relative !important;
    z-index: 3 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

@media (max-width: 767px){

  /* Einheitliche Klickflächen/Höhen für alle Menüpunkte (auch <strong>) */
  #header .mod_navigation a,
  #header .mod_navigation span,
  #header .mod_navigation strong{
    height: auto !important;
    padding: 3px 0 !important;
    line-height: 1.2 !important;
  }

  /* Einheitlicher Abstand zwischen den Zeilen */
  #header .mod_navigation ul.level_1 > li{
    margin: 3px 0 !important;
  }
}

/* Zentrierung im Mobile-Stylesheet erzwingen */
.inside,
#header .inside,
#main .inside{
  width: 90% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
  box-sizing: border-box;
}

/* grid13 auf Desktop neutralisieren (mod_article, Navigation, etc.) */
#main .mod_article.grid13,
#header .mod_navigation.grid13,
.grid13{
  float: none !important;
  width: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}

/* sicherstellen, dass der normale Content-Container zentriert bleibt */
#main .inside,
#header .inside{
  width: 90% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}