Jia UI refactor

![screen shot 2014-11-07 at 4 50 28 pm](https://cloud.githubusercontent.com/assets/1996521/4962498/4fc944a6-66e1-11e4-8a63-58fe61997c19.png)
![screen shot 2014-11-07 at 4 50 14 pm](https://cloud.githubusercontent.com/assets/1996521/4962503/6638d350-66e1-11e4-8de8-ae3325529510.png)

Shout out to @tjphilli for his feedback and recommendations
The mobile layout classes are part of Bootstrap's 12 column grid system. In some places, things fit multiple across

```
Small screen:
[   col-xs-12 col-sm-6   ][   col-xs-12 col-sm-6   ]
```

but when it gets down to mobile, almost nothing can fit side by side

```
Phone screen:
[   col-xs-12 col-sm-6   ]
[   col-xs-12 col-sm-6   ]
```