/* L A P T O P  S  1 5 - Z O L L ::::::::::::::::::::::::::::::::::::::::: */
@media (max-width: 1367px) {
    #wrapper {
        flex-direction: column;
        align-items: center;
        height: auto;
        row-gap: 24px;
        position: relative;
    }

    /* Submenu dezenter + kein Overlay */
    #sub_menu {
        position: relative;
        /* kein absolutes Overlay mehr */
        top: 0;
        display: flex;
        justify-content: center;
        padding: 6px 0;
        background: rgba(59, 40, 23, 0.4);
        border-bottom: 1px solid rgba(210, 189, 162, 0.2);
        width: 100%;
    }

    #sub_menu a {
        color: rgb(241, 230, 217);
        padding: 0 10px;
        font-size: 0.9rem;
    }

    #sub_menu {
  position: relative;
  top: 0;
  display: flex;
  justify-content: center;      /* zentriert horizontal */
  align-items: center;
  width: 100%;
  padding: 6px 0;
  background: rgba(59, 40, 23, 0.4);
  border-bottom: 1px solid rgba(210, 189, 162, 0.2);
  z-index: 999;
}

/* Liste und Abstände neutralisieren */
#sub_menu ul {
  list-style: none;
  margin: 0;                    /* entfernt Standard-Margin */
  padding: 0;
  display: flex;
  justify-content: center;      /* zentriert Inhalte */
  gap: 1em;                     /* gleichmäßiger Abstand */
}

#sub_menu li {
  display: inline-block;
  padding: 0;
}

#sub_menu a {
  color: rgb(241, 230, 217);
  font-size: 0.9rem;
  text-decoration: none;
  transition: color 0.5s ease;
  padding: 0 10px;
}

#sub_menu a:hover {
  color: #FFCC00;
}


    #col_left,
    #col_middle,
    #col_right {
        flex: 0 0 auto;
        width: 100%;
        justify-content: center;
    }

    #info_container {
        border: 1px solid rgb(210, 189, 162);
        border-radius: 1em;
    }

    #info_container,
    #flyer_dl,
    #about_container {
        width: 90%;
        max-width: 100%;
        height: auto;
        margin: 12px auto;
    }

    /* Flyer etwas kleiner */
    #flyer_dl {
        width: 50vw;
        aspect-ratio: 1 / 1;
        height: auto;
    }

    #flyer_dl a {
        width: 94%;
        aspect-ratio: 1 / 1;
    }

    /* Info-Bild deutlich höher */
    #info_location {
        min-height: 440px;
        /* doppelt so hoch wie vorher */
    }

    #about {
        height: auto;
    }
}

/* L A P T O P S 1 4 - Z O L L ::::::::::::::::::::::::::::::::::::::::::: */
@media (max-width: 1281px) {
    #wrapper {
        row-gap: 28px;
    }

    #info_container,
    #flyer_dl,
    #about_container {
        width: 92%;
    }

    #info_location {
        min-height: 400px;
    }
}

/* T A B L E T ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media (max-width: 1025px) {
    #social_media img {
        width: 44px;
        height: 44px;
    }

    #info_location {
        min-height: 380px;
    }
}

/* S M A R T P H O N E S ::::::::::::::::::::::::::::::::::::::::::::::::: */
@media (max-width: 769px) {

    #info_container,
    #about_container {
        padding: 24px;
    }

    #about {
        font-size: 1.05em;
    }

    #info_location {
        min-height: 360px;
    }

    /* Flyer kleiner und mittig */
    #flyer_dl {
        width: 45vw;
        aspect-ratio: 1 / 1;
        height: auto;
    }

    #flyer_dl a {
        width: 92%;
        aspect-ratio: 1 / 1;
    }
}

/* K L E I N E  S M A R T P H O N E S :::::::::::::::::::::::::::::::::::: */
@media (max-width: 481px) {

    #info_container,
    #flyer_dl,
    #about_container {
        width: 94%;
        margin: 10px auto;
    }

    #info_location {
        min-height: 320px;
    }

    #flyer_dl {
        width: 55vw;
    }

    #social_media img {
        width: 40px;
        height: 40px;
    }
}