How to make border flush with video (change aspect ratio?)

Hello! I'm trying to add borders to the videos on my site and am running into an issue where the border is not fully flush with the video–there's a little extra space at the top of each. I've attached an image below where you can see the thin white section at the top of the videos. I'm not sure why this is happening because the videos came out of iMovie with a 16:9 ratio and I thought that was the ratio Squarespace uses for video blocks? 

Anyway, here's the code that I used to make the border:

.video-player  {
  border: solid 4px #000369 !important;
}

I tried playing around with changing the padding (as I saw some people do to fix the aspect ratio for a 9:16 image)  but didn't have any luck. Any ideas for how to fix this issue are very appreciated!

website: andreakloehn.com

password: flute43

(this issue is on the "music copy" page)

@melody495 That worked perfectly, thank you so much!! 🙂

You are very welcome 🙂