Estou há muito tempo tentando resolver um bug que só ocorre no Microsoft Edge. Preciso criar um link que tenha uma borda em formato de círculo, e dentro deste círculo preciso que tenha uma imagem. Ao passar o mouse, deve surgir uma animação com opacidade na div interna.
Tudo funciona perfeitamente no Chrome e Firefox, porém só no Microsoft Edge que acontece o problema. Ele já inicia como se eu tivesse com o mouse sobre os elementos. Ao que parece, ele está considerando só a opacidade da última div, e não das externas.
O código está neste link: https://jsfiddle.net/fsf4ehsb/1/
Alguém poderia dizer como contornar este problema?