<div class="widget follow-us">
  <div class="share-links">
    <a href="#" target="_blank" title="Facebook" class="share-facebook">Facebook</a>
    <a href="#" target="_blank" title="Twitter" class="share-twitter">Twitter</a>
    <a href="#" target="_blank" title="Instagram" class="share-instagram">Instagram</a>
  </div>
</div>
<div class="widget widget_text">
  <h3 class="widget-title">Subscribe newsletter</h3>
  <div class="textwidget"><p>Get all the latest information on Events, Sales and Offers.</p></div>
</div>
<div class="widget widget_text">
  <div class="textwidget">
    {{block class="Magento\Newsletter\Block\Subscribe" name="home.newsletter" template="subscribe_form_footer.phtml"}}
  </div>
</div>
<style>
  .footer .footer-middle .col-lg-12:before {
    content: '';
    border-top: 1px solid #e7e7e7;
    display: block;
    margin-bottom: 3rem;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
  }

  .footer .widget + .widget {
    margin-top: 0;
  }
  .footer .footer-middle .col-lg-12 {
    margin-top: 2rem;
    margin-bottom: 1rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .footer-middle .col-lg-12 .widget {
    margin: 0 0 1.4rem;
    flex: 0 0 100%;
  }
  .footer .footer-middle .col-lg-12 .widget-title {
    font-size: 1.077em;
    margin-bottom: .2rem;
  }
  @media (min-width: 992px) {
    .footer-middle .col-lg-12 .widget {
      flex: 0 0 33.3333%;
    }
  }
  .footer .follow-us .share-links a:not(:hover) {
    background: #f4f4f4;
    color: #333;
  }
  .footer .follow-us .share-links a {
    width: 30px;
    height: 30px;
    border: none;
  }
  .footer .newsletter input {
    background: #f4f4f4;
    padding-left: 1.5rem;
    color: #686865;
    height: 44px;
    font-size: .75rem;
    margin-bottom: 10px;
  }
  .footer .newsletter input:placeholder {
    color: inherit;
  }
  .footer .newsletter .action.subscribe {
    height: 44px;
    padding: 0 1.25rem;
    font-size: 11px;
  }
</style>