.greenscreen, .greenscreen span {
    text-decoration: underline;
}

@media only screen and (max-width: 1000px) {
    .bg1 {
        background-position: 70%;
    }
    .bg2 {
        background-position: 34%;
    }
    .bg3 {
        background-position: 30%;
    }
}

.pt-500 {
    padding-top: 650px;
    text-shadow: -1px 0 #3b3b3b, 0 1px #3B3B3B, 1px 0 #3B3B3B, 0 -1px #3B3B3B;
}

.mobile-nav {
    color: black;
}

/* 1. Styling für den Hauptcontainer (Zentrierung) */
.video-preview-area {
    position: relative;
    width: 100%;
    text-align: center;
    display: block;
    margin: 20px 0;
}

/* 2. Styling für das quadratische Thumbnail (200px) */
.video-thumbnail {
    position: relative;
    cursor: pointer;
    width: 400px;
    height: 400px;
    max-width: 100%;
    overflow: hidden;
    display: inline-block;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

/* 3. Bild-Styling */
.video-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* 4. Play-Icon Styling (Font Awesome Icon) */
.play-icon-fa {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    font-size: 4em; /* Größer für besseren visuellen Effekt */
    color: white;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.8); /* Schatten für bessere Sichtbarkeit */

    transition: color 0.3s;
    pointer-events: none;

    /* Font Awesome spezifisch: Hintergrund entfernt, da das Icon selbst oft einen Kreis hat */
}

.video-thumbnail:hover .play-icon-fa {
    color: #cdcdcd; /* Icon-Farbe beim Hover ändern */
}

/* 5. Modal-Styling für <dialog> */
dialog {
    border: none;
    padding: 0;
    background: transparent;
    max-width: 90vw;
    max-height: 90vh;
    overflow: hidden
}

dialog video:focus-visible {
    outline: none
}

dialog::backdrop {
    background: rgba(0, 0, 0, 0.9);
}

/* 6. Schließen-Button */
.close-button {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255, 255, 255, 0.7);
    border: none;
    font-size: 2em;
    cursor: pointer;
    line-height: 1;
    padding: 2px 10px;
    border-radius: 5px;
    z-index: 10;
}