Joomla Templates Club 406,261 posts

[dozza Friend dozzaJoin date: October 2007Posts: 149Downloads:0Uploads:21 Thanks: 16 Thanked: 8 times in 1 posts]

#126225

I’m starting ‘re-skinning’ JA-Zibal at http://www.protouchcleaningservices.co.uk/index.php

I’m going to use the moo menu style. I’ve updated the default background gradient image used in the main menu links described by ‘ja-mainnav’ in template_css.css as below…

#ja-mainnav {
border-top: 1px solid #544F4C;
border-bottom: 1px solid #999999;
background: url(../images/mainnav-bg.gif) repeat-x bottom #544F4C;
font-family: Arial, Helvetica, sans-serif;
}

On ‘rollover’ and when selected, the top nav changes to one of two solid dark grey colours. In which css file are these colours declared as I would like to change them and possibly replace with a gradient background image.

[Hung Dinh Friend Hung DinhJoin date: September 2014Posts: 4408Downloads:11Uploads:189 Thanks: 309 Thanked: 3310 times in 3 posts]

#241124

It is in http://protouchcleaningservices.co.uk/templates/ja_larix/ja_cssmenu/ja-sosdmenu.css

#ja-cssmenu {
float:left;
margin:0pt;
padding:0pt;
}
#ja-cssmenu ul {
margin:0pt;
padding:0pt;
}
#ja-cssmenu li {
background:transparent none repeat scroll 0%;
cursor:pointer;
display:block;
float:left;
margin:0pt;
padding:0pt;
}
#ja-cssmenu li ul {
height:auto;
left:-999em;
position:absolute;
width:15.9em;
z-index:99;
}
#ja-cssmenu li ul ul {
margin:-1.25em 0pt 0pt 12em;
}
#ja-cssmenu li li {
margin:0pt;
padding:0pt 1em 0pt 0pt;
width:14.9em;
}
#ja-cssmenu ul a {
width:10.8em;
}
#ja-cssmenu li:hover ul ul, #ja-cssmenu li:hover ul ul ul, #ja-cssmenu li.sfhover ul ul, #ja-cssmenu li.havechildsfhover ul ul, #ja-cssmenu li.havechild-activesfhover ul ul, #ja-cssmenu li.activesfhover ul ul, #ja-cssmenu li.sfhover ul ul ul, #ja-cssmenu li.havechildsfhover ul ul ul, #ja-cssmenu li.havechild-activesfhover ul ul ul, #ja-cssmenu li.activesfhover ul ul ul {
left:-999em;
}
#ja-cssmenu li:hover ul, #ja-cssmenu li li:hover ul, #ja-cssmenu li li li:hover ul, #ja-cssmenu li.sfhover ul, #ja-cssmenu li.havechildsfhover ul, #ja-cssmenu li.havechild-activesfhover ul, #ja-cssmenu li.activesfhover ul, #ja-cssmenu li li.sfhover ul, #ja-cssmenu li li.havesubchildsfhover ul, #ja-cssmenu li li.havesubchild-activesfhover ul, #ja-cssmenu li li.activesfhover ul, #ja-cssmenu li li li.sfhover ul, #ja-cssmenu li li li.havesubchildsfhover ul, #ja-cssmenu li li li.havesubchild-activesfhover ul, #ja-cssmenu li li li.activesfhover ul {
left:auto;
}
#ja-cssmenu li a {
background:transparent url(../images/mainnav-sep.gif) repeat-y scroll right bottom;
color:#C8C8C8;
display:block;
font-size:135%;
font-weight:bold;
line-height:normal;
padding:10px 30px;
text-decoration:none;
text-transform:uppercase;
}
#ja-cssmenu li a:hover, #ja-cssmenu li a:active, #ja-cssmenu li a:focus {
}
#ja-cssmenu li:hover, #ja-cssmenu li.sfhover, #ja-cssmenu li.havechildsfhover, #ja-cssmenu li.havechild-activesfhover {
background:#636160 url(../images/mainnav-sep.gif) repeat-y scroll right bottom;
color:#FFFFFF;
}
#ja-cssmenu li a.active, #ja-cssmenu li a.active:hover, #ja-cssmenu li a.active:active, #ja-cssmenu li a.active:focus {
background:#23211F url(../images/mainnav-sep.gif) repeat-y scroll right bottom;
color:#FFFFFF;
}
#ja-cssmenu li ul {
background:#403C3A none repeat scroll 0%;
border:1px solid #23211F;
}
#ja-cssmenu li ul li {
background:transparent none repeat scroll 0%;
border-bottom:1px solid #23211F;
border-top:1px solid #636160;
}
#ja-cssmenu li ul a {
background:transparent none repeat scroll 0%;
border-right:medium none;
color:#C8C8C8;
font-family:Tahoma,Arial,sans-serif;
font-size:100%;
font-weight:normal;
line-height:normal;
margin:0pt;
padding:7px 10px;
text-transform:none;
}
#ja-cssmenu li.havesubchild, #ja-cssmenu li.havesubchild-active {
background:transparent url(../images/arrow2.gif) no-repeat scroll 94% 50%;
}
#ja-cssmenu li ul a:hover, #ja-cssmenu li ul a:active, #ja-cssmenu li ul a:focus, #ja-cssmenu ul li:hover, #ja-cssmenu ul li.sfhover, #ja-cssmenu ul li.havesubchildsfhover, #ja-cssmenu ul li.havesubchild-activesfhover, #ja-cssmenu ul ul li:hover, #ja-cssmenu ul ul li.sfhover, #ja-cssmenu ul ul li.havesubchildsfhover, #ja-cssmenu ul ul li.havesubchild-activesfhover {
background:#636160 none repeat scroll 0%;
color:#FFFFFF;
}
#ja-cssmenu ul li a.active, #ja-cssmenu ul li a.active:hover, #ja-cssmenu ul li a.active:active, #ja-cssmenu ul li a.active:focus {
background:transparent none repeat scroll 0% !important;
color:#FFFFFF;
font-weight:bold;
margin:0pt;
padding:7px 10px;
}
#ja-cssmenu ul li a.active span, #ja-cssmenu ul li a.active:hover span, #ja-cssmenu ul li a.active:active span, #ja-cssmenu ul li a.active:focus span {
background:transparent none repeat scroll 0% !important;
color:#FFFFFF;
font-weight:bold;
padding:0pt;
}
#ja-cssmenu li ul a span {
margin:0pt;
padding:0pt;
}

[Author]

Posts