:: Sobre - 4. Melhorando a experiência do usuário

:: Olá... eu estou no vídeo quatro e algo acontece mas não estou enxergando o que está errado.

Eu tenho no HTML:

        <div class="row">
                <!-- inicio do panel -->
                <meu-painel titulo="{{foto.titulo}}" ng-repeat="foto in fotos | filter:filtro" class="col-md-4 painel-animado">
                    <img src="{{foto.url}}" alt="{{foto.titulo}}" class="img-responsive center-block">
                </meu-painel>

                <!-- fim do panel -->
        </div>

E tenho no CSS:

.painel-animado.ng-leave-active {
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -o-transform: scale(0.1);
    -ms-transform: scale(0.1);
    transform: scale(0.1);
}

.painel-animado {
-webkit-transition: all 0.8s ease;
-moz-transition: all 0.8s ease;
-o-transition: all 0.8s ease;
transition: all 0.8s ease;
}

`

Entretanto meus paineis não desaparecem com suavidade. Onde posso estar errando que não enxergo?