/* Setzt die Grundstile */
body, html {
    height: 100%;
    margin: 0;
    font-family: 'Arial', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #1a1a1a; /* Dunkler Hintergrund basierend auf dem Logo */
    color: #f0ad4e; /* Farbe des Textes basierend auf dem Logo */
}

/* Zentriert den Inhalt vertikal und horizontal */
.container {
    text-align: center;
}

/* Stil für das Logo */
.logo {
    width: 50%; /* Responsiv für verschiedene Geräte */
    max-width: 50%; /* Maximale Breite */
    margin-bottom: 20px; /* Abstand zum Text */
}



/* Responsivität für kleinere Geräte */
@media (max-width: 600px) {
    .logo {
        width: 100%; /* Größere Breite auf kleinen Geräten */
    }
    
    .coming-soon {
        font-size: 1.5em; /* Kleinere Schriftgröße auf kleinen Geräten */
    }
}


/* Addiere deine vorherigen Styles hier, mit der Ausnahme der .coming-soon Klasse */

/* Stil für den "Coming Soon" Text */
.coming-soon {
    font-size: 2em;
    font-weight: bold;
    color: inherit;
    white-space: nowrap;
    overflow: hidden;
	word-spacing: 0.3em;
    /* Entferne die Breitenangabe und die Animation */
}




/* Responsivität für kleinere Geräte */
@media (max-width: 600px) {
    .coming-soon {
        font-size: 1.5em;
    }
}


@media (max-width: 1200px) {
    .logo {
        width: 100%; /* Größere Breite auf kleinen Geräten */
    }