Submenu on mouse hover change color

If you go on my website www.casino-online.bz with username gavick and password gavick and click the main menu on the "casino AAMS" link it will open a submenu where the links are ALL white, but when your mouse goes over such white child links they becames red.
I would change the red color into white when the mouse goes over such child links. Please have a look at the attachment image.
To solve the problem I tried on override.css with:
.gkMenu > ul li div.childcontent li:hover > a, {
color: white;
}
with no success. Can you tell me the css to change the hover color of the child links in main menu?

Please edit: /templates/gk_news2/css/override.css and add at its end:

Code: Select all

.gkMenu > ul li div.childcontent a:hover {
   color: #fff !important;
}


Remember to enable "CSS override" in template settings - advanced section.

Wonderful. It worked, thank you.

Always in the same menu. If you click on:
CASINO AAMS-->Categories--> and then keep the mouse over "poker" you will notice that the link "Categories" is not white anymore, it becames gray.
Please have a look at the image attached.


How can I color (for example white) that link too?

Code: Select all

.gkMenu > ul li div.childcontent li:hover > a,
.gkMenu > ul li div.childcontent li:hover > a small {
   color: #fff;   
}


It worked thank you.

When the mouse goes over "CASINO AAMS" every background becomes red. Have a look at image attached 02.jpg.

02.jpg

This is correct by my side.
But when the mouse leave the "CASINO AAMS" entry its background becomes white (image 01-jpg).

01.jpg

Is there a way to keep always the background red wherever the mouse is (inside the menu entry CASINO AAMS or its child links)?

My goal is to keep background-color=RED of CASINO AAMS link even if the mouse goes over its child links (like article, categories, ...)

Are there any other changes you would like to do to menu?
Perhaps learning firefox/chrome develop tools might help. Usually we don't provide complete support for colour behave change. If there are few other things to change, please post them here, if not (if there is a lot of them) please try using firebug/chrome dev tools to find correct selectors.

I only have another change request: remove the thin white spaces I circled into the image attached.

gavick-white.jpg

But this is not very important, if you are able to do it I will be very happy, otherwise never mind.
What is important for me is the previous request on my previous post. Can you help me with that?

To fix red background, please modify this line in override.css:
and change:

Code: Select all

.gkMenu > ul > li > a:hover, .gkMenu > ul > li.active > a {
        color:#ffffff;
   background-color: #C93638;
}


to:

Code: Select all

.gkMenu > ul > li:hover > a, .gkMenu > ul > li > a:hover, .gkMenu > ul > li.active > a {
    color:#ffffff;
    background-color: #C93638;
}


It worked thank you. If we can remove the white spaces too .... it would be perfect.

This override should do the trick:

Code: Select all

.gkMenu > ul li div.childcontent,
.gkMenu > ul > li > .childcontent .gkcol {
   border: none;
}



Cyberek You are a boss. It worked thank you. I like it.

I hope your page will be live soon, from what I remember you have been working on it for a quite long time

Hi Cyberek & Giovanni

I followed your steps to add some color to my menus, but I had no success so far.

I ve added the following lines to override:

.gkMenu > ul li div.childcontent li:hover > a,
.gkMenu > ul li div.childcontent li:hover > a small {
color: #5882FA;
}

Nothing changes ? Any tips for me ?
Thanks in advance.
At the moment I am testing under: http://news2.aktepe.org/index.php/en/