Transparent Header CSS

[TheRetold]

Hi, I am attempting to make my Header Transparent with My background image. My goals is to achieve a header exactly like this

I previous asked this question and received a CSS code that read;

.x-navbar {

transform: translate3d(0, 0, 0);
background: none;
box-shadow: none;
border-bottom: none;

}

.x-breadcrumb-wrap {

background: none;

}

This code is effective. However my next problem is the fact that i can’t get my background image in section 1 to overlay the header. At the moment it is grey as that is my background colour. I am trying to get it to look simplistic and to just be one with my section 1
So I’m trying to obtain a CSS where i can make it be apart of my section 1 and gives me the ability to edit it significantly
Thanks

[jade]

Hi There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thank you.

[TheRetold]

Www.theretold.com

[thai]

Hi There,

Please try adding the following CSS:

.home header.masthead.masthead-inline {
    position: absolute;
    width: 100%;
}
.home .x-navbar .desktop .x-nav > li > a {
    color: #fff;
}

Hope it helps

[TheRetold]

Thanks for that
It works perfectly on the home page
However, My goal is to have this on all of my pages throughout the website
Kind Regards

[TheRetold]

Also, whats the code for making all footers transparent throughout the website
Thanks for the assistance
Liam

[nabeel]

Hi again,

Please replace the previous code with the following code to have it on all of your pages:

header.masthead.masthead-inline {
    position: absolute;
    width: 100%;
}
.x-navbar .desktop .x-nav > li > a {
    color: #fff !important;
}

You Footer is already transparent, can you please show us some screenshots of how you’re wanting the footer to be so we can take a look?

Thanks!