Fixed font splitting issue on iOS, Fixes #1

<h2>The problem</h2>

There is an issue on iOS (and potentially other browsers) where font that doesn't support being bold, is made
bold with "font-weight" and the result is "pseudo-bold" by the browser -- rendering the font a second time offset
from the first.

<h2>The fix</h2>

The following steps taken to fix the splitting issue are explained and
shown below.

As you can see, there is an issue with the font "doubling" or "splitting". (If you can't see it, open the image in a new tab at 100% size.)


<h4>Original (iOS 8) on the left; proposed changes (iOS 8) on the right</h4>


<img width="50%" height="50%" src="https://cloud.githubusercontent.com/assets/4109551/3729503/95bd090c-16be-11e4-8533-c5d7d5a517a7.png"><img width="50%" height="50%" src="https://cloud.githubusercontent.com/assets/4109551/3729502/95bca9b2-16be-11e4-9b9c-91908d4fd0f7.png">

But when you fix the "splitting" for mobile (by using font-weight: normal;), all the bold text doesn't pop out anymore. I changed the font-family in the #title class from "Roboto-ThinItalic" to "Roboto-LightItalic" to fix this.

<h4>Original (on Safari 8)</h4>
<img width="90%" height="90%" src="https://cloud.githubusercontent.com/assets/4109551/3729505/95bd6910-16be-11e4-912c-b3c2a1858a89.png">

<h4>Proposed changes (on Safari 8), with Roboto-Thin</h4>
<img width="90%" height="90%" src="https://cloud.githubusercontent.com/assets/4109551/3729501/95bc8c7a-16be-11e4-8d0f-5b4b5e60c523.png">

<h4>Proposed changes (on Safari 8), with Roboto-Light</h4>
<img width="90%" height="90%" src="https://cloud.githubusercontent.com/assets/4109551/3729504/95bd1a5a-16be-11e4-8fdc-3d5dbb1d1bb4.png">