JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="container">
  <div class="row visit-redeem text-center">
    <h5>Visit Site To Redeem</h5>
  </div>
  <div class="row">
  <div class="col-xs-6 survey-extra">
    <h5>FROM OUR SPONSORS</h5>
    <span class="money-extra">$0.00</span>
  </div>

  <div class="col-xs-6 survey-extra">
    <h5>FREEBIES</h5>
    <span class="money-extra">$0.00</span>
  </div>
</div>
</div>

CSS

.survey-extra {
    background: #1e90ff;
    color: #fff;
    padding: 5px;
    border-radius: 10px;
    text-transform: uppercase;
}

.survey-extra:nth-of-type(2) {
  width: 49%;
  float: right;
}

.visit-redeem {
  background: #56a4da;
  margin-top: 5px;
  margin-bottom: 6px;
  color: #fff;
  padding: 5px;
  border-radius: 20px 20px 0 0;
  text-transform: uppercase;
}