I need help getting a video loaded through custom section, width to be full screen for desktop

Hello, I originally wanted a video with text overlay, so I made a custom liquid section and was able to get the text over the page. However the changes I made now will not display the video full screen. Please let me know if someone can help me adjust the width and height of the video.

Admin view

User desktop view

Here is the custom liquid code by section.

Your text goes here

Here is the custom CSS I have so far:

.video-container {
position: relative;
height: 500px;
max-width: 100%;
width: 100%;
}
.test {
position: relative;
height: 500px;
max-width: 100%;
width: 100%;
}
.video_text {
position: absolute;
z-index: 9999;
top: 20%;
font-size: 60px;
left: 35%;
padding: 10px;
.video-container {
position: relative;
height: 500px;
max-width: 100%;
width: 100%;
}
.test {
position: relative;
height: 500px;
max-width: 100%;
width: 100%;
}
.video_text {
position: absolute;
z-index: 9999;
top: 20%;
font-size: 60px;
left: 35%;
padding: 10px;