[marengo]

the easiest way if you'll create two navigation: one for desktop, second for the mobiles.
Find your <div id="navbar"class="navbar">
duplicate it and for the second write <div id="navbarhide"class="navbar">
Now you have two navbars.
Well, customize a menu and CSS style for navbarhide (add new css code in addtional.css).

Then open additional.css and write

#navbarhide { display: none;}

@media screen and (max-width: 990px) and (min-width: 120px){
#navbarhide {display: block;}
#navbar {display: none;}
}

Look at the demo, here I created two navbars: https://www.theironden.com/forum/

More complicated solution use http://responsivemobilemenu.com/en/ but in this case you have to redo navbar css code. Not so fast but looks good

Regards,
Nathalie