Typography

<h2 class="sg-subtitle">Heading 1</h2>
<h1>Physics for everyone</h1>

<h2 class="sg-subtitle">Heading 2</h2>
<h2>Leading scientific membership society working to advance physics for the benefit of all.</h2>

<h2 class="sg-subtitle">Heading 3</h2>
<h3>Leading scientific membership society working to advance physics for the benefit of all.</h3>

<h2 class="sg-subtitle">Heading 4</h2>
<h4>Leading scientific membership society working to advance physics for the benefit of all.</h4>

<h2 class="sg-subtitle">Heading 5</h2>
<h5>Leading scientific membership society working to advance physics for the benefit of all.</h5>

<h2 class="sg-subtitle">Heading 6</h2>
<h6>Leading scientific membership society working to advance physics for the benefit of all.</h6>

<h2 class="sg-subtitle">Heading lockup</h2>
<div class="iop-heading-lockup">
    <p class="iop-text-meta">Become a member</p>
    <h1>
        The Universe
        <span>in your hands</span>
    </h1>
</div>

<div class="context-html row">
    <div class="col-md-8">
        <h2 class="sg-subtitle">Lead paragraph</h2>
        <p class="iop-text-lg">Leading scientific membership society working to advance physics for the benefit of all.</p>

        <h2 class="sg-subtitle">Paragraph</h2>
        <p>Cras mattis iudicium purus sit amet <a href="#0">fermentum</a>. Quid securi etiam tamquam eu fugiat nulla pariatur. Praeterea iter est <b>quasdam</b> res quas ex communi. Cum ceteris in <i>veneratione</i> tui montes, nascetur mus.</p>

        <h2 class="sg-subtitle">Meta</h2>
        <p class="iop-text-meta">Cras mattis iudicium purus sit amet <a href="#0">fermentum</a>. Quid securi etiam tamquam eu fugiat nulla pariatur. Praeterea iter est <b>quasdam</b> res quas ex communi. Cum ceteris in <i>veneratione</i> tui montes, nascetur mus.</p>

        <h2 class="sg-subtitle">Small</h2>
        <p>
            <small>Cras mattis iudicium purus sit amet <a href="#0">fermentum</a>. Quid securi etiam tamquam eu fugiat nulla pariatur. Praeterea iter est <b>quasdam</b> res quas ex communi. Cum ceteris in <i>veneratione</i> tui montes, nascetur mus.</small>
        </p>

        <h2 class="sg-subtitle">Ordered list</h2>
        <ol>
            <li>Quae vero auctorem tractata ab fiducia dicuntur.</li>
            <li>Tityre, tu patulae recubans sub tegmine fagi dolor.</li>
            <li>Ambitioni dedisse scripsisse iudicaretur.</li>
        </ol>

        <h2 class="sg-subtitle">Unordered list</h2>
        <ul>
            <li>Quae vero auctorem tractata ab fiducia dicuntur.</li>
            <li>Tityre, tu patulae recubans sub tegmine fagi dolor.</li>
            <li>Ambitioni dedisse scripsisse iudicaretur.</li>
        </ul>

        <h2 class="sg-subtitle">Nested list</h2>
        <ol>
            <li>
                Quae vero auctorem tractata ab fiducia dicuntur.
                <ul>
                    <li>Quae vero auctorem tractata ab fiducia dicuntur.</li>
                    <li>Tityre, tu patulae recubans sub tegmine fagi dolor.</li>
                    <li>Ambitioni dedisse scripsisse iudicaretur.</li>
                </ul>
            </li>
            <li>Tityre, tu patulae recubans sub tegmine fagi dolor.</li>
            <li>
                Ambitioni dedisse scripsisse iudicaretur.
                <ol>
                    <li>Quae vero auctorem tractata ab fiducia dicuntur.</li>
                    <li>Tityre, tu patulae recubans sub tegmine fagi dolor.</li>
                    <li>Ambitioni dedisse scripsisse iudicaretur.</li>
                </ol>
            </li>
        </ol>
    </div>
</div>