Box shadow leaving strip at bottom of image?

Hey all, very new to really messing with CSS and I can’t seem to figure out what’s going on here. On the site I’m working on there are several flags lined up like the ones in the image, and I’ve added a hover effect on mouse over with a little box shadow. However, anytime the hover effect is applied to the flag image, there’s that little strip of white added to the bottom of the image and I can’t seem to figure out what’s causing it, although I know it has something to do with the box shadow.

For the box shadow I have:
xvideos

box-shadow: 0 20px 20px rgba(0, 0, 0, 0.23);xnxx
Would really appreciate any help!

img {vertical-align: middle;}