/*$Id: memberportal.css Jan 2017  thangam $*/
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;

}

body {
  background: #F6F6F6;
  font-family: Arial, sans-serif;
  font-size: 14px;
  color: #77909D;
  font-weight: 300;
}

ul, ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

a {
  font-size: 14px;
  color: #180000;
  text-decoration: underline;
}
a:hover {
  text-decoration: underline;
}

.signup-form-info-message {
  margin-block-start:0;
  margin-block-end:0;
  margin-inline-start:auto;
  margin-inline-end:auto;
  padding-block-start:13px;
  padding-block-end:13px;
  padding-inline-start:25px;
  padding-inline-end:25px;
  border-radius: 4px;
  text-align: center;
  background: #F9EEBB;
  border: 1px solid #F1C466;
  color: #222222;
  width: 90%;
  position: relative;
}
@media all and (min-width: 992px) {
  .signup-form-info-message {
    width: 850px;
  }
}
.signup-form-info-message .close {
  width: 15px;
  height: 15px;
  margin-inline-start: 15px;
  cursor: pointer;
  margin-inline-start: auto;
}
.signup-form-info-message .close:after, .signup-form-info-message .close:before {
  position: absolute;
  width: 15px;
  height: 2px;
  content: '';
  background: #D1A342;
  top: 50%;
  right: 10px;
  margin-block-start: -1px;
  transform: rotate(-45deg);
}
.signup-form-info-message .close:before {
  background: #D1A342;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-block-start: -1px;
  transform: rotate(45deg);
  cursor: pointer;
}

