How to make new images for products fit in the sliders layouts?

[dalawwa]

Hi,
I am trying to figure out how to make newly created images for a product fit nicely in the circles inside the sliders. I have a screenshot :

I would like to have something in the line of the following but bigger and larger with same proportions that can fit decently in the circles of the sliders.

I obtained this result after following the tutorial at http://guides.spreecommerce.com/developer/heroku.html and adjusting it like this :

https://gist.github.com/adoptanoob/26e2e4cd263deaf2d9bf

Here is my gemfile.lock : https://gist.github.com/adoptanoob/339204a819fbc05d60eb#file-spree2_gemfilelock

I am on ubuntu 14.04 FF latest version, same happens with windows 8 and chrome