.login-container{position:relative;width:750px;height:450px;border:2px solid var(--color-primary-500);box-shadow:0 0 25px var(--color-primary-500);overflow:hidden;background:#25252b}.login-curved-shape{position:absolute;right:0;top:-5px;height:600px;width:850px;background:linear-gradient(45deg,#25252b,var(--color-primary-500));transform:rotate(10deg) skewY(40deg);transform-origin:bottom right;transition:transform 1.5s ease;transition-delay:1.6s;z-index:0}.login-curved-shape2{position:absolute;left:250px;top:100%;height:700px;width:850px;background:#25252b;border-top:3px solid var(--color-primary-500);transform:rotate(0deg) skewY(0deg);transform-origin:bottom left;transition:transform 1.5s ease;transition-delay:.5s;z-index:0}.login-form-box{position:absolute;top:0;width:50%;height:100%;display:flex;justify-content:center;flex-direction:column;left:0;padding:0 40px;z-index:1}.login-form-box h2{font-size:32px;text-align:center;color:#fff}.login-input-box{position:relative;width:100%;height:50px;margin-top:25px}.login-input-box input{width:100%;height:100%;background:transparent;outline:none;font-size:16px;color:#fff;font-weight:600;border:none;border-bottom:2px solid #fff;padding-right:23px;transition:.5s}.login-input-box input:focus,.login-input-box input:valid{border-bottom:2px solid var(--color-primary-500)}.login-input-box label{position:absolute;top:50%;left:0;transform:translateY(-50%);font-size:16px;color:#fff;transition:.5s;pointer-events:none}.login-input-box input:focus~label,.login-input-box input:valid~label{top:-5px;color:var(--color-primary-500)}.login-input-box .login-icon{position:absolute;top:50%;right:0;font-size:18px;transform:translateY(-50%);color:#fff;transition:.5s;pointer-events:none}.login-input-box input:focus~.login-icon,.login-input-box input:valid~.login-icon{color:var(--color-primary-500)}.login-button{position:relative;width:100%;height:45px;background:transparent;border-radius:40px;cursor:pointer;font-size:16px;font-weight:600;border:2px solid var(--color-primary-500);overflow:hidden;z-index:1;color:#fff;transition:all .3s ease}.login-button:before{content:"";position:absolute;height:300%;width:100%;background:linear-gradient(#25252b,var(--color-primary-500),#25252b,var(--color-primary-500));top:-100%;left:0;z-index:-1;transition:.5s}.login-button:hover:before{top:0}.login-button:disabled{opacity:.5;cursor:not-allowed}.login-button:disabled:before{display:none}.login-info-content{position:absolute;top:0;height:100%;width:50%;display:flex;justify-content:center;flex-direction:column;right:0;text-align:right;padding:0 40px 60px 150px;z-index:1}.login-info-content h2{text-transform:uppercase;font-size:36px;line-height:1.3;color:#fff}.login-info-content p{font-size:16px;color:#fff}.login-animation{transform:translateX(0);transition:.7s;opacity:1}.login-animation[data-delay="0"]{transition-delay:calc(.1s * 20)}.login-animation[data-delay="1"]{transition-delay:calc(.1s * 21)}.login-animation[data-delay="2"]{transition-delay:calc(.1s * 22)}.login-animation[data-delay="3"]{transition-delay:calc(.1s * 23)}.login-animation[data-delay="4"]{transition-delay:calc(.1s * 24)}.login-animation[data-delay="5"]{transition-delay:calc(.1s * 25)}.login-error-message{font-size:14px;text-align:center;margin:20px 0 10px;padding:.75rem;background:rgba(239,68,68,.2);border:1px solid rgba(239,68,68,.3);border-radius:.5rem;color:var(--color-error-400)}@media (max-width:767px){.login-container{width:100%;max-width:100%;height:auto;min-height:450px;border:none;box-shadow:none;border-radius:0}.login-curved-shape,.login-curved-shape2{display:none}.login-form-box{position:relative;width:100%;padding:2rem 1.5rem}.login-info-content{display:none}.login-form-box h2{font-size:28px}}