My images is moving/bad pixel when mouse hover

Hi

I have this website: https://oliver.kaspertoxvig.dk/
But when you try to hover over an image at the frontpage, you can see that pixels move inside the image. Why does this happen?

The same if you hover over the cart in the right corner (then the logo move).

It do not happen when I remove:

transition: opacity .20s ease-in-out;
-moz-transition: opacity .20s ease-in-out;
-webkit-transition: opacity .20s ease-in-out;
}

But I was wondering if there is a solution, so I still can use the ease-in-out effect, cause normally it works fine with ease-in-out.