tweaking styles to polish layout / text

This updates and polishes some font styles and component widths at various break points. Most obvious differences seen on fronts;

Before;
![screen shot 2014-06-11 at 15 50 34](https://cloud.githubusercontent.com/assets/1303616/3246051/f2c37ada-f177-11e3-8891-bb82b9811c1f.png)

After;
![screen shot 2014-06-11 at 15 51 06](https://cloud.githubusercontent.com/assets/1303616/3246059/fbbcf864-f177-11e3-8eab-0ef10a94138d.png)


Where is this 32px coming from? Can you put it into a variable to make it more obvious?