/* Allgemeines Styling */
body {
    margin: 0;
    background-color: black;
    color: white;
    font-family: Arial, sans-serif;
    text-align: center;
    background-image: url('bilder/watermark.png'); /* Wasserzeichen */
    background-repeat: repeat; /* Wiederholen */
    background-position: top left; /* Ausrichtung */
}

/* Fotostreifen Styling */
.slider-container {
    overflow: hidden;
    width: 100%;
    height: 300px;
    position: relative;
}

.slider {
    display: flex;
    width: calc(300px * 10); /* 5 Originalbilder + 5 Duplikate */
    animation: scroll 15s linear infinite;
}

.slider img {
    width: auto;
    height: 300px;
    object-fit: cover;
}

/* Animation */
@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-300px * 5)); /* Nur 5 Bilder weit scrollen */
    }
}

/* Container für den Text */
.text-container {
    background-color: black; /* Schwarzer Hintergrund für den Text */
    padding: 20px;
    display: inline-block; /* Begrenze die Breite */
    margin-top: 20px;
}

/* Text Styling */
.title {
    font-size: 6rem; /* 6xl */
    color: yellow;
    margin: 20px 0;
}

.email {
    font-size: 1.5rem;
    color: blue;
}

.email .mailto {
    color: limegreen;
    text-decoration: none;
}

.logo-row {
    background-color: black; /* Schwarzer Hintergrund für die gesamte Zeile */
    height: 180px; /* Höhe der Zeile (anpassbar) */
    display: flex; /* Flexbox für zentrierte Ausrichtung (optional) */
    align-items: center; /* Vertikale Zentrierung */
    position: relative; /* Positionierung für Inhalte innerhalb */
}

/* Logo Styling */
.logo {
    margin: 20px; /* Abstand links */
    padding: 20px;;
    height: auto; /* Automatische Höhe */
    max-height: 150px; /* Maximale Höhe des Logos (anpassbar) */
}