Problema con transition en img, no reconoce after y after:hover

[Rafael]

Yo la realidad es de que no he probado tu código, solo quiero hacer notar la lógica.

<div class="product-image-container">
- <a>
- <img>
- </a>
</div>

El codigo acaba siendo bastante simple:

Código CSS:

.product-image-container > a > img {
    box-shadow: 0px 0px 0px #888888;
    transition: all .3s ease-in-out;}
 
.product-image-container > a > img:hover {
    box-shadow: 10px 10px 5px #888888;
    transition: all .3s ease-in-out;}
 

Repito el código para la transición de ida y vuelta.