The reason the images are cut in half as you say is because you added this code to the Custom CSS field,

.home .content-area img.wp-post-image {
max-height: 200px;
min-height: 200px;
min-width: 300px;
max-width: 300px;

It prevents from the Bootstrap responsive CSS to take effect.

What you need to do is upload larger images and WordPress will resize them to the set sizes and it will be responsive on all devices.


This image is 300x158px.

You need to upload an image which is at least 680x500px for the system to resize it.

That will take care of the image thumbnail sizes on desktops and they will be automatically resize on mobile devices.