Background image behind sticky menu

Hey Tom

A good while back you gave me the following code that extends the background image behind the main nav:

.main-navigation:not(.navigation-clone) {
    background-color: transparent;
    position: absolute;
    width: 100%;
    top: 0;
}

With my latest dev, I have the header hidden across all of the site. At the top of each page is just the sticky menu (it includes the site logo).

I am currently using the page header function to insert a full width background image on what is going to be the home page. I tried the above code (including page specific ID) but it did not work. What code do I need to extend the page header background image up so that it is behind the sticky menu (which is at the top of my screen).

Kind Regards

Max