.user-signup-container {
  display: flex;
  flex-direction: column;
  width: 90%;
  margin-block-start:30px;
  margin-block-end:50px;
  margin-inline-start:auto;
  margin-inline-end:auto;
  background: #ffffff;
}
@media all and (min-width: 768px) {
  .user-signup-container {
    width: 500px;
    margin-block-start:30px;
    margin-block-end:50px;
    margin-inline-start:auto;
    margin-inline-end:auto;
  }
}
.user-signup-container .user-signup-header {
  font-weight: 300;
  text-align: center;
  font-size: 24px;
  color: #ffffff;
  background: #415B76;
  padding: 12px;
}
.user-signup-container .user-signup-form-area {
  padding: 0;
  border-inline-start: 1px solid #C9D7DF;
  border-inline-end: 1px solid #C9D7DF;
  border-block-end: 1px solid #C9D7DF;
  position: relative;
}
.user-signup-container .user-signup-form-area .user-signup-form-container {
  display: flex;
  flex-direction: column;
  padding-block-start:30px;
  padding-block-end:30px;
  padding-inline-start:20px;
  padding-inline-end:20px;
  position: relative;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container {
  display: flex;
  flex-direction: column;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper {
  width: 100%;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper label {
  font-size: 14px;
  margin-block-end: 7px;
  color: #36474F;
  display: block;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.user-signup-choice-field {
  display: -webkit-inline-box;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message {
  position: relative;
  padding-block-end: 35px;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message .form-field-datetime-formula input {
  padding-inline-end: 30px;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message .form-field-datetime-formula .form-field-icon-formula {
  position: absolute;
  right: 10px;
  top: 20px;
  transform: translate(0, -50%);
  cursor: pointer;
  font-size: 15px;
  line-height: 0;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message .form-field-datetime-formula .form-field-icon-formula svg {
  width: 15px;
  height: 15px;
  fill: currentColor;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea {
  border: 1px solid #C9D7DF;
  background: #ffffff;
  border-radius: 3px;
  padding-block-start:0px;
  padding-block-end:0px;
  padding-inline-start:10px;
  padding-inline-end:10px;
  width: 100%;
  font-family: Helvetica, Arial, sans-serif;
  color: #505c63;
  font-size: 14px;
  height: 40px;
  line-height: 40px;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text]::-moz-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password]::-moz-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number]::-moz-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit]::-moz-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea::-moz-placeholder {
  color: #cccccc;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.user-signup-choice-field .form-field-choice-container{
    display: flex;
    align-items: baseline;
    margin-block-end: 5px;
    margin-inline-start: 15px;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.user-signup-choice-field .form-field-choice-container input{
    margin-inline-end: 10px;
    flex: 0 0 auto;
    width: auto;
}

.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text]::-webkit-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password]::-webkit-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number]::-webkit-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit]::-webkit-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea::-webkit-input-placeholder {
  color: #cccccc;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text]:-ms-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password]:-ms-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number]:-ms-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit]:-ms-input-placeholder, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea:-ms-input-placeholder {
  color: #cccccc;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text]:focus, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text]:active, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password]:focus, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password]:active, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number]:focus, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number]:active, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit]:focus, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit]:active, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea:focus, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea:active {
  outline: none;
  border-color: #3497FF;
  -webkit-transition: border-color 0.5s ease-in-out;
  -moz-transition: border-color 0.5s ease-in-out;
  -ms-transition: border-color 0.5s ease-in-out;
  -o-transition: border-color 0.5s ease-in-out;
  transition: border-color 0.5s ease-in-out;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text].field-disable, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password].field-disable, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number].field-disable, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit].field-disable, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea.field-disable {
  background: #ECECEC;
  border-color: #C9D7DF;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=text].field-value-change, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=password].field-value-change, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=number].field-value-change, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message input[type=submit].field-value-change, .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea.field-value-change {
  padding-inline-end: 0px;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message textarea {
  line-height: normal;
  height: 80px;
  resize: none;
  padding: 10px;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message .field-error-msg {
  color: #EB4C5C;
  position: absolute;
  left: 0px;
  bottom: 7px;
  font-size: 12px;
  height: 20px;
  display: none;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message .field-value-modify-button {
  text-decoration: underline;
  position: absolute;
  right: 10px;
  top: 12px;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .form-field-and-message .field-value-modify-button:hover {
  text-decoration: underline;
}
.signup-button{
  -webkit-appearance: none;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper .signup-button, .signup-button {
  border: 0px;
  background: #3498DB;
  color: #ffffff;
  padding-block-start:8px;
  padding-block-end:8px;
  padding-inline-start:18px;
  padding-inline-end:18px;
  font-size: 14px;
  border-radius: 3px;
  margin-inline-start: auto;
  cursor: pointer;
}
.signup-button + .signup-button{
  margin-inline-start: 10px;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.signup-form-submit {
  display: inline-flex;
}
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.field-error .form-field-and-message input[type=text], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.field-error .form-field-and-message input[type=password], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.field-error .form-field-and-message input[type=number], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.field-error .form-field-and-message input[type=submit], .user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.field-error .form-field-and-message textarea {
  border-color: red;
  -webkit-transition: border-color 0.5s ease-in-out;
  -moz-transition: border-color 0.5s ease-in-out;
  -ms-transition: border-color 0.5s ease-in-out;
  -o-transition: border-color 0.5s ease-in-out;
  transition: border-color 0.5s ease-in-out; }
.user-signup-container .user-signup-form-area .user-signup-form-container .user-signup-form-fields-container .user-signup-form-field-wrapper.field-error .form-field-and-message .field-error-msg {
  display: block;
}
.user-signup-container .user-signup-help {
  background: #FBFBFB;
  border: 1px solid #C9D7DF;
  border-block-start: 0px;
  padding-block-start:18px;
  padding-block-end:18px;
  padding-inline-start:20px;
  padding-inline-end:20px;
  font-size: 13px;
  text-align: center;
}
.user-signup-help div {
  display: inline;
}
.user-signup-container .user-signup-help a {
  padding-block-start:0;
  padding-block-end:0;
  padding-inline-start:5px;
  padding-inline-end:5px;
  font-size: 13px;
}

.user-signup-container .user-signup-help .forgot-password {

    display: block;
    margin-block-start: 10px;

  }
@media all and (min-width: 992px) {
  .user-signup-container .user-signup-help .forgot-password {
    margin-inline-start: auto;
    float: right;
    float: inline-end;
    width: 50%;
    text-align: end;
    display: inline;
    margin-block-start: 0;
  }
}
.user-signup-container .user-signup-error-header{
  text-align: center;
}
.user-signup-container .user-signup-error-text{
  line-height:1.8;
  color:#333;
  padding-block-start:20px;
  padding-block-end:20px;
  padding-inline-start:0;
  padding-inline-end:0;
}
.user-signup-container .user-signup-back-button{
  background: #3498DB;
  border-radius: 2px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 300;
  padding-block-start:10px;
  padding-block-end:10px;
  padding-inline-start:20px;
  padding-inline-end:20px;
  position: relative;
  text-decoration: none;
  border:0 solid;
  cursor:pointer;
}
.user-signup-container .user-signup-heading{
  color: #3498DB;font-size: 22px;font-weight: 400;margin: 0;
}
.user-signup-disabled{
  padding: 40px;
  margin-block-start:0px;
  margin-block-end:0px;
  margin-inline-start:auto;
  margin-inline-end:auto;
  background-color: #fff;
  border-radius: 4px;
  border-inline-start: 1px solid #e9e9e9;
  border-inline-end: 1px solid #e9e9e9;
  border-block-end: 2px solid #c7c7c7;
  margin-block-start: 20px;
}
.portal-site-detail-container{
  margin-block-start : 10px;
}
.site-details-inner{
  width: 100%;
  margin-block-start:0px;
  margin-block-end:0px;
  margin-inline-start:auto;
  margin-inline-end:auto;
  padding-block-start:12px;
  padding-block-end:12px;
  padding-inline-start:0px;
  padding-inline-end:0px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media all and (min-width: 992px) {
  .site-details-inner{
    width: 1000px;
    margin-block-start:0px;
    margin-block-end:0px;
    margin-inline-start:auto;
    margin-inline-end:auto;
  }
}
.site-details-inner a{
  flex-direction: column;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  padding-block-start:0;
  padding-block-end:0;
  padding-inline-start:12px;
  padding-inline-end:12px;
}
@media all and (min-width: 992px) {
  .site-details-inner a{
    flex-direction: row;
    padding:0;
  }
}
.portal-logo-container{
  padding-inline-end: 0;
}
.portal-logo-container img{
  max-inline-size: 200px;
  max-block-size: 200px;
}
a .portal-site-name{
  font-size: 100%;
  margin-block-start: 10px;
}
@media all and (min-width: 992px) {
  .portal-logo-container{
    padding-inline-end: 12px;
  }
  .portal-logo-container img{
    max-inline-size: 100%;
    max-block-size: 100%;
  }
  a .portal-site-name{
    font-size: 120%;
    color:#36474F;
    text-decoration: none;
    margin-block-start:0;
  }
}


.signin-iframe{
  display:block;
  width:90%;
  height:480px;
  overflow-x:hidden;
  overflow-y:hidden;
  margin-block-start:0px;
  margin-block-end:0px;
  margin-inline-start:auto;
  margin-inline-end:auto;
}
@media all and (min-width: 992px) {
  .signin-iframe{
    width:450px;
  }
}
.forgetpassword-iframe{
  height:350px;
}
input[type="password"] + span.field-error-msg{
     position: initial !important;
    padding-block-start: 6px;
    min-block-size: 20px;
    height: auto !important;
}
.user-signup-form-area.box-border{
  border: none;
  box-shadow: 0 0 15px 5px rgba(0,0,0,0.05);
  border-radius: 5px;
  margin-block-start: 110px;
  background: #fff;
}
.pb12{
  padding-block-end: 12px;
}
.password-field{
  border-inline-end: none !important;
  border-radius: 3px 0 0 3px !important;
  max-inline-size: 285px;
  border-color: rgba(39,63,91,.30);
  height: 46px !important;
  font-size: 22px !important;
}
input.signup-button.password-button {
  background: #4A90E2 !important;
  color: #FFF !important;
  border-radius: 0 3px 3px 0 !important;
  border: none !important;
  width: 150px !important;
  font-size: 16px !important;
  font-weight: normal;
  height: 46px !important;
  margin: 0 !important;
}
.password-field-container{
  display: flex;
  padding-block-end: 0 !important;
}
.text-style{
  line-height: 1.6 !important;
}
.lock-icon{
  display: flex;
  justify-content: center;
  padding-block-end: 24px;
}
.password-container{
  width: 90%;
  background: transparent;
}
.error-message {
  padding:0;
  color: #eb4c5c;
}
.user-signup-form-captcha li{
  width: 311px !important;
}
@media (min-width: 768px){
  .password-container{
    width: 600px;
  }
  .error-message {
    padding-block-start:12px;
    padding-block-end:0;
    padding-inline-start:50px;
    padding-inline-end:0;
    color: #eb4c5c;
  }
  .user-signup-form-captcha li{
    width: 370px !important;
  }
}
.password-body-bg{
  background: #f6fcff;
}
.user-signup-container .user-signup-form-area.box-border .user-signup-form-container{
  padding-block-start:34px;
  padding-block-end:64px;
  padding-inline-start:34px;
  padding-inline-end:34px;
}
.password-heading{
  font-size: 22px;
  margin-block-start:0px;
  margin-block-end:36px;
  margin-inline-start:0;
  margin-inline-end:0;
  padding: 0;
  text-align: center;
  font-weight: normal;
  color:#273f5b;
}
.password-text{
  font-size: 15px !important;
  color:#25313c;
  margin-block-start:0px !important;
  margin-block-end:28px !important;
  margin-inline-start:0 !important;
  margin-inline-end:0 !important;
  text-align: center;
}

.signup-button[disabled] {
  cursor: not-allowed;
  pointer-events: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none 2px 5px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: none 2px 5px rgba(0, 0, 0, 0.4);
  -ms-box-shadow: none 2px 5px rgba(0, 0, 0, 0.4);
  box-shadow: none 2px 5px rgba(0, 0, 0, 0.4);
}
.signup-button #zs-loader-icon{
  display: none;
}
.signup-button[disabled] #zs-loader-icon{
  display: inline-block;
}
.user-signup-form-captcha{
  align-items: center;

}

.user-signup-form-captcha .form-field-and-message{
  padding-block-end: 24px !important;
}
.user-signup-form-captcha .signup-button{
  background: #4A90E2 !important;
  font-size: 16px !important;
  padding-block-start:12px !important;
  padding-block-end:12px !important;
  padding-inline-start:30px !important;
  padding-inline-end:30px !important;
}
.user-signup-form-captcha .signup-button:focus {
    outline: none;
}