@font-face{font-family:Monforat;src:url("/static/fonts/Monforat-Regular.eot");src:url("/static/fonts/Monforat-Regular.eot?#iefix") format("embedded-opentype"),url("/static/fonts/Monforat-Regular.woff2") format("woff2"),url("/static/fonts/Monforat-Regular.svg") format("svg")}@font-face{font-family:Monforat-Medium;src:url("/static/fonts/Monforat-Medium.eot");src:url("/static/fonts/Monforat-Medium.eot?#iefix") format("embedded-opentype"),url("/static/fonts/Monforat-Medium.woff2") format("woff2"),url("/static/fonts/Monforat-Medium.svg") format("svg")}*{box-sizing:border-box}p,div,span,a,h1,label,select{font-weight:400;font-variant:normal}.hide{display:none !important}a,a:link,a:visited{color:#1072eb;font-family:Monforat-Medium,Helvetica,Arial,sans-serif;font-variant:normal;font-weight:400;text-decoration:none;transition:color .2s ease-out}a:hover,a:focus{text-decoration:underline;outline:0}a.button,a.button:link,a.button:visited,.button{width:100%;min-height:44px;padding:12px 32px;border:0;display:block;margin-top:8px;margin-bottom:8px;background-color:#142c8e;box-shadow:none;border-radius:4px;box-sizing:border-box;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;-webkit-tap-highlight-color:rgba(0,0,0,0);color:#fff;font-size:1.2em;text-align:center;font-weight:700;font-family:Monforat-Medium,Helvetica,Arial,sans-serif;text-shadow:none;text-decoration:none;transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease;-webkit-font-smoothing:antialiased}.button{font-family:Monforat,Helvetica,Arial,sans-serif;font-weight:400;font-variant:normal;font-size:100%;border-radius:25px;height:48px}a.button:hover,a.button:link:hover,a.button:visited:hover,.button:hover{background-color:#1040c1;border-color:#1040c1;outline:0}a.button:focus,a.button:link:focus,a.button:visited:focus,.button:focus{background-color:#142c8e;border:.1875rem solid #1040c1;outline:0;box-shadow:0 0 0 .375rem rgba(16,114,235,.16)}a.button.active,a.button:link.active,a.button:visited.active,.button.active,a.button:active,a.button:link:active,a.button:visited:active,.button:active{background:#142c8e}a.button.secondary,a.button:link.secondary,a.button:visited.secondary,.button.secondary{background-color:rgba(0,0,0,0);color:#142c8e;border:.0125rem solid #142c8e;transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease}a.button.secondary:hover,a.button:link.secondary:hover,a.button:visited.secondary:hover,.button.secondary:hover{background:0 0;border-color:#142c8e;box-shadow:inset 0 0 0 .0625rem #142c8e;color:#142c8e}a.button.secondary:focus,a.button:link.secondary:focus,a.button:visited.secondary:focus,.button.secondary:focus{background:0 0;border-color:#142c8e;box-shadow:inset 0 0 0 .0625rem #142c8e;color:#142c8e;outline:0;border:.125rem solid #1072eb;box-shadow:0 0 0 .25rem rgba(16,114,235,.16)}body{background:#fff;font-family:Monforat,Helvetica,Arial,sans-serif;font-weight:400}.main{display:grid;align-items:center;justify-content:center}section.login{position:relative;margin:0 auto;width:460px}section.login .container{position:relative;margin:120px auto 0;padding:30px 10% 50px;border:1px solid #eaeced;overflow:hidden;border-radius:12px;display:flex;flex-direction:column;justify-content:center;align-items:center}section.login .container img.logo{margin:0 auto 13.16%}section.login .container .form{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}section.login .container .form *{width:100%}section.login .container .form-input{position:relative;z-index:2}section.login .container .form-input::before{content:"";display:block;z-index:-1;position:absolute;top:0;width:100%;height:40px;background-color:#fff;border-radius:5px}section.login .container .form-input .form-field{border:.0625rem solid #9da3a6;border-radius:4px;margin-bottom:16px}section.login .container .form-input .form-field input:not([type=submit]):not([type=radio]):not([type=checkbox]){-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;transition:border .2s ease-in-out,background-color .2s ease-in-out}section.login .container .form-input .form-field input{border:0;font-size:22px;height:64px;width:100%;padding:0 10px;background:#fff;text-overflow:ellipsis;box-sizing:border-box;border-radius:4px;box-shadow:none;font-size:100%;color:#000;font-variant:normal;font-weight:bold;direction:ltr}section.login .container .form-input .form-field input:not(:-moz-placeholder-shown){padding-top:20px}section.login .container .form-input .form-field input:not(:placeholder-shown){padding-top:20px}section.login .container .form-input .form-field input:focus{outline:0;border:.0625rem solid #1040c1;box-shadow:inset 0 0 0 .125rem #1040c1,0 0 0 .375rem rgba(16,114,235,.16),inset 0 0 0 1px #031954,0 0 0 1px #1040c1;background-color:#fff;padding-top:20px}section.login .container .form-input .form-field input:-moz-placeholder-shown~.field-label{display:none}section.login .container .form-input .form-field input:placeholder-shown~.field-label{display:none}section.login .container .form-input .form-field input:focus~.field-label{display:block}section.login .container .form-input .form-field .field-label{position:absolute;color:#6c7378;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);padding:0;border:0;height:1px;width:1px;overflow:hidden;transition:font-size .5s ease}section.login .container .form-input .form-field input:not([type=submit]):not([type=radio]):not([type=checkbox]){-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;transition:border .2s ease-in-out,background-color .2s ease-in-out}section.login .container .form-input .form-field [for=email].field-label{position:absolute;pointer-events:none;left:10px;top:8px;transition:.2s ease all;height:30px;width:400px;clip:unset;text-align:left}section.login .container .form-input .form-field [for=password].field-label{position:absolute;pointer-events:none;left:10px;top:12px;transition:.2s ease all;height:30px;width:400px;clip:unset;text-align:left;top:8px;bottom:10px;left:10px;font-size:14px;height:30px;width:400px;clip:unset;opacity:1;font-weight:500;font-family:Monforat,Helvetica,Arial,sans-serif}section.login .container .form-input .form-field input:focus::-moz-placeholder{color:rgba(0,0,0,0)}section.login .container .form-input .form-field input:focus::placeholder{color:rgba(0,0,0,0)}section.login .container .form-input .form-field input::-moz-placeholder{font-weight:bold;font-family:Monforat,Helvetica,Arial,sans-serif}section.login .container .form-input .form-field input::placeholder{font-weight:bold;font-family:Monforat,Helvetica,Arial,sans-serif}section.login .container .form-input .form-field.password{display:flex}section.login .container .form-input .form-field.password button.password-toggle{width:12%;display:flex;justify-content:center;align-items:center;background:0 0;border:0;color:#1072eb;cursor:pointer;font-size:13px;font-family:Monforat-Medium,Helvetica,Arial,sans-serif;font-weight:bold;font-variant:normal;outline:none}section.login .container .form a.forgot-password{position:relative;display:inline-block;margin:0 0 16px;font-size:18px;text-align:left}section.login .container .form .divider{border-top:1px solid #cbd2d6;position:relative;margin-top:8.72%;margin-bottom:4.895%;height:15px;text-align:center;font-size:83.34%}section.login .container .form .divider span{background-color:#fff;padding:0 .5em;position:relative;color:#6c7378;top:-0.7em;font-size:15px}section.login .container .form #otp::before{background-image:url("/static/images/sms_icon.png");background-repeat:no-repeat;background-size:14px;width:14px;height:18px;display:inline-block;content:" ";position:relative;top:3px;left:5px;margin-right:10px}/*# sourceMappingURL=main.min.css.map */

.otp-inputs {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    gap: 10px; /* Adjust the gap between each OTP input */
  }
  
  .otp-inputs input {
    width: 45px;
    height: 64px;
    font-size: 22px;
    text-align: center;
    border: 1px solid #9da3a6;
    border-radius: 4px;
    box-sizing: border-box;
    font-family: Monforat, Helvetica, Arial, sans-serif;
    font-weight: bold;
  }
  
  .otp-inputs input:focus {
    border: 1px solid #1040c1;
    box-shadow: inset 0 0 0 .125rem #1040c1, 0 0 0 .375rem rgba(16,114,235,.16);
    outline: none;
  }