Hii! thank you for the code i’ve tried it however it did not work 
Topic summary
Problem: A homepage background video on desktop shows empty space at the bottom instead of filling the full screen. The author successfully added separate background videos to two pages and wants a full-bleed hero look.
Context: A preview site URL and password were shared so others could inspect. Images were provided to show the current gap versus the desired full-screen result (visuals are central to understanding the issue).
Attempts and guidance:
- Initial CSS suggestion (in base.css): set #MainContent .shopify-section.videoBackground and .videoBackground .videoBox to height: 100%. The author reported this did not work.
- Updated CSS recommendation (add at bottom of base.css):
• div.videoBackground .videoBox { height: 100vh !important; }
• div.videoBackground .fullscreen-video-wrap .video-js { height: 100% !important; }
Rationale: Using 100vh targets the viewport height to eliminate bottom whitespace; the !important flags aim to override theme defaults.
Status: No confirmation yet that the revised CSS resolved the issue. The discussion remains open pending the author’s test/feedback.