footer1

<section>
  <div class="bg-white">
    <div class="container py-12 lg:py-16">
      <div class="xl:grid xl:grid-cols-3 xl:gap-8">
        <div class="text-white xl:col-span-1">
          <a href="#"
            class="text-lg font-bold tracking-tighter tracking-wide text-blue-600 transition duration-500 ease-in-out lg:pr-8">
            wickedblocks
          </a>
          <p class="mt-2 w-1/2 text-sm text-gray-500">
            Wicked templates for wicked dev's
          </p>
        </div>
        <div class="mt-12 grid grid-cols-2 gap-8 xl:col-span-2 xl:mt-0">
          <div class="md:grid md:grid-cols-2 md:gap-8">
            <div>
              <h3 class="text-sm font-bold uppercase tracking-wider text-blue-500">
                Navigation
              </h3>
              <ul role="list" class="mt-4 space-y-2">
                <li>
                  <a href="./pricing.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Pricing
                  </a>
                </li>
                <li>
                  <a href="./templates.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    All Templates
                  </a>
                </li>
                <li>
                  <a href="./landing-pages.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Landing Pages
                  </a>
                </li>
                <li>
                  <a href="./nextjs.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Next.js Templates
                  </a>
                </li>
                <li>
                  <a href="./multi-page.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Full Templates
                  </a>
                </li>
                <li>
                  <a href="./demos.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Free Templates
                  </a>
                </li>
                <li>
                  <a href="./documentation.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Documentation
                  </a>
                </li>
                <li>
                  <a href="#" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Customers
                  </a>
                </li>
                <li>
                  <a href="https://twitter.com/wickedtemplates/"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    About
                  </a>
                </li>
              </ul>
            </div>
            <div class="mt-12 md:mt-0">
              <h3 class="text-sm font-bold uppercase tracking-wider text-blue-500">
                UI/UX &amp; Dev
              </h3>
              <ul role="list" class="mt-4 space-y-2">
                <li>
                  <a href="https://www.wickedblocks.dev"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Wickled Blocks
                  </a>
                </li>
                <li>
                  <a href="https://www.wickedbackgrounds.com/"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Wicked Backgrounds
                  </a>
                </li>
                <li>
                  <a href="https://wickedpopups.com/" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Wicked Popup's
                  </a>
                </li>
                <li>
                  <a href="https://www.colorsandfonts.com/.html"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Colors &amp; Fonts
                  </a>
                </li>
                <li>
                  <a href="https://30daysoftailwindcss.com/"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    30 Days Of Tailwind CSS</a>
                </li>
                <li>
                  <a href="https://www.wvsc.dev/.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Wicked VS Code</a>
                </li>
                <li>
                  <a href="https://www.brutalist.one/.html"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Brutalist Websites</a>
                </li>
              </ul>
            </div>
          </div>
          <div class="md:grid md:grid-cols-2 md:gap-8">
            <div>
              <h3 class="text-sm font-bold uppercase tracking-wider text-blue-500">
                Legal
              </h3>
              <ul role="list" class="mt-4 space-y-2">
                <li>
                  <a href="./changelog.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Changelog
                  </a>
                </li>
                <li>
                  <a href="./faq.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    FAQ
                  </a>
                </li>
                <li>
                  <a href="./refund.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Refund
                  </a>
                </li>
                <li>
                  <a href="./license.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    License
                  </a>
                </li>
                <li>
                  <a href="./privacy.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Privacy Policy
                  </a>
                </li>
                <li>
                  <a href="./terms.html" class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Terms
                  </a>
                </li>
              </ul>
            </div>
            <div class="mt-12 md:mt-0">
              <h3 class="text-sm font-bold uppercase tracking-wider text-blue-500">
                Socials
              </h3>
              <ul role="list" class="mt-4 space-y-2">
                <li>
                  <a href="https://twitter.com/WickedTemplates"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Twitter
                  </a>
                </li>
                <li>
                  <a href="https://dribbble.com/MichaelAndreuzza.html"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Dribbble
                  </a>
                </li>
                <li>
                  <a href="https://www.indiehackers.com/product/wicked-templates"
                    class="text-base font-normal text-gray-500 hover:text-blue-600">
                    Indie Hackers
                  </a>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="bg-gray-50 py-12 sm:px-6">
    <div class="container">
      <div class="flex flex-wrap items-baseline">
        <span class="mt-2 text-sm font-light text-gray-500">
          Copyright © 2020 - 2021
          <a href="https://twitter.com/wickedtemplates"
            class="mx-2 text-blue-600 hover:text-blue-700">@WickedTemplates</a>
        </span>
      </div>
    </div>
  </div>
</section>