Colocar um fade na div que aparece em overlay

Olá, tudo bem?

Estou criando um site de portfólios e criei um mansonry em que a imagem, quando esta em estado hover, aparece uma div sobre ela, fazendo um overlay. Segue o meu código: https://jsfiddle.net/mruoppolo/6yb9w4jf/ Ele até adiciona a classe transition no estado hover, porém o fade não acontece.

Saberia me explicar o motivo??

Obrigado :D