@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}
@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}
@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}

.ws-block-video__thumbnail,
iframe.ws-block-video__player {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}

.ws-block-video__player {
    display: none;
}

.ws-block-video__thumbnail {
    position: relative;
    display: flex;
}

.ws-block-video__thumbnail img {
    width: 100%;
    z-index: 50;
    position: relative;
    object-fit: cover;
}

.ws-block-video__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.3);
    z-index: 51;
    cursor: pointer;
}

.ws-block-video__play-button,
.ws-block-video__consent,
.ws-block-video__loading {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    display: none;
    align-items: center;
    justify-content: center;
    z-index: 52;
}

.video-player--ready .ws-block-video__play-button,
.video-player--consent .ws-block-video__consent,
.video-player--in-initialized .ws-block-video__loading,
.video-player--initialized .ws-block-video__player {
    display: flex;
}

.video-player--initialized .ws-block-video__thumbnail {
    display: none;
}

.ws-block-video__play-button svg,
.ws-block-video__play-button i,
.ws-block-video__loading svg,
.ws-block-video__loading i {
    font-size: 50px;
    color: white;
    cursor: pointer;
}

.ws-block-video__loading .fa-spinner-third {
    -webkit-animation:spin 1s linear infinite;
    -moz-animation:spin 1s linear infinite;
    animation:spin 1s linear infinite;
}