Cambiar color de la imagen según si es categoria, pagina, single o home.

[txie]

Hola!
Quiero que mi website cambie el color del logo según la sección en la que esta.
Mi programación es esta:

Código HTML:

 <?php
    if (is_front_page() ) {
      $cat_title = "home";
    } elseif (is_page(array("archives"))) {
      $cat_title = "archive";    
    } elseif (is_page() || is_search()) {
      $cat_title = "page";
      } elseif (is_category() || is_single()) {
      $cat_title = get_the_category();
      $cat_title = $cat_title[0]->slug;
    } 
  ?>

Código HTML:

<div id="wrapper" class="<?= $cat_title ?> <?php if (is_single()) echo 'post' ?>">
    <a href="http://k-i-t.com.ar/"><img src="http://k-i-t.com.ar/wp-content/themes/kit/images/kit-marca-azul-tienda-regalos.png" alt="" width="75" height="41" border="0" style="opacity:0;filter:alpha(opacity=0)"/></a></div> 

Logré que cambie el color si es home o si es pagina, pero no me está funcionando el cambio de color segun la categoria.

El css es el siguiente:

Código HTML:

#wrapper.home  {
	position:absolute;
	width: 75px;
	height:41px;
	margin: 55px 0px 0px 0px;
	background: url(http://k-i-t.com.ar/wp-content/themes/kit/images/kit-marca-azul-tienda-regalos.gif) #FFF;
	
	}
	
#wrapper.page {
	position:absolute;
	width: 75px;
	height:41px;
	margin: 55px 0px 0px 0px;
	background: url(http://k-i-t.com.ar/wp-content/themes/kit/images/kit-marca-verde-tienda-regalos.gif) #FFF;
	
	}

#wrapper.cuadernos  {
	position:absolute;
	width: 75px;
	height:41px;
	margin: 55px 0px 0px 0px;
	background: url(http://k-i-t.com.ar/wp-content/themes/kit/images/kit-marca-azul-tienda-regalos.gif) #FFF;
	
	}
	
	
#wrapper.bienvenida {
	position:absolute;
	width: 75px;
	height:41px;
	margin: 55px 0px 0px 0px;
	background: url(http://k-i-t.com.ar/wp-content/themes/kit/images/kit-marca-amarillo-tienda-regalos.gif) #FFF;
	
	}
	
#wrapper.regalo {
	position:absolute;
	width: 75px;
	height:41px;
	margin: 55px 0px 0px 0px;
	background: url(http://k-i-t.com.ar/wp-content/themes/kit/images/kit-marca-naranja-tienda-regalos.gif) #FFF;
	
	}


#wrapper.cocina {
	position:absolute;
	width: 75px;
	height:41px;
	margin: 55px 0px 0px 0px;
	background: url(http://k-i-t.com.ar/wp-content/themes/kit/images/kit-marca-rosa-tienda-regalos.gif) #FFF;
	
	}

Gracias por la ayuda!

[txie]

Ya lo resolví, resulta que el código me toma la primer categoria principal publicada...
y yo tenia 2 subcategorias dentro de esta. lo resolvi añadiendo el estilo css para mis subcategorias.