* {
  touch-action: manipulation;
}
html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
}
nav.navbar.navbar-light {
  border-bottom: 1px solid #eee;
  height: 62px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
nav.navbar.navbar-light .container {
   /* max-width: 1440px; */
   max-width: 100%;
  height: 100%;
  position: relative;
}
.img-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 66px;
  height: 29px;
  margin-left: 15px;
  position: relative;
}
.img-logo a {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    height: 100%;
}
.img-logo hr {
  height: 28px;
  margin: 0 12px;
  width: 2px;
  background: #aaa;
  border: 0;
}
.img-logo h4 {
  margin: 0;
  font-family: ActualB;
  font-size: 20px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: 0.12px;
  text-align: left;
  color: #808080;
}
nav.navbar img.logo {
  margin-left: 0;
  width: 100%;
  height: 100%;
}
.Header-background {
  width: auto;
  height: 100%;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Header-background p, .Header-background a {
  margin-bottom: 0;
  font-family: ActualR;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.29;
  letter-spacing: 0.05px;
  text-align: right;
  color: #666666;
  margin: 0 10px;
  cursor: pointer;
}
.Header-background a:hover {
  text-decoration: none;
}
.pms-phone:before {
  color: #a50034 !important;
}
div#pms {
  height: calc(100vh - 62px);
  width: 100%;
  margin: 0px auto;
  padding: 0;
  overflow: hidden;
}
.signed-in, .sign-in, .login-form{
  display: none;
}
.login-form {
  position: absolute;
  right: 5px;
  top: 62px;
  border: 1px solid #eee;
  min-width: 221px;
  padding-bottom: 15px;
  padding-top: 10px;
  background: #fff;
}
.login-form .form-control {
  border: none;
  display: flex;
  flex-direction: column;
}
.form-control.pms-form input:focus-within {
  outline: solid 3.2px #333333 !important;
}
div#myModal {
  background: #f5f5f5;
  top: 62px;
}
.modal.show .modal-dialog {
  margin-top: 2%;
  border: none;
  overflow-y: visible;
  max-width: 376px;
  padding: 20px;
  border-radius: 4px;
  box-shadow: 0 4px 15px 0 rgb(102 102 102 / 20%);
  background: #fff;
}
.modal-content {
  border-radius: 4px;
  border: none;
}
.modal-header {
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
}
h4.modal-title {
  font-family: ActualB;
  font-size: 36px;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.25;
  letter-spacing: normal;
  text-align: center;
  color: #333333;
  margin-bottom: 0;
}
.modal-body {
  border: 0;
  padding: 5px 0 0;
}
.modal-body .row {
  margin: 0;
}
.form-control.pms-form {
  height: auto;
  border: none;
  padding: 0 0px;
  border-radius: 0;
  margin-bottom: 16px;
  position: relative;
  padding-bottom: 0;
}
.form-control.pms-form input.erri {
  border-color: red;
}
.form-control.pms-form.btn-con {
  margin-bottom: 0;
  padding-top: 15px;
}
p.npf {
  padding: 0;
  float: left;
  width: 100%;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.29;
  letter-spacing: normal;
  color: #666666;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: 'ActualR';
}
.image-container img {
  width: 100%;
}
.image-row{
  margin-right: -16px;
  margin-left: -16px;
}
.title-sec {
  display: flex;
  align-items: center;
  justify-content: center;
}
h4.sign-title {
  font-family: ActualR;
  padding: 0px 15px 10px;
  font-size: 20px;
  letter-spacing: 0.13px;
  color: #333333;
  border-bottom: 2px solid #aaaaaa;
  padding-bottom: 14px;
  margin-bottom: 24px;
}
.modal-dialog {
  max-width: 400px;
}
.form-control.pms-form input {
  height: 47px;
  border: 1px solid rgba(102, 102, 102, 0.5);
  background-color: white;
  border-radius: 4px;
  font-family: ActualR, Roboto;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.06px;
  color: #808080;
  width: 100%;
  padding: 12px;
}
.form-control.pms-form button {
  background-color: #a50034;
  margin: auto;
  color: #fff;
  float: none;
  border: 0;
  font-family: ActualB;
  margin-right: 0;
  font-size: 14px;
  margin-top: 0;
  width: 100%;
  border-radius: 4px;
  position: relative;
  height: 47px;
  text-transform: capitalize;
  margin-bottom: 16px;
}
.form-control.pms-form p {
  margin-top: 10px;
  text-align: center;
}
.modal-backdrop.show {
  display: none;
}
.pms-form p.p-em-err, .pms-form p.p-pas-err, .pms-form p.pms-val-err, .p-l-err {
  margin: 0;
  margin-top: 5px !important;
  color: red;
  font-size: 12px;
  display: none;
  text-align: left;
  /* position: absolute; */
}
.row.hide {
  display: none;
}
.pms_loader {
        z-index: 999999;
        position: fixed;
        background-color: rgb(185, 185, 185);
        display: flex;
        height: 100%;
        width: 100%;
    }

    #circle1 {
        fill: #333333 !important;
    }

    #circle2 {
        fill: #A50034 !important;
    }
    .pms-parent {
      height: calc(100% - 62px)
    }
