<div class="fixed bottom-0 inset-x-0 z-50 p-4">
<div class="pt-14 pb-20 px-8 md:px-18 bg-yellowGray-500 rounded-3xl">
<div class="flex flex-wrap -mx-4">
<div class="w-full xl:w-2/3 px-4">
<div class="inline-flex items-center px-5 py-2 bg-white rounded-full mb-8">
<span class="block w-2 h-2 mr-2 rounded-full bg-indigo-500"></span>
<span class="uppercase text-sm font-medium tracking-tight">COOOOKIES</span>
</div>
<h1 class="text-4xl font-heading mb-8">Cookies on this site</h1>
<p class="max-w-4xl">By clicking accept, you agree to the storing of cookies on your device to enhance site navigation. Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests.</p>
</div>
<div class="w-full xl:w-1/3 px-4 pt-16">
<div class="flex flex-wrap items-center -mb-4">
<a class="group relative inline-block h-16 sm:mr-6 mb-4 w-full sm:w-40 bg-blueGray-900 rounded" href="#">
<div class="absolute top-0 left-0 transform -translate-y-1 -translate-x-1 w-full h-full group-hover:translate-y-0 group-hover:translate-x-0 transition duration-300">
<div class="flex h-full w-full items-center justify-center bg-blue-500 border-2 border-blueGray-900 rounded">
<span class="text-base font-semibold uppercase">Allow</span>
</div>
</div>
</a>
<a class="group relative inline-block h-16 mb-4 w-full sm:w-40 bg-blueGray-900 rounded" href="#">
<div class="absolute top-0 left-0 transform -translate-y-1 -translate-x-1 w-full h-full group-hover:translate-y-0 group-hover:translate-x-0 transition duration-300">
<div class="flex h-full w-full items-center justify-center bg-white border-2 border-blueGray-900 rounded">
<span class="text-base font-semibold uppercase">More</span>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>