:root {
  /*--form-height: 550px;*/
  --form-width: 900px;
  --form-height: 600px;
  /*--form-width: 1302px;*/
  --left-color: #6abd49;
  --right-color: #96dbe2;
}

body, html {
  width: 100%;
  height: 100%;
  margin: 0;
  /*font-family: 'Helvetica Neue', sans-serif;*/
  letter-spacing: 0.5px;
}

.container {
  width: var(--form-width);
  height: var(--form-height);
  position: relative;
  padding-left: 0;
  margin: auto;
  box-shadow: 2px 10px 40px rgba(22,20,19,0.4);
  border-radius: 10px;
  margin-top: 50px;
}

.overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 100;
  background: #00639ce8;
  border-radius: 10px;
  color: white;
  /*clip: rect(0, 385px, var(--form-height), 0);*/
  clip: rect(0, 450px, var(--form-height), 0);
}

  .overlay .sign-up {
    --padding: 50px;
    width: calc(385px - var(--padding) * 2);
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding: 0px var(--padding);
    text-align: center;
  }


  .overlay .sign-in {
    /*--padding: 50px;*/
    width: calc(385px - var(--padding) * 2);
    /*height: 100%;*/
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding: 0px var(--padding);
    text-align: center;
  }



  .overlay .sign-in {
    /*Helth care Id*/
    margin-top: 97px !important;
    float: left;
    width: 50% !important;
  }

  .overlay #sign-in {
    margin-top: 200px !important;
  }

  .overlay p {
    padding: 10px;
    margin: 20px 0px 30px;
    font-weight: 200;
  }


.form .sign-up {
  /*  --padding: 30px;
  position: absolute;
  width: calc(var(--form-width) - 385px - var(--padding) * 2);
  height: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  padding: 0px var(--padding);
  text-align: center;*/

  --padding: 30px;
  position: absolute;
  width: calc(var(--form-width) - 385px - var(--padding) * 2);
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  padding: 0px var(--padding);
  text-align: center;
  top: 0;
  padding-top: 180px !important;
}

.form .sign-up {
  right: 0;
  right: 0;
}

.sign-in h3 {
  color: var(--left-color);
  font-weight: 600;
}

.form .sign-up h3 {
  color: var(--left-color);
  font-weight: 600;
  margin: 0;
}


.custome-btn {
  background: #17ad37 !important;
  color: #fff;
}

.form-control {
  border-radius: 6px !important;
  /*padding-left: 10px !important;*/
  /*box-shadow: inset 0px 0px 3px 3px #f9f9f9;*/
}


  .form-control:focus {
    box-shadow: 0 0 0 0.1rem rgb(109 214 134 / 45%);
    border-color: #ffffff !important;
  }

.images img {
  height: 210px;
  border-radius: 12px;
}

.custome-p {
  font-weight: 600 !important;
  font-size: 12px;
  color: #000;
  margin: 0 !important;
}

@media (min-width: 1400px) {
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl {
    max-width: 900px !important;
  }
}

@media (min-width: 1200px) {
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl {
    max-width: 900px !important;
  }
}

@media (min-width: 992px) {
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl {
    max-width: 900px !important;
  }
}

.container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {
  padding: 0 !important;
}

.customeVerifyBtn {
  height: 35px !important;
  padding: 0px 0 3px 0;
}

.bg-LightBtn {
  background: red !important;
}

.oneHelath-btn {
  text-transform: capitalize;
  color: #282a2ea3;
  font-family: Arial,Helvetica,sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: initial;
  filter: blur(0.3px);
}

.onehealthcareImage {
  height: 44px;
  padding: 6px 0 !important;
}

.alert-wrapper {
  z-index: 999 !important;
}

.alert-close {
  color: #ffffff;
}

.input-group .form-control:focus {
  border-left: none !important;
  border-right: none !important;
}

.input-group-text {
  padding: 0 !important;
  border: none;
  border-radius: 0;
  margin: 3px 10px !important;
  height: 34px !important;
}

.input-group .form-control {
  border-left: 1px solid #d2d6da !important;
}

.passcodebody {
  /*--padding: 10px;*/
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  padding: 0px var(--padding);
  top: 0;
  /*padding-top: 80px !important;*/
}
  .passcodebody input{
  padding-left: 8px !important;
  }

  .passcodebody p {
    font-size: 0.875rem !important;
  }

  .passcode-upload-login {
    margin-top: 155px;
  }

.passcode-upload-logins {
  margin-top: 20px;
}

.passcode-upload-login span, a {
  color: #00639ce8 !important;
}


.header-title {
  border-radius: 10px 10px 0 0;
}

.header-title h6 {
  color: #00639ce8 !important;
  font-weight: 600;
}

.header-title a {
  background: #00639ce8 !important;
  color: #fff !important;
}


.header-title button:hover {
  background: #00639ce8 !important;
  color: #fff;
}


.passcode-table-content {
  box-shadow: 0 3px 12px 2px rgba(0, 0, 0, 0.11), 0 2px 4px -1px rgba(0, 0, 0, 0.07);
}