Hide main menu but not other menus on mobile

Question

My website is http://www.brightlegal.co.uk. I was having issues making my main menu properly mobile responsive, so I instead opted to install a mobile reponsive menu plugin (I'm using Wordpress). I tried to hide the main menu on mobile devices using this css:

@media screen and (max-width: 768px){
#main-nav-wrap {
   display: none;
}

However, on some of my pages I have "sub menus" to the left. For example, here: http://brightlegal.co.uk/individuals/family/ and with that css implemented it also removes these menus on mobile devices. How can I stop this from happening?

Thanks, Becky

Answer 1

For left menu .tb-column-inner #menu-391-1-0-1 { display:block }

Answer 2

.ui.nav {
  display: inline-block !important;
}