Crashing Navigation on tablet/cell phone size

How can I stop the Navigation Crashing into my logo on tablet/cell phone size. see attached.

It happen's on the Demo site too, so it not just my site.

NOTE - I've got around it by now placing logo in Top1, but not happy with the depth of header

You can move that menu little bit up so it's no across image :

SELECT.tinynav{
margin-top:-20px;
}

put that at bottom of template_css.css

Nice idea, I have a play with that. Thanks