Main navigation menu styles

Hey LbCCbeA_89,

It’s best recommmended to change the look and feel of the menu items from enfold theme options.

Enfold > Advance Styling > Menu Items

If you are looking for CSS class names for advanced styling, here they are :

NOTE: Add important rule to the css property if you do not see any changes.
Other reason you may not see the css changes is because a caching plugin is active, please deactivate the cache plugin and try to hard refresh the browser.

Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

/* Menu font color */
#top #header .av-main-nav > li > a .avia-menu-text, 
#top #header .av-main-nav > li > a .avia-menu-subtext {
    color: #4d4d4d;
}

/* 
Background color
Border color
font size
*/
#top #header .av-main-nav > li > a {
    background-color: #f7f7f7;
    border-color: #bdbdbd;
    font-size: 16px;
}

/* Active menu hover state */
.header_color .avia-menu-fx {
    background-color: #c51048;
    border-color: #c51048;
}

/* Header border */
.header_color div {
border-color: #ff0303;
}

Best regards,
Vinay

• This reply was modified 7 years, 11 months ago by Vinay.

Hi,

I have checked the site and the code given and I see it properly reflecting on the site, I can see the font color in #4d4d4d and background color using #f7f7f7, what color should it be using? did you declare other color instead?

Best regards,
Nikko