.center{width:100%;height:100vh;background-size:100% 100%;background-repeat:no-repeat;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(45deg,#4284db,#29eac4)}h1{font-size:30px;color:#000}.logon{background-color:#fff;border-radius:10px;box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);width:768px;max-width:100%;min-height:480px;margin-top:20px;display:flex;background:-webkit-linear-gradient(right,#4284db,#29eac4)}.overlaylong{border-radius:10px 0 0 10px}.overlaylong,.overlaylongleft{width:50%;height:100%;background-color:#fff;display:flex;align-items:center;justify-content:center}.overlaylongleft{border-radius:0 10px 10px 0;transform:translateX(100%);transition:transform .6s ease-in-out}.overlaylongright{border-radius:10px 0 0 10px;background-color:#fff;transform:translateX(0);transition:transform .6s ease-in-out}.overlaylongright,.overlaytitle{width:50%;height:100%;display:flex;align-items:center;justify-content:center}.overlaytitle{border-radius:0 10px 10px 0;background-color:transparent}.overlaytitleH2{font-size:30px;color:#fff;margin-top:20px}.overlaytitleP{font-size:15px;color:#fff;margin-top:20px}.overlaytitleleft{transform:translateX(0)}.overlaytitleleft,.overlaytitleright{border-radius:0 10px 10px 0;width:50%;height:100%;background-color:transparent;display:flex;align-items:center;justify-content:center;transition:transform .6s ease-in-out}.overlaytitleright{transform:translateX(-100%)}.overlaytitle-Signin,.overlaytitle-Signup{display:flex;align-items:center;justify-content:center;flex-direction:column}.buttongohs{width:180px;height:40px;border-radius:50px;border:1px solid #fff;color:#fff;font-size:15px;text-align:center;line-height:40px;margin-top:40px}.overlaylongH2{font-size:25px;color:#000}.overlaylong-Signin,.overlaylong-Signup{display:flex;align-items:center;justify-content:center;flex-direction:column}input{background-color:#eee;border:none;padding:12px 15px;margin:10px 0;width:240px;box-sizing:border-box}h3{font-size:10px;margin-top:10px;cursor:pointer}.inupbutton{background-color:#29eac4;border:none;width:180px;height:40px;border-radius:50px;font-size:15px;color:#fff;text-align:center;line-height:40px;margin-top:30px}.code-container{display:flex;align-items:center;gap:10px;margin:10px 0;width:240px;box-sizing:border-box}.code-button{background-color:#29eac4;border:none;width:180px;height:40px;font-size:15px;color:#fff;text-align:center;line-height:40px}