body {
overflow: hidden;
}
.container {
--videoRatio: calc(16 / 9);
background-color: yellow;
padding: 0;
margin: 0;
width: 100vw;
height: 100vh;
overflow: hidden;
position: relative;
}
iframe {
padding: 0;
margin: 0;
position: relative;
--w: 100vw;
--h: calc(var(--w) / var(--videoRatio));
height: var(--h);
width: var(--w);
top: calc(50% - (var(--h) / 2));
left: 0;
width: var(--w);
height: var(--h);
}
@media (max-aspect-ratio: 16/9) {
iframe {
--h: 100vh;
--w: calc(var(--h) * var(--videoRatio));
top: 0;
left: calc(50% - (var(--w) / 2));
}
}