Logo bumps down over header image on tablet/mobile

I don’t know how to delete but I managed to fix it. I had an additional CSS:

@media screen and (max-width: 1024px) {
.main-header {
position: static;
height: auto;
width: 100%;
z-index: 1000 !important;
background: #ffffff;
}
}

I change the position to static (was “fixed”) and the height to auto (was 50px) and that seemed to work.

Whenever the site is viewed on tablet or mobile, the logo & menu icon bump down over the header image. How can I fix it? The logo is a .png with a transparent background.

Hello,

As far as I understand, your issue is fixed. Is it correct?

Kind Regards, Roman.

It seems to have fixed the issue on every page except the home page. How can I create more padding?

Hello, I’m not sure what exactly you want to achieve.

Can you please provide some explanatory screenshots?

Kind Regards, Roman.

For whatever reason, this is how the home page menu looks. It bumps up right against the header image. It doesn’t do that on mobile or on any of the other pages.

Hello,

You can try to temporarily deactivate all your plugins except aThemes Toolbox and Page Builder by SiteOrigin, and see if it helps.

Kind Regards, Roman.