[js]Zmiana stylów Opcje

[Glarden]

Chciałem zrobić sobie skrypt, który po kliknięciu zmienia kolor nagłówka w divie. Kod wygląda tak:

[HTML] pobierz, plaintext 
<style>
.main {color: blue; width: 200px; border: 1px solid blue; font-family: arial; font-size: 12px;}
#head {background-color: blue; color: white; font-family: arial; font-size: 12px;}
a:active {text-decoration: none;}
a:hover {text-decoration: none;}
</style>
<script>
function zmien () {
kolor = document.getElementById("head");
kolor.style.background-color = "gray;"
}
</script>
<div class='main'>
<a href="java script: zmien();"><div id='head'><center>Menu</center></div></a>
Witoj na stronie!<br>
Kliknij na nagłówek menu, aby zmienił kolor.<br>
Gul, gul - powiedział indyk.
</div>
[HTML] pobierz, plaintext 

Nie ma reakcji. Natomiast jeśli zastąpię w funkcji JS "background-color" na "color", to bardzo ładnie zmienia kolor tekstu. Nie rozumiem, dlaczego?