.elementor-1005 .elementor-element.elementor-element-25f024b{--display:flex;}/* Start custom CSS *//* Container für das Video */
.fullscreen-video-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw; /* Volle Breite */
    height: 100vh; /* Volle Höhe */
    overflow: hidden; /* Verhindert Scrollen */
    z-index: 10; /* Video sichtbar */
    display: flex;
    justify-content: center;
    align-items: center; /* Zentriert das Video */
    background-color: black; /* Hintergrundfarbe schwarz */
}

/* Standard Video im normalen Modus - Schwarze Ränder, falls das Video nicht passt */
.fullscreen-video {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Video bleibt vollständig sichtbar, schwarze Ränder, wenn zu klein */
}

/* Steuerelemente-Container */
.controls-container {
    position: absolute;
    bottom: 10%; /* 10% Abstand vom unteren Rand */
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
}

/* Play/Pause Button */
.play-pause-button {
    background: rgba(0, 0, 0, 0.7); /* Halbtransparenter Hintergrund */
    color: white;
    border: none;
    border-radius: 50%;
    width: 40px; /* Kleinere Größe */
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.3s ease;
}

.play-pause-button:hover {
    background: rgba(255, 255, 255, 0.8); /* Hellerer Hintergrund bei Hover */
    color: black;
}

/* 10 Sekunden Vorwärts/Zurück Buttons */
.seek-button {
    background: rgba(0, 0, 0, 0.7); /* Halbtransparenter Hintergrund */
    color: white;
    border: none;
    border-radius: 50%;
    width: 40px; /* Kleinere Größe */
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.3s ease;
    margin: 0 10px;
}

.seek-button:hover {
    background: rgba(255, 255, 255, 0.8); /* Hellerer Hintergrund bei Hover */
    color: black;
}

/* Vollbildmodus-Button */
.fullscreen-button {
    position: absolute;
    bottom: 10%; /* 10% Abstand vom unteren Rand */
    right: 5%; /* 5% Abstand vom rechten Rand */
    background: rgba(0, 0, 0, 0.7); /* Halbtransparenter Hintergrund */
    color: white;
    border: none;
    border-radius: 50%;
    width: 40px; /* Kleinere Größe */
    height: 40px;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10; /* Über dem Video sichtbar */
    transition: background 0.3s ease;
}

.fullscreen-button:hover {
    background: rgba(255, 255, 255, 0.8); /* Hellerer Hintergrund bei Hover */
    color: black;
}

/* Zeitanzeige */
.time-display {
    position: absolute;
    bottom: 5%; /* 5% Abstand vom unteren Rand */
    left: 5%; /* 5% Abstand vom linken Rand */
    color: white;
    font-size: 1.2rem;
    z-index: 10;
    background: rgba(0, 0, 0, 0.5); /* Halbtransparenter Hintergrund */
    padding: 5px 10px;
    border-radius: 5px;
    display: block; /* Anfangs sichtbar */
}

/* Verstecke die Buttons und den Mauszeiger bei Inaktivität */
.hidden {
    display: none;
}

/* Mauszeiger ausblenden */
.cursor-hidden {
    cursor: none;
}

/* MOBILE-ANPASSUNGEN: */
@media (max-width: 768px) {
    /* Buttons sind immer sichtbar und kleiner */
    .play-pause-button, .fullscreen-button, .seek-button {
        width: 35px; /* Kleinere Buttons */
        height: 35px;
        font-size: 1.2rem; /* Kleinere Schriftgröße für Mobile */
    }

    /* Steuerelemente nach oben verschieben auf mobilen Geräten */
    .controls-container {
        bottom: 15%; /* Weiter nach oben verschoben */
    }

    .fullscreen-button {
        bottom: 15%; /* Weiter nach oben verschoben */
    }
}

/* PC-ANPASSUNGEN: */
@media (min-width: 769px) {
    /* Auf PC werden die Buttons weiter nach unten verschoben */
    .controls-container {
        bottom: 5%; /* Weiter nach unten verschoben */
    }

    .fullscreen-button {
        bottom: 5%; /* Weiter nach unten verschoben */
    }
}/* End custom CSS */