Farben Navigation ändern

PeteParker

Hi Leute,

ich stehe da vor einem kleinen Problem. Und zwar geht es um diese Navigation hier:

http://img716.imageshack.us/img716/3387/navbarb.png

So lange ich in dem Menü auf die Homeseite verlinke, bleibt der Menüpunkt in diesem schicken blau. Verlinke ich aber von der Home Seite auf eine Unterseite, wird er schwarz. Er soll aber die ganze Zeit blau sein.

Leider gibt es im Theme einige .css Sheets, die sich mit der Navi beschaffen, aber selbst wenn ich die schwarzen Farben zum #18B0E2 Blau umändere, passiert nichts.

Könnt ihr mir sagen wo der Fehler liegt?

Style.css

HTML

/* COLOR-BLUE */


/* layout */
.color-blue #footer a.anchor { background-image: url(../images/color/blue/footer_anchor.png); } 


/* typography */
.color-blue h2,
.color-blue h4,
.color-blue h6,
.color-blue a:hover { color: #18B0E2; }


.color-blue ul.links li { background-image: url(../images/color/blue/typography/list_links.png); }
#page.color-blue ul.links li a:hover { color: #18B0E2; }


.color-blue ul.hoverbox li { background-image: url(../images/color/blue/typography/list_hoverbox.png); }
.color-blue ul.hoverbox li:hover a,
.color-blue ul.hoverbox li:hover span.title { color: #18B0E2; }


.color-blue .spotlight.fade .spotlight1 { background-color: #18B0E3; }


/* menus */
.color-blue #footer .menu li a:hover { color: #18B0E2; }


.color-blue #menu li.level1.active:hover,
.color-blue #menu li.active.remain { background: #18B0E3; }
.color-blue #menu li.active a.level1 > span,
.color-blue #menu li.active span.level1 > span { color: #18B0E2; }
.color-blue #menu li.parent a.level1,
.color-blue #menu li.parent span.level1 { background-image: url(../images/color/blue/menu_level1_item_parent.png); }


.color-blue #menu a.level2:hover span.bg,
.color-blue #menu a.level3:hover span.bg { color:  #18B0E2; }


.color-blue div.mod-line ul.menu a.current span.bg,
.color-blue div.mod-line ul.menu a:hover span.bg,
.color-blue div.mod-line ul.menu span:hover span.bg { color: #18B0E2; }
.color-blue div.mod-line ul.menu li.level1 .level1 { background-image: url(../images/color/blue/submenu_level1_item_hover.png); }
.color-blue div.mod-line ul.menu li.parent .level1 span.bg { background-image: url(../images/color/blue/submenu_level1_item_parent.png); }
.color-blue div.mod-line ul.menu li.level2 span.bg { background-image: url(../images/color/blue/submenu_level2_item.png); }


/* modules */
.color-blue div.mod-box-templatecolor div.box-1,
.color-blue div.mod-hoverbox-default:hover div.box-1,
.color-blue div.mod-line-templatecolor:hover div.box-1 { background-color: #18B0E3; }
.color-blue div.mod-line-texthover:hover div.box-1,
.color-blue div.mod-line-texthover:hover h3.header span.subtitle { color: #18B0E2; }
.color-blue div.mod-line-texthover:hover h3.header span.title {
    border-color: #32BBE9;
    color: #18B0E2;
}
.color-blue div.mod-box-invert:hover a:hover,
.color-blue div.mod-hoverbox-invert:hover a:hover,
.color-blue div.mod-line-texthover:hover a,
.color-blue div.mod-line-invert:hover a:hover { color: #18B0E2; }
.color-blue div.mod-line-texthover:hover a:hover { color: #000000; }
.color-blue div.mod-line-texthover:hover a.readmore { color: #ffffff; }


/* system */
.color-blue #searchbox .results li.result.selected { color: #18B0E2; }


.color-blue #searchbox .results li.more-results:hover { background-color: #18B0E3; }
.color-blue .breadcrumbs a:hover  {    color: #18B0E2; }


.color-blue a.readmore { background-image: url(../images/color/blue/readmore.png); }

Alles anzeigen

Layout.css

HTML

/* Copyright (C) 2007 - 2010 YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */


 
 
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 150%;
    color: #595959;
    position: relative;
}


 


.wrapper { margin: auto; }


#header {
    margin: 0px 10px 30px 10px;
    padding: 0px 0px 0px 0px;
    position: relative;
    z-index: 10;
    clear: both;
}


#top {
    margin: 0px 0px 20px 0px;
    padding: 0px 0px 0px 0px;
    overflow: hidden;
    clear: both;
}


#middle {
    clear: both;
    min-height: 300px;
}


#bottom {
    margin: 20px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    overflow: hidden;
    clear: both;
}


#footer {
    position: relative;
    margin: 20px 10px 0px 10px;
    padding: 20px 0px 20px 0px;
    border-top: 5px solid #333435;
    clear: both;
    font-size: 10px;
    text-align: center;
}
    
 
 
#middle {
    width: 100%;  
     
    overflow: hidden;  
    position: relative;  
}


#middle-expand {
    width: 200%;
}


 
#main {
    position: relative;
    left: 50%;
    width: 50%;
    float: left;
}


#main-shift {
    position: relative;
    left: -100%;
     
     
    overflow: hidden;
}


 
#left {
    position: relative;
    left: -50%;
     
    float: left;
    overflow:hidden;
}


 
#right {
     
     
    position: relative;
    float: left;
    overflow:hidden;
}


 


