[Clayo]

Hello,

I am having an issue figuring out how to make the mobile menu transparent on my wedding website. I do not want to hide the mobile menu because then my monogram will be hidden as well. Currently when on mobile there is a black navigation bar that is visible, but since my site is parallax I do not need this menu.

Thanks

[Juanfra Aldasoro]

Hi,

Thanks for writing. I hope you are doing well.

Would you please try adding the following custom CSS:

@media all and (max-width:1024px) {
    #header:not(.scrolled) {
        background-color: transparent !important;
    }

    #header + #container {
        margin-top: -108px !important;
    }

    #header + #container #content > article > .entry > .page-content > .vc_row:first-child::before {
        height: 108px !important;
    }
}

Best,
Juan.

[Clayo]

There is still a bit of white space at the top. Any ideas?

[Clayo]

Changed it to -125px and it works.

[Juanfra Aldasoro]

Hi,

Thanks for the follow-up.

That’s great 🙂 Yes, I think the difference is given by the logo size.

Have a nice day,
Juan.