Responsive Video

In this example we're using a YouTube video.

Surround the video iframe in a DIV, here we're assigning the class video-responsive ;

<div class="video-responsive">
    <iframe 
        width="853" 
        height="480" 
        src="https://www.youtube.com/embed/YOUR_VIDEO_ID" 
        frameborder="0" 
        allowfullscreen>
    </iframe>
</div>

Then add this custom CSS;

.video-responsive {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
}

.video-responsive iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

‍