Menu style

The background color is here #access ul li.current_page_item, #access ul li.current-menu-item

the text color is here #access ul li.current_page_item > a, #access ul li.current-menu-item > a
and here #access a

try those and see what you can do.

the menu can be redesigned however you like, it will mostly depend on your skill with html and css.

Hello. Thank you for your help. Unfortunately, none of those worked for changing the background color of the drop down in the navigation menu. just stays white.

And my HTML is fine. My CSS is pretty non-existent. Is there a plugin or a fairy simple way to change the look of that main navigation menu?

Thanks again.

Where are you making the CSS changes?

style.css

Does Mantra come with a section in the dashboard named, “Custom CSS”, “Custom Styles” or “Jetpack”?

yes sir. Custom CSS built into Mantra Settings. And also custom CSS in JetPack (which i currently do not have connected to wordpress.com because I dont like how it makes my site look mobile and cant figure out how to turn just that feature of jetpack off.)

Could you add the CSS recommended by James into the Custom CSS section built-in to Mantra’s settings?

Thats a separate issue. But yes, I have Custom CSS in two places that can be used.

Excellent.

Maybe I am not typing in the CSS code entirely correctly in the Custom CSS field. Its not helping either.

Let’s take a look, can you post the CSS you’re trying?

Sure. Again, I am new to this. I just included what James said above with the brackets.

never done the custom css before.
———————-
}
ul li.current_page_item, #access ul li.current-menu-item

color: #FF0000
}
————————

Thats it

Using James’ example, you need to be using the text colour CSS selectors.
Your CSS syntax is wrong too https://www.w3schools.com/css/css_syntax.asp

}
ul li.current_page_item, #access ul li.current-menu-item

color:#FF0000;
}

That is all I would think to change. I’m not sure.

Here is how you should write it

#access ul li.current_page_item, #access ul li.current-menu-item {

background-color:#333333 !important;

}

And

#access ul li.current_page_item > a, #access ul li.current-menu-item > a{

color:#ffffff !important;

}