banners #01

<div class="pb-36">
  <!--- Starts Component -->
  <div class="overflow-hidden bg-base-50 px-6 py-2.5 sm:px-3.5">
    <div
      class="flex flex-wrap sm:justify-center sm:items-center gap-x-4 gap-y-2 lg:text-center"
    >
      <span class="text-sm font-medium text-base-500 pr-8 lg:pr-0">
        <strong class="font-semibold">Lexington Themes</strong>
        <span>·</span> Free and premium multipage themes and UI Kits crafted
        with Astro JS, and Tailwind CSS.
      </span>
      <button
        class="flex items-center justify-center text-center text-shadow-2xs font-semibold shadow-md ring inset-shadow-2xs hover:shadow-none items-center duration-300 ease-in-out transition-all focus:outline-2 outline-offset-2 focus:ring-offset-white text-white shadow-accent-600/20 inset-shadow-white/20 text-shadow-accent-500 ring-accent-600 bg-linear-to-b from-accent-500 to-accent-600 to-70% focus:outline-accent-600 h-8 px-4 py-2 text-xs rounded-md w-full lg:w-auto"
      >
        Visit now
      </button>
    </div>
  </div>
</div>