trying to hide my massive main menu in mobile view

display: none;

use it inside a media query like so:

@media (max-width: 760px) {
#masthead { display: none; }
}

or with the mobile first principle

#masthead { display: none; }
@media (min-width: 761px) {
#masthead { display: block; }
}

Im not that good at this i was using shiftnav and wp responsive but no luck.I dont know where to put this in ccs media query.

Hehe. We all started at this point where we needed to learn how to CSS.

Most premium themes have a region where you can add CSS.

Otherwise you can add this under Display -> editor -> style.css

If you wanna learn how to do it the right way read on. If not -> make sure to not update your theme or make a backup of the style.css when you do want to update.

It is recommended you use a child theme so if the theme gets updated your CSS won’t get deleted. Keep in mind that all changes made to the active theme settings pages will be ignored when activating a child theme.

making a child theme is as easy as creating a folder with a single file in it

to create a child theme (themeName = the name of the folder of your current theme):

Add a folder like so /wp-content/themes/themeName-child/
Add a file to the child folder named style.css

in the style.css add this:

/*!
Theme Name: themeName-child
Author: Your Name
Author URI: https://www.yourwebsite.nl
Description: Child theme of themeName
Version: 0.1
Template: themeName
*/

Now you can go activate your child theme and modify it’s css under Display -> editor -> style.css

Do make sure you got the child theme selected in the top right corner on the editor page.