.vjs-poster { display: none !important; }

/* videojs.js Style */
.perle-video-class video {
    aspect-ratio: 16/9;
    position: relative;
    overflow: hidden;
    object-fit: cover;
}
#my-video {
    background-color: transparent !important;
    overflow: hidden;
}

/* Button */
.at-video-js .vjs-big-play-button {
    animation: perleopacity 1s ease 1s forwards;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    width: 20%;
    height: auto;
    aspect-ratio: 16/9 !important;
    line-height: inherit;
    margin-top: unset;
    margin-left: unset;
}

@keyframes perleopacity {
    from { opacity: 0; }
    to { opacity: 1; }
}

.at-video-js .vjs-big-play-button .vjs-icon-placeholder::before {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 150%;
}

/* Controllbar */
#perle-video-container .at-video-js .vjs-control-bar {
    height: 38px;
    padding: 0px;
    font-size: 12px;
    background-color: rgba(43, 51, 63, 0.7);
}
#perle-video-container .vjs-picture-in-picture-control { display: none !important; }
#perle-video-container .vjs-fullscreen-control { margin-left: -10px !important; }
#perle-video-container .vjs-error .vjs-error-display:before { content: "⚠" !important; }
#perle-video-container .vjs-modal-dialog-content { display: none !important; }
#perle-video-container .vjs-modal-dialog { background-color: #139588 !important; }
#perle-video-container .at-video-js .vjs-control-bar * { font-family: VideoJS !important; }

/* Volle Responsivität für den Video-Container & Player */
#perle-video-container {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}

#perle-video-container video#my-video,
#perle-video-container .at-video-js {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    aspect-ratio: 16/9 !important;
}