Add borders around horizontal and vertical teasers

This adds borders around horizontal and vertical teasers. Fixes #5.

Because individual parts of the templating don't know what follows it ends up adding in a border beneath which shouldn't be there. JavaScript has been added for cases to remove the redundant border beneath an individual teaser when the row also has one. (As a side effect, it resolves the mobile view problem mentioned on https://github.com/cambridgeuniversity/Project-Light/issues/53 and it can be unhidden at this size - except for the last one on the row.)

This doesn't remove the bottom row border where the teasers are the last thing, eg

![image](https://cloud.githubusercontent.com/assets/1784740/2799226/6d35fc0c-cc5c-11e3-9e58-50a06cbbe36a.png)

It *might* be possible to use JavaScript to work it out and hide it accordingly, but that won't be trivial.