<section>
   <div class="relative items-center w-full px-5 py-12 mx-auto md:px-12 lg:px-20 max-w-7xl">
     <div class="w-full max-w-md mx-auto md:max-w-sm md:px-0 md:w-96 sm:px-4">
       <div class="flex flex-col">
         <div>
           <h2 class="text-4xl">Login</h2>
         </div>
       </div>
       <form> <input autocomplete="false" name="hidden" style="display: none" data-ddg-inputtype="unknown">
         <div class="mt-4 space-y-6">
           <div class="col-span-full"> <label class="block mb-3 text-sm font-medium">
               Username
             </label> <input class="block w-full px-6 py-3 input input-bordered rounded-full appearance-none  sm:text-sm" placeholder="username" autocomplete="off" type="text" id="username" name="" value=""> </div>
           <div class="col-span-full"> <label class="block mb-3 text-sm font-medium">
               Password
             </label> <input type="password" id="password" name="" value="" placeholder="password" class="block w-full px-6 py-3 input input-bordered rounded-full appearance-none  sm:text-sm" placeholder="******" autocomplete="off" type="password" data-ddg-inputtype="credentials.password"> </div>
           <div class="col-span-full"> <input class="items-center justify-center w-full px-6 py-2.5 text-center text-primary-content duration-200 bg-primary border-2 border-primary rounded-full inline-flex hover:bg-transparent hover:border-primary hover:text-primary focus:outline-none focus-visible:outline-black text-sm focus-visible:ring-black" type="submit" value="Login"> </div>
         </div>
       </form>
     </div>
   </div>
 </section>

 <section>
   <div class="relative items-center w-full px-5 py-12 mx-auto md:px-12 lg:px-20 max-w-7xl">
     <div class="w-full max-w-xl p-8 mx-auto text-center">
       <div>
         <h2 class="text-4xl tracking-tighter">
           Forgot your password?
         </h2>
       </div>
       <div class="mt-8">
         <div class="mt-6">
           <form action="#" method="POST" class="space-y-2">
             <div class="col-span-full"> <label class="block mb-3 text-sm font-medium">
                 How shall we contact you?
               </label> <input class="block w-full px-6 py-3 text-center border input input-bordered rounded-full appearance-none sm:text-sm" placeholder="email@example.com" autocomplete="off" type="email" data-ddg-inputtype="identities.emailAddress" data-ddg-autofill="true" style="background-size: auto 24px !important; background-position: right center !important; background-repeat: no-repeat !important; background-origin: content-box !important; background-image: url('chrome-extension://bkdgflcldnnnapblkhphbgpggdiikppg/img/logo-small.svg') !important; transition: background 0s ease 0s !important;"> </div>
             <div> <button class="items-center justify-center w-full px-6 py-2.5 text-center text-primary-content duration-200 bg-primary border-2 border-primary rounded-full nline-flex hover:bg-transparent hover:border-primary hover:text-primary focus:outline-none focus-visible:outline-black text-sm focus-visible:ring-black"> <span> Submit </span> </button> </div>
           </form>
         </div>
       </div>
     </div>
   </div>
 </section>

 <section>
   <div class="relative items-center w-full px-5 py-12 mx-auto md:px-12 lg:px-20 max-w-7xl">
     <div class="w-full max-w-md mx-auto md:max-w-sm md:px-0 md:w-96 sm:px-4">
       <div class="flex flex-col">
         <div>
           <h2 class="text-4xl">Reset password</h2>
         </div>
       </div>
       <form> <input autocomplete="false" name="hidden" style="display: none" data-ddg-inputtype="unknown"> <input name="_redirect" type="hidden" value="https://jamstacker.studio/thankyou">
         <div class="mt-4 space-y-6">
           <div class="col-span-full"> <label class="block mb-3 text-sm font-medium">
               Password
             </label> <input class="block w-full px-6 py-3 text-center border input input-bordered rounded-full appearance-none sm:text-sm" placeholder="******" autocomplete="off" type="password" data-ddg-inputtype="credentials.password"> </div>
           <div class="col-span-full"> <label class="block mb-3 text-sm font-medium">
               Confirm passord
             </label> <input class="block w-full px-6 py-3 text-center border input input-bordered rounded-full appearance-none sm:text-sm" placeholder="******" autocomplete="off" type="password" data-ddg-inputtype="credentials.password"> </div>
           <div class="col-span-full"> <button class="items-center justify-center w-full px-6 py-2.5 text-center text-primary-content duration-200 bg-primary border-2 border-primary rounded-full nline-flex hover:bg-transparent hover:border-primary hover:text-primary focus:outline-none focus-visible:outline-black text-sm focus-visible:ring-black" type="submit">
               Submit your request
             </button> </div>
         </div>
       </form>
     </div>
   </div>
 </section>