#83716236: Match blocks proportional scaling of images

Solves [original request](https://www.pivotaltracker.com/story/show/83716236) to scale images in match blocks without changing aspect ratio.  Also vertically centers images, and sets them on a white background with uniform colored borders for a cleaner look.  Colors updated a bit to match [this color guide](https://s3.amazonaws.com/uploads.hipchat.com/65395/780341/kCxI5OwDMpdpdAz/Screen%20Shot%202014-10-14%20at%205.38.53%20PM.png).  Tried to improve usability by adding a border color change and cursor change on rollover of an interactive tile, and adding a darker dotted outline to valid drop zones while dragging a tile.
It does not work in IE8; as reported [at w3schools](http://www.w3schools.com/cssref/css3_pr_transform.asp) the transform property has only been available since IE9, and then only via the vendor prefix (used here).  In IE8 the transform will be ignored, resulting in incorrect positioning of images.

I figured it wasn't an issue because IE8.x is on [the Code.org browser blacklist](https://support.code.org/hc/en-us/articles/202591743) and isn't supported by our product.  Did we want to try and support it anyway?