scrolling fixed menu does not work on mobile

In the Edin-theme I’ve made the top-menu to be static at the top of any page wherever I am at the page. It works fine with desktops and iPad.

My problem is that on iPhone (not on iPad) the menu with a long list of pages and daughter-pages isn’t scrollable, so in the menu I’ve only access to the first items that fit in the screen.

If I do scroll, I see the page behind the pulled-down menu scrolling, instead of the menu itself.

My css looks like this:
#masthead {
background:transparent;
height:0px;
z-index:1;
margin:0 auto;
border-bottom:0px solid #dadada;
width:100%;
position:fixed;
top:25;
left:0;
right:0;
text-align: left;
}

Any help would be appreciated. Rather without the help of a plug-in.

Alb

The page I need help with: [log in to see the link]