* {
  font-family: "Open Sans", sans-serif;
}

body {
  font-weight: 400;
  font-size: 1rem;
}

.bg-auth {
  background-color: #f4f2f8;
}

.min-h-100vh {
  min-height: 100vh;
}

.h-100vh {
  height: 100vh;
}

.btn {
  font-size: 1rem;
}

.btn.btn-secondary {
  font-size: 1rem;
}

button:disabled {
  cursor: not-allowed;
}

button.bg-primary {
  background-color: #4b1abc !important;
  color: #fff;
  letter-spacing: normal;
  padding: 0.75rem;
  border-radius: 0.5rem;
}

button.bg-primary:hover,
button.bg-primary:focus {
  background-color: #310d86 !important;
  color: #fff;
}

.content-area {
  padding: 2rem 3rem;
}

.content-area .heading {
  padding-top: 2rem;
}

.content-area .heading h1 {
  font-weight: 800;
  font-size: 2.25rem;
}

.content-area .heading p {
  font-size: 1.1rem;
  color: #746c88;
}

.content-area form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.5rem;
  padding-top: 2rem;
}

.content-area form label {
  font-size: 1rem;
}

.content-area form #verification_code {
  max-width: 150px;
}

.content-area form .email-address-parent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5rem;
}

.content-area form .email-address-parent .email-address {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  position: relative;
}

.content-area form .email-address-parent .email-address input.form-control.verified {
  border-color: #21af42 !important;
}

.content-area form .email-address-parent .email-address input.form-control:not(.verified) ~ i {
  display: none;
}

.content-area form .email-address-parent .email-address i {
  position: absolute;
  color: #21af42;
  right: 1rem;
  top: 1rem;
  font-size: 1rem;
}

.content-area form .email-address-parent .email-address-buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5rem;
}

.content-area form .form-check .form-check-input {
  margin-top: 0.25rem;
}

.content-area form .form-check .form-check-label {
  margin-left: 0.5rem;
}

.content-area form input.form-control,
.content-area form select.form-control {
  padding: 0.8rem 1rem !important;
  height: auto;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: 1px solid #e0e0e0;
}

.content-area form .input-group-text.parent-url {
  background-color: #f3edff;
  color: #222;
}

.content-area form .custom-radio-parent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1em;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.content-area form .custom-radio-parent .custom-radio {
  position: relative;
}

.content-area form .custom-radio-parent .custom-radio input[type=radio] {
  opacity: 0;
  position: absolute;
  bottom: 0;
}

.content-area form .custom-radio-parent .custom-radio input[type=radio]:checked ~ label {
  background: #4D13D1;
  border-color: #4D13D1;
  color: #fff;
}

.content-area form .custom-radio-parent .custom-radio label {
  padding: 12px 40px;
  border: 1px solid #c7c7c7;
  border-radius: 5px;
  cursor: pointer;
  white-space: nowrap;
}

.content-area form [for="hear_about_us"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.content-area form .password-check-list,
.content-area form .register-form-check-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 0.5rem;
  font-size: 80%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.content-area form .password-check-list .password-check-list-item,
.content-area form .password-check-list .register-form-check-list-item,
.content-area form .register-form-check-list .password-check-list-item,
.content-area form .register-form-check-list .register-form-check-list-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.content-area form .password-check-list .password-check-list-item i,
.content-area form .password-check-list .register-form-check-list-item i,
.content-area form .register-form-check-list .password-check-list-item i,
.content-area form .register-form-check-list .register-form-check-list-item i {
  margin-top: 3px;
}

@media only screen and (max-width: 600px) {
  .content-area form .password-check-list .password-check-list-item i,
  .content-area form .password-check-list .register-form-check-list-item i,
  .content-area form .register-form-check-list .password-check-list-item i,
  .content-area form .register-form-check-list .register-form-check-list-item i {
    margin-top: 0px;
  }
}

.content-area form .password-check-list .password-check-list-item.passed,
.content-area form .password-check-list .register-form-check-list-item.passed,
.content-area form .register-form-check-list .password-check-list-item.passed,
.content-area form .register-form-check-list .register-form-check-list-item.passed {
  color: #1cc007;
}

.content-area form .password-check-list .password-check-list-item:not(.passed),
.content-area form .password-check-list .register-form-check-list-item:not(.passed),
.content-area form .register-form-check-list .password-check-list-item:not(.passed),
.content-area form .register-form-check-list .register-form-check-list-item:not(.passed) {
  color: #84919a;
}

.content-area form .register-form-check-list {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 3rem;
}

@media only screen and (max-width: 556px) {
  .content-area form .register-form-check-list {
    gap: 1rem;
  }
}

.content-area .bottom {
  margin-top: 8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.content-area .bottom.single-button {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}

.content-area .bottom a {
  color: #222222;
}

.content-area .bottom .back {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  font-weight: bold;
}

.content-area .bottom .back i {
  margin-top: 2px;
}

.content-area .bottom .button a {
  border: 1px solid #4b1abc33;
  border-radius: 0.5rem;
  padding: 0.5rem 1.5rem;
  font-weight: bold;
}

.auth-image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: fixed;
  right: 0;
}

.auth-image img {
  margin: 0 auto;
}

.password-field {
  position: relative;
}

.password-field i {
  position: absolute;
  right: 1rem;
  top: 1rem;
  font-size: 1rem;
  cursor: pointer;
}

#language-form {
  position: fixed;
  right: 25px;
  top: 25px;
}

@media only screen and (max-width: 1140px) {
  .content-area {
    padding: 2rem 4rem;
  }
}

@media only screen and (max-width: 992px) {
  #language-form {
    position: absolute;
  }

  .auth-image {
    display: none;
  }

  .content-area {
    padding: 2rem;
  }

  .email-address-parent {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

@media only screen and (max-width: 414px) {
  html {
    font-size: 80%;
  }
}