Проблема с hover

Frontend developer HTML / CSS
1

Проект на ASP.NET , вставил картинку, с помощью псевдокласса hover сделал так что б картинка медленно увеличивалась в зависимости при наведении. Увеличивается она без проблем, медленно, всё как надо, а вот возвращается на место как курсор отвожу - очень быстро, мгновенно даже.

Как сделать так, что б уменьшалась она так же быстро, как и увеличивалась?

вот код:

.content-photo:hover {
        z-index: 10;

    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -o-transform: scale(1.5);

    -webkit-transition-timing-function: linear;
    -moz-transition-timing-function: linear;
    -o-transition-timing-function: linear;

    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
}</pre>
2

Вынеси 

        -webkit-transition-duration: 0.4s;
        -moz-transition-duration: 0.4s;
        -o-transition-duration: 0.4s;

в отдельный класс .content-photo { ... } и посмотри что будет

3

заработало))) спасиб)