<body> <div class="md:grid md:grid-cols-2 md:gap-8 relative mt-16 lg:mt-16 items-center"> <div class="relative lg:ml-8 my-8 w-full md:w-auto"> <h3 class="text-base not-italic leading-6 text-gray-600">FEATURED POST</h3> <a href={{featured.permalink}} class=""> <h2 class="mt-8 text-2xl sm:text-3xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-2 md:mb-4"> {{ featured.title }} </h2> </a> <p class="mb-4 md:mb-10 text-lg lg:pr-4"> {{featured.description}} </p> <h4 class="text-sm not-italic font-light leading-6 text-gray-600"> {{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} - {{ featured.extra.author }} </h4> </div> <div class="-mx-4 relative lg:mt-0 max-w-full"> <img class="relative mx-auto w-7/12 md:w-auto md:max-w-full max-h-80" src=/{{featured.extra.imgPath}} alt="" /> </div> </div> </div> </div> </body>