Thanks for the hint about Javascript, the problem is now fixed! There was a folder with some Javascripts uploaded to the home directory, I haven’t even been using them but they must’ve caused the conflict somehow. I deleted that folder and the mobile menu now works!

Great, thanks!

FYI, anyone else using this code – you need to add !important in order for it to work:

#header_main .container, .main_menu ul:first-child > li a {
line-height: 80px !important;
}

I finally figured it out! Posting the code here – hopefully it will help others who are looking for a more narrow site width (in this code the site width is 940). To change the site width, just adjust every single value in the code below by the percentage you are increasing/decreasing it.

/* #Desktop - Large
==================================================  */@media only screen and (min-width: 1140px) {
  .responsive .boxed#top {
	width: 940px;
  }
  .responsive .container {
    width: 855px;
  }
  .responsive .container .one.unit,
  .responsive .container .one.units {
    width: 33px;
  }
  .responsive .container .two.units {
    width: 108px;
  }
  .responsive .container .three.units {
    width: 182px;
  }
  .responsive .container .four.units {
    width: 257px;
  }
  .responsive .container .five.units {
    width: 332px;
  }
  .responsive .container .six.units {
    width: 406px;
  }
  .responsive .container .seven.units {
    width: 481px;
  }
  .responsive .container .eight.units {
    width: 556px;
  }
  .responsive .container .nine.units {
    width: 631px;
  }
  .responsive .container .ten.units {
    width: 705px;
  }
  .responsive .container .eleven.units {
    width: 780px;
  }
  .responsive .container .twelve.units {
    width: 855px;
  }
  .responsive #top.boxed .stretch_full {
    width: 938px;
  }
  .responsive #top .offset-by-one {
    padding-left: 74px;
  }
  .responsive #top .offset-by-two {
    padding-left: 149px;
  }
  .responsive #top .offset-by-three {
    padding-left: 224px;
  }
  .responsive #top .offset-by-four {
    padding-left: 299px;
  }
  .responsive #top .offset-by-five {
    padding-left: 373px;
  }
  .responsive #top .offset-by-six {
    padding-left: 448px;
  }
  .responsive #top .offset-by-seven {
    padding-left: 523px;
  }
  .responsive #top .offset-by-eight {
    padding-left: 597px;
  }
  .responsive #top .offset-by-nine {
    padding-left: 672px;
  }
  .responsive #top .offset-by-ten {
    padding-left: 747px;
  }
  .responsive #top .offset-by-eleven {
    padding-left: 821px;
  }
}

Any ideas? Just making sure my question didn’t get overlooked as it’s already on page 6.

Thanks in advance for your help!

No, my child theme folder doesn’t have header.php. I have the latest version of Enfold 2.9.1 that I purchased on July 23. The only files my child theme has is style.css and a blank functions.php

Thank you so much, I really appreciate it! The menu is now fixed!

I bought Enfold just 2 weeks ago, on July 23rd, and it was already the latest version 2.9.1.

My child theme doesn’t have header.php, it only has style.css and blank functions.php