Css Dropdown Menus

I have a wordpress website with a dropdown menu.  I'm using CSS to style the background on Hover.  However, Menu choices that do not have a dropdown menu, I don't want there to be any background on hover.  Also, my dropdown menu is inheriting attributes that I don't want there.  If you go here: http://spokeinsurance.com/spoke/ and go toi the menu it should make sense.  But for further info, go to ABOUT and then down to "who we are" and you will see the styling I don't want.  Then if you go to FAQ, there is a background on hover that I don't want there cause there is no dropdown menu.

Any help?
LVL 7
rgranlundAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

GaryCommented:
styles.css line 2449
Change
.top-menu li:hover

to
.top-menu .menu > li:hover:nth-child(n+3)
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Peter HartCommented:
not sure what you mean.
on safari it looks ok.
the way I see  menus are as buttons and buttons when clicked will do something and buttons usually have a hover over and change to indicate you have got the right button.  is it just the  actual change you don't like?  
I think its slightly too big when you hover and would just go for the change in colour,
0
rgranlundAuthor Commented:
Yep, never would have come up with that.  Thanks!
0
eemitCommented:
You can also use class menu-item-has-children added by WordPress, e.g:
.top-menu li.menu-item-has-children:hover {
    box-shadow: 0 -3px 8px -5px black;
}

.top-menu li:hover {
    box-shadow: none;
}

Open in new window


Please note: If you have less than three sub-menu items posted solution will not work.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.