Tutorial:Efecto en la imagen 3

Hola como estan ?  ,hoy les traigo otro efecto en la Imagen ,que al pasar el cursor se inclina y tiene un borde y sombra ,para verlo mejor ,clic en :

Vista Previa 

Si les gusta sigan los pasitos :
Para Plantilla Basica: Ir a Plantilla/Edicion Html/Buscar con Ctrl +F  ]]></b:skin>
Para Plantilla Clasica o Blogskin:Pegar el siguiente codigo antes de </style>

img{
 margin: 20px; border: 5px solid #eee;
-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;
 }
img:hover{
 -webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
}

y listo ponen guardar ,eso es todo 
#eee:cambiar el color del borde