Mobile header transparent should still take same space, but it doesn't

Byzantium

Hi. If you take a look at this page

http://hipsleyfarmcottages.co.uk

and then narrow it to mobile size, you will see that the header, which is set to transparent at

muffin options | responsive | header | header | mobile options <768

becomes not just transparent but not there, so the image slides up.

If I make the header transparent I still expect it to occupy the same space. Is that not how it should work?

Thanks

Bryan

You can try using this css 

@media (max-width:767px) {
	#Content {
	margin-top:90px !important;
	}
}

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

Byzantium

I've tried this but it didn't work. It pushes down the logo and the hamburger icon as well as everything else.

I have that CSS on the homepage currently if you want to take a look.

When I have the header not transparent it works as it should (in terms of the position of the logo and hamburger icon and the photo below). 

If I make the header transparent it should work the same, but it doesn't, the photo slides up as if there was no header there.  

Bryan

I pasted the custom css to your website and everything is fine:
http://prntscr.com/gjpp93
Please paste this css into theme options>custom css&js>css

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

Byzantium

You're right - it's fine. I was wrong. My bad. Don't know why it didn't work when i tried it but it works now.

Thank you!