Transparent Header over slider

Hi there, I am using a Revolution slider below the masthead on my landing page for httsp://sugarsbridgefarm.com
I would like the header (nav menu and top header) to sit on top of the slider and give the background opacity.

.x-navbar {

background-color: #fff;
opacity: .8;
position: absolute;
width: 100%;

}

when I add absolute to the top navbar it overlaps the main navbar. Is there a way to set it so this doesn’t happen? Many thanks!!

Hi Simone,

Since this is intended for home page only, the correct CSS should be:

.home header.masthead.masthead-stacked {
    position: absolute;
    left: 0;
    right: 0;
}
.x-topbar, .x-logobar, .x-navbar {
    background: rgba(255,255,255,.8) !important;
}

Absolute position should be added on the header container.

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.