<section class="relative overflow-hidden">
<img class="hidden lg:block absolute top-0 right-0 w-1/2 h-full" src="saturn-assets/images/http-codes/image-yellow.png" alt="">
<div class="relative container px-4 mx-auto">
<img class="absolute top-0 left-0 ml-20 h-142" src="saturn-assets/images/http-codes/blue-orange-double-light.png" alt="">
<div class="relative py-20 md:py-24 lg:py-44 max-w-sm mx-auto lg:mx-0">
<h3 class="text-7xl font-semibold text-gray-900 mb-4">404</h3>
<h4 class="font-heading text-4xl font-bold text-gray-900 mb-6">Oops! Can't Find That Page</h4>
<p class="text-xl font-semibold text-gray-500 mb-14">Sorry, the page you are looking for doesn't exist or has been moved. Try searching our site:</p>
<a class="relative group inline-block py-3 px-5 text-center text-sm font-semibold text-orange-50 bg-orange-900 rounded-full overflow-hidden" href="#">
<div class="absolute top-0 right-full w-full h-full bg-gray-900 transform group-hover:translate-x-full group-hover:scale-102 transition duration-500"></div>
<span class="relative">Take me home</span>
</a>
</div>
</div>
<img class="lg:hidden w-full h-135 md:h-166 object-cover object-bottom" src="saturn-assets/images/http-codes/image-yellow.png" alt="">
</section>