@media (prefers-color-scheme: dark) {
}
/* Mobile Information */
@media (max-width: 768px) {
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
    header {
        height: auto;
        padding: 20px;
    }
    .header-container {
        flex-direction: column;
        text-align: center;
    }

    .profile-photo {
        margin-bottom: 10px;
    }

    nav ul {
        flex-direction: column;
        gap: 10px;
    }	
    .container-form {
        width: 100%; /* Breite anpassen für mobile Ansicht */
    }

    .thankYouPopup {
        width: 100%; /* Popup-Breite anpassen für mobile Ansicht */
        top: 50%; 
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .g-recaptcha {
        transform: scale(0.75); /* Skaliert den Button auf 75% seiner normalen Größe */
        transform-origin: left; /* Zentriert das Skalieren */
    }
    .text {
        display: none; /* Versteckt den Text in der mobilen Ansicht */
    }
    .items a {
        width: 60px; /* Reduziert die Breite des Buttons */
        justify-content: center; /* Zentriert das Icon im Button */
    }
    .status-list li {
        flex-direction: column;
    }
    .info {
        width: 100%; /* Sicherstellen, dass die Infos auf kleinen Bildschirmen schön gestaltet sind */
    }
    .social-btn {
        border-radius: 50%;
/*        width: 100%;  */  /* Breite auf 100% setzen, damit Buttons untereinander angezeigt werden */
        max-width: 64px; /* Maximalbreite der Buttons */
    }
    .social-media-buttons {
        flex-direction: column; /* Verändert die Ausrichtung zu vertikal */
    }
    .mobile-nav ul {
        display: flex;
        justify-content: center;
        width: 100%;
        text-align: center;
    }
    .mobile-nav ul li {
        list-style-type: none; /* Entfernt die Standard-Aufzählungszeichen */
        margin: 0 15px; /* Abstand zwischen den Menüpunkten */
    }
    .mobile-nav ul li a {
        text-decoration: none;
        color: var(--color-text); /* gewünschte Textfarbe */
    }
    .desktop-menu {
        display: none; /* Desktop-Menü ausblenden */
    }

    .mobile-menu {
        display: block; /* Mobile-Menü sichtbar */
    }

    .mobile-menu-up {
        display: block; /* Mobile-Menü sichtbar */
    }

    #mobile-menu-list.open {
        display: block; /* Mobile Menü wird eingeblendet */
    }

    #mobile-menu-list-up.open {
        display: block; /* Mobile Menü wird eingeblendet */
		top: -250%;
    }
}