#maintop,
#contenttop {
    margin: 0px 0px 20px 0px;
    overflow: hidden;
}


#contentbottom,
#mainbottom {
    margin: 20px 0px 0px 0px;
    overflow: hidden;
}


 
 
#mainmiddle {
    width: 100%;  
     
    overflow: hidden;  
    position: relative;  
}


#mainmiddle-expand {
    width: 200%;
}


 
#content {
    position: relative;
    left: 50%;
    width: 50%;
    float: left;
}


#content-shift {
    position: relative;
    left: -100%;
     
     
    overflow: hidden;
}


 
#contentleft {
    position: relative;
    left: -50%;
     
    float: left;
    overflow:hidden;
}


 
#contentright {
     
     
    position: relative;
    float: left;
    overflow:hidden;
}


 


.floatbox { overflow:hidden; }


.float-left { float: left; overflow: hidden; }
.float-right { float: right; overflow: hidden; }


.width15 { width: 15%; }
.width18 { width: 18%; }
.width20 { width: 20%; }
.width23 { width: 23%; }
.width25 { width: 25%; }
.width33 { width: 33%; }
.width34 { width: 34%; }
.width35 { width: 35%; }
.width40 { width: 40%; }
.width46 { width: 46%; }
.width50 { width: 50%; }
.width54 { width: 54%; }
.width65 { width: 65%; }
.width75 { width: 75%; }
.width100 { width: 100%; }


 


body.yoopage { background: #072E55; }
#page-body { border-top: 3px solid #333435; }


 


#absolute {
    position: absolute;
    z-index: 15;
    top: 0px;
    left: 0px;
    width: 100%;
}


 


#toolbar {
    height: 25px;
    padding: 0px 0px 0px 0px;
    overflow: hidden;
    line-height: 25px;
    font-size: 10px;
}


#headerbar { 
    padding: 20px 0px 20px 140px;
    min-height: 30px;
    overflow: hidden;
}


#menubar { border-bottom: 5px solid #333435; }


#menubar div.menubar-1 { 
    height: 54px;
    background: #ffffff;
    overflow: hidden;
    border: 1px solid #E1E1E2;
    border-bottom: none;
}


#date {
    padding: 0px 0px 0px 0px;
    float: right;
}


#logo {
    position: absolute;
    left: 0px;
    top: 25px;
}


#search {
    position: absolute;
    bottom: 16px;
    right: 14px;
    z-index: 12;
}


#menu { 
    position: absolute;
    bottom: 5px;
    left: 0px;
    height: 55px;
}


#banner {
    position: absolute;
    top: 120px;
    right: -20px;
    width: 0px;
    z-index: 3;
}


 


#footer a.anchor {
    position: absolute;
    right: -3px;
    top: 0px;
    width: 20px;
    height: 20px;
    background: url(yoo_pure_wp_/yoo_pure_wp/images/footer_anchor.png) 0 0 no-repeat;
    display: block;
    text-decoration: none;
}


