JSFiddle - React, Tailwind, and code Playground

HTML

<h2>Current Style</h2>
<img src="http://ceusearch.texasagriculture.gov/images/tdaheader.png" />

<h2>Single Line</h2>
<div class="tda-header">
    <span class="agency-seal"></span>
    <div>
        <h1>Texas Department of Agriculture</h1>
        <h2>Commissioner Sid Miller</h2>
    </div>
</div>
<br/>

<h2>Two Lines Left Justified</h2>
<div class="tda-header">
    <span class="agency-seal"></span>
    <div>
        <h1>Texas Department of Agriculture</h1>
        <h2>
            Commissioner<br/>
            Sid Miller
        </h2>
    </div>
</div>
<br/>

<h2>Single Line Centered With Seal</h2>
<div class="tda-header" style="text-align: center">
    <span class="agency-seal" style="float: none;"></span>
    <div>
        <h1 style="margin-left:0">Texas Department of Agriculture</h1>
        <h2 style="margin-left:0">
            Commissioner Sid Miller
        </h2>
    </div>
</div>
<br/>

<h2>Two Lines Centered Without Seal</h2>
<div class="tda-header" style="text-align: center">
    <div>
        <h1 style="margin-left:0">Texas Department of Agriculture</h1>
        <h2 style="margin-left:0">
            Commissioner<br/>
            Sid Miller
        </h2>
    </div>
</div>
<br/>

CSS

/* @import url(http://fonts.googleapis.com/css?family=EB+Garamond); */
@import url(//fonts.googleapis.com/css?family=Cinzel:400,bold?text=TexasDepartmentOfAgricultureCommissionerSidMiller);

h2 {
    margin-bottom: 0;
    margin-top: 3rem;
    font-family: Calibri;
    font-variant: small-caps;
}

h2:first-of-type {
    margin-top: 0;
}
.tda-header {
    font-family: 'EB Garamond', Garamond, Georgia, serif;
    font-family: 'Cinzel', serif;
    /* font-family: Garamond, Georgia, serif; */
    font-variant: small-caps;
    white-space: nowrap;
}

.tda-header img.agency-seal {
    display: inline-block;
    float: left;
    margin: 4px;
}

.tda-header h1 {
    font-size: 1.85rem;
    font-weight: normal;
    margin: 0;
    /* color: #0C00E8; */
}
.tda-header h2 {
    font-size: 1rem;
    font-weight: bold;
    font-family: 'Cinzel', serif;
    text-transform: uppercase;
    margin: 0;
    margin-left: 4rem;
    line-height: .75rem;
    /* color: #FF2929; */
}

span.agency-seal {
    display: inline-block;
    float: left;
    margin: 4px;
    width: 50px;
    height: 50px;
    background:...