Hi guys, I hope I can explain this but it might need a look at my site ibooknewzealand.com .

I have set the Home page to be "New Zealand" the static page. This static page is a parent of several child pages. The problem is that all these child pages show in the dark hover colour, when the parent (home page) is chosen, which looks ugly when you first land.

I guess the way around it is to have a home page with no child pages, but it would be interesting if anyone had any other ideas.
Regards, Joan

I've been struggling with this myself. I know it has something to do with child menus, but I have not been able to figure it out.

when you set a style for a parent item, that style cascades to the child elements (hence the term 'Cascading' in Cascading Style Sheets - CSS)

If you want the child elements to be different, then you must set up a selector and rules for the children

For each child menu item?

[page1] [page2]
[child1]
[child2]
[child3]

I'm almost there. I just need an explanation on the child menus. I have not been able to find any documentation on this.

Page1 has child menus. Page2 does not.
When Page2 is active, hover works as expected on all menu items including children of Page1.
But when Page1 is active, ALL the child menu items take on the hover color identified here:

li.current_page_item ul.rMenu-ver li a:hover { background: #CD4F60 !important; }

So essentially there is no hover in the child menus.

In the Page Menu Bar settings, I have the following set:

Background color: blue
Background color: Hover: red
Background color: Parent: black

Is this working correctly? Is there another setting I missed?

Can anyone point me in the right direction on this?

I cannot figure out where the hover for the child items are controlled.

Thanks!