Bulma Footers Components

<section class="section pt-0-tablet pb-0-tablet pl-0-tablet has-background-light is-clipped">
  <div class="columns is-multiline">
    <div class="column is-3-desktop is-5-tablet px-6 py-20 has-background-white">
      <div class="has-mw-xs mx-auto">
        <a class="mb-12 is-inline-block" href="#">
          <img class="image" src="yofte-assets/logos/yofte-logo.svg" alt="">
        </a>
        <div class="mb-12 has-text-weight-semibold">
          <p>Our Store</p>
          <p>N&oslash;rremark 51, 8700 Horsens</p>
          <p>Denmark</p>
        </div>
        <div class="mb-16 mb-40-tablet is-flex">
          <a class="mr-2 is-inline-block" href="#">
            <img class="image" src="yofte-assets/buttons/facebook-circle.svg" alt="">
          </a>
          <a class="mr-2 is-inline-block" href="#">
            <img class="image" src="yofte-assets/buttons/instagram-circle.svg" alt="">
          </a>
          <a class="is-inline-block" href="#">
            <img class="image" src="yofte-assets/buttons/twitter-circle.svg" alt="">
          </a>
        </div>
        <div class="columns is-mobile is-multiline">
          <div class="column is-4">
            <img class="image" src="yofte-assets/brands/visa.svg" alt="">
          </div>
          <div class="column is-4">
            <img class="image" src="yofte-assets/brands/paypal.svg" alt="">
          </div>
          <div class="column is-4">
            <img class="image" src="yofte-assets/brands/mastercard.svg" alt="">
          </div>
        </div>
      </div>
    </div>
    <div class="column is-9-desktop is-7-tablet px-6 py-20 pl-40-desktop" style="border-bottom: 1px solid rgba(0, 0, 0, 0.1);">
      <ul class="mb-16 columns is-mobile is-multiline">
        <li class="column is-narrow mb-3"><a class="button py-0 px-5 is-white has-text-centered is-rounded" style="height: 40px;" href="#">Category</a></li>
        <li class="column is-narrow mb-3"><a class="button py-0 px-5 is-white has-text-centered is-rounded" style="height: 40px;" href="#">Collection</a></li>
        <li class="column is-narrow mb-3"><a class="button py-0 px-5 is-white has-text-centered is-rounded" style="height: 40px;" href="#">Story</a></li>
        <li class="column is-narrow mb-3"><a class="button py-0 px-5 is-white has-text-centered is-rounded" style="height: 40px;" href="#">Brand</a></li>
        <li class="column is-narrow mb-3"><a class="button py-0 px-5 is-white has-text-centered is-rounded" style="height: 40px;" href="#">Partners</a></li>
        <li class="column is-narrow mb-3"><a class="button py-0 px-5 is-white has-text-centered is-rounded" style="height: 40px;" href="#">Videos</a></li>
      </ul>
      <div class="pb-20 columns is-multiline">
        <div class="column is-4-desktop is-6-tablet mb-10 mb-0-desktop">
          <h6 class="title mb-8 is-size-5">Information</h6>
          <ul class="mb-0">
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Newsroom</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Story</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Yofte Careers</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Investor Relations</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Reward program</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Delivery information</a></li>
            <li><a class="has-text-dark is-size-6" href="#">Paying by invoice</a></li>
          </ul>
        </div>
        <div class="column is-4-desktop is-6-tablet mb-10 mb-0-desktop">
          <h6 class="title mb-8 is-size-5">Customer Service</h6>
          <ul class="mb-0">
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Return an order</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Search Terms</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Advanced Search</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Orders and Returns</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">FAQs</a></li>
            <li class="mb-6"><a class="has-text-dark is-size-6" href="#">Store Location</a></li>
            <li><a class="has-text-dark is-size-6" href="#">Contact Us</a></li>
          </ul>
        </div>
        <div class="column is-4-desktop is-6-tablet">
          <h6 class="title mb-8 is-size-5">Contact Us</h6>
          <ul>
            <li class="mb-6">
              <p class="mb-2">Mobile</p>
              <a class="has-text-info is-size-6" href="#">+39 4097 533 32 331</a>
            </li>
            <li class="mb-6">
              <p class="mb-2">Email</p>
              <a class="has-text-info is-size-6" href="#">[email protected]</a>
            </li>
            <li>
              <p class="mb-2">Live Chat</p>
              <a class="has-text-info is-size-6" href="#">yoftestore</a>
            </li>
          </ul>
        </div>
      </div>
      <div class="mt-8 pb-32 pb-0-desktop is-relative">
        <p class="has-text-weight-semibold">&copy; Copyright 2021 Yofte</p>
      </div>
    </div>
  </div>
</section>