@media (min-width: 576px){
  .modal-dialog {
    max-width: 540px;
  }
}
@media (max-width:768px){
  .pms-parent {
    height:calc(100% - 124px)
  }
  nav.navbar.navbar-light .container {
    display: flex;
    align-items: center;
    flex-direction: row;
  }
  nav.navbar.navbar-light img.logo {
    margin-left: 0px;
    width: 58px;
    height: 29px;
  }
  .img-logo hr {
    height: 30px;
  }
  .img-logo h4 {
    margin: 0;
    opacity: 0.95;
    font-family: ActualM;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.06px;
    text-align: left;
    color: #808080;
  }
  .Header-background {
    /*width: 125px;*/
    padding: 0px 5px;
  }
  .img-logo{
    max-width: 50%;
  }
}
@media (max-width:480px){
  .Header-background a span {
    display: none;
  }
  .Header-background p{
    margin: 0 5px;
  }
}
@media (max-width:360px) {
  .Header-background p, .Header-background a {
    font-size: 11px;
    margin: 0 3px;
  }
}
a {
  color: #2266dd;
}
    /*forgot password*/
    a.forgot_pass {
      color: #2266dd !important;
      font-size: 12px;
      font-weight: 400;
      line-height: 1.5;
      cursor: pointer;
      top: -10px;
      position: absolute;
      right: 10px;
    }
  .forgot_pass{
    font-family: ActualR;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: 0.05px;
    color: #2266dd !important;
    float:right;
  }
  #sign_in, #forgot_pass , #reset_link , #reset-password, #success , #resend, #resend-timer{
    display:none;
  }
  .visible{
    display: block !important;
  }
  .reset{
    font-family: ActualB;
    font-size: 24px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: 0.17px;
    text-align: center;
    color: #2A2A2A;
  }
  .reset-text{
    font-family: ActualR;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.06px;
    text-align: center;
    color: #666666;
  }
  #forgot_pass button {
    margin-top: 30px;
    margin-bottom: 0;
  }
  #verifyot {
    margin-bottom: 0;
  }
  .email-label{
    font-family: ActualM;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: 0.07px;
    text-align: left;
    color: #666666;
  }
  .otp{
    font-family: ActualR;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.38;
    letter-spacing: -0.12px;
    text-align: center;
    color: #666666;
  }
  .reset-otp {
    font-family: ActualR;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.57;
    letter-spacing: -0.11px;
    text-align: center;
    color: #666666;
  }
    .textstyle{
      font-family: ActualM;
      color: #7755dd !important ;
    }
  .border-red{
    border:1px solid red !important;
  }
  .text-red{
    color: red !important;
  }
  #reset-password .form-control.pms-form {
    margin-bottom: 0;
  }
    /*Loader*/
  .loader-container {
    display: none;
  }
  .loader-container.show-loader {
    display: flex;
    position: absolute;
    background: #403e3e;
    width: 100%;
    height: 100%;
    z-index: 10000;
    opacity: 0.9;
    align-items: center;
    justify-content: center;
    left: 0;
  }
  .loader {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #a50034;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
  }

  /* Safari */
  @-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
  }

  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
  .m-40{
    margin-top:40px;
  }