Showing <h1> <h5> text inline using css

I want to show "Sentiment analysis" such that S should be much larger then h5 text.

What's wrong with follwing code:

HTML:

<h1>S</h1> <h5>entiment Analysis</h5>      

CSS:

h1 {
    margin-left: 36%;
    color:#C0C0C0;
    font-family: "calibri";
    text-decoration:underline;
    white-space: pre;
}

h5 {
    margin-left: 36%;
    color:#C0C0C0;
    font-family: "calibri";
    text-decoration:underline;
    white-space: pre;
}

Live code in CodePan