Different font vertical align in line on OS X

Question

I have a problem with fonts, because they don't render same on Windows and on OS X. On Windows, characters are vertically aligned in line, but on OS X, the characters are positioned much closer to top of the line. I highlighted the text in screenshots so you can see the difference.

I am using font Gotham. Any ideas? Do I have to use browser-specific hacks or is it a font issue?

Link to JSFiddle: http://jsfiddle.net/wewo/myh4amud/

body {
	font-family: 'Gotham', Arial, sans-serif;
	background-color: #282828;
	font-size: 14px;
	font-weight: normal;
}

div {
    color: white;
    font-size: 5em;
    padding-top: 15px;
    padding-bottom: 6px;
    line-height: 1em;
}

<div>3</div>

---

Thank you!

Answer 1

The problem is in process converting or generating webfont font.

I use tool Font Squirrel for convert correct, with this option EXPERT... :

If don't work with Google Font, download him and send for convert.