There was a decent amount of swearing involved
I'll see if I can find the css I used.
EDIT
I added this CSS to my extra.css:
Code:
.video-container {
position: relative;
padding-top: 50%;
overflow: hidden;
width: 100%;
max-width: 560px;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
max-height: 320px;
}
and I changed my youtube media code to this:
HTML:
<div class="video-container">
<iframe class="responsiveVideo" type="text/html" width="100%" height="100%" src="//www.youtube.com/embed/{$id}?wmode=opaque&html5=1" frameborder="0" allowfullscreen></iframe>
</div>