Background video sizing responsiveness + mobile

Hi there,
I’ve had a hard time controlling the sizing of background videos for a responsive website.
As the video would be cropped automatically and would not keep its proportions, I’ve been trying to size it by hand for each breakpoint. I tried to work with percentages, vh, vw but its just impossible to control.

  • Even though it shows correctly on preview, as soon as I publish the website some of the videos get cropped on mobile.
  • Due to its sizing he video doesn’t fluidly sizes between the different breakpoints.

Browser I’ve tested: chrome, safari, firefox

I’ve been looking online and couldn’t find information to help me with this. Could someone help, please?

published website:


Here is my site Read-Only: LINK
(how to share your site Read-Only link)