JSFiddle - React, Tailwind, and code Playground

HTML

<div class="x">
  <div></div>
  <div>Line 1</div>
  <div>Line 2</div>
</div>

CSS

.x {
        width: 100%;
        height: 56px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .x > :nth-child(1) {
        display: block;
        float: left;
        width:48px;
        height:48px;
        border-radius: 50%;
        border:solid 1px #333333;
        margin: 4px 16px 4px 4px ;
    }

    .x > :nth-child(2) {
        font-size: 12pt;

    }

    .x::after {
        content: '';
        width: 100%;
    }

    .x > :nth-child(3) {
        font-size: 10pt;
        font-weight: 600;
        order: 1;
    }