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 pr-8 font-medium text-base-500 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 font-medium duration-500 ease-in-out transition-colors focus:outline-2 focus:outline-offset-2 focus:z-10 select-none text-white bg-blue-500 outline outline-accent-500 hover:bg-blue-600 focus:outline-accent-600 shadow-sm h-8 px-4 py-2 text-xs rounded-tl-md rounded-tr-md rounded-bl-md rounded-br-md w-full lg:w-auto"
      >
        Visit now
      </button>
    </div>
  </div>
</div>