Переход CSS с фоновым градиентом

Я изучаю анимацию / переходы с помощью CSS3, но в этом коде переход не работает ... почему?

HTML:

CSS:

#test {
    background-color: #333;
    background-image: -webkit-linear-gradient(top, #333, #666);
    width: 100px;
    height: 100px;
    -webkit-transition: background 1s linear;
}

#test:hover {
    background-image: -webkit-linear-gradient(top, #666, #999);
}

http: // jsfiddle .net / LLRfN /