How do I get navigation menu on top with narrow viewport?
@media width queries in CSS
http://css-tricks.com/css-media-queries/
At a certain width, you could use a different positioning tactic, forcing it up top.
Via Javascript, checking against: window.innerWidth or body .clientWidth
Many things you could do here, from changing CSS rules, to actually moving it in the DOM.
Using a Drupal module for responsive menus like:
https://www.drupal.org/project/responsive_navigation
or https://www.drupal.org/project/responsive_menus