keeping your aspect ratio with css

aspect-ratio.styl

// This gist will keep your image or video's aspect ratio at 16:9 and horizontally centered
// [support](//caniuse.com/#feat=viewport-units): IE9+, Firefox 21+, Chrome 27+, Safari 6+, Android 4.4+, BlackBerry 10+
// [credit](//stackoverflow.com/a/20593342)
.video
  position: relative
  max-height: 100vh
  max-width: 177.78vh
  width: 100vw
  height: 56.25vw
  background-color: black
  top: 0
  left: 50%
  right: 0
  bottom: 0
  transform: translate(-50%, 0)