<section class="newsletter-2 py-5">
  <div class="fui-container">
    <form action="">

      <div class="px-1">
        <h4 class="mb-1 weight-300 text-gray magical">Grow Your Business!</h4>
        <p class="weight-300 text-gray magical">Get tips on managing your site, WordPress, growing your
          business,
          marketing strategies, specials and discounts! </p>
      </div>

      <div class="row">

        <!-- COL -->
        <div class="col-md-3 magical">
          <div class="group">
            <input type="text" class="fui-input" placeholder="Name*">
          </div>
        </div>

        <!-- COL -->
        <div class="col-md-3 magical">
          <div class="group">
            <input type="phone" class="fui-input" placeholder="Phone*">
          </div>
        </div>

        <!-- COL -->
        <div class="col-md-3 magical">
          <div class="group">
            <input type="email" class="fui-input" placeholder="Email*">
          </div>
        </div>

        <!-- COL -->
        <div class="col-md-3 magical">
          <div class="group">
            <input type="submit" class="fui-btn fui-btn-primary d-block w-100 img-rounded" placeholder="Email*">
          </div>
        </div>

      </div>
    </form>
  </div>
</section>

.newsletter-3 {
  position: relative;
}

.newsletter-3 .fui-container {
  padding: 40px 0;
  border-top: 2px solid #eee;
}

.newsletter-3 .fui-input,
.newsletter-3 .fui-btn {
  min-height: 50px;
}

.newsletter-3 .fui-input {
  border: none;
  border-bottom: 2px solid #949494;
}

.newsletter-3 .fui-input::-webkit-input-placeholder {
  color: gray;
}

.newsletter-3 .fui-input:-ms-input-placeholder {
  color: gray;
}

.newsletter-3 .fui-input::-ms-input-placeholder {
  color: gray;
}

.newsletter-3 .fui-input::placeholder {
  color: gray;
}

.newsletter-3 .fui-input:focus {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-color: #008cff !important;
}