.login.login-3 {
  background-size: cover;
  background-repeat: no-repeat
}

.login.login-3 .login__wrapper {
  height: 100vh;
  padding: 6% 2rem 1rem 2rem;
  overflow: hidden;
}

.login.login-3 .login__wrapper .login__container {
  width: 430px;
  margin: 0 auto
}

.login.login-3 .login__wrapper .login__container .login__logo {
  text-align: center;
  margin: 0 auto 4rem auto
}

.login.login-3 .login__wrapper .login__container .login__head {
  margin-top: 1rem;
  margin-bottom: 3rem
}

.login.login-3 .login__wrapper .login__container .login__head .login__title {
  text-align: center;
  font-size: 1.5rem;
  font-weight: 500;
  color: #595d6e
}

.login.login-3 .login__wrapper .login__container .login__head .login__desc {
  margin-top: 1.5rem;
  text-align: center;
  font-size: 1.1rem;
  font-weight: 400;
  color: #B3B4C2
}

.login.login-3 .login__wrapper .login__container .form {
  margin: 0 auto
}

.login.login-3 .login__wrapper .login__container .form .input-group {
  padding: 0;
  margin: 0 auto
}

.login.login-3 .login__wrapper .login__container .form .form-control {
  height: 46px;
  border: none;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  margin-top: 1.5rem;
  background: rgba(235, 237, 242, .08);
  color: #B3B4C2;
}

.login.login-3 .login__wrapper .login__container .form .checkbox-inline span {
  background: rgba(235, 237, 242, .08)
}

.login.login-3 .login__wrapper .login__container .form .form-control::-moz-placeholder {
  color: #B3B4C2;
  opacity: 1
}

.login.login-3 .login__wrapper .login__container .form .form-control:-ms-input-placeholder {
  color: #B3B4C2
}

.login.login-3 .login__wrapper .login__container .form .form-control::-webkit-input-placeholder {
  color: #B3B4C2
}

.login.login-3 .login__wrapper .login__container .form .form-control.is-invalid + .invalid-feedback, .login.login-3 .login__wrapper .login__container .form .form-control.is-valid + .valid-feedback {
  font-weight: 500;
  font-size: .9rem;
}

.login.login-3 .login__wrapper .login__container .form .login__extra {
  margin-top: 30px;
  margin-bottom: 15px;
  color: #b3b4c2;
  font-size: 1rem
}

.login.login-3 .login__wrapper .login__container .form .login__extra .checkbox {
  font-size: 1rem
}

.login.login-3 .login__wrapper .login__container .form .login__extra .login__link {
  font-size: 1rem;
  color: #B3B4C2;
  -webkit-transition: color .3s ease;
  transition: color .3s ease
}

.login.login-3 .login__wrapper .login__container .form .login__extra .login__link:hover {
  color: #ED125F;
  -webkit-transition: color .3s ease;
  transition: color .3s ease
}

.login.login-3 .login__wrapper .login__container .form .login__actions {
  text-align: center;
  margin-top: 7%
}

.login.login-3 .login__wrapper .login__container .form .login__actions .login__btn-primary, .login.login-3 .login__wrapper .login__container .form .login__actions .login__btn-secondary {
  height: 50px;
  padding-left: 2.5rem;
  padding-right: 2.5rem
}

.login.login-3 .login__wrapper .login__container .login__account {
  text-align: center;
  margin-top: 2rem
}

.login.login-3 .login__wrapper .login__container .login__account .login__account-msg {
  font-size: 1rem;
  font-weight: 400;
  color: #B3B4C2
}

.login.login-3 .login__wrapper .login__container .login__account .login__account-link {
  font-size: 1rem;
  font-weight: 500;
  color: #595d6e;
  -webkit-transition: color .3s ease;
  transition: color .3s ease
}

.login.login-3 .login__wrapper .login__container .login__account .login__account-link:hover {
  color: #ED125F;
  -webkit-transition: color .3s ease;
  transition: color .3s ease
}

.login.login-3.login--signin .login__signup {
  display: none
}

.login.login-3.login--signin .login__signin {
  display: block
}

.login.login-3.login--signin .login__forgot {
  display: none
}

.login.login-3.login--signup .login__signup {
  display: block
}

.login.login-3.login--signup .login__signin {
  display: none
}

.login.login-3.login--signup .login__forgot {
  display: none
}

.login.login-3.login--signup .login__account {
  display: none
}

.login.login-3.login--forgot .login__signup {
  display: none
}

.login.login-3.login--forgot .login__signin {
  display: none
}

.login.login-3.login--forgot .login__forgot {
  display: block
}

@media (max-width: 1024px) {
  .login.login-3 .login__wrapper {
    padding-top: 5rem;
    width: 100%
  }

  .login.login-3 .login__wrapper .login__container {
    margin: 0 auto
  }

  .login.login-3 .login__wrapper .login__container .login__account {
    margin-top: 1rem
  }
}

@media (max-width: 768px) {
  .login.login-3 .login__wrapper {
    width: 100%
  }

  .login.login-3 .login__wrapper .login__container {
    width: 100%;
    margin: 0 auto
  }

  .login.login-3 .login__wrapper .login__container .form {
    width: 100%;
    margin: 0 auto
  }

  .login.login-3 .login__wrapper .login__container .login__account {
    margin-top: 1rem
  }
}