body { font-family: Arial, sans-serif; margin:0; padding:0; }
header { background:#0265CB; }


/* Hauptcontainer */
main {
    margin: 0 auto;
    width: 100%;
    max-width: 1000px;
    padding: 20px;
    box-sizing: border-box;
}

/* Sections */
section {
    margin-bottom: 20px;
    padding: 20px;
    background: #f5f5f5;
    border-radius: 8px;
}

/* Responsive Umbruch */
@media (max-width: 1000px) {
    main {
        padding: 15px;
    }

    section {
        padding: 15px;
    }
}

/* =========================
   Bilder
========================= */


/* Grundgröße der Bilder */
section img {
    max-width: 400px;
    height: auto;
}

/* Bild links */
.links {
    float: left;
    margin: 0 20px 10px 0;
}

/* Bild rechts */
.rechts {
    float: right;
    margin: 0 0 10px 20px;
}

/* Float innerhalb der Section aufräumen */
section::after {
    content: "";
    display: block;
    clear: both;
}

@media (max-width: 1000px) {

    .links,
    .rechts {
        float: none;
        display: block;
        margin: 15px auto;
    }

    section img {
        max-width: 100%;
    }

}

/* =========================
   Desktop     MENÜ
========================= */
.desktop-row {
    display:flex;
    align-items:center;
    justify-content: space-between;
    max-width:960px;
    margin:0 auto;
    padding:10px 20px;
}

.desktop-row .logo img { height:45px; }

#cssmenu-desktop {
    list-style:none;
    display:flex;
    justify-content:center;
    flex:1;
    margin:0;
    padding:0;
}

#cssmenu-desktop li { position:relative; }
#cssmenu-desktop a {
    display:block;
    padding:15px 20px;
    color:white;
    text-decoration:none;
}
#cssmenu-desktop a:hover { background:#444; }

#cssmenu-desktop .submenu {
    list-style: none;
    display:none;
    position:absolute;
    top:100%;
    left:0;
    background:#0B3B6D;
    min-width:180px;
}
#cssmenu-desktop .submenu li a {  padding:10px 15px; }
#cssmenu-desktop li.sub:hover > .submenu { display:block; }

#cssmenu-desktop .active  {
    color:red;
}

/* Desktop nur sichtbar, Mobile ausblenden */
.mobile-nav, #cssmenu-mobile { display:none; }

/* =========================
   Mobile    MENÜ
========================= */
@media (max-width:768px){
    .desktop-row, #cssmenu-desktop { display:none; }

    .mobile-nav {
        display:flex;
        align-items:center;
        justify-content:flex-start;
        padding:10px 15px;
    }
    .mobile-nav .logo-left { order:1; }
    .mobile-nav .logo-right { order:2; margin-left:10px; }
    #menu-toggle { order:3; margin-left:auto; display:block; background:none; border:none; color:white; font-size:28px; cursor:pointer; }

    .mobile-nav .logo-left a,
    .mobile-nav .logo-right a {
        display: inline-block; /* oder flex */
        width: auto;           /* optional: fixe Breite */
    }

    .mobile-nav .logo-left img,
    .mobile-nav .logo-right img {
        display: block;
        height: 45px;  /* feste Höhe, damit es sichtbar ist */
        width: auto;   /* proportional */
    }

    #cssmenu-mobile {
        list-style:none;
        display:none;
        flex-direction:column;
        margin:0;
        padding:0;
        background:#333;
    }
    #cssmenu-mobile.open { display:flex; }
    #cssmenu-mobile li { width:100%; }

    #cssmenu-mobile .submenu {
        display:none;
        position:relative;
        background:#444;
    }
    #cssmenu-mobile li.sub.open > .submenu { display:block; }

    #cssmenu-mobile a {
        display:block;
        padding:15px 20px;
        color:white;
        text-decoration:none;
    }
    #cssmenu-mobile a:hover { background:#444; }
}

/* =========================
   Weitere
========================= */

.footer {
         text-align:center;  }

 .footer-link {
         text-decoration: none; }

.strich1   {
         color: #0265CB;  }


#footer {
         background: #FFFFFF;
 }