<div class="bg-gray-50">
<div
class="container mx-auto text-center py-12 px-4 sm:px-6 lg:py-16 lg:px-8"
>
<h2
class="text-3xl font-extrabold tracking-tight text-gray-900 sm:text-4xl"
>
<span class="block">Sign Up!</span>
</h2>
<p class="py-4 text-gray-500 text-lg tracking-wide w-full md:w-3/5 mx-auto text-center">
We will send you the hottest deals straight to your inbox. So you are always in on the best-kept software secrets.
</p>
<form action="" method="post" class="mx-auto w-full md:w-3/5">
<div class="grid grid-cols-1 md:grid-cols-3 gap-0 gap-y-3 md:gap-3">
<div class="col-span-2">
<input type="email" name="email" id="email" placeholder="Enter your email address.." class="w-full bg-white px-5 py-6 border border-gray-100 rounded-md h-12 shadow">
</div>
<div>
<button type="submit"
class="block w-full text-center md:inline-flex items-center justify-center px-5 py-3 rounded-md border border-transparent text-base font-medium text-white bg-indigo-600 hover:bg-indigo-700"
>Submit</button>
</div>
</div>
</form>
</div>
</div>
const CTA = () => {
return (
<div className="bg-gray-50">
<div className="container mx-auto text-center py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
<h2 className="text-3xl font-extrabold tracking-tight text-gray-900 sm:text-4xl">
<span className="block">Sign Up!</span>
</h2>
<p className="py-4 text-gray-500 text-lg tracking-wide w-full md:w-3/5 mx-auto text-center">
We will send you the hottest deals straight to your inbox.
So you are always in on the best-kept software secrets.
</p>
<form action method="post" className="mx-auto w-full md:w-3/5">
<div className="grid grid-cols-1 md:grid-cols-3 gap-0 gap-y-3 md:gap-3">
<div className="col-span-2">
<input
type="email"
name="email"
id="email"
placeholder="Enter your email address.."
className="w-full bg-white px-5 py-6 border border-gray-100 rounded-md h-12 shadow"
/>
</div>
<div>
<button
type="submit"
className="block w-full text-center md:inline-flex items-center justify-center px-5 py-3 rounded-md border border-transparent text-base font-medium text-white bg-indigo-600 hover:bg-indigo-700"
>
Submit
</button>
</div>
</div>
</form>
</div>
</div>
);
}
export default CTA;