Blank space on top of a video cover (only in safari, not chrome)

Question

I have a problem with a video cover for a website, but only when I opened it on Safari. There is a black space between the top and the video that I can't remove.

There is the code and an image down below:

  video {
  width: 100% !important;
  height: auto !important;
  min-height: 30%;
  display: table;
  background: rgb(242, 242, 242) url('images/inicio.png') center bottom no-repeat;
  background-size: 100% auto;
  margin-bottom: -4px;
  z-index: 1;

<div>
  <video autoplay loop poster="images/inicio.png"> 
    <source src="video/video.webm" type="video/webm"> 
    <source src="video/video.mp4" type="video/mp4"> 
    </video>
</div>

This is the website to see the code: http://josefinaechenique.esy.es/videos.html

The image

Answer 1

The display:table from the videotag seems to be the issue causing the big space there. Removing it should solve it