Background video on color section not working properly?

Hey Illingco,
I tested a color section set to 100% height with your video as the background of the color section and the video is full screen.
See the link below, so I’m not sure what you may have done differently, perhaps you could include an admin login for us to examine.
Also I don’t see any black bars in Edge.

Best regards,
Mike

Hi,

Thank you for the update.

We tried to access the site, but we were prevented from doing so by the security plugin. Did you block certain countries’ access to the site?

Your access to this site has been limited by the site owner

Would you mind providing a screenshot of the issue? You can use platforms like Savvyify, Imgur or Dropbox to upload and share the screenshot. Here are the steps to follow:

1.) Visit the website of your chosen platform, such as Savvyify, Imgur or Dropbox.
2.) Locate the option to upload a file or an image.
3.) Select the screenshot file from your computer or device and upload it to the platform.
4.) After the upload is complete, you will be provided with a shareable link or an embed code.
5.) Copy the link or code and include it in your message or response to provide us with the screenshot.

Thank you for taking the time to share the screenshot. It will help us better understand the issue you’re facing and provide appropriate assistance.

Best regards,
Ismael

Hi,
We are all in different countries, please disable the block so we can try to help, Ismael has more experience with this so please disable so he can check. Thank you for your patience.
If you can’t disable this for your live site then try creating a staging site with the IP block disabled and post an admin login so we can examine.
If you check the test page I created on my test site, linked below, with your video in a color section there is no black bars on the sides, at lest I don’t see them, do you?

Best regards,
Mike

Hi,

Thank you for the update.

The issue occurs because of the custom css rule in the Quick CSS field, which we have temporarily disabled. This limits the height of the slider to 400px and affects the background video.

.avia-slideshow-inner {
    height: 400px !important;
}
.avia-slideshow {
    max-height: 400px !important;
} 

Please make sure to purge the cache before testing the page again.

Best regards,
Ismael

Hi,
Thank you for your patience, I’m not sure why your site is behaving differently, because I copied you page to my test site and the video shows correctly without the black bars, perhaps there is a conflict with a plugin or code custom code.
But I found adding this css in your WordPress ▸ Customize ▸ Additional CSS corrects

#top .av-video-slide video {
    width: 100%;
    height: unset;
}

Please clear your browser cache and check.

Best regards,
Mike