Hover effekt mit css spuckt :(

[rasengan374]

Hallo zusammen

Ich versuche gerade der Navigation meiner Website einen Hover Effekt zuzuweisen, mit folgendem Code:
html:

<ul id="navigation">
<li>
<a href="http://www.google.ch">Google</a></li>
<li>
<a href="http://www.youtube.com">Youtube</a></li>
<li>
<a href="http://www.webfail.at">Webfail</a></li>
</ul>

und das ist mein css code:

#navigation{
list-style: none;
margin: 0;
padding: 0;
float: left;

}

#navigation li a{
color: White;
background-color: 2F4F4F;
font-size: 12pt;
font-family: Arial;
display: block;
width: 92px;
height: 30px;
text-align: center;
text-decoration: none;
border-left: 1px solid BEBEBE;
border-right: 1px solid 141414;
}

#navigation:hover a{
color: black;
background-color: 7FFF00;
font-size: 12pt;
font-family: Arial;
display: block;
width: 92px;
height: 30px;
text-align: center;
text-decoration: none;
border-left: 1px solid 9ACD32;
border-right: 1px solid 66CD00;
}

allerdings ändert nur die Schtiftfarbe des Links, und es wird weder der Border noch der Hintergrund korrekt angezigt, kann mir einer helfen?
(wenn möglich soll die Navigation Horizontal sein)