<div class="flex flex-wrap justify-between space-x-2">
<div class="max-w-xs rounded-lg bg-white shadow-lg dark:bg-neutral-700">
<img
src="https://tecdn.b-cdn.net/img/new/standard/nature/184.jpg"
class="rounded-t-lg"
alt="..." />
<div class="p-6">
<h5
class="mb-2 text-xl font-medium leading-tight text-neutral-800 dark:text-neutral-50">
Card title
</h5>
<p class="mb-4 text-base text-neutral-600 dark:text-neutral-200">
Some quick example text to build on the card title and make up the
bulk of the card's content.
</p>
<button
type="button"
class="inline-block rounded bg-primary px-6 pt-2.5 pb-2 text-xs font-medium uppercase leading-normal text-white shadow-[0_4px_9px_-4px_#3b71ca] transition duration-150 ease-in-out hover:bg-primary-600 hover:shadow-[0_8px_9px_-4px_rgba(59,113,202,0.3),0_4px_18px_0_rgba(59,113,202,0.2)] focus:bg-primary-600 focus:shadow-[0_8px_9px_-4px_rgba(59,113,202,0.3),0_4px_18px_0_rgba(59,113,202,0.2)] focus:outline-none focus:ring-0 active:bg-primary-700 active:shadow-[0_8px_9px_-4px_rgba(59,113,202,0.3),0_4px_18px_0_rgba(59,113,202,0.2)]"
data-te-ripple-init
data-te-ripple-color="light">
Go somewhere
</button>
</div>
</div>
<div
class="max-w-xs rounded-lg bg-white shadow-lg dark:bg-neutral-700"
aria-hidden="true">
<img
src="https://tecdn.b-cdn.net/img/new/standard/nature/182.webp"
class="rounded-t-lg"
alt="..." />
<div class="p-6">
<h5
class="mb-2 animate-pulse text-xl font-medium text-neutral-900 dark:text-white">
<span
class="inline-block min-h-[1em] w-6/12 flex-auto cursor-wait bg-current align-middle opacity-50"></span>
</h5>
<p
class="mb-4 animate-pulse text-base text-neutral-700 dark:text-white">
<span
class="inline-block min-h-[1em] w-7/12 flex-auto cursor-wait bg-current align-middle opacity-50"></span>
<span
class="inline-block min-h-[1em] w-4/12 flex-auto cursor-wait bg-current align-middle opacity-50"></span>
<span
class="inline-block min-h-[1em] w-4/12 flex-auto cursor-wait bg-current align-middle opacity-50"></span>
<span
class="inline-block min-h-[1em] w-6/12 flex-auto cursor-wait bg-current align-middle opacity-50"></span>
<span
class="inline-block min-h-[1em] w-8/12 flex-auto cursor-wait bg-current align-middle opacity-50"></span>
</p>
<a
href="#"
tabindex="-1"
class="inline-block min-h-[1em] w-6/12 flex-auto cursor-wait rounded bg-primary px-6 pt-2.5 pb-2 text-xs font-medium uppercase leading-normal text-white opacity-50 shadow-[0_4px_9px_-4px_#3b71ca] transition duration-150 ease-in-out before:inline-block before:content-[''] hover:bg-primary-600 hover:shadow-[0_8px_9px_-4px_rgba(59,113,202,0.3),0_4px_18px_0_rgba(59,113,202,0.2)] focus:bg-primary-600 focus:shadow-[0_8px_9px_-4px_rgba(59,113,202,0.3),0_4px_18px_0_rgba(59,113,202,0.2)] focus:outline-none focus:ring-0 active:bg-primary-700 active:shadow-[0_8px_9px_-4px_rgba(59,113,202,0.3),0_4px_18px_0_rgba(59,113,202,0.2)]"></a>
</div>
</div>
</div>