Airi Theme: Mobile Menu Change Color & Background

Hello,

I have been trying for a while to find a way to change my mobile/tablet nav menu only. Currently it is a white background, with pink letters, and I cannot see the other menus until I hover over them.

I would prefer if I could make the mobile nav background [black or transparent], change the still color of the menu links to [white], and the hover color to [pink]! Can you please assist me in doing this?! Can you provide me with the additional CSS code that I can add to my website.

Hello there,

Try this code:

@media only screen and (max-width: 1199px) {

  #site-navigation.main-navigation {
    background-color: #333 !important;
  }  

  #site-navigation.main-navigation a {
    color: #ff0000 !important;
  }    

  #site-navigation.main-navigation a:hover {
    color: #fff000 !important;
  }    
  
}

and do your own adjustments as needed.

Regards,
Kharis

It worked!!! Thanks so much Kharis!!! Really appreciate all your help!

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis