Tooltips con CSS, por que no me funciona? (casi aporte)

[Bam_Margera]

Muy buenas

Encontre este codigo para agregar tooltips a los enlaces solo usando CSS

Código:

.a span {display: none;}
.a:hover span {display: inline;} 

 

/* The above hover change defeats the
  IE/Win display changing bug */
 
.a:hover span {
  display: block;
  background-color:#FFC;
    border: 1px solid #FC9;

  } 
.a {position: relative;}
 
.a:hover span {
  color:#220000;
.a:5px;
  position: absolute;
  bottom: 25px;
width:300%;
height:auto;
  left: 20px;
  display: block;
  background-color:#FFC;
  border: 1px solid #FC9;
  }

Modo de uso (funciona!)

Código:

<a href="#">Texto Enlace<span>Texto tooltip</span></a>

y por conflictos con un script de traduccion, decidi que solo se aplicara a una clase, tooltip, por lo que adapte el codigo a:

a.tooltip span {display: none;}
a.tooltip:hover span {display: inline;}



/* The above hover change defeats the
IE/Win display changing bug */

a.tooltip:hover span {
display: block;
background-color:#FFC;
border: 1px solid #FC9;

}
a.tooltip {position: relative;}

a.tooltip:hover span {
color:#220000;
padding:5px;
position: absolute;
bottom: 25px;
width:300%;
height:auto;
left: 20px;
display: block;
background-color:#FFC;
border: 1px solid #FC9;
}

E intento usarlo:

Código:

<a class="tooltip" href="#">Texto Enlace<span>Texto tooltip</span></a>

Pero no funciona, es decir no oculta y muestra el tooltip sino que siempre esta ahi,

podeis verlo en

http://keepyourlinks.com/link1.php?id=467

Que hago mal? gracias!!