Footers Components in Boldui library

<section class="bg-black overflow-x-hidden">
  <div class="border-t">
    <div class="container mx-auto px-4">
      <div class="flex flex-wrap -mx-4 mb-10 md:mb-0">
        <div class="w-full md:w-2/6 md:border-r md:border-gray-800 px-4">
          <div class="max-w-xs mx-auto py-20">
            <a class="inline-block text-xl text-white font-medium font-heading mb-8 md:mb-32" href="#">
              <img class="h-8" src="boldui-assets/logo/logo-boldui-light.svg" alt="" width="auto">
            </a>
            <p class="max-w-xs text-white uppercase font-heading">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
          </div>
        </div>
        <div class="w-full md:w-4/6 px-4">
          <div class="md:py-20 px-8 lg:pl-20 lg:pr-10">
            <div class="flex flex-wrap -mx-4">
              <div class="w-1/2 md:w-1/4 px-4 mb-12 md:mb-0">
                <h3 class="mb-8 text-sm text-white uppercase font-heading">Company</h3>
                <ul>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Careers</a></li>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Press</a></li>
                  <li><a class="text-gray-500 hover:text-gray-400" href="#">Blog</a></li>
                </ul>
              </div>
              <div class="w-1/2 md:w-1/4 px-4 mb-12 md:mb-0">
                <h3 class="mb-8 text-sm text-white uppercase font-heading">Pages</h3>
                <ul>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Login</a></li>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Register</a></li>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Add list</a></li>
                  <li><a class="text-gray-500 hover:text-gray-400" href="#">Contact</a></li>
                </ul>
              </div>
              <div class="w-1/2 md:w-1/4 px-4">
                <h3 class="mb-8 text-sm text-white uppercase font-heading">Legal</h3>
                <ul>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Terms</a></li>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">About Us</a></li>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Team</a></li>
                  <li><a class="text-gray-500 hover:text-gray-400" href="#">Privacy</a></li>
                </ul>
              </div>
              <div class="w-1/2 md:w-1/4 px-4">
                <h3 class="mb-8 text-sm text-white uppercase font-heading">Resources</h3>
                <ul>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Blog</a></li>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Service</a></li>
                  <li class="mb-8"><a class="text-gray-500 hover:text-gray-400" href="#">Product</a></li>
                  <li><a class="text-gray-500 hover:text-gray-400" href="#">Pricing</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="border-t py-16">
    <div class="container mx-auto px-4">
      <div class="flex flex-wrap justify-between">
        <p class="mb-8 md:mb-0 text-gray-500">All rights reserved © BoldUI 2021</p>
        <div class="flex w-full md:w-auto">
          <a class="mr-8" href="#">
            <img src="boldui-assets/brands/small-logos/facebook.svg" alt="">
          </a>
          <a class="mr-8" href="#">
            <img src="boldui-assets/brands/small-logos/twitter.svg" alt="">
          </a>
          <a class="mr-8" href="#">
            <img src="boldui-assets/brands/small-logos/instagram.svg" alt="">
          </a>
          <a class="mr-8" href="#">
            <img src="boldui-assets/brands/small-logos/github.svg" alt="">
          </a>
          <a href="#">
            <img src="boldui-assets/brands/small-logos/linkedin.svg" alt="">
          </a>
        </div>
      </div>
    </div>
  </div>
</section>