Как сделать так, что бы при наведении мышкой на блок меню, он становился бы другого цвета

#menu
{
    width: 100%;
    margin: 0;
    padding: 10px 0 0 0;
    list-style: none;   
    background: #111;
    background: -moz-linear-gradient(#444, #111); 
    background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));  
    background: -webkit-linear-gradient(#444, #111);    
    background: -o-linear-gradient(#444, #111);
    background: -ms-linear-gradient(#444, #111);
    background: linear-gradient(#444, #111);
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 2px 1px #9c9c9c;
    -webkit-box-shadow: 0 2px 1px #9c9c9c;
    box-shadow: 0 2px 1px #9c9c9c;
    background-image:block;
    
}
 
#menu li
{
    float: left;
    padding: 0 0 10px 0;
    position: relative;
    line-height: 0;
    display:inline-block;
 
    
}
 
#menu a 
{
    display: block;
    float: left;
    height: 25px;
    padding: 0 25px;
    color: #999;
    text-transform: uppercase;
    font: bold 12px/25px Arial, Helvetica;
    text-decoration: none;
    text-shadow: 0 1px 0 #000;
}
 
#menu li:hover > a
{
background-color: #04acec;
    color: #fafafa;
}
 
*html #menu li a:hover /* IE6 */
{
    color: #fafafa;
}
 
#menu li:hover > ul
{
    display: block;
}

#menu li:hover{display:inline-block; color:#...; background:#....;}