Tailwind CSS Components

<section class="pt-6 pb-20 bg-white overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white border border-gray-100 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-900 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-800 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-900 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-900 border border-gray-800 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-800 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-900 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-50 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-50 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-900 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-800 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-50 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-900 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-900 border border-gray-800 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-white overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white border border-gray-100 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-900 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-800 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-white overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-100 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-900 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-900 border border-gray-800 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-50 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-800 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-900 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-white overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-100 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-800 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-gray-900 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo-white.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-200 hover:text-gray-300" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-white overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white border border-gray-100 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-gray-50 overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white border border-gray-100 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>

<section class="pt-6 pb-20 bg-white overflow-hidden" x-data="{ mobileNavOpen: false }">
  <div class="container mx-auto px-4">
    <div class="mb-6">
      <div class="flex items-center justify-between px-6 py-3.5 bg-white border border-gray-100 rounded-full">
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto">
              <a href="#">
                <img src="zanrly-assets/logos/zanrly-logo.svg" alt="">
              </a>
            </div>
          </div>
        </div>
        <div class="w-auto">
          <div class="flex flex-wrap items-center">
            <div class="w-auto hidden lg:block">
              <ul class="flex items-center justify-center">
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Features</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Solutions</a></li>
                <li class="mr-9"><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Resources</a></li>
                <li><a class="inline-block text-sm font-bold text-gray-900 hover:text-gray-700" href="#">Pricing</a></li>
              </ul>
            </div>
          </div>