.loginFormStyleEmployee {
  .employeeCard {
    .submit-bar {
      @apply w-full;
    }
  }
}
.banner .bannerCard{
  min-width: 420px !important;
}
.employeeForgotPassword .employeeCard .field .field-container .component-in-front {
  margin-top: 0;
  border: 1px solid;
  border-right: none;
  padding: 7px;
}
@screen dt {
  .employeeForgotPassword .employeeCard .field .field-container .component-in-front {
    padding: 7px;
  }
 .loginFormStyleEmployee .employeeCard, .banner .bannerCard{
    min-width: 420px !important;
  }
  .employeeForgotPassword .employeeCard, .employeeChangePassword .employeeCard{
    max-width: 420px !important;
    min-width: 420px !important;
  }
}

.employeeForgotPassword .employee-card-input {
  margin-bottom: 0px;
  border-left: none;
}

.employeeForgotPassword .field-container {
  margin: 10px 0;
}
.employeeForgotPassword {
  .submit-bar {
    @apply w-full;
  }
}
.employeeChangePassword .submit-bar {
  width: 100% !important;
}
.employeeChangePassword .card-text {
  text-align: center;
}
.employeeChangePassword .input-otp-wrap {
  text-align: center;
}
.submit-bar {
  .submit-bar {
    @apply w-full;
  }
}
.loginFormStyleEmployee .bannerHeader p,
.employeeForgotPassword .bannerHeader p,
.employeeChangePassword .bannerHeader p {
  font-size: 19px;
}
.employeeCard .card-sub-header {
  font-size: 24px;
}
.loginFormStyleEmployee .employeeCard .card-label, .employeeForgotPassword .employeeCard .card-label{
  font-weight: normal;
  font-size: 16px;
  line-height: 19px;
  color: #0B0C0C;
  margin-top: 20px;
}
.banner .bannerHeader {
  margin-bottom: 20px;
}
.employeeCard .card-label{
  font-weight: normal;
  font-size: 16px;
  line-height: 19px;
  color: #0B0C0C;
}
.profile-label-margin{
   margin-top: 10px;
}

.employeeForgotPassword .employeeCard .card-label-desc {
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  color: #505a5f;
  margin-top: 15px;
}
.employeeChangePassword .employeeCard .card-text {
  margin-bottom: 15px;
  font-size: 16px;
  color: #505a5f;
}
@media screen and (max-width: 768px) {
  .employeeChangePassword .employeeCard .card-text {
    margin-top: 7px;
  }
  .employeeCard .card-sub-header {
    font-size: 18px;
  }
}
.employeeChangePassword .employeeCard .card-text-button {
  text-align: center !important;
  margin-bottom: 12px !important;
}
.employeeChangePassword .employeeCard .input-otp-wrap {
  margin-bottom: 10px;
}
.employee .loginContainer {
  padding-top: 0px !important;
}
.banner {
  height: calc(100vh ) !important;
}

.employeeChangePassword .employeeCard .field .field-container{
  margin-bottom: 24px;
}

.employeeForgotPassword .employeeCard  .employee-card-sub-header, .employeeChangePassword .employeeCard  .employee-card-sub-header, .loginFormStyleEmployee .employeeCard .employee-card-sub-header{
  font-size: 24px !important;
  line-height: 28px !important;
  margin-bottom: 0px !important;
}
@media screen and (max-width : 768px){
  .employeeForgotPassword .employeeCard  .employee-card-sub-header, .employeeChangePassword .employeeCard  .employee-card-sub-header, .loginFormStyleEmployee .employeeCard .employee-card-sub-header{
    font-size: 18px !important;
    line-height: 21px !important;
    margin-bottom: 0px !important;
  }
  .loginFormStyleEmployee .employeeCard, .banner .bannerCard{
    min-width: 340px !important;
    margin: 10px !important;
  }
  .employeeForgotPassword .employeeCard, .employeeChangePassword .employeeCard{
    max-width: 360px !important;
    min-width: 340px !important;
    margin: 10px !important;
  }
}
.employeeChangePassword .employeeCard .card-text{
  margin-top: 18px !important;
  margin-bottom: 20px !important;
}
.employeeBackbuttonAlign{
  display: none;
}

.employee-select-wrap.login-city-dd {
  .options-card{
  max-height: 200px;
  }
}
@media screen and (max-width: 768px){
  .employeeBackbuttonAlign{
    display: block;
    position: absolute;
    top: 20px;
    left: 20px;
  }
  .banner{
    align-items: flex-end;
    padding-bottom: 40px;
    height: 100vh !important;
  }
  .topbar{
    background: rgba(34, 57, 77, var(--bg-opacity)) !important;
    color: white;
  }
  .employee .loginContainer{
    padding-top: 0px !important;
  }
  .removeBottomMargin{
    margin-bottom: 0px !important;
  }
  .employee-select-wrap.login-city-dd {
    .options-card{
    max-height: 160px;
    }
  }
}

