/**
* Styles for Reset Username/Email form
* Language : CSS
* Date: 29 June 2020
*/

/*Reset Button*/
.btn-reset-primary{
    border-radius: 40px;
    background-color: #29bbb0;
    /* background-image: linear-gradient(261deg,#243f95 24%,#00b4a9 100%); */
    color: #ffffff;
    font-weight: 400;
    font-size: 16px;
}

.btn-reset-primary:hover{
  background-color: #29bbb0;
  /* background-image: linear-gradient(261deg,#243f95 24%,#00b4a9 100%); */
  color: #ffffff;
}

.btn-reset-primary:disabled{
    background-color: rgb(208, 215, 219);
    /* background-image: unset; */
    color:#8C9194;
    font-weight: 400;
    font-size: 16px;
}

.form-label{
    font-weight: 400;
    font-size: .9em;
    color: #d0d2d3;
}
input[type="text"]#username::placeholder{
    font-weight: 400;
    font-size: .8em;
    color: #d0d2d3;
}

.info-label{
    color: #000c37;
    font-size: 1.2em;
    font-weight: 400;
}

.info-icon{
    color: #29bbb0;
    font-size: 1.6em;
}
.reset_password_error{
    transition: all 0.3s ease;
}

.reset-form-wrapper{
    width: 90%;
    margin: auto;
  }

  .reset-form-wrapper
  .info{
    margin-bottom: 2em;
  }

  .reset-form-wrapper
  .instruction{
    letter-spacing: 0.5px;
    line-height: 22px;
  }
  
  .reset-form-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  
  .reset-form-container > p{
    margin: 0;
  }

  .back-to-application {
    padding-left: 22px;
  }

  .reset-form-container 
  .login-button{
    margin-bottom: 5em;
    padding: 10px 0;
    height: unset;
  }

  .reset-form-container 
  .login-button:hover{
    text-decoration: none;
    color: #ffff;
  }
  
  .reset-success-icon{
    width: 82px;
  }

  .reset-success-logo{
      width: 4em;
      margin-top: 2em;
  }

  .reset-title{
    padding: 1em;
    font-size: 26px;
    font-weight: bold;
  }

  .reset-subtitle{
    padding: 0 3em 1.5em;
  }

/* Reset Password Form*/
.validity-container{
    display: flex;
}
.validity-item {
    border-radius: 6px;
    border: solid 1px #f0f1f1;
    box-sizing: content-box;
    text-align: center;
    padding: 14px 7px;
    margin: 0 12px 0 0;
    position: relative;
    color: #041333;
}
.validity-item-success{
    color: #00884b;
    border: solid 1px #00884b;;
}
.validity-item-title-class{
    margin-bottom: 0;
    font-weight: bold;
}
.validity-item-desc-class{
    font-size: 12px;
    font-weight: lighter;
    margin-bottom: 0;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
}
/*Checkmark styles*/
.checkmark{
    font-size: 12px;
    padding: 0.25em 0 0 0.25em;
    position: absolute;
    right: 13px;
    top: -3px;
}
.checkmark:before{
    content: " ";
    display: block;
    border: solid 0.8em #00884b;
    border-radius: 0.9em;
    position: absolute;
    left: 0.4em;
    margin-top: -0.7em;
}
.checkmark:after{
    content: " ";
    display: block;
    width: 0.4em;
    height: 0.8em;
    border: solid #ffffff;
    border-width: 0 0.2em 0.2em 0;
    position: absolute;
    left: 1em;
    top: 40%;
    margin-top: -0.3em;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
/*Terms and Conditions styles*/
.terms-container{
    display: flex;
    position:relative;
}

.terms-checkbox-label{
    padding-left: 31px;
    font-size: 13px;
    font-weight: 400;
}

.validate-password-header-title{
    height: unset;
}

.password-header-label{
    color: #041333;
    font-size: 16px;
}

.username-paragraph{
    color: #041333;
    font-weight: 300;
}

.username-green{
    color: #29bbb0;
    font-weight: bold;
}
input[type="password"]::placeholder{
    color: #d0d2d3;
    font-size: 14px;
}
.terms-checkbox,.terms-checkbox-active{
    -webkit-appearance: none;
        outline: none;
        cursor: pointer;
}

.terms-checkbox:before{
    content: " ";
    display: block;
    border-radius: 0.9em;
    border: solid 0.8em #ddd;
    position: absolute;
    margin: -0.4em 0 0 0;
    left: -0.2em;
    top: 9px;
}

.terms-checkbox-active:before{
    border: solid 0.8em #29bbb0;
}

.terms-checkbox-active:after{
    content: " ";
    display: block;
    width: 0.4em;
    height: 0.8em;
    border: solid #ffffff;
    border-width: 0 0.2em 0.2em 0;
    position: absolute;
    left: .36em;
    top: 1.2em;
    margin-top: -0.7em;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.input-with-icon-right{
  width: 100%;
  display: flex;
}
.password-match-icon{
  margin: auto 2px;
}
.fa-times{
  color: #E00023;
}
.fa-check{
  color: #00884b;
}