Site Logo and Navigation Overlap on banner in mobile

Site URL: https://badger-flugelhorn-yp72.squarespace.com

Hello,

On the desktop version of my site, the site logo and navigation overlay on top of the banners at the top of each page:

However, the mobile version has it on a white background above the banner image:

Is there a way to get the logo and menu 3 lines to overlay on top of the banner image in the mobile version as well?

Password for the site is 123

Thank you!

On 10/5/2022 at 6:54 PM, DavidBakes said:

Site URL: https://badger-flugelhorn-yp72.squarespace.com

Hello,

On the desktop version of my site, the site logo and navigation overlay on top of the banners at the top of each page:

However, the mobile version has it on a white background above the banner image:

Is there a way to get the logo and menu 3 lines to overlay on top of the banner image in the mobile version as well?

Password for the site is 123

 

Thank you!

123 is wrong password. Can you check it again?

Hi @bangank36 - sorry about that, it is 123 now. 

On 10/11/2022 at 9:56 AM, DavidBakes said:

 sorry about that, it is 123 now. 

Add to Design > Custom CSS > then save & reload the site

.Mobile.loaded {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.Mobile-bar.Mobile-bar--top {
    background-color: transparent;
}

On 10/12/2022 at 11:58 PM, tuanphan said:

Add to Design > Custom CSS > then save & reload the site

.Mobile.loaded {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.Mobile-bar.Mobile-bar--top {
    background-color: transparent;
}

 

It worked, thank you very much for the assistance!