CSS to Remove Menu from Desktop on Home Page

Hi guys!! :)

I am working on a dev environment and so far I have been able to tweak quite a few things by checking answers on the forum but I am stuck here:

I added this to remove the Menu only for the Home Page and on Desktop. It works like a charm on Safari but on Chrome, it doesn’t.

/*remove menu from desktop from home page*/
@media screen and (min-width: 767px) {
.page-id-367 .main_menu {
display: none !important;
}
}

I have checked some forums and the answer seems to be adding this to the head: <meta name=”viewport” content=”width=device-width,initial-scale=1″>

But Enfold already has that.

I know I am missing something.

Thank you!!

Havi