Font rendering on Mac makes the font "Regular" look like "Bold"

Question

I have a font rendering problem on my Mac. The font is "Regular" size and renders right in windows, however, on Mac the same font looks like "Bold". Windows is Seven and MAC is Yosemite.

I’m using this code:

@font-face {
font-family: 'open_sansregular';
src: url('font/OpenSans-Regular-webfont.eot');
src: url('font/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
     url('font/OpenSans-Regular-webfont.woff2') format('woff2'),
     url('font/OpenSans-Regular-webfont.woff') format('woff'),
     url('font/OpenSans-Regular-webfont.ttf') format('truetype'),
     url('font/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
font-weight: normal;
font-style: normal;
}

(I tried that in body and html, but the problem still remains)

body {
font-family: 'open_sansregular';
color: #939393;
font-size: 14px;
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
font-style: normal;
font-weight: normal;
}

And the sources go like this:

1 - Windows, Chrome (Correct) 2 - Mac, Chrome 3 - Mac, Firefox

Answer 1

From what I know Mac and Windows have different algorithms to calculate font size, if it is a web font the situation gets even more complicated.

Anyway you can use the following CSS code

-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;

This should make the fonts look more uniform across platforms.