style h1 inside a div

I want to style a h1 headline inside a div, but no matter what I try it always remains bold.

js fiddle

.header h1 { font-style: normal; color: grey;
}

<div> <h1> Hello World </h1>
</div>

2 Answers

You need font-weight:

.header h1{ color: grey; font-weight: normal;
}

Demo:

font-style has nothing to do with bold:

The font-style CSS property allows italic or oblique faces to be selected within a font-family.

You want font-weight instead:

The font-weight CSS property specifies the weight or boldness of the font. However, some fonts are not available in all weights; some are available only on normal and bold.