@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@300&display=swap");.login-body{min-height:100vh;background:#0a0a0a;width:100%;overflow:hidden;font-family:Quicksand,sans-serif}.login-body,.ring{display:flex;justify-content:center;align-items:center}.ring{position:relative;width:450px;height:450px}.ring i{position:absolute;inset:0;border:2px solid #fff;transition:.5s}.ring i:first-child{border-radius:38% 62% 63% 37%/41% 44% 56% 59%;animation:animate-ring 6s linear infinite}.ring i:nth-child(2){animation:animate-ring 4s linear infinite}.ring i:nth-child(2),.ring i:nth-child(3){border-radius:41% 44% 56% 59%/38% 62% 63% 37%}.ring i:nth-child(3){animation:animate-ring2 10s linear infinite}.ring:hover i{border:6px solid var(--clr);filter:drop-shadow(0 0 20px var(--clr))}@keyframes animate-ring{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes animate-ring2{0%{transform:rotate(1turn)}to{transform:rotate(0deg)}}.login-form-container{position:absolute;width:300px;height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:20px}.login-form-container h2{font-size:2em;color:#fff;font-weight:900}.inputBx{position:relative;width:100%}.inputBx input{position:relative;padding:12px 20px;background:transparent;border:2px solid #fff;border-radius:40px;outline:none;text-align:center}.inputBx button,.inputBx input{width:100%;font-size:1.1em;color:#fff}.inputBx button{padding:12px;background:linear-gradient(45deg,#10b981,#059669);border:none;border-radius:40px;font-weight:700;cursor:pointer;transition:.3s}.inputBx button:hover{opacity:.8;letter-spacing:1px}.error-msg{color:#ff4d4d;font-size:.8em;text-align:center}