Change the header's color when scrolling down

Hello everyone,

I have managed to make the header of my website transparent on the main page. I also found a snippet of css that makes it change color when scrolling down (you can check it at https://gregoirepansu.com/ - the header becomes dark gray when scrolling down).

I have tried to replicate both of these things on my portfolio project pages. I managed to make the header transparent, but unfortunately can't seem to be able to make it change color when scrolling down. (see it on https://gregoirepansu.com/en/gallery1/landscapes - when scrolling down, the header stays transparent).

The bit of code i use for the homepage is the following : 

.tweak-fixed-header .shrink.header {
  background: #2A2829 !important;  
}

I tried using the item ID for the pages in order to target them directly, but it didn't work. I then tried adding this bit of code as a code block, no results either. And I can't inject it in the portfolio project pages, because they don't have that option. 

Does anyone have an idea about what I'm doing wrong ? I feel like it is a simple mistake which i'm overlooking lol

Thank you so much !

19 hours ago, Web_Solutions said:

If you add this code on Custom CSS section then it will work perfectly. You can also add a specific color for this page by replace #2a2829 to your color code. 

#item-617099f38dedf825f53792f6 header#header.shrink {
  background: #2a2829 !important;
}

 

It worked, thank you so much !

You are welcome!