#footer a.anchor:hover { background-position: 0 -23px; }


 


#left div.left-1,
#contentleft div.contentleft-1 { 
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-left: 1px solid #E1E1E2;
    border-right: 1px solid #E1E1E2;
}
#page.column-left #contentleft div.contentleft-1 { border-left: none; }


#right div.right-1,
#contentright div.contentright-1 {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-left: 1px solid #E1E1E2;
    border-right: 1px solid #E1E1E2;
}
#page.column-right #contentright div.contentright-1 { border-right: none; }


.middle-wrapper { margin: 0 10px 0 10px; }


#maintop,
#mainbottom,
#contenttop,
#contentbottom {
    margin-left: -10px;
    margin-right: -10px;
}


#page.column-left #maintop,
#page.column-left #mainbottom { margin-left: 10px; }
#page.column-right #maintop,
#page.column-right #mainbottom { margin-right: 10px; }
#page.column-left #contenttop,
#page.column-contentleft #contenttop,
#page.column-left #contentbottom,
#page.column-contentleft #contentbottom { margin-left: 10px; }
#page.column-right #contenttop,
#page.column-contentright #contenttop,
#page.column-right #contentbottom,
#page.column-contentright #contentbottom { margin-right: 10px; }


#page.column-left .breadcrumbs,
#page.column-contentleft .breadcrumbs,
#page.column-left #component,
#page.column-contentleft #component  { margin-left: 20px; }
#page.column-right .breadcrumbs,
#page.column-contentright .breadcrumbs,
#page.column-right #component,
#page.column-contentright #component { margin-right: 20px; }


.breadcrumbs { margin-bottom: 20px; }


div.top-separator,
div.maintop-separator,
div.mainbottom-separator,
div.bottom-separator {
    margin: 0px 10px 0px 10px;
    height: 5px;
    background: url(yoo_pure_wp_/yoo_pure_wp/images/separator.png) 0 0 repeat-x;
    clear: both;
}

Alles anzeigen

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

PeteParker

Und die menu.css

HTML

/* Copyright (C) 2007 - 2010 YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */


/*
 * top and footer menu
 */


 
#toolbar ul.menu,
#footer ul.menu {
    display: inline-block;
    margin: 0px;
    padding: 0px;
    list-style: none;
}


#footer ul.menu {
    display: block;
    line-height: 14px;
}


#toolbar .menu li,
#footer .menu li {
    display: inline-block;
    margin: 0px;
    padding: 0px;
}


#toolbar .menu li a,
#footer .menu li a {
    display: inline-block;
    padding: 0px 15px 0px 15px;
    overflow: hidden;  
    color: #595959;
    text-decoration: none;
}


#toolbar .menu li a.active,
#toolbar .menu li a:hover { 
    color: #ffffff;
    text-decoration: none;
    background: #18B0E3;
}


#footer .menu li a { 
    padding: 0 14px 0 15px;
    background: url(../images/footermenu_item_bg.png) 0 50% no-repeat;
}


#footer .menu li a.first { background: none; }
#footer .menu li a:hover { color: #FF3399; }


/*
 * menu
 */


 
#menu ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}


#menu li {
    position: relative;
    z-index: 5;  
    margin: 0px;
    padding: 0px;
}


#menu a,
#menu span { display: block; }
#menu a { text-decoration: none; }


 
#menu span.icon {
    background-repeat: no-repeat;
    background-position: 0 50%;
}


 
#menu ul.menu { float: left; }


#menu li.level1 { float: left; }


#menu a.level1,
#menu span.level1 { 
    padding: 0px 15px 0px 15px;
    float: left;
}


#menu a.level1 span.bg,
#menu span.level1 span.bg {
    height: 55px;
    float: left;
    line-height: 55px;
    font-size: 18px;
    color: #333435;
    text-transform: uppercase;
}


 
#menu li.level1:hover,
#menu li.remain { background: #18B0E3; }


#menu li.level1.active:hover,
#menu li.active.remain { background: #18B0E3; }


#menu li.active a.level1 span.bg,
#menu li.active span.level1 span.bg { color: #18B0E3;}


