Title Padding Issues - Desktop and Mobile

Hello,

I am inquiring regarding a follow-up question to a previous topic here: Menu is invisible until I scroll (on all pages except the home page)

I noticed now that the menu is “sticky”? or lower down, it causes my page titles to be hidden unless I give it 100px of padding. This is fine on desktop, but on mobile, it makes it way too far down (since the menu becomes hamburger-style). Is there a way I can keep the start of my pages below the menu bar without needing to add that code, so that it does not disrupt my mobile view?

My website is iedcfedforum.org . Mobile and desktop screenshots attached.

Thank you,
Hannah

Please remove this top padding on your pages. Then add the below simple CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 1025px) {
      body:not(.home) .sydney-hero-area {
        padding: 70px 0;
      }
    }

Regards,
Kharis
aThemes Support

1 Like

Hi Kharis,

Thank you, this resolved my issues.

Much appreciated,
Hannah

You’re welcome Hannah!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis
aThemes Support