Bootstrap Carousel.js Image Size not working on Mobile and Tablet

This is my tribute project: http://codepen.io/TheKhangx/full/wgzaYQ/
On mobile and tablet, my images don’t follow my max-height in .overflow
The 4th image becomes tiny too…

Can someone figure this out? Thank you

I think this may be because I need to specify different max-heights for different devices