Changing header size for mobile

The header on my website covers up content when viewed on a mobile device.

I would to have the header in Adventure dynamically change size to fit other screens.

my site is here: http://www.philliphermans.com

I have tried setting various ‘height’ parameters to auto but this is not doing the trick.

Any help is appreciated