//https://www.w3schools.com/howto/howto_js_fullscreen_overlay.asp
.bg__html5-video-player {
    position: relative;
    overflow-y: hidden;

    .default {
        /* no default stuff yet */
    }

    video {
        object-fit: contain;
        min-height: 300px;
        max-height: 50vh;
    }

    .full-screen {
        height: 100%;
        max-height: 100%;
        width: 100%;
        position: fixed;
        display: flex;
        left: 0;
        top: 0;
        background-color: rgb(0, 0, 0); /* Black fallback color */
        background-color: rgba(0, 0, 0, 0.9); /* Black w/opacity */
        overflow-x: hidden; /* Disable horizontal scroll */
        overflow-y: hidden; /* Disable horizontal scroll */
        transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
        z-index: 2000; /*crank up that z-index so this video conquers all! :) */

        video {
            max-height: 100%;
        }
    }
}