Adaptive header on homepage only / solid header on all other pages ?

Hello,

I'm new here!

I'd like to put an adaptive header on my homepage but leave the header in full on the other pages (as it is currently on the site, with a plain color and nothing else).

I've explored the other topics but couldn't get it to work...

Thank you very much for your help.

My site: https://weareatom.ch/

Up please 🙏

@sr9574 Hi! Can you provide more details on how you want the adaptive header styled? It would be helpful if you could share an example of exactly how you want it to look.

1 hour ago, Lesum said:

@sr9574 Hi! Can you provide more details on how you want the adaptive header styled? It would be helpful if you could share an example of exactly how you want it to look.

Hello Sam !

Thanks for your answer !

So, 

Here are 3 screenshots.

The 1st is the adaptive header, so it's transparent and matches the home page background.
Then, as soon as I scroll down, it becomes full with a solid color. (2nd screenshot).

And finally, the 3rd screenshot is on another page when I leave the adaptive color in the settings, my logo is white because it adapts to the background of the page, which is white.
So I'd like the header on side pages to remain solid and not adaptive.

I don't know if this is clearer for you?

Thank you very much for your help.

9 hours ago, Lesum said:

@sr9574 You can add this code in Website > Pages > Website Tools > Custom CSS

body.homepage .header {
    background: transparent !important;
}

body.homepage .header.shrink {
    background: #1c1c1c !important;
}

It works perfectly!
Thanks a lot for your help.