<div class="overflow-hidden rounded-md bg-glacier-50 shadow shadow-glacier-400">
<a href="#" class="">
<img class="h-60 w-full object-cover duration-300 hover:opacity-90" src="https://images.unsplash.com/photo-1529963183134-61a90db47eaf?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80" loading="lazy" alt="" />
</a>
<div class="p-8">
<div class="text-sm font-semibold uppercase tracking-wide text-glacier-darkblue">Travel</div>
<a href="#" class="mt-1 block text-lg font-medium leading-tight text-glacier-800 hover:underline">Best times to see the Northern Lights</a>
<p class="mt-2 max-w-prose text-glacier-600">When and where can you see the Northern Lights? All you need to know!</p>
</div>
</div><div class="overflow-hidden rounded-md bg-glacier-50 shadow shadow-glacier-400 dark:bg-glacier-800 dark:shadow-glacier-900">
<a href="#" class="">
<img class="h-60 w-full object-cover duration-300 hover:opacity-90" src="https://images.unsplash.com/photo-1529963183134-61a90db47eaf?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80" loading="lazy" alt="" />
</a>
<div class="p-8">
<div class="text-sm font-semibold uppercase tracking-wide text-glacier-darkblue">Travel</div>
<a href="#" class="mt-1 block text-lg font-medium leading-tight text-glacier-800 hover:underline dark:text-glacier-100">Best times to see the Northern Lights</a>
<p class="mt-2 max-w-prose text-glacier-600 dark:text-glacier-400">When and where can you see the Northern Lights? All you need to know!</p>
</div>
</div><div class="overflow-hidden rounded-md bg-glacier-800 shadow shadow-glacier-900">
<a href="#" class="">
<img class="h-60 w-full object-cover duration-300 hover:opacity-90" src="https://images.unsplash.com/photo-1529963183134-61a90db47eaf?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80" loading="lazy" alt="" />
</a>
<div class="p-8">
<div class="text-sm font-semibold uppercase tracking-wide text-glacier-darkblue">Travel</div>
<a href="#" class="mt-1 block text-lg font-medium leading-tight text-glacier-100 hover:underline">Best times to see the Northern Lights</a>
<p class="mt-2 max-w-prose text-glacier-400">When and where can you see the Northern Lights? All you need to know!</p>
</div>
</div>