adaptive_video

adaptive_video

<div class="relation">
	<div class="relation__offset relation__offset-16-9"></div>
	<div class="relation__content">
		<iframe class="video__content" src="https://www.youtube.com/embed/KFVoIzaGPYg" ></iframe>
	</div>
</div>

.relation{
    max-width: 560px;
    position: relative;
}

.relation__offset{
    height: 0;
}

.relation__offset-1-1{
    padding-top: 100%;
}

.relation__offset-16-9{
    padding-top: 56.25%;
}

.relation__content{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.relation__content iframe,
.relation__content object,
.relation__content embed
{
    width: 100%;
    height: 100%;
    border: none;
}