Hover obrazów

Hej,
chciałbym zrobić hover dla obrazków (są one zarazem hiperłączem). Hover polegałby na tym, że po najechaniu obrazy stawałby się kolorowe. Przygotowałem odpowiednie pliki w photoshopie i teraz jest problem z samym css'em. Kiedy daję standardowy hover to obrazek nie staje się kolorowy tylko jakby się "nakłada" drugi czarno-biały. Poniżej kody:
HTML

<div class="support">
<a href="#"><img class="air" src="img/sup_black/air.png" alt="Air" width="122" height="45" /></a>
<a href="#"><img class="cool" src="img/sup_black/cool.png" alt="Cool" width="128" height="45" /></a>
<a href="#"><img class="l" src="img/sup_black/l.png" alt="L" width="91" height="45" /></a>
<a href="#"><img class="pa" src="img/pa.png" alt="Pa" width="125" height="45" /></a>
<a href="#"><img class="fi" src="img/sup_black/f.png" alt="F" width="92" height="45" /></a>
<a href="#"><img class="sa" src="img/sup_black/sa.png" alt="Sa" width="106" height="45" /></a>
</div>

CSS

.support {
	width: 960px;
	height: 80px;
	padding-left: 35px;
	margin-top: 10px;
}
.support a {
	padding-right: 40px;	
}
.support a .pa {
	margin-bottom: 10px !important;	
}
.support a .air:hover {
	background-image: url(img/air.png);
}

Miałem już trochę kłopotu, żeby to wszystko wypośrodkować, więc możliwe, że rozwiązania w css nie są idealne odnośnie tej materii :)
Dzięki za pomoc.

Oryginalny obrazek masz jako źródło elementu <img>, a podmieniasz tło elementu <img> po najechaniu myszą (zamiast źródła). Ale źródła nie da się podmienić w CSS.
Albo użyj JS albo zrób background-image dla poszczególnych obrazków, zarówno w wersji :hover, jak i nie. Tylko wtedy nie używaj elementu <img> raczej, tylko zastosuj jako tło dla tego <a>.

Niestety nie znam JS, a rozwiązania w css szczerze nie zrozumiałem. Dysponujesz stroną z tym kodem JS / gotowym kodem JS?

Rozwiązanie w JS to coś w stylu:

Rozwiązanie w CSS to coś w stylu:

```css
.support a.air { background-image: url('obrazek.jpg');  /* plus pewnie też display: block; wysokośc i szerokość - nie używasz IMG, używasz tylko tła dla elementu hiperłącza */ }
.support a.air:hover { background-image: url('hover.jpg'); }

Dzięki wielkie!
Wszystko działa jak należy ;)