adjusting a dropdown menu to be full screen

Site URL: https://puma-tan-gztn.squarespace.com/config/design/custom-css

Hi everyone, I'm working on this website and I'm struggling to get the drop down menu to do what I want to do. I'm looking to make it so that when you hover over "works" the srop down menu covers the entire screen with a high opacity white box, and have the text right justified inline with the 's' on works. I've managed to make the dropdown the right colour and can make it full screen but for the life of me cannot get the text to line up AND the the white to be full screen. I can get one or the other but not both.

Hi. It looks like you solved this with CSS

@media screen and (min-width:769px) {
.subnav {
    background-color: rgba(255,255,255,.9) !important;
    text-align: right !important;
    transform: translatex(-90%) translatex(229.578px) !important;
    width: 110vw !important;
    height: 100vh !important;
}
}