.video-player{
    display: flex;
    margin: var(--block-margin) 0;
    overflow: hidden;
    position: relative;
}

.video-player.alignfull{
    width: 100%;
    max-width: 100%;
}

.video-player-image img,
.video-player-video-player img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.video-player-video-player :is(iframe, video){
    display: block;
    border: none;
    border-radius: var(--element-border-radius);
}

.video-player .video-player-video-player :is(iframe, video){
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    position: relative;
}

.video-player-wrapper{
    margin: 0 auto;
    position: relative;
}

.video-player-inner {
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    row-gap: var(--item-row-gap);
}

.video-player-inner>*:last-child{
    margin-bottom: 0;
}

.video-player-content{
    margin-bottom: calc(1em * var(--secondary-line-height));
}

.video-player-buttons{
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: calc( var(--item-column-gap) / 2);
    row-gap: var(--item-row-gap);
}

@media (min-width: 768px){
    .video-player .video-player-wrapper{
        width: var(--wide-width);
    }

    .video-player:is([data-align="left"]) .video-player-inner {
        text-align: left;
    }

    .video-player:is([data-align="center"]) .video-player-inner {
        text-align: center;
    }

    .video-player:is([data-align="right"]) .video-player-inner {
        text-align: right;
    }

    .video-player:is([data-content-width="50"]) .video-player-inner{
        width: 50%;        
    }

    .video-player:is([data-content-width="80"]) .video-player-inner{
        width: 80%;        
    }

    .video-player:is([data-content-width="full"]) .video-player-inner{
        width: 100%;        
    }
}