2 different headers

My homepage has no colour header, but it starts as you scroll down the page. - http://cobrapparel.com/

Whilst on my other pages, it starts with a colour header and continues as you scroll down the page. eg. http://cobrapparel.com/products/

I want all my pages to have the header like the homepage- no colour header but a colour header starts as you scroll down the page. How do i make this happen?

Thanks.

Hello there,

Try adding this simple CSS code to Appearance > Customize > Additional CSS from dashboard.

    .site-header:not(.float-header) {
      background-color: transparent !important;
    } 

Regards,
Kharis

It works for desktop version of the site, but it removed the header completely from tablet and phone. Any ideas?

Hello there,

Try replacing the code I suggested with this one:

    @media only screen and (min-width: 1025px) {
      .site-header:not(.float-header) {
        background-color: transparent !important;
      }
    } 

Regards,
Kharis