The typical trick is margin: auto. It'll center it inside what-ever it's in.
demo
Besides that I have a few comments on your code (since you're a beginner).
left: 50%; does nothing unless you change the position style, e.g., position: relative; or position: absolute;- The container the
div is in needs to be larger than it -- otherwise centering it really doesn't mean anything. This is because styles like margin: auto are relative to the parent container, i.e., it needs space.
- For Google Web Fonts, make sure you have your
@font-face with it. Also, use alternatives. Not all browsers support web fonts, and the more control you have: the better. An example would be font-family: Ubuntu, Arial, Sans;, ordered from most preferred to most likely backups.
