Como colocar varios tipos de <a href=“#”> CSS?

Estou com uma duvida e gostaria de saber como coloco varios tipos de

Eu tenho html assim

<li class="documentos"><a href="#"> Documentos </a></li>
<span class="logo"><img src="image/Logo.png" height="94"/></span>

e quero colocar a imagem tambem com um link para o página Home. mas no css tenho este código que ao passar por cima da imagem fica com uma cor.

#nav ul li:hover a {background-color: #069; color: #fff; width: 90px; height: 55px;}

Quero so colocar a imagem so com link e sem a cor de passagem do rato.

Exemplo dos codigos:

http://jsfiddle.net/n494w1qu/