.form-group.required .form-control-label::before {
  content: "*";
  color: #c00; }

.login-page {
  margin-top: 1em; }
  .login-page .login-form-nav {
    margin-bottom: 1.25em; }
    .login-page .login-form-nav .tab-pane {
      margin-top: 1em; }
  .login-page .login {
    margin-bottom: 0.938em; }
    .login-page .login .error-message-form {
      padding: 0.625em;
      background-color: #c00;
      color: #fff;
      border-radius: 0.188em; }

.registration-page .privacy-policy {
  margin-top: 1rem; }

.login-banner {
  background-image: url("../images/account.jpg");
  background-position-y: 40%; }

.equal-height .card {
  width: 100%; }

.track-order-header {
  font-size: 1.75rem; }

.request-password-title {
  font-size: 1.5rem; }

/* function to convert the calc function in to rem based
$first- should be in % */
/** Slick Carousel Starts **/
/** Slick Carousel Ends **/
/* override default breakpoints */
#requestPasswordResetModal .modal-dialog {
  max-width: 35.8125rem;
  height: 100%;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 auto; }
  @media (min-width: 992px) {
    #requestPasswordResetModal .modal-dialog {
      max-width: 48.75rem;
      height: auto;
      width: auto;
      display: block;
      margin: 1.875rem auto; } }

#requestPasswordResetModal .modal-header {
  border: none; }
  #requestPasswordResetModal .modal-header .close {
    position: absolute;
    top: 1rem;
    right: 1rem; }

#requestPasswordResetModal .modal-content {
  width: 35.8125rem; }
  @media (min-width: 992px) {
    #requestPasswordResetModal .modal-content {
      width: 48.75rem; } }

.request-password-title {
  margin: auto; }

#otpTitleText {
  padding: 2.5rem 0; }

.request-password-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.success-icon {
  margin: 1.25rem auto 0.25rem;
  display: block;
  height: 3.125rem;
  width: 3.125rem; }
  @media (min-width: 768px) {
    .success-icon {
      margin: 0 auto 1.875rem;
      height: 4.375rem;
      width: 4.375rem; } }

.reset-password-wrapper {
  margin: 0;
  width: 100%;
  max-width: unset; }

.reset-password-note {
  margin-bottom: 1.875rem;
  text-align: center;
  line-height: normal; }
  @media (min-width: 768px) {
    .email-success .reset-password-note {
      max-width: 80%;
      line-height: 1.5; } }
  .reset-password-note br {
    display: none; }
    @media (min-width: 768px) {
      .reset-password-note br {
        display: block; } }

.reset-password-form {
  -webkit-box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.15);
          box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.15);
  background-color: #fff;
  padding: 1.25rem 0.625rem 1rem 0.625rem; }
  .reset-password-form.email-success {
    background-color: unset;
    -webkit-box-shadow: unset;
            box-shadow: unset; }
  @media (min-width: 768px) {
    .reset-password-form {
      -webkit-box-shadow: none;
              box-shadow: none;
      padding: 0; } }
  .reset-password-form .form-group,
  .reset-password-form .send-email-btn {
    width: 100%;
    margin: 0 auto 1rem; }
    @media (min-width: 768px) {
      .reset-password-form .form-group,
      .reset-password-form .send-email-btn {
        width: 19.125rem; } }
  .reset-password-form .send-email-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
  .reset-password-form input,
  .reset-password-form button {
    height: 3.125rem;
    -webkit-box-shadow: none;
            box-shadow: none; }

#OTPVerifyOtpForm .otp-text-wrapper {
  margin-bottom: 1.75rem; }

#OTPVerifyOtpForm .otp-resend-link-wrapper {
  margin-top: 1.125rem; }

@media (max-width: 767.98px) {
  #OTPVerifyOtpForm #forgotPwdOtp #popoverContent {
    width: 12.1875rem; } }

#OTPSetNewPassword .form-group-wrapper .form-group .note-wrapper {
  margin-top: 0.75rem; }

#OTPSetNewPassword .form-group-wrapper .form-group .toggle-password {
  position: absolute;
  top: 1.0625rem;
  right: 1rem; }

