img hover pro img scr přes text indent

ahoj, zakládám sice další téma, ale do toho staršího by asi už nikdo nekouknul

o co mi jde, chci udělat roll over efekt, stejný jako tady: http://stuff.1-webdesign.cz/text-indent.html


ale nějak mi to nevychází, mám bordel ve třídách a uý vůbec nevím, jak to dát dohromady, prosím o napsání, kde mám chybu, respektive co bych měl přepsat, díky moc

.ref {
width: 480px;
color: black;
padding-bottom: 40px;
}

.fotovlevo {
float:left;
margin: 0;
display:block;
width:164px; height:146px;
overflow:hidden;
}

.fotovlevo a { display:block; width:164px; height:146px; overflow:hidden; float:left; margin: 0;}
.fotovlevo a:hover img {text-indent:-164px;}
.fotovlevo a img {border:none;}

<div class="ref">
<a href="http://lubas.ic.cz/"><img class="fotovlevo" src="img/reference/12.gif" width="328" height="146" alt="Lubasova fotogalerie"></a>
</div>