7.1 Mobile Header Covering Part of Background Banner

Site URL: https://bluebird-rhubarb-algp.squarespace.com/our-team

I am trying to upgrade a site from 7.0 to 7.1. Everything looked good, but I hit a snag while testing mobile. Every page has a background banner image just under the site header. While it works fine on 7.0, on 7.1 the mobile site header partially covers the banner background image. 

Some pages it is not so noticeable,  but the one shown its pretty obvious. Is there a way to get it to push the image down rather than cover it?

I forgot. I had to set a password as it is in trial mode. PW:1234

Add to Design > Custom CSS

/* fix banner mobile */
@media screen and (max-width:767px) {
header#header {
    position: relative !important;
}
}

Thank you. Works great! I noticed issues with the desktop as well so I ended up using:

.header#header {
    position: relative !important;
}

That seems to be working well. Do you see any problem doing that?

15 hours ago, Kingfish said:

Thank you. Works great! I noticed issues with the desktop as well so I ended up using:

.header#header {
    position: relative !important;
}

That seems to be working well. Do you see any problem doing that?

Looks fine to me 😆