Div coupe image (background)

Bonjour, j'essaye de mettre dans mon site internet un lien avec une image qui passe de noir et blanc à toute coloré lorsque l'on "hover" par dessus. Jusqu'à présent ça marche. le seul problème est que le div ou je ne sais trop quoi empêche l'image de s'afficher au complet. Pour un example, vous pouvez aller visiter ma page : www.tarentule-fitness.com/chris/tarentule/nouveau/index.php et vous pouvez voir le code.

Je vous met le code quand même.
Html :

<div id="courriel-border" ></div>
<div id="courriel"><a href="#"><span style=" height:200px;">COURRIEL</span></a></div>

Css :

#courriel-border {
	position:absolute;
	left: 768px;
	top: 1318px;
	border-color:#FFFFFF;
	border:dashed;
	border-width:3px;
	border-spacing:inherit;
	width:140px;
	height: 45px;
	z-index:0;
	color:#FFFFFF;
}

#courriel {
	position:absolute;
	top:1282px;
	left:741px;
	z-index:1;
	overflow:visible;
	height: 96px;
}


#courriel a {
	width:167px;
	height: 243px;
	z-index:1;
	color:#FFFFFF;
	text-align:right;
	padding-left: 50px;
	background: url(timbre-gris.png) no-repeat;
	overflow:visible;
}

#courriel a:hover {
	z-index:1;
	color:#FFFFFF;
	text-align:right;
	padding-left:50px;
	background: url(timbre-couleur.png) no-repeat;
}

Merci à l'avance
Christophe