Changing the appearance of one menu item only

Hi there,
I’d love some help with my site www.dressforchange.co

On the top menu, I’ve changed one of the menu items to a green background using the custom CSS:

#menu-item-7739 {
font-weight: 400;
background: #4fccc3;
border-color: #4fccc3;
padding-left: 10px;
padding-right: 10px;
color: #000000 !important;
}

However, I’m also trying to change the colour of the text for that menu item to white (so it stands out on the green background). Is there css I can use to target only that menu item and turn it white, while leaving all the other menu items their original colour? Also, is there a way I can remove the ‘fade’ on that menu item only??

Would greatly appreciate some help!

Thank you,
Joelle

Hey there,
Hope you’re doing well today

The code below, when added to Appearance > Customize > Additional CSS should solve the problem:

#menu-item-7739 a {
    color: white!Important;
    opacity: 1!Important;
}

Please let me know if that helps.

Best Regards,
Support

That worked perfectly! Thank you so much. I really appreciate the help.

Hi,

Glad we helped. :slight_smile:

Let us know if you have any other questions in a separate thread.

Thanks,
laranz.

@joelle
Will you share how you added the banner at the top of your homepage? Is this a feature of Shapely or a plugin?

Thx!

Hey @lucretiamcc,
Hope you’re doing well today

I believe she got that banner with this plugin:

I hope this helps :slight_smile:

Best Regards,
Support

Yep that’s exactly right!