.with-label-main-section{flex-direction:column;gap:8px;display:flex}.with-label-input-field{border:1px solid var(--border-color);width:100%;min-height:40px;color:var(--black-color);font-size:16px;font-weight:var(--regular-font-weight);border-radius:4px;outline:none;padding:0 16px}.input-field.disabled{cursor:not-allowed}.with-label-label-text{color:var(--black-color);font-size:15px;font-weight:var(--semibold-font-weight)}.with-label-error-text{color:#ff4d4d;padding-top:3px;font-size:12px}.input-field-container{position:relative}.input-field-container .search-icon{cursor:pointer;justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:absolute;top:0;right:0}.input-field-container .search-input{padding-right:40px}
.login-main-container{background-color:var(--blue-color);background:linear-gradient(to left,var(--green-color),var(--blue-color));background:linear-gradient(225deg,#00008b 0%,#00aae5 100%);justify-content:center;align-items:center;height:100vh;margin-left:-19vw;display:flex}.login-center-container{z-index:9999;background:var(--white-color);border-radius:8px;flex-direction:column;justify-content:center;width:500px;max-width:90%;min-height:500px;margin:0 auto;padding:32px 32px 32px 22px;display:flex;position:relative;box-shadow:0 4px 8px #0000001a}.login-text{letter-spacing:.032px;margin-bottom:12px;margin-left:8px;font-size:26px;font-weight:700;line-height:40px}.login-form{flex-direction:column;gap:40px;width:100%;display:flex}.login-form .with-label-input-field{width:110%}.login-input-field{box-sizing:border-box;height:40px;padding:10px}.login-input-fields{box-sizing:border-box;width:100%;height:40px;padding:10px 40px 10px 10px}.login-label{margin-bottom:5px;font-size:14px;display:block}.login-input{border:1px solid #ddd;border-radius:6px;width:100%;padding:10px;font-size:14px}.ImageDiv{background:linear-gradient(225deg,#00008b 0%,#00aae5 100%);margin-bottom:30px;padding-left:35%}.password-container{flex-direction:column;align-items:flex-start;margin-top:10px;display:flex}.password-input{width:100%}.password-toggle{cursor:pointer;z-index:1;background:0 0;border:none;margin-right:5px;position:absolute;top:145%;right:10px;transform:translateY(-50%)}.password-toggle img{width:24px;height:24px}.login-btn{width:98%;margin-left:10px}.input-error .with-label-input-field{border:1px solid red;padding-top:3px}.checkbox-container{align-items:center;margin-top:59px;margin-left:12px;display:flex}.checkbox-container input{cursor:pointer;margin-right:8px}.checkbox-container label{color:#333;font-size:14px}.area{justify-content:center;align-items:center;width:100%;height:100vh;display:flex;position:relative;overflow:hidden}.login-button{cursor:pointer;border:none;border:1px solid var(--green-color);color:#fff;background:linear-gradient(225deg,#00008b 0%,#00aae5 100%);border-radius:4px;outline:none;width:100%;height:44px;padding:0 15px;font-size:18px;font-weight:400;box-shadow:0 2px 8px #00000029}.circles li{background:#d6d6d667;width:20px;height:20px;list-style:none;animation:25s linear infinite animate;display:block;position:absolute;bottom:-150px}.circles li:first-child{width:80px;height:80px;animation-delay:0s;left:25%}.circles li:nth-child(2){width:20px;height:20px;animation-duration:12s;animation-delay:2s;left:10%}.circles li:nth-child(3){width:20px;height:20px;animation-delay:4s;left:70%}.circles li:nth-child(4){width:60px;height:60px;animation-duration:18s;animation-delay:0s;left:40%}.circles li:nth-child(5){width:20px;height:20px;animation-delay:0s;left:65%}.circles li:nth-child(6){width:110px;height:110px;animation-delay:3s;left:75%}.circles li:nth-child(7){width:150px;height:150px;animation-delay:7s;left:35%}.circles li:nth-child(8){width:25px;height:25px;animation-duration:45s;animation-delay:15s;left:50%}.circles li:nth-child(9){width:15px;height:15px;animation-duration:35s;animation-delay:2s;left:20%}.circles li:nth-child(10){width:150px;height:150px;animation-duration:11s;animation-delay:0s;left:85%}@keyframes animate{0%{opacity:1;border-radius:0;transform:translateY(0)rotate(0)}to{opacity:0;border-radius:50%;transform:translateY(-1000px)rotate(720deg)}}
