Efeito no avatar nos topicos

Qual é minha questão:
Como Coloco Esse Efeito No Avatar Dos Topicos, Assim: Quando tu Passa o Mouse Ele Vira:

https://i.imgur.com/FtmHlCW.png
Ai Quando Passa Mouse Fica Assim:
https://i.imgur.com/LUOepk6.png

Forum Que Eu Vi: http://brasilgameoflifebgl.forumeiros.com/forum

Topico Que Eu Vi:  http://brasilgameoflifebgl.forumeiros.com/t8782-manual-da-pf-by-godrix_rockwell

Endereço do meu fórum:
http://familywhistle.forumeiros.com

Versão do fórum:
PHPBB3

teste :

Código:

.blog_comment-avatar img:hover, .postprofile dl dt a[href*="/u"] img:hover {
-webkit-filter: grayscale(1);
}
div.postprofile dl dt img:hover {
-moz-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
-webkit-transform: rotate(-7deg);
}
.blog_comment-avatar img, .postprofile dl dt a[href*="/u"] img {
-moz-transition: all .7s ease-in-out;
-ms-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
-webkit-filter: grayscale(0);
-webkit-transition: all .7s ease-in-out;
display: inline-block;
transition: all .7s ease-in-out;
}
div.postprofile dl dt img {
-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-moz-transition: all .5s ease;
-o-transition: all .5s ease;
-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-webkit-transition: all .5s ease-out;
border: 5px solid #eee;
box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
margin-left: 3px;
}
img {
border-width: 0;
}
* {
margin: 0;
padding: 0;
}
Inherited from a


na sua css

Flw Resolvido