<div class="py-6 flex flex-col justify-center sm:py-12">
<div class="relative py-3 sm:max-w-xl sm:mx-auto">
<div class="relative px-4 py-10 bg-white mx-8 md:mx-0 shadow rounded-3xl sm:p-10">
<div class="max-w-md mx-auto">
<div class="flex items-center space-x-5">
<div
class="h-14 w-14 bg-blue-500 rounded-full flex flex-shrink-0 justify-center items-center text-white text-2xl font-mono">
C</div>
<div class="block pl-2 font-semibold text-xl self-start text-gray-700">
<h2 class="leading-relaxed">Create an Account</h2>
<p class="text-sm text-gray-500 font-normal leading-relaxed">Already have an account? <a
href="#" class="underline">Sign In</a></p>
</div>
</div>
<div class="divide-y divide-gray-200">
<div class="py-8 text-base leading-6 space-y-4 text-gray-700 sm:text-lg sm:leading-7">
<div class="relative">
<label for="name" class="leading-7 text-sm text-gray-600">Name</label>
<input type="text" id="name" name="name" class="w-full bg-white rounded border border-gray-300 focus:border-blue-500 focus:ring-2 focus:ring-blue-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out">
</div>
<div class="relative">
<label for="email" class="leading-7 text-sm text-gray-600">Email</label>
<input type="email" id="email" name="email" class="w-full bg-white rounded border border-gray-300 focus:border-blue-500 focus:ring-2 focus:ring-blue-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out">
</div>
<div class="relative">
<label for="password" class="leading-7 text-sm text-gray-600">Password</label>
<input type="password" id="password" name="password" class="w-full bg-white rounded border border-gray-300 focus:border-blue-500 focus:ring-2 focus:ring-blue-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out">
</div>
<div class="relative">
<label for="confirm-password" class="leading-7 text-sm text-gray-600">Confirm Password</label>
<input type="password" id="confirm-password" name="confirm-password" class="w-full bg-white rounded border border-gray-300 focus:border-blue-500 focus:ring-2 focus:ring-blue-200 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out">
</div>
<div class="relative">
<button type="submit" class="text-white bg-blue-500 border-0 py-2 px-6 focus:outline-none hover:bg-blue-600 rounded text-lg">Sign Up</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
genaroibc