typography

<!-- Default -->


<!-- H 1 -->
<h1>H1 Title</h1>

<!-- H 2 -->
<h2>H2 Title</h2>

<!-- H 3 -->
<h3>H3 Title</h3>

<!-- H 4 -->
<h4>H4 Title</h4>

<!-- H 5 -->
<h5>H5 Title</h5>

<!-- H 6 -->
<h6>H6 Title</h6>

<!-- Lead -->
<p class="lead">
    <!--
  font-size: 24px; line-height 30px;
  -->
    This is lead copy.
</p>

<!-- Body Copy -->
<p>
    This is body copy. A series of sentences together which make a paragraph.
</p>

<!-- Body Copy Small -->
<p class="body-copy-small">Body Copy Small</p>

<!-- Code -->
<code>This is code style.</code>

<!-- Right Align -->
<p class="right-align">Right-Aligned Text</p>

<!-- Center Align -->
<p class="center-align">Center-Aligned Text</p>

<!-- Left Align -->
<p class="left-align">Left-Aligned Text</p>

<!-- Strong -->
<p>This sentence contains text styled as <strong>strong</strong>.</p>

<!-- Emphasis -->
<p>This sentence contains text styled as <em>emphasis</em></p>

<!-- Deleted -->
<p>This sentence contains text styled as <del>strike</del></p>

<!-- Marked -->
<p>This sentence contains text that has been <span class="mark-text">marked</span>.</p>

<!-- Inserted -->
<p>This sentence contains text that has been <span class="insert-text">inserted.</span></p>

<!-- Blockquote -->
<div class="blockquote-wrapper">
    <div class="blockquote">
        <p class="blockquote__quote">Quote copy. A series of senences together which make a paragraph. Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus caborundum e pluribus unum.</p>
        <p class="blockquote__citation">&mdash; First Last Name in <em>Source</em></p>
    </div>
</div>