#OTPVerifyEmailForm .otp-text-wrapper,
#OTPVerifyOtpForm .otp-text-wrapper,
#OTPSetNewPassword .otp-text-wrapper {
  margin-bottom: 1rem; }
  #OTPVerifyEmailForm .otp-text-wrapper .otp-text,
  #OTPVerifyOtpForm .otp-text-wrapper .otp-text,
  #OTPSetNewPassword .otp-text-wrapper .otp-text {
    max-width: 28.0625rem;
    text-align: center;
    line-height: 1.5; }

#OTPVerifyEmailForm .form-group-wrapper .form-group,
#OTPVerifyOtpForm .form-group-wrapper .form-group,
#OTPSetNewPassword .form-group-wrapper .form-group {
  width: 24.1875rem; }

#OTPVerifyEmailForm .otp-btn-wrapper .otp-btn,
#OTPVerifyOtpForm .otp-btn-wrapper .otp-btn,
#OTPSetNewPassword .otp-btn-wrapper .otp-btn {
  width: 100%;
  margin-top: 1rem; }
  @media (min-width: 768px) {
    #OTPVerifyEmailForm .otp-btn-wrapper .otp-btn,
    #OTPVerifyOtpForm .otp-btn-wrapper .otp-btn,
    #OTPSetNewPassword .otp-btn-wrapper .otp-btn {
      width: 16.8125rem; } }

.login #maincontent {
  background-color: #f7f7f7; }

@media (max-width: 575.98px) {
  .change-password {
    margin: 0;
    max-width: unset; } }

@media (min-width: 768px) {
  .change-password.reset .card {
    max-width: 23.125rem; } }

.change-password.reset .card-body {
  padding: 1.5625rem 0.625rem 1.875rem; }
  @media (min-width: 768px) {
    .change-password.reset .card-body {
      padding: 2rem 2.125rem; } }

.change-password .breadcrumb-wrapper {
  text-align: center; }
  .change-password .breadcrumb-wrapper .breadcrumb {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex; }
    .change-password .breadcrumb-wrapper .breadcrumb-item {
      font-size: 0.75rem; }

.change-password .card {
  background: none;
  border: none;
  max-width: unset;
  margin: auto; }
  @media (min-width: 768px) {
    .change-password .card {
      max-width: 27.125rem; } }
  .change-password .card-header {
    background: none;
    border: none;
    text-align: center;
    margin: 0 auto 1.75rem;
    padding: 0.75rem 0; }
    .change-password .card-header-text {
      font-weight: 700; }
    .change-password .card-header-desc {
      margin: 0.5rem 0 0;
      line-height: normal; }
  .change-password .card-body {
    background: #fff;
    -webkit-box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.15);
            box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.15);
    padding: 0.9375rem 0.625rem 1.875rem; }
    @media (min-width: 768px) {
      .change-password .card-body {
        padding: 1.25rem 1.875rem 3.75rem; } }
    .change-password .card-body .update-btn {
      margin: 0 auto; }
      @media (min-width: 768px) {
        .change-password .card-body .update-btn {
          max-width: 18.125rem;
          height: 3.125rem; } }
    .change-password .card-body .email {
      line-height: 1.5; }
  .change-password .card .toggle-password {
    position: absolute;
    right: 1rem;
    top: 1rem;
    font-size: 0.75rem; }

.registration .email-signup-info {
  font-size: 0.75rem; }
  .registration .email-signup-info a {
    border: 0.0625rem solid transparent; }
    .registration .email-signup-info a:focus {
      -webkit-box-shadow: none;
              box-shadow: none;
      border: 0.0625rem solid #8f8f8f;
      border-radius: 0.25rem;
      outline: none; }
    .registration .email-signup-info a:active {
      text-decoration: underline; }

