/* Media Query für Bildschirmgrößen kleiner als 768px (z.B. Handys) */
@media (max-width: 768px) {
    /* Abstand vom oberen Rand für mobile Geräte erhöhen */
    #container {
        margin-top: 50px;
        flex-direction: column; /* Stapel die Elemente vertikal für mobile Geräte */
    }

    /* Breite des größeren Logos für mobile Geräte anpassen */
    #logo {
        width: 90%; /* An die Bildschirmbreite anpassen */
        max-width: 100px; /* Maximalbreite für das größere Logo festlegen */
        margin: 0; /* Kein horizontaler Abstand */
    }

    /* Verstecke das linke kleine Bild für mobile Geräte */
    #small-image-left {
        display: none;
    }

    /* Breite des Bildes rechts unterhalb des Logos für mobile Geräte anpassen */
    #small-image-right {
        width: 60%; /* An die Bildschirmbreite anpassen */
        max-width: 300px; /* Maximalbreite für das Bild festlegen */
        margin: 10px 0; /* Abstand oben und unten hinzufügen */
    }

    /* Breite des Bildes unterhalb des Logos für mobile Geräte anpassen */
    #image-below {
        width: 80%; /* An die Bildschirmbreite anpassen */
        max-width: 300px; /* Maximalbreite für das Bild festlegen */
        margin-top: 1px; /* Abstand auf 15px reduzieren */
    }
}
