For the Ulta Theme I don’t see anything in Appearance>Customize that allow me to choose the menu hover and active colors so I am using CSS to change the default from #0896fe to #a70237, but not everything is working as expected. I have used the following CSS so far:
.main-navigation ul li:hover > a {
color: #a70237;
}
.main-navigation div > ul > li > a:hover {
border-bottom: 3px solid #a70237;
}
.main-navigation ul ul li:hover > a {
background: #a70237;
border-color: #a70237;
color: #fff;
}
What I haven’t been able to figure out is 1) how to make the menu text be #a70237 when the page is active, 2) how to change the top border color of the dropdown menu to #a70237 when hovering over a primary menu item.
For #1 I have used the following along with the CSS above, and it doesn’t work.
.main-navigation ul ul .current-menu-item > a {
color: #a70237;
}
What I want for the main navigation menu is for the hover color and bottom border to be #a70237, when I’m on a page the menu item for that page is #a70237, when I hover over a menu and there’s a sub menu that the top border of the drop down menu to be #a70237 and for the sub menu (when hovering over it) to have #a70237 as the background color. Could you help me with the CSS to accomplish all of that?
