JSFiddle - React, Tailwind, and code Playground

HTML

<div class="banner">
    <div class="wrapper">
<p style="color: #fff;"><img src="assets/image.png"><span style="">Line one of text</span>
          <br>
         <span class="ban2">Line 2 of text</span></p>
    </div>
</div>

CSS

.banner { background-color: #000; }

.wrapper { width: 30%;
    margin: 0 auto; }

.banner p {
  font-family: "Gentium Basic";
  font-size: 19px;
  text-align: center;
  color: #aaa;
  margin-top: -10px;
  display: block;
 }
.banner img {
  float: left; 
    margin: 5px;
 }
 .banner span {
  padding-top: 50px;
  font-size: 17px;
  vertical-align:top;
 }
  .banner .ban2 span {
  padding-top: 50px;
  font-size: 17px;
  vertical-align:top;
 }