Home Page content showing under header area

When I open my website (http://www.musicforfun.com.au)(Sydney Child Theme) in my Safari browser, it shows page body contents under the header area.
When I navigate to another page and then navigate back to the Home Page, the issue is gone.
Can you help fix this and possibly explain why this happened.
Regards
Shaun

It’s because your menu miscalculates a bit on first load. Not sure why this happens in your case, could be because of the logo. Try using a caching plugin and maybe resize your logo a bit and make it smaller.
There’s a CSS solution too but first try the above please.

Hi,

I am not sure what caused it, but I hope this CSS code can fix the issue:
.header-clone{ height: 137px !important; }

You can put the code to: Customize > Additional CSS.

Regards,
Awan

Hi Vlad, thanks for your thoughts.
This wasn’t happening until I tried to add a Facebook icon to my menu via the instructions of this video by Nathan Ingram https://www.youtube.com/watch?v=tuY69b2j120
The icon thing didn’t work. Not sure why. I got the Facebook menu item to open my Facebook page in another tab, but no icon.
So I deleted the code that I used to get my Style.css back to its original state, and then this current issue raised its head.

This may help with your thoughts on the matter.
I’m going to try Awan’s header code and see what happens.

Meanwhile, aThemes support has entered the frey.

Hi Awan, your code has worked. Thank you very much. I am very grateful.

Vlad: Due to not wanting to reduce my logo size because this is how I would like the logo and page to look, I have gone with the code from Awan.

FYI - Wordpress websites are new to me. I have built a couple of sites through the StoresOnline templates, however, they have issues that my wife and I are disappointed with so have moved to WP.

Thanks for all your help again and hope to come across you again at some stage down the road of site building and learning. Which is what I am doing.

Cheers
Shaun