Changing Hover Color Of Menu Links

I am trying to customize my menu and make the background white. The only problem I'm having is the default color of a menu item being hovered over is white.

I can't find anywhere to change this setting. I have tried to customize the css in a lot of different ways. It seem like this should work but no luck:

This changes the font color to red.

.ty-menu__items .ty-menu__item .ty-menu__item-link {
color:red;
}
This does nothing and the hover color remains white.
.ty-menu__items a:hover, .ty-menu__item a:hover, .ty-menu__item-link a:hover {
color:red;
}
Any help is much appreciated!

Please try

.ty-menu__items .ty-menu__item .ty-menu__item-link:hover {
    color:red;
}

Please try

.ty-menu__items .ty-menu__item .ty-menu__item-link:hover {
    color:red;
}

Worked perfectly. Thank you!

Please try

.ty-menu__items .ty-menu__item .ty-menu__item-link:hover {
    color:red;
}

This works great when I hover over the menu item, but when I move the cursor to the drop down sub menu, it turns the original menu item back to the default white.

Any suggestions?

In this case please use the following CSS:

.ty-menu__items .ty-menu__item:hover .ty-menu__item-link {
    color: red;
}

In this case please use the following CSS:

.ty-menu__items .ty-menu__item:hover .ty-menu__item-link {
    color: red;
}

Thank you eComLabs!

You are welcome!