.flex-layout.video_content-layout{
    margin-block: max(2rem, calc(4.5 * var(--su)));
}

.flex-layout.video_content-layout .video-col{
    position: relative;
}

.flex-layout.video_content-layout .video-col video{
    width: 100%;
}

.flex-layout.video_content-layout .video-col .mute-toggle{
    cursor: pointer;
    position: absolute;
    top: max(1rem, calc(1 * var(--su)));
    right: max(1rem, calc(1 * var(--su)));
    background-color: var(--accent-color);
    color: var(--text-color);
    border: none;
    border-radius: 50%;
    aspect-ratio: 1;
    padding: max(.25rem, calc(.25 * var(--su)));

    transition: scale 100ms ease-out;
}

.flex-layout.video_content-layout .video-col .mute-toggle span{
    display: block;
    aspect-ratio: 1;
    width: max(1rem, calc(1 * var(--su)));
    background-color: currentColor;
}

.flex-layout.video_content-layout .video-col .mute-toggle .mute{
    mask: url('/wp-content/themes/pk-theme-child/assets/icons/mute.svg') no-repeat center / contain;
}

.flex-layout.video_content-layout .video-col .mute-toggle .sound{
    mask: url('/wp-content/themes/pk-theme-child/assets/icons/sound.svg') no-repeat center / contain;
}

.flex-layout.video_content-layout .video-col .mute-toggle.active .mute,
.flex-layout.video_content-layout .video-col .mute-toggle:not(.active) .sound{
    display: none;
}

.flex-layout.video_content-layout .video-col .mute-toggle:active{
    scale: 0.95;
}

.flex-layout.video_content-layout .content-col{
    height: fit-content;
    margin-top: auto;
}