.login {
  width: 100%;
  position: relative;
  height: 100dvh;
}
.login_cnt {
  width: 100%;
  height: 100%;
  position: relative;
  display: block;
}
.login_cnt .login_media {
  width: 100%;
  height: 100%;
  position: relative;
  display: block;
}
.login_cnt .login_media video,
.login_cnt .login_media iframe {
  width: 100%;
  height: 100%;
  position: relative;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.login_cnt .login_media picture {
  width: 100%;
  height: 100%;
  position: relative;
  display: block;
}
.login_cnt .login_media picture img {
  height: 100%;
}
.login_cnt .login_form {
  width: 100%;
  height: 100%;
  max-width: 600px;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 0.36);
  -webkit-backdrop-filter: blur(20px);
          backdrop-filter: blur(20px);
  top: 0;
  left: 0;
  z-index: 1;
}
@media (max-width: 768px) {
  .login_cnt .login_form {
    height: -moz-fit-content;
    height: fit-content;
    top: 0;
    bottom: 0;
    padding: 30px 0;
    margin: auto;
  }
}
.login_cnt .login_form .login_form--wrapper {
  width: 90%;
  height: -moz-fit-content;
  height: fit-content;
  max-width: 350px;
  position: relative;
  display: block;
  margin-top: 90px;
}
@media (max-width: 768px) {
  .login_cnt .login_form .login_form--wrapper {
    margin-top: 0;
  }
}
.login_cnt .login_form .login_form--wrapper ._title {
  width: 100%;
  position: relative;
  display: block;
  margin-bottom: 30px;
}
.login_cnt .login_form .login_form--wrapper ._title h5 {
  width: 100%;
  position: relative;
  display: block;
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  .login_cnt .login_form .login_form--wrapper ._title h5 {
    text-align: center;
  }
}
.login_cnt .login_form .login_form--wrapper ._title p {
  width: 100%;
  position: relative;
  display: block;
  font-size: 0.9333333333em;
}
@media (max-width: 768px) {
  .login_cnt .login_form .login_form--wrapper ._title p {
    display: none;
  }
}
.login_cnt .login_form .login_form--wrapper form {
  width: 100%;
  position: relative;
  display: block;
}
.login_cnt .login_form .login_form--wrapper form ._input {
  width: 100%;
  position: relative;
  display: block;
  margin-bottom: 15px;
}
.login_cnt .login_form .login_form--wrapper form ._input label {
  width: 100%;
  position: relative;
  display: block;
  font-weight: 600;
  margin-bottom: 7px;
}
.login_cnt .login_form .login_form--wrapper form ._input input {
  width: 100%;
  position: relative;
  display: block;
  border: 1px solid var(--secondary);
  border-radius: 9px;
  background: var(--white);
  padding: 12px;
  font-size: 0.9333333333em;
  font-weight: 700;
}
.login_cnt .login_form .login_form--wrapper form ._input input.placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper form ._input input:-moz-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper form ._input input::-moz-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper form ._input input:-ms-input-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper form ._input input::-webkit-input-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper form ._submit {
  width: 100%;
  position: relative;
  display: block;
  margin-top: 20px;
}
.login_cnt .login_form .login_form--wrapper form ._submit button {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 12px 20px;
  border-radius: 23px;
  background: var(--primary);
  color: var(--secondary);
  font-weight: 500;
  gap: 5px;
  transition: var(--ease);
}
.login_cnt .login_form .login_form--wrapper form ._submit button i {
  color: inherit;
}
@media not all and (pointer: coarse) {
  .login_cnt .login_form .login_form--wrapper form ._submit button:hover {
    background: var(--secondary);
    color: var(--primary);
  }
}
.login_cnt .login_form .login_form--wrapper form ._submit button.active {
  background: var(--secondary);
  color: var(--primary);
}
.login_cnt .login_form .login_form--wrapper .step_2 {
  width: 100%;
  position: relative;
  display: block;
}
.login_cnt .login_form .login_form--wrapper .step_2 ._title {
  width: 100%;
  position: relative;
  display: block;
  margin-bottom: 15px;
}
.login_cnt .login_form .login_form--wrapper .step_2 ._title h5 {
  width: 100%;
  position: relative;
  display: block;
  text-align: center;
  margin-bottom: 20px;
}
.login_cnt .login_form .login_form--wrapper .step_2 form {
  width: 100%;
  position: relative;
  display: block;
}
.login_cnt .login_form .login_form--wrapper .step_2 form > p {
  width: 100%;
  position: relative;
  display: block;
  font-size: 0.9333333333em;
  text-align: center;
  margin-bottom: 10px;
  font-weight: 700;
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group ._number {
  width: calc(16.6666666667% - 8.3333333333px);
  position: relative;
  display: block;
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group ._number input {
  width: 100%;
  position: relative;
  display: block;
  aspect-ratio: 50/42;
  border: 1px solid var(--secondary);
  border-radius: 9px;
  background: var(--white);
  font-size: 1.2em;
  font-weight: 700;
  text-align: center;
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group ._number input.placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group ._number input:-moz-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group ._number input::-moz-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group ._number input:-ms-input-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._number-group ._number input::-webkit-input-placeholder {
  color: rgba(42, 42, 42, 0.31);
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._submit {
  width: 100%;
  position: relative;
  display: block;
  margin-top: 20px;
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._submit button {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 12px 20px;
  border-radius: 23px;
  background: var(--primary);
  color: var(--secondary);
  font-weight: 500;
  gap: 5px;
  transition: var(--ease);
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._submit button i {
  color: inherit;
}
@media not all and (pointer: coarse) {
  .login_cnt .login_form .login_form--wrapper .step_2 form ._submit button:hover {
    background: var(--secondary);
    color: var(--primary);
  }
}
.login_cnt .login_form .login_form--wrapper .step_2 form ._submit button.active {
  background: var(--secondary);
  color: var(--primary);
}
.login_cnt .login_form .login_form--wrapper .step_2 hr {
  width: 100%;
  position: relative;
  height: 1px;
  display: block;
  background: var(--white);
  margin: 20px 0;
  outline: none;
  border: none;
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options {
  width: 100%;
  position: relative;
  display: block;
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options p {
  width: 100%;
  position: relative;
  display: block;
  font-size: 0.9333333333em;
  margin-bottom: 10px;
  text-align: center;
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options button {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 12px 20px;
  border-radius: 23px;
  background: var(--primary);
  color: var(--secondary);
  font-weight: 500;
  gap: 5px;
  transition: var(--ease);
  margin-bottom: 8px;
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options button i {
  color: inherit;
}
@media not all and (pointer: coarse) {
  .login_cnt .login_form .login_form--wrapper .step_2 ._options button:hover {
    background: var(--secondary);
    color: var(--primary);
  }
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options button.active {
  background: var(--secondary);
  color: var(--primary);
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options a {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 12px 20px;
  border-radius: 23px;
  background: var(--white);
  color: var(--secondary);
  font-weight: 500;
  gap: 5px;
  transition: var(--ease);
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options a i {
  color: inherit;
}
@media not all and (pointer: coarse) {
  .login_cnt .login_form .login_form--wrapper .step_2 ._options a:hover {
    background: var(--secondary);
    color: var(--primary);
  }
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options a.active {
  background: var(--secondary);
  color: var(--primary);
}
.login_cnt .login_form .login_form--wrapper .step_2 ._options a:not(:last-child) {
  margin-bottom: 9px;
}

.login_cnt .login_form .login_form--wrapper form ._submit a {
      width: 100%;
      height: -moz-fit-content;
      height: fit-content;
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 12px 20px;
      border-radius: 23px;
      color: var(--primary);
      background: var(--secondary);
      font-weight: 500;
      gap: 5px;
      transition: var(--ease);
}

  @media not all and (pointer: coarse) {
      .login_cnt .login_form .login_form--wrapper form ._submit a:hover {
          background: var(--primary);
          color: var(--secondary);
      }
  }