JSFiddle - React, Tailwind, and code Playground

HTML

<div style="text-align:center; position:relative">
      <div id="playIcon"><img src="play.png" /></div> 
          <video id="video">
              <source src="/video.mp4" type="video/mp4">
          </video>
       </div>
</div>

CSS

#video{
   width:100%;
   max-height:1200px;
   z-index: 1;
   background-color: black;
}
#playIcon {
    position: absolute; 
    top: 47%;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}