.video-wrapper {
    position: relative;
    overflow-y: hidden;
    max-height: 300px;
}
.video-wrapper .video-hero {
  position: relative;
  width: 100vw;
  padding-bottom: 56.25%;
  margin-top: -15%;
}
.video-wrapper .video-hero iframe{
    position: absolute;
    height: 100%;
    width: 100%;
}

@media screen and ( min-width: 1200px ) {
  .video-wrapper {
    left: calc( ( 100vw - 1200px ) / -2 );
    max-height: 600px;
  }
}