menu colors

hello

how can I change this colors

Hi

First i recommend that you enable override.css file on template parameters, them open ../css/menu.css file and find classes related with background color on menu. For example:

Code: Select all

div.gk-menu > ul.level0 > li > a {..}
div.gk-menu > ul.level0 > li > a:hover {..}
div.gk-menu > ul.level0 > li > .childcontent {..}
div.gk-menu > ul.level0 > li .childcontent ul {..}
div.gk-menu > ul.level0 > li li.group .group-title {..}


Them added them (changed) on override.css file.
This way you will make your own customization without having problems with future updates.

Note: On some classes you might need to force with !important rule.

Cheers

its not be

www.ozel-dersimiz.com

Here is your answer

This is best after me working on it for an hour

The whole source code is ready - you can just copy and paste in your override.css and enable your settings for override.css ( turn it on ) - the demo is on my site - http://squaresmicrosystems.com

Code: Select all

/*
#------------------------------------------------------------------------
# penguinMail - December 2010 (for Joomla 1.6)
#
# Copyright (C) 2007-2011 Gavick.com. All Rights Reserved.
# License: Copyrighted Commercial Software
# Website: http://www.gavick.com
# Support: [email protected]
*/

/* Here you can include your override CSS styles */

#gkMenu {
    background-color: #F88017;
}
#gkWrap2 .box_menu h3, #gkWrap2 .box_text h3, #gkWrap2 .box h3 > span {
    background: none repeat scroll 0 0 #F88017;
}
a.readon, input[type="submit"], .adminform button, input[type="button"] {
    background: none repeat scroll 0 0 #168EF7;
}
#gkWrap3 .box_menu h3, #gkWrap3 .box_text h3, #gkWrap3 .box h3 > span {
    background: none repeat scroll 0 0 #F88017;
}
div.box.dark {
    background: none repeat scroll 0 0 #FFFFFF !important;
  border: 1px solid #8A847A;
}
div.box.dark a {
    color: #000000 !important;
}
div.box.dark > h3 > span {
    background-color: #F88017 !important;
  color: #FFFFFF !important;
}
.nspArt p.nspText {
    color: #000000;
    float: none;
}
#gkMainBlock a:hover {
    color: #000000;
}

div.gk-menu > ul.level0 > li.active > a, div#gkDropMain > ul > li.active > a, div.gk-menu > ul.level0 > li:hover > a, div#gkDropMain > ul > li:hover > a, div.gk-menu > ul.level0 > li.active:hover > a, div#gkDropMain > ul > li.active:hover > a {
    background: none repeat scroll 0 0 #000000;
}
.nspHeader {
    color: #168EF7;
    font-size: 150%;
    line-height: 1.2em !important;
    margin-bottom: 6px;
}
div.gk-menu > ul.level0 > li > .childcontent .gkcol {
    background-color: #168EF7;
    float: left;
}
div.gk-menu > ul.level0 > li .childcontent ul li {
    background: url("../images/menu_bullet.png") no-repeat scroll 2px center #168EF7;
    border-top: 1px solid #000000;
}
div.gk-menu > ul.level0 > li {
    border-left: 1px solid #000000;
}
div.gk-menu > ul.level0 > li .childcontent ul {
    background: none repeat scroll 0 0 #000000;
    margin: 0 7px;
}
div.gk-menu > ul.level0 > li .childcontent ul li a {
    color: #FFFFFF;
}
div.gk-menu > ul.level0 > li .childcontent ul li a:hover {
    color: #FFFFFF;
    text-decoration: none;
}
div.gk-menu > ul.level0 > li > .childcontent .module {
    background: none repeat scroll 0 0 #168ef7;
}
div.gk-menu > ul.level0 > li .childcontent ul li li {
    background: url("../images/menu_bullet.png") no-repeat scroll 2px center #168ef7;
    border-top: 1px solid #000000;
}
div.gk-menu > ul.level0 > li li.group .gk-group-content > ul {
    background-color: #168EF7;
}
div.gk-menu > ul.level0 > li .childcontent .gkcol ul {
    background-color: #168EF7;
    padding: 0 !important;
}
div.gk-menu > ul.level0 > li li.group .group-title {
    background: none repeat scroll 0 0 #168EF7;
    border: 1px solid #000000;
}


Hope this helps you - you can change your color codes accordingly - to get the color codes visit http://www.computerhope.com/htmcolor.htm

Regards,
spokanet