Edit in JSFiddle

<div id="video" class="video">
  <div class="video-box">
    <iframe frameborder="1" src="https://player.vimeo.com/video/44309170?autoplay=1&color=ffffff&title=0&byline=0&portrait=0" width="525" height="458" frameborder="0" allow="autoplay; fullscreen" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>   
  </div>
</div>
.video {
	display: flex;
	position: absolute;
	justify-content: center;
	align-items: center;
	background-color: #000000;
	z-index: 999;
	width: 100%;
	height: 100vh;
 
 }
 
 .video-box {
   position: relative;
   width: 100%;
   max-width: 600px;
 }
 
 .video-box::before {
   content: '';
   display: block;
   width: 100%;
   height: 0;
   padding-bottom: 56.25%; /* 9:16 */
 }
 
 .video-box iframe {
   box-sizing:border-box;
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
 }