Menu Hover

I’m wondering if you guys know of a better way to do this:

http://mightyfreshfarms.com/home/

I want it so when you over over the menu items that the smaller words BELOW the larger words on the menu turn green – but the larger words keep turning green too.

What I have it doing is:

html_header_top.html_bottom_nav_header .main_menu ul:first-child>li a:hover {
color: #a7bd39;
}

.html_header_top.html_bottom_nav_header .main_menu ul:first-child>li a span.larger-menu:hover {
color: #666666 !important;
}