.registration .form-group .instruction {
  padding-left: 1.875rem; }
  @media (min-width: 768px) {
    .registration .form-group .instruction {
      padding-left: 1rem; } }
  .registration .form-group .instruction.error-icon {
    position: absolute;
    top: 1rem;
    left: 0.5rem; }
    @media (min-width: 768px) {
      .registration .form-group .instruction.error-icon {
        top: 1.5rem; } }
    .registration .form-group .instruction.error-icon::before {
      height: 1.5rem;
      width: 1.5rem;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      color: #d0021b;
      font-size: 1rem;
      font-weight: 700;
      border: 0.125rem solid #d0021b; }

.registration .form-group.error-block .error-fields {
  padding-left: 2.5rem; }
  @media (min-width: 768px) {
    .registration .form-group.error-block .error-fields {
      padding-left: 2rem; } }

.registration .email-signup-check.cb-wrapper,
.registration .signup-loyalty.cb-wrapper {
  padding-left: 2rem; }
  .registration .email-signup-check.cb-wrapper input,
  .registration .signup-loyalty.cb-wrapper input {
    position: absolute; }

.registration .email-signup-check .cb-custom,
.registration .signup-loyalty .cb-custom {
  top: 0.5rem;
  left: 0; }
  .registration .email-signup-check .cb-custom::after,
  .registration .signup-loyalty .cb-custom::after {
    top: 0.0625rem;
    left: 0.25rem; }

.registration .ycc-rewards-wrapper.invalid .cb-custom {
  border: 0.0625rem solid #d0021b; }

.registration .ycc-rewards-wrapper.invalid .ctExistingUser-error {
  color: #d0021b; }
  .registration .ycc-rewards-wrapper.invalid .ctExistingUser-error .error-icon {
    fill: #d0021b; }

.registration .custom-checkbox-loyalty {
  margin: 0 0 0.625rem 0;
  position: relative;
  cursor: pointer; }
  .registration .custom-checkbox-loyalty input {
    height: 0;
    width: 0;
    opacity: 0;
    cursor: pointer;
    position: absolute;
    z-index: -1; }
    .registration .custom-checkbox-loyalty input:checked + .cb-wrapper .cb-custom {
      background-color: #707372;
      border-color: #595c5b; }
      .registration .custom-checkbox-loyalty input:checked + .cb-wrapper .cb-custom::after {
        display: block; }
    .registration .custom-checkbox-loyalty input:focus + .cb-wrapper {
      border: 0.125rem solid #707372;
      -webkit-box-shadow: 0 0 0.3125rem 0.0625rem #707372;
              box-shadow: 0 0 0.3125rem 0.0625rem #707372;
      outline: none; }
  .registration .custom-checkbox-loyalty .cb-wrapper {
    padding: 0.5rem 0.3125rem 0.5rem 1.875rem;
    border: 0.0625rem solid transparent;
    margin: 0;
    color: #000;
    cursor: pointer; }
    .registration .custom-checkbox-loyalty .cb-wrapper .cb-custom {
      position: absolute;
      top: 0.5rem;
      left: 0;
      border: 0.0625rem solid #6a6c6c;
      border-radius: 0.125rem; }
      .registration .custom-checkbox-loyalty .cb-wrapper .cb-custom::after {
        content: '';
        position: absolute;
        display: none;
        top: 0.0625rem;
        left: 0.25rem;
        width: 0.375rem;
        height: 0.6875rem;
        border: solid #fff;
        border-width: 0 0.125rem 0.125rem 0;
        -webkit-transform: rotate(40deg);
                transform: rotate(40deg); }

.registration .signup-loyalty .custom-control-input {
  top: 0;
  visibility: hidden; }

.registration .loyalty-fields {
  margin-top: 0.5rem; }
  .registration .loyalty-fields .static-label {
    margin-bottom: 0.5rem; }
    .registration .loyalty-fields .static-label .phone,
    .registration .loyalty-fields .static-label .birthday {
      margin-right: 0.5rem; }
  .registration .loyalty-fields .custom-select-wrapper .form-control:disabled {
    cursor: not-allowed; }
  .registration .loyalty-fields .custom-select-wrapper .form-control:not(:required):not([value='']) + .form-control-label {
    opacity: 1; }
  .registration .loyalty-fields .custom-select-wrapper .form-control:not(:required)[value=''] + .form-control-label {
    opacity: 0; }

.registration .loyalty-points {
  color: #707372; }

.error-block.form-group {
  display: none;
  padding: 1rem;
  width: 100%;
  border-radius: 0.25rem;
  border: solid 0.0625rem #d0021b;
  background-color: #f9f6f6;
  margin-bottom: 1.75rem; }
  .error-block.form-group:focus {
    outline: none; }
  .error-block.form-group .error-icon::before {
    left: 0.125rem;
    width: 1rem;
    height: 1rem;
    border: 0.0625rem solid #d0021b;
    color: #d0021b; }
    @media (min-width: 768px) {
      .error-block.form-group .error-icon::before {
        width: 1.5rem;
        height: 1.5rem;
        font-size: 1rem;
        font-weight: 700;
        padding-top: 0.5rem; } }
  .error-block.form-group span {
    font-size: 0.75rem;
    color: #222; }
    @media (min-width: 768px) {
      .error-block.form-group span {
        font-size: 1rem;
        margin: 0.5rem;
        line-height: 1.25; } }
  .error-block.form-group .error-fields {
    font-size: 0.75rem;
    list-style: none;
    color: #6a6c6c;
    padding-left: 1.5rem;
    margin: 0.375rem 0 0; }
    @media (min-width: 768px) {
      .error-block.form-group .error-fields {
        padding-left: 2rem;
        font-size: 1rem;
        margin: 0.625rem 0 0.25rem; } }
    .error-block.form-group .error-fields .item {
      padding-bottom: 0.375rem; }
      .error-block.form-group .error-fields .item a {
        font-size: 0.75rem;
        color: #6a6c6c;
        border: 0.0625rem solid transparent;
        padding: 0.25rem 0.5rem; }
        @media (min-width: 768px) {
          .error-block.form-group .error-fields .item a {
            font-size: 1rem; } }
        .error-block.form-group .error-fields .item a:focus {
          -webkit-box-shadow: none;
                  box-shadow: none;
          border: 0.0625rem solid #8f8f8f;
          border-radius: 0.25rem;
          outline: none; }
        .error-block.form-group .error-fields .item a:active {
          text-decoration: underline; }
        .error-block.form-group .error-fields .item a:hover {
          text-decoration: underline;
          color: #6a6c6c; }

.error-block.error {
  display: block; }

.bottom-help-section {
  color: #222;
  font-family: "Roboto-Regular", sans-serif, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.38;
  letter-spacing: normal; }
  .bottom-help-section .need-help-header {
    font-family: "RobotoSlab-Bold", sans-serif;
    font-weight: 700;
    font-size: 1rem; }
  .bottom-help-section .need-help-links {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex; }
    .bottom-help-section .need-help-links a {
      margin: 1.125rem 0.625rem;
      color: #6a6c6c;
      border: 0.0625rem solid transparent;
      padding: 0.25rem 0.5rem; }
      .bottom-help-section .need-help-links a:hover {
        color: #6a6c6c; }
        .bottom-help-section .need-help-links a:hover svg {
          fill: #6a6c6c; }
      .bottom-help-section .need-help-links a:focus {
        outline: none;
        border-color: #8f8f8f;
        border-radius: 0.25rem; }
      .bottom-help-section .need-help-links a:active {
        outline: none; }
      .bottom-help-section .need-help-links a svg {
        fill: #6a6c6c;
        margin-bottom: 0.5rem; }

@media (max-width: 575.98px) {
  .pc-modal .modal-dialog {
    margin: 0;
    height: 100%; } }

@media (min-width: 576px) {
  .pc-modal .modal-dialog {
    max-width: 29.25rem; } }

@media (max-width: 767.98px) {
  .pc-modal .modal-content {
    border: 0;
    height: 100%; } }

.pc-modal .modal-header {
  background: #f7f7f7; }

.pc-modal .modal-body {
  background: #fff; }
  .pc-modal .modal-body .success-content {
    padding: 4rem 2.5rem 3.5rem; }
    @media (min-width: 576px) {
      .pc-modal .modal-body .success-content {
        padding: 2.5rem 2.5rem 3.5rem; } }
    .pc-modal .modal-body .success-content .success-icon {
      position: relative;
      width: 3.3125rem;
      height: 3.3125rem;
      border-radius: 50%;
      background-color: #417505;
      margin: 0 auto 1rem; }
      .pc-modal .modal-body .success-content .success-icon::before {
        content: '';
        position: absolute;
        left: 44%;
        top: 22%;
        width: 0.75rem;
        height: 1.5rem;
        border: solid #fff;
        border-width: 0 0.1875rem 0.1875rem 0;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg); }

.pc-modal .guest-label-or {
  position: relative; }
  .pc-modal .guest-label-or::after, .pc-modal .guest-label-or::before {
    content: '';
    display: inline-block;
    position: absolute;
    height: 0.0625rem;
    width: 46%;
    top: 50%;
    background: #707372; }
  .pc-modal .guest-label-or::before {
    left: 0; }
  .pc-modal .guest-label-or::after {
    right: 0; }

.pc-modal .pc-modal-loggedIn .save-project-section {
  margin: 0 0 6.125rem; }
  @media (min-width: 576px) {
    .pc-modal .pc-modal-loggedIn .save-project-section {
      margin: 0 0 5.875rem; } }
  .pc-modal .pc-modal-loggedIn .save-project-section.error {
    margin: 0 0 3.625rem; }
    @media (min-width: 576px) {
      .pc-modal .pc-modal-loggedIn .save-project-section.error {
        margin: 0 0 3.375rem; } }
  .pc-modal .pc-modal-loggedIn .save-project-section .is-invalid + label {
    color: #d0021b; }

.fc-saved-projects-list select:focus {
  border: 0.125rem solid #707372;
  -webkit-box-shadow: 0 0 0.3125rem 0.0625rem #707372;
          box-shadow: 0 0 0.3125rem 0.0625rem #707372; }

.fc-saved-projects-list button:focus {
  outline: 0.125rem solid #707372;
  outline-offset: 0.125rem;
  -webkit-box-shadow: 0 0 0.3125rem 0.0625rem #707372;
          box-shadow: 0 0 0.3125rem 0.0625rem #707372; }

@media (max-width: 767.98px) {
  .fc-add-project-container .fc-button-pair:focus {
    border: 0.125rem dotted #000; } }

[data-action="PersonalizeCandle-Show"] .header-banner {
  display: none !important; }

.login-page,
.pc-modal {
  padding: 2.5rem 0 3rem; }
  .login-page .login,
  .pc-modal .login {
    margin-bottom: 0; }
    .login-page .login .alert,
    .pc-modal .login .alert {
      display: none; }
  .login-page .toggle-password,
  .pc-modal .toggle-password {
    position: absolute;
    right: 1rem;
    top: 1rem;
    font-size: 0.75rem; }
  .login-page .remember-me-check,
  .pc-modal .remember-me-check {
    font-size: 0.75rem; }
  .login-page .login-info,
  .pc-modal .login-info {
    padding: 1rem 1.25rem;
    line-height: normal; }
  .login-page .login-error-message,
  .login-page .register-error-message,
  .login-page .turnstile-error-message,
  .pc-modal .login-error-message,
  .pc-modal .register-error-message,
  .pc-modal .turnstile-error-message {
    color: #222;
    font-family: "Roboto-Regular", sans-serif;
    font-size: 1rem;
    line-height: normal;
    padding: 1rem;
    border-radius: 0.25rem;
    border: 0.0625rem solid #d0021b;
    background-color: #f9f6f6;
    position: relative;
    margin-bottom: 1.5rem;
    margin-top: 1rem; }
    .login-page .login-error-message span,
    .login-page .register-error-message span,
    .login-page .turnstile-error-message span,
    .pc-modal .login-error-message span,
    .pc-modal .register-error-message span,
    .pc-modal .turnstile-error-message span {
      display: inline-block;
      padding-left: 2rem; }
      .login-page .login-error-message span.error-text,
      .login-page .register-error-message span.error-text,
      .login-page .turnstile-error-message span.error-text,
      .pc-modal .login-error-message span.error-text,
      .pc-modal .register-error-message span.error-text,
      .pc-modal .turnstile-error-message span.error-text {
        color: #d0021b; }
    .login-page .login-error-message .circle-info-red,
    .login-page .register-error-message .circle-info-red,
    .login-page .turnstile-error-message .circle-info-red,
    .pc-modal .login-error-message .circle-info-red,
    .pc-modal .register-error-message .circle-info-red,
    .pc-modal .turnstile-error-message .circle-info-red {
      position: absolute;
      fill: #d0021b;
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg); }
    .login-page .login-error-message .circle-success-green,
    .login-page .register-error-message .circle-success-green,
    .login-page .turnstile-error-message .circle-success-green,
    .pc-modal .login-error-message .circle-success-green,
    .pc-modal .register-error-message .circle-success-green,
    .pc-modal .turnstile-error-message .circle-success-green {
      position: absolute; }
    .login-page .login-error-message.success,
    .login-page .register-error-message.success,
    .login-page .turnstile-error-message.success,
    .pc-modal .login-error-message.success,
    .pc-modal .register-error-message.success,
    .pc-modal .turnstile-error-message.success {
      background-color: #f9fff3;
      border: 0.0625rem solid #417505; }
  .login-page .password-section,
  .pc-modal .password-section {
    margin-bottom: 0; }
  .login-page .forgot-password,
  .pc-modal .forgot-password {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1; }
    .login-page .forgot-password a,
    .pc-modal .forgot-password a {
      font-size: 0.75rem; }
  .login-page .card,
  .pc-modal .card {
    -webkit-box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.15);
            box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 0, 0, 0.15);
    border: none; }
    .login-page .card-header,
    .pc-modal .card-header {
      font-weight: 700;
      padding: 1.6875rem 0;
      border-bottom: 0.125rem solid #d8d8d8;
      text-align: center; }
    .login-page .card .tab-pane:focus,
    .pc-modal .card .tab-pane:focus {
      outline: 0.125rem dotted #6a6c6c; }
    .login-page .card-body,
    .pc-modal .card-body {
      padding: 2rem 0.5rem; }
      @media (min-width: 768px) {
        .login-page .card-body,
        .pc-modal .card-body {
          padding: 2rem 4.75rem 2.625rem; } }
      @media (min-width: 992px) {
        .login-page .card-body,
        .pc-modal .card-body {
          padding: 2rem 5.125rem 2.625rem; } }
    .login-page .card .track-order-header-text,
    .login-page .card .track-order-required-text,
    .pc-modal .card .track-order-header-text,
    .pc-modal .card .track-order-required-text {
      padding: 2rem 0.5rem 0; }
      @media (min-width: 768px) {
        .login-page .card .track-order-header-text,
        .login-page .card .track-order-required-text,
        .pc-modal .card .track-order-header-text,
        .pc-modal .card .track-order-required-text {
          padding: 2rem 4.75rem 0; } }
      @media (min-width: 992px) {
        .login-page .card .track-order-header-text,
        .login-page .card .track-order-required-text,
        .pc-modal .card .track-order-header-text,
        .pc-modal .card .track-order-required-text {
          padding: 2rem 5.125rem 0; } }
    .login-page .card .track-order-header-text,
    .pc-modal .card .track-order-header-text {
      font-size: 0.875rem;
      line-height: 1.5;
      color: #222;
      text-align: center;
      max-width: 18rem;
      margin: 0 auto; }
      @media (min-width: 768px) {
        .login-page .card .track-order-header-text,
        .pc-modal .card .track-order-header-text {
          max-width: inherit; } }
    .login-page .card .track-order-required-text,
    .pc-modal .card .track-order-required-text {
      font-size: 1rem;
      color: #222;
      margin-bottom: 0.5rem; }
  .login-page .track-order-container .card-body,
  .pc-modal .track-order-container .card-body {
    padding-top: 0; }
    @media (min-width: 768px) {
      .login-page .track-order-container .card-body .form-group .instruction.error-icon,
      .pc-modal .track-order-container .card-body .form-group .instruction.error-icon {
        top: 1.5rem; } }
    @media (min-width: 768px) {
      .login-page .track-order-container .card-body .form-group .instruction.error-icon::before,
      .pc-modal .track-order-container .card-body .form-group .instruction.error-icon::before {
        height: 1.5rem;
        width: 1.5rem;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        color: #d0021b;
        font-size: 1rem;
        font-weight: 700;
        border: 0.125rem solid #d0021b; } }
  .login-page .login-section .card-body,
  .pc-modal .login-section .card-body {
    padding-top: 0.5rem; }
  .login-page .forgot-password-section,
  .pc-modal .forgot-password-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: 0.5rem 0; }
    .login-page .forgot-password-section .popover,
    .pc-modal .forgot-password-section .popover {
      width: 18.75rem;
      max-width: 18.75rem; }
  .login-page .custom-wrap-checkbox,
  .pc-modal .custom-wrap-checkbox {
    margin-bottom: 0.9375rem; }
  .login-page .nav-tabs .nav-link,
  .pc-modal .nav-tabs .nav-link {
    height: 4.3125rem;
    border: 0.125rem solid transparent;
    padding: 0;
    color: #222 !important;
    font-family: "Roboto-Medium", sans-serif, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: normal; }
    .login-page .nav-tabs .nav-link .nav-link-text,
    .pc-modal .nav-tabs .nav-link .nav-link-text {
      padding-bottom: 0.3125rem; }
    .login-page .nav-tabs .nav-link.active,
    .pc-modal .nav-tabs .nav-link.active {
      font-weight: 700;
      color: #6a6c6c !important; }
      .login-page .nav-tabs .nav-link.active .nav-link-text,
      .pc-modal .nav-tabs .nav-link.active .nav-link-text {
        border-bottom: 0.125rem solid #6a6c6c; }
    .login-page .nav-tabs .nav-link:focus,
    .pc-modal .nav-tabs .nav-link:focus {
      -webkit-box-shadow: none;
              box-shadow: none;
      outline: 0.0625rem solid #6a6c6c;
      border: none;
      outline-offset: -0.25rem;
      color: #6a6c6c; }
    .login-page .nav-tabs .nav-link:not(.active):focus,
    .pc-modal .nav-tabs .nav-link:not(.active):focus {
      outline: 0.0625rem solid #222 !important; }
    .login-page .nav-tabs .nav-link.active:active,
    .pc-modal .nav-tabs .nav-link.active:active {
      outline: none;
      border: 0.0625rem solid #6a6c6c;
      -webkit-box-shadow: inset 0 0.125rem 0.25rem 0.0625rem rgba(0, 0, 0, 0.15);
              box-shadow: inset 0 0.125rem 0.25rem 0.0625rem rgba(0, 0, 0, 0.15); }
  .login-page .nav-tabs .nav-item,
  .pc-modal .nav-tabs .nav-item {
    height: 4.3125rem;
    width: 50%;
    background-color: #eaeaea; }
    .login-page .nav-tabs .nav-item:not(.active),
    .pc-modal .nav-tabs .nav-item:not(.active) {
      -webkit-box-shadow: 0 0 0.25rem 0 #b4b0ab;
              box-shadow: 0 0 0.25rem 0 #b4b0ab;
      border: solid 0.03125rem #d8d8d8; }
    .login-page .nav-tabs .nav-item.active,
    .pc-modal .nav-tabs .nav-item.active {
      background-color: #fff;
      border: 0; }
    .login-page .nav-tabs .nav-item:last-of-type::after,
    .pc-modal .nav-tabs .nav-item:last-of-type::after {
      border: none; }
    .login-page .nav-tabs .nav-item:last-child .nav-link,
    .pc-modal .nav-tabs .nav-item:last-child .nav-link {
      border-right: solid 0.125rem transparent; }
      .login-page .nav-tabs .nav-item:last-child .nav-link.active:active,
      .pc-modal .nav-tabs .nav-item:last-child .nav-link.active:active {
        border-right: solid 0.0625rem #6a6c6c; }
  .login-page .loyaltyModalHeader,
  .pc-modal .loyaltyModalHeader {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    .login-page .loyaltyModalHeader .headerText,
    .pc-modal .loyaltyModalHeader .headerText {
      height: 4.5rem;
      border-bottom: 2px solid #000;
      color: #000;
      font-family: "Roboto-Bold", sans-serif, sans-serif;
      font-size: 1rem;
      font-weight: 700;
      line-height: 1.25;
      letter-spacing: normal; }
  .login-page .oauth-facebook,
  .pc-modal .oauth-facebook {
    background: #4267b2;
    color: #fff !important;
    padding: 0.75rem 0;
    margin: 0 0 1rem 0; }
    .login-page .oauth-facebook:focus,
    .pc-modal .oauth-facebook:focus {
      -webkit-box-shadow: none;
              box-shadow: none;
      outline: 0.0625rem solid #8f8f8f;
      outline-offset: 0.1875rem; }
    .login-page .oauth-facebook .fa-facebook,
    .pc-modal .oauth-facebook .fa-facebook {
      background-color: #fff;
      width: 1.5rem;
      height: 1.4375rem;
      border-radius: 50%; }
      .login-page .oauth-facebook .fa-facebook::before,
      .pc-modal .oauth-facebook .fa-facebook::before {
        color: #4267b2;
        position: absolute;
        top: 0.3125rem;
        left: 0.375rem;
        font-size: 1.25rem; }
  .login-page .label-or,
  .pc-modal .label-or {
    margin-bottom: 1.5rem;
    margin-top: 0.5rem; }
  @media (min-width: 768px) and (max-width: 991.98px) {
    .login-page .card,
    .pc-modal .card {
      margin-left: auto;
      margin-right: auto; } }
  @media (min-width: 768px) {
    .login-page .login-error-message,
    .login-page .register-error-message,
    .pc-modal .login-error-message,
    .pc-modal .register-error-message {
      padding: 1rem 1rem 1rem 1.5rem;
      margin-top: 1.5rem; }
      .login-page .login-error-message span,
      .login-page .register-error-message span,
      .pc-modal .login-error-message span,
      .pc-modal .register-error-message span {
        padding-left: 2rem;
        padding-top: 0.125rem; }
        .login-page .login-error-message span.error-text,
        .login-page .register-error-message span.error-text,
        .pc-modal .login-error-message span.error-text,
        .pc-modal .register-error-message span.error-text {
          color: #d0021b; }
    .login-page .login-info,
    .pc-modal .login-info {
      padding: 1rem 2.25rem; }
    .login-page .login-container,
    .login-page .track-order-container,
    .pc-modal .login-container,
    .pc-modal .track-order-container {
      max-width: 30.25rem; }
    .login-page .card-body,
    .pc-modal .card-body {
      padding: 2rem 5rem 2.5rem; }
    .login-page .label-or,
    .pc-modal .label-or {
      margin-bottom: 1rem;
      margin-top: 0.75rem; }
    .login-page .login-section .card-body,
    .pc-modal .login-section .card-body {
      padding-top: 1rem; } }
  @media (min-width: 992px) {
    .login-page .track-order-container,
    .pc-modal .track-order-container {
      margin-left: 2.5rem; } }

.login #maincontent {
  background-color: #f7f7f7; }

.login-modal .modal-close {
  top: 0.75rem;
  right: 1rem;
  z-index: 1; }

@media (max-width: 575.98px) {
  .login-modal .modal-dialog {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0; }
  .login-modal .modal-content {
    height: 100%;
    width: 100%; } }

.login-modal .modal-content .card {
  margin: 0;
  -webkit-box-shadow: none;
          box-shadow: none; }
  @media (max-width: 575.98px) {
    .login-modal .modal-content .card-body {
      padding-left: 1rem;
      padding-right: 1rem; } }

.login-alert {
  border: 0.0625rem solid #b58500;
  border-radius: 0.25rem;
  background-color: #f9f8f6;
  margin-bottom: 1rem; }
  .login-alert:focus {
    outline: none; }
  .login-alert svg {
    top: 1rem;
    left: 1rem;
    position: absolute;
    fill: #b58500; }
  .login-alert-msg {
    padding-left: 1.75rem; }

@media (max-width: 767.98px) {
  .pc-modal {
    padding: 0;
    padding-right: 0 !important; } }

.pc-modal .card-body {
  padding: 1.5rem 1rem; }
  @media (min-width: 576px) {
    .pc-modal .card-body {
      padding: 2rem 5rem 2.5rem; } }

.ct-cont {
  padding: 1.5rem 0; }
  @media (min-width: 576px) {
    .ct-cont {
      padding: 2.1875rem 0 9rem; } }
  .ct-cont .login-ct-cont {
    background: #fff;
    max-width: 37.5625rem;
    margin-top: 1.5rem;
    padding: 1rem 0.5rem; }
    @media (min-width: 576px) {
      .ct-cont .login-ct-cont {
        margin-top: 2.5rem;
        padding: 1.5rem 5.875rem 2.5rem 4.9375rem; } }
    .ct-cont .login-ct-cont .alert {
      display: none; }
  @media (min-width: 576px) {
    .ct-cont .content-asset {
      margin-top: 2.5rem;
      margin-left: 5rem; } }
  .ct-cont .content-asset .benifit-icon {
    padding-right: 0.75rem; }
  .ct-cont .content-asset img {
    width: auto; }

.login-page .forgot-password .btn-link {
  color: #6a6c6c; }
  .login-page .forgot-password .btn-link:hover {
    color: #6a6c6c; }