#menu li.level1:hover a.level1 span.bg,
#menu li.level1:hover span.level1 span.bg,
#menu li.remain .level1 span.bg,
#menu li.remain.active .level1 span.bg { color: #ffffff; }


#menu li.parent a.level1,
#menu li.parent span.level1 { 
    padding-right: 35px;
    background: url(../images/menu_level1_item_parent.png) 100% 0 no-repeat;
}


#menu li.parent.active a.level1,
#menu li.parent.active span.level1 { background-position: 100% -55px; }


#menu li.parent:hover a.level1,
#menu li.parent:hover span.level1,
#menu li.parent.remain a.level1,
#menu li.parent.remain span.level1 { background-position: 100% -110px; }


 
#menu a.level1 span.title,
#menu span.level1 span.title {
    font-size: 16px;
    line-height: 45px;
}


 
#menu a.level1 span.subtitle,
#menu span.level1 span.subtitle {
    margin-top: -12px;
    font-size: 10px;
    font-weight: normal;
    line-height: 10px;
    text-transform: none;
}


 
#menu .dropdown {
    position: absolute;
    top: 60px;
     left: -999em;  
    z-index: 100;
     
}


#menu li:hover .dropdown,
#menu li.remain .dropdown { left: 0px; }


#menu .dropdown-t1 {}
#menu .dropdown-t2 {}
#menu .dropdown-t3 {}


#menu .dropdown-1 {}
#menu .dropdown-2 {}


#menu .dropdown-3 {
    padding: 14px 7px 14px 7px;
    border: 1px solid #E1E1E2;
    border-top: none;
    background: #FFFFFF;
    overflow: hidden;
}


#menu .dropdown-b1 {}
#menu .dropdown-b2 {}
#menu .dropdown-b3 {}


 
#menu li.level2 .group-box1 { 
    margin: 0px 7px 0px 7px;
    overflow: hidden;
}


#menu li.level2 .hover-box1,
#menu li.level2.parent .group-box1 .hover-box1 { 
    border-bottom: 1px solid #E5E5E5;
    overflow: hidden;
}
#menu li.level2.last .hover-box1 { border-bottom: none; }


#menu a.level2,
#menu span.level2 {    overflow: hidden; }


#menu a.level2 span.bg,
#menu span.level2 span.bg {
    line-height: 28px;
    font-size: 14px;
    color: #18B0E3;
    text-transform: uppercase;
}


#menu a.level2:hover span.bg { color:  #18B0E3; }


 
#menu li.level2 a.current span.bg { font-weight: bold; } 


 
#menu a.level2 span.title,
#menu span.level2 span.title { line-height: 33px; }


#menu a.level2 span.subtitle,
#menu span.level2 span.subtitle {
    margin-top: -18px;
    font-size: 10px;
    font-weight: normal;
    text-transform: none;
    line-height: 30px;
}


 
#menu a.level2 span.icon,
#menu span.level2 span.icon {
    min-height: 45px;
    padding-left: 50px;
    line-height: 45px;
}


 
#menu .sub { padding: 0px 0px 15px 0px; }
#menu ul.level2.last .sub { padding-bottom: 0px; }


#menu ul.level3 { padding: 5px 0px 0px 0px; }


#menu a.level3 span.bg,
#menu span.level3 span.bg {
    line-height: 18px;
    font-size: 11px;
    color: #18B0E3;
}


#menu a.level3.current span.bg { font-weight: bold; }


#menu a.level3:hover span.bg { color: #18B0E3; }


 
 
 
 


#menu .columns2 ul.level2,
#menu .columns3 ul.level2,
#menu .columns4 ul.level2 { float: left; }


#menu .columns2 ul.level2 {    width: 50%; }


#menu .columns3 ul.level2 { width: 34%; }
#menu .columns3 ul.first,
#menu .columns3 ul.last { width: 33%; }


#menu .columns4 ul.level2 { width: 25%; }


/*
 * sub menus
 */
 
 
div.mod-menu ul {
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    list-style: none;
}


div.mod-menu ul.menu li {
    margin: 0px;
    padding: 0px;
}


