Aspect ratio mixin (source: https://css-tricks.com/snippets/sass/maintain-aspect-ratio-mixin/)

aspect-ratio.scss

@mixin aspect-ratio($width, $height) {
    position: relative;
    &:before{
        display: block;
        content: " ";
        width: 100%;
        padding-top: ($height / $width) * 100%;
    }

    > .content {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
}
// usage ratio
.21-9 {
    @include aspect-ratio(21,9);  
}