Adjusting mobile menu with CSS Media Query

I have a new custom menu that is good for desktop. However, I would like to hide that menu on Phones. I have tried this CSS, but it only works in Portrait mode and not landscape mode.
@media all and (min-width:480px) {
I have attached the image of what I would like the menu to look like and then what it looks like in landscape mode.