div.mod-menu ul.menu a,
div.mod-menu ul.menu span { display: block; }
div.mod-menu ul.menu a { text-decoration: none; }


 
div.mod-menu ul.menu span.icon {
    background-repeat: no-repeat;
    background-position: 5px 50%;
    text-indent: 35px;
}


 
div.mod-menu ul.menu li.parent span.separator { cursor: pointer; }


 
div.mod-menu ul.menu span.subtitle { display: none; }




/*
 * sub menu: mod-line
 */


div.mod-line ul.menu span.bg {
    height: 25px;
    line-height: 25px;
    text-indent: 5px;
    color: #595959;
    font-size: 14px;
}


 
div.mod-line ul.menu a.current span.bg { color: #18B0E3; }


 
div.mod-line ul.menu a:hover span.bg,
div.mod-line ul.menu span:hover span.bg { color: #18B0E3; }


 
div.mod-line ul.menu li.level1 .level1 { 
    padding: 0px 0px 0px 20px;
    text-transform: uppercase;
    font-weight: bold;
    background: url(../images/submenu_level1_item_hover.png) 0 0 no-repeat;
}


div.mod-line ul.menu li.first .level1 { background-position: 0 50px; }
div.mod-line ul.menu li.level1 .level1:hover { background-position: 0 -25px; }
div.mod-line ul.menu li.level1 .level1:hover span.bg { color: #ffffff; }
div.mod-line ul.menu li.current .level1:hover { background-position: 0 -50px; }


div.mod-line ul.menu li.parent .level1 span.bg { background: url(../images/submenu_level1_item_parent.png) 100% 0 no-repeat; }
div.mod-line ul.menu li.parent .level1:hover span.bg { background-position: 100% -25px; }
div.mod-line ul.menu li.parent.current .level1 span.bg { background-position: 100% -50px; }
div.mod-line ul.menu li.parent.active .level1 span.bg { background-position: 100% -75px; }
div.mod-line ul.menu li.parent.active.current .level1 span.bg { background-position: 100% -125px; }
div.mod-line ul.menu li.parent.active .level1:hover span.bg,
div.mod-line ul.menu li.parent.active.current .level1:hover span.bg { background-position: 100% -100px; }


 
#left div.mod-line ul.menu li.level1 .level1,
#contentleft div.mod-line ul.menu li.level1 .level1 { 
    padding-left: 0px;
    padding-right: 16px;
    background-position: 100% -75px;
}


#left div.mod-line ul.menu li.first .level1,
#contentleft div.mod-line ul.menu li.first .level1 { background-position: 0 50px; }


#left div.mod-line ul.menu li.level1 .level1:hover,
#contentleft div.mod-line ul.menu li.level1 .level1:hover { background-position: 100% -100px; }


#left div.mod-line ul.menu li.current .level1:hover,
#contentleft div.mod-line ul.menu li.current .level1:hover { background-position: 100% -125px; }


 
div.mod-line ul.menu ul.level2 { padding: 5px 0px 10px 20px; }


#left div.mod-line ul.menu ul.level2,
#contentleft div.mod-line ul.menu ul.level2 { padding-left: 0px; }


div.mod-line ul.menu li.level2 {}
div.mod-line ul.menu li.level2 a:hover {}


div.mod-line ul.menu li.level2 span.bg {
    height: 20px;
    line-height: 20px;
    text-indent: 15px;
    font-size: 12px;
    background: url(../images/submenu_level2_item.png) 0px 0px no-repeat;
}


div.mod-line ul.menu a.level2:hover span.bg { background-position: 0px -20px; }


 
div.mod-shadowbox ul.menu a.level3 span.bg { 
    text-indent: 30px;
    background-position: 15px 0px;
}
div.mod-shadowbox ul.menu a.level3:hover span.bg { background-position: 15px -20px; }


 
div.mod-shadowbox ul.menu a.level4 span.bg { 
    text-indent: 45px;
    background-position: 30px 0px;
}
div.mod-shadowbox ul.menu a.level4:hover span.bg { background-position: 30px -20px; }

Alles anzeigen

Beste Grüße und Danke
Pete

Whoppy

Findest du mit Firebug ganz schnell heraus, welche Datei und welche Anweisung du anpassen musst.

Gruß Whoppy

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Farben Navigation ändern

Jetzt mitmachen!