Slider revolution behind header

[King]

Hi,

I have built a header in cornerstone and directly below this i have a revolution slider. I want my customer headers background to be transparent but when i set to be transparent, it show a white background. Is there something else that i need to do. Here is the website in question: Learning Community Trust I have set this back to its original state for now with a black background.

thanks all

Chris

[tristup]

Hi Chris,

Thanks for reaching out.
I have checked your website and found that Slider started just under the Header not behind the Header, and that is why the transparent header shows white background. You need to add the following code as shown in the following article after setting the background color transparent.

Stack the Navbar over Masthead Slider | Themeco Docs

You need to change the masthead selector to x-masthead as the class has been changed in an updated version, and your code will look like the following.

@media(min-width: 980px) 
{ 
    .home .x-masthead  
    {
        position:absolute;
        width:100%;
        background-color:transparent !important;
    }

    body.x-navbar-fixed-top-active .x-navbar-wrap 
    {
        height: auto;
    }

    .home .x-logobar,
    .home  .x-navbar, .home .x-topbar  
    {
        background-color: transparent !important;
        box-shadow: none;
        border: 0;
    }
}

.x-navbar .desktop .x-nav>li>a 
{
    border-right: 0px ;
}

Please remember that the above code will work if copied as it is and doesn’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We really do not provide support for custom codes which means we can’t fix it in case it conflicts with something on your site nor will we enhance it. Further customization should be directed to a third-party developer or you can avail of One, where we answer the questions beyond normal theme support.

Thanks

[King]

Hey @tristup, that worked thanks :). It didnt apply on a mobile but i changed the @media width to 300px and that worked

[ruenel]

You’re welcome, Chris.
We are glad that @Tristup were able to help you out.