@use "sass:math";

//
// Responsive video wrap
//

.video-responsive-wrap {
    height: 0;
    position: relative;
    padding-bottom: math.percentage(math.div(9, 16));

    &.video-ratio-5-4 { padding-bottom: math.percentage(math.div(4, 5)); }
    &.video-ratio-4-3 { padding-bottom: math.percentage(math.div(3, 4)); }
    &.video-ratio-3-2 { padding-bottom: math.percentage(math.div(2, 3)); }
    &.video-ratio-8-5 { padding-bottom: math.percentage(math.div(5, 8)); }
    &.video-ratio-5-3 { padding-bottom: math.percentage(math.div(3, 5)); }
    &.video-ratio-16-9 { padding-bottom: math.percentage(math.div(9, 16)); }
    &.video-ratio-2-1 { padding-bottom: math.percentage(math.div(1, 2)); }

    iframe,
    embed,
    object {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }
}