Change the main menu and the dropdown hover color

Hello guys,

I want to change the main menu and the dropdown hover color so it looks like the Game Magazine template http://demo.gavick.com/joomla16/oct2011/ (black with white text)

Where do I go to do that?

Link to our development server: http://development.friendzstop.com/

Thanks

Hi
If you don't want use color switcher try add to override.css

Code: Select all

#gkMainMenu > div.gk-menu > ul > li:hover, #gkMainMenu > div.gk-menu > ul > li:active, #gkMainMenu > div.gk-menu > ul > li:focus, #gkMainMenu > div.gk-menu > ul > li.active {
    background:#101010;
    color: #fff;
}
#gkMainMenu > div.gk-menu > ul > li:hover > a, #gkMainMenu > div.gk-menu > ul > li:active > a, #gkMainMenu > div.gk-menu > ul > li:focus > a {
    color: #fff;
}
#gkMainMenu > div.gk-menu > ul div.childcontent-inner-wrap {
    background:#101010;
}


and remember to enable override.css option in template settings.
If it is for one color try add this to style2.css

Hi
If you don't want use color switcher try add to override.css

Code: Select all

#gkMainMenu > div.gk-menu > ul > li:hover, #gkMainMenu > div.gk-menu > ul > li:active, #gkMainMenu > div.gk-menu > ul > li:focus, #gkMainMenu > div.gk-menu > ul > li.active {
    background:#101010;
    color: #fff;
}
#gkMainMenu > div.gk-menu > ul > li:hover > a, #gkMainMenu > div.gk-menu > ul > li:active > a, #gkMainMenu > div.gk-menu > ul > li:focus > a {
    color: #fff;
}
#gkMainMenu > div.gk-menu > ul div.childcontent-inner-wrap {
    background:#101010;
}


and remember to enable override.css option in template settings.
If it is for one color try add this to style2.css

You have been such a great help, thank you so much Konrad!

I'm glad I could help.

We need to get rid of the red lettering when you are on a page (its Community on this screen capture)

What do I need to change?

Thanks

Try add to override.css

Code: Select all

#gkMainMenu > div.gk-menu > ul > li.active > a {
    color: #FFF !important;
}
#gkMainMenu > div.gk-menu > ul > li > a {
    text-shadow:none !important;
}


Try add to override.css

Code: Select all

#gkMainMenu > div.gk-menu > ul > li.active > a {
    color: #FFF !important;
}
#gkMainMenu > div.gk-menu > ul > li > a {
    text-shadow:none !important;
}


Thanks again for your help.