.noty_layout_mixin,
#noty_layout__centerRight,
#noty_layout__centerLeft,
#noty_layout__center,
#noty_layout__bottomRight,
#noty_layout__bottomCenter,
#noty_layout__bottomLeft,
#noty_layout__bottom,
#noty_layout__topRight,
#noty_layout__topCenter,
#noty_layout__topLeft,
#noty_layout__top {
  position: fixed;
  margin: 0;
  padding: 0;
  z-index: 9999999;
  transform: translateZ(0) scale(1, 1);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
  filter: blur(0);
  -webkit-filter: blur(0);
  max-width: 90%;
}

#noty_layout__top {
  top: 0;
  left: 5%;
  width: 90%;
}

#noty_layout__topLeft {
  top: 20px;
  left: 20px;
  width: 325px;
}

#noty_layout__topCenter {
  top: 5%;
  left: 50%;
  width: 325px;
  transform: translate(calc(-50% - 0.5px)) translateZ(0) scale(1, 1);
}

#noty_layout__topRight {
  top: 20px;
  right: 20px;
  width: 325px;
}

#noty_layout__bottom {
  bottom: 0;
  left: 5%;
  width: 90%;
}

#noty_layout__bottomLeft {
  bottom: 20px;
  left: 20px;
  width: 325px;
}

#noty_layout__bottomCenter {
  bottom: 5%;
  left: 50%;
  width: 325px;
  transform: translate(calc(-50% - 0.5px)) translateZ(0) scale(1, 1);
}

#noty_layout__bottomRight {
  bottom: 20px;
  right: 20px;
  width: 325px;
}

#noty_layout__center {
  top: 50%;
  left: 50%;
  width: 325px;
  transform: translate(calc(-50% - 0.5px), calc(-50% - 0.5px)) translateZ(0) scale(1, 1);
}

#noty_layout__centerLeft {
  top: 50%;
  left: 20px;
  width: 325px;
  transform: translate(0, calc(-50% - 0.5px)) translateZ(0) scale(1, 1);
}

#noty_layout__centerRight {
  top: 50%;
  right: 20px;
  width: 325px;
  transform: translate(0, calc(-50% - 0.5px)) translateZ(0) scale(1, 1);
}

.noty_progressbar {
  display: none;
}

.noty_has_timeout.noty_has_progressbar .noty_progressbar {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 3px;
  width: 100%;
  background-color: #646464;
  opacity: 0.2;
  filter: alpha(opacity=10);
}

.noty_bar {
  -webkit-backface-visibility: hidden;
  transform: translate(0, 0) scale(1, 1);
  -webkit-font-smoothing: subpixel-antialiased;
  overflow: hidden;
}

.noty_effects_open {
  opacity: 0;
  transform: translate(50%);
  -webkit-animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
          animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.noty_effects_close {
  -webkit-animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
          animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

.noty_fix_effects_height {
  -webkit-animation: noty_anim_height 75ms ease-out;
          animation: noty_anim_height 75ms ease-out;
}

.noty_close_with_click {
  cursor: pointer;
}

.noty_close_button {
  position: absolute;
  top: 2px;
  right: 2px;
  font-weight: bold;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  background-color: rgba(0, 0, 0, 0.05);
  border-radius: 2px;
  cursor: pointer;
  transition: all 0.2s ease-out;
}

.noty_close_button:hover {
  background-color: rgba(0, 0, 0, 0.1);
}

.noty_modal {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 10000;
  opacity: 0.3;
  left: 0;
  top: 0;
}

.noty_modal.noty_modal_open {
  opacity: 0;
  -webkit-animation: noty_modal_in 0.3s ease-out;
          animation: noty_modal_in 0.3s ease-out;
}

.noty_modal.noty_modal_close {
  -webkit-animation: noty_modal_out 0.3s ease-out;
          animation: noty_modal_out 0.3s ease-out;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}

@-webkit-keyframes noty_modal_in {
  100% {
    opacity: 0.3;
  }
}

@keyframes noty_modal_in {
  100% {
    opacity: 0.3;
  }
}

@-webkit-keyframes noty_modal_out {
  100% {
    opacity: 0;
  }
}

@keyframes noty_modal_out {
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes noty_anim_in {
  100% {
    transform: translate(0);
    opacity: 1;
  }
}

@keyframes noty_anim_in {
  100% {
    transform: translate(0);
    opacity: 1;
  }
}

@-webkit-keyframes noty_anim_out {
  100% {
    transform: translate(50%);
    opacity: 0;
  }
}

@keyframes noty_anim_out {
  100% {
    transform: translate(50%);
    opacity: 0;
  }
}

@-webkit-keyframes noty_anim_height {
  100% {
    height: 0;
  }
}

@keyframes noty_anim_height {
  100% {
    height: 0;
  }
}

.noty_theme__sunset.noty_bar {
  margin: 4px 0;
  overflow: hidden;
  border-radius: 2px;
  position: relative;
}

.noty_theme__sunset.noty_bar .noty_body {
  padding: 10px;
  font-size: 14px;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}

.noty_theme__sunset.noty_bar .noty_buttons {
  padding: 10px;
}

.noty_theme__sunset.noty_type__alert,
.noty_theme__sunset.noty_type__notification {
  background-color: #073B4C;
  color: #fff;
}

.noty_theme__sunset.noty_type__alert .noty_progressbar,
.noty_theme__sunset.noty_type__notification .noty_progressbar {
  background-color: #fff;
}

.noty_theme__sunset.noty_type__warning {
  background-color: #FFD166;
  color: #fff;
}

.noty_theme__sunset.noty_type__error {
  background-color: #EF476F;
  color: #fff;
}

.noty_theme__sunset.noty_type__error .noty_progressbar {
  opacity: 0.4;
}

.noty_theme__sunset.noty_type__info,
.noty_theme__sunset.noty_type__information {
  background-color: #118AB2;
  color: #fff;
}

.noty_theme__sunset.noty_type__info .noty_progressbar,
.noty_theme__sunset.noty_type__information .noty_progressbar {
  opacity: 0.6;
}

.noty_theme__sunset.noty_type__success {
  background-color: #06D6A0;
  color: #fff;
}

html {
  background: #f9f9f9;
}

body {
  font-family: "Poppins", sans-serif;
  font-size: 0.8rem;
  background: #ffffff;
  color: #000;
  font-weight: 400;
  max-width: 768px;
}

body.show {
  overflow: hidden;
}

body.show::before {
  content: " ";
  position: absolute;
  transition: all 0.5s ease-in-out !important;
  background: rgba(0, 0, 0, 0.75);
  position: fixed;
  top: 0;
  z-index: 8;
  left: 0;
  width: 100%;
  height: 100%;
}

body img {
  -o-object-fit: cover;
     object-fit: cover;
}

body a {
  color: #000;
  cursor: pointer;
  transition: all 0.5s ease-in-out !important;
}

body a svg {
  transition: all 0.5s ease-in-out !important;
}

body a:hover {
  text-decoration: none;
  color: #FF5C5C;
}

body a:hover svg {
  fill: #FF5C5C;
}

body a.more {
  color: #000;
}

body a.more:hover {
  color: #FF5C5C;
}

body .btn {
  height: 48px;
  border: none;
}

body .btn-primary {
  background-color: #FF5C5C;
}

body .btn-primary span {
  color: #ffffff !important;
}

body .btn-primary:hover {
  background-color: #86899D;
}

body .btn-black {
  background-color: #000;
}

body .btn-black span {
  color: #ffffff;
}

body input::-moz-placeholder {
  font-size: 0.8rem;
}

body input::placeholder {
  font-size: 0.8rem;
}

body .nav {
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}

body .nav button {
  background: transparent;
  color: #86899D;
}

body .nav button:focus {
  outline: none;
  box-shadow: none;
}

body .nav button.active {
  font-weight: 600;
}

body .nav button.active::before {
  content: " ";
  position: absolute;
  transition: all 0.4s ease-in-out !important;
  background: #000;
  height: 4px;
  bottom: 0;
  width: 50%;
  left: 25%;
}

body .title {
  font-weight: 600;
  font-size: 1rem;
}

body .product > div:not(.border-0) {
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  border-radius: 10px;
}

body .product .image img {
  border-radius: 8px;
}

body .product .image .bookmark {
  width: 30px;
  height: 30px;
  background: #ffffff;
  border-radius: 50px;
  top: 8px;
  right: 8px;
  cursor: pointer;
}

body .product .image .bookmark:hover,
body .product .image .bookmark.active {
  background-color: #000;
}

body .product .image .bookmark:hover svg,
body .product .image .bookmark.active svg {
  fill: #ffffff;
}

body .product .image .tag {
  background: #FFF0ED;
  border-radius: 5px;
  bottom: 8px;
  right: 8px;
}

body .product .image .tag span {
  font-size: 0.7rem;
}

body .product .content label {
  font-weight: 700;
  font-size: 0.8rem;
}

body .product .content span {
  font-size: 0.7rem;
  color: #86899D;
  line-height: 0.9rem;
}

body .page-single {
  background-color: #f6f6f6;
  transition: all 0.4s ease-in-out !important;
  top: 0;
  z-index: 9;
  transform: translateX(200%);
  max-width: 768px;
}

body .page-single.show {
  transform: translateX(0%);
}

body .page-pop {
  z-index: 9;
  transition: all 0.4s ease-in-out !important;
  top: 100%;
  left: 0;
}

body .page-pop.show {
  transform: translateY(-100%);
}

body .page-pop h6 {
  font-weight: 700;
}

body .page-pop .pop-content {
  background: #ffffff;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  max-width: 768px;
  margin: 0 auto !important;
}

body .page-pop .pop-content .pop-back {
  height: 6px;
  width: 80px;
  background-color: #D9D9D9;
  border-radius: 25px;
}

body .fixed-content {
  margin-top: 70px !important;
}

.page-loader {
  background: rgba(255, 255, 255, 0.9);
  z-index: 999;
  left: 0;
}

.page-loader .loader svg {
  width: 90px;
  height: 90px;
}

.page-loader .loader svg circle {
  stroke: #000;
}

.page-loader .loader svg line {
  stroke: #e80e0e;
}

.page-auth .nav-tabs li {
  min-width: 125px;
}

.page-auth .nav-tabs li .nav-link {
  border-radius: 50px;
  border: 1px solid #000;
}

.page-auth .nav-tabs li .nav-link.active,
.page-auth .nav-tabs li .nav-link:hover {
  background-color: #000;
  color: #ffffff;
}

.page-auth .forgot-password {
  font-size: 0.7rem;
}

.page-auth .btn-primary {
  background: #FF5C5C;
}

.page-auth label.error {
  color: #e80e0e;
  font-size: 0.7rem;
}

.page-auth .spinner-border {
  width: 1em;
  height: 1em;
}

.idx-top-section input {
  border-radius: 25px;
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.4);
}

.idx-top-section img.search {
  width: 20px;
  height: 20px;
  top: 10px;
  left: 15px;
}

.idx-top-section a span {
  left: 12px;
  text-align: center;
  font-size: 0.6rem;
  top: 6px;
}

.idx-credit-point {
  background-image: url("/images/custom_ui/index/credit-point.png");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: -webkit-image-set(url("/images/custom_ui/index/credit-point.webp") 1x);
  border-radius: 10px;
}

.idx-credit-point img {
  width: 30px;
  height: 30px;
}

.idx-credit-point .credit,
.idx-credit-point .point {
  width: calc(100% - 30px);
}

.idx-credit-point .credit label,
.idx-credit-point .point label {
  font-size: 1.6rem;
  font-weight: 500;
}

.idx-credit-point .credit span,
.idx-credit-point .point span {
  font-size: 0.7rem;
}

.idx-credit-point .rank label {
  font-weight: 500;
  font-size: 1.6rem;
}

.idx-credit-point .rank span {
  font-size: 0.8rem;
}

.idx-credit-point a {
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 8px;
}

.idx-action-button a .icon {
  width: 60px;
  height: 60px;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 15px;
}

.idx-action-button a span {
  color: #86899D;
  font-size: 0.7rem;
}

.idx-banner .bannerSwiper {
  border-radius: 10px;
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
}

.idx-banner .swiper-pagination {
  bottom: -25px;
  z-index: 1;
}

.idx-banner .swiper-pagination-bullet-active {
  background: #000;
  width: 30px;
  border-radius: 25px;
}

.idx-category .flex-nowrap {
  overflow-x: scroll;
}

.idx-category .flex-nowrap .tag {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.6);
  border-radius: 25px;
  height: 40px;
  white-space: nowrap;
}

.idx-category .flex-nowrap .tag span {
  color: #000;
}

.idx-category .flex-nowrap .tag:hover,
.idx-category .flex-nowrap .tag.active {
  background: #FF5C5C;
  box-shadow: none;
}

.idx-category .flex-nowrap .tag:hover span,
.idx-category .flex-nowrap .tag.active span {
  color: #ffffff;
}

.pwa {
  background: #f6f6f6;
  border-radius: 10px;
}

.pwa label {
  font-size: 1.4rem;
  font-weight: 600;
}

.pwa #installBtn {
  border: none;
  background-color: #000;
  border-radius: 25px;
}

.bottom-nav {
  height: 70px;
  background-color: #ffffff;
  bottom: 0;
  box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4);
  z-index: 2;
  max-width: 768px;
}

.bottom-nav span {
  font-size: 0.7rem;
  color: #86899D;
}

.bottom-nav .message .number-badge {
  width: 20px;
  height: 20px;
  border-radius: 50px;
  background-color: #e80e0e;
  top: -10px;
  right: 25%;
}

@media screen and (max-width: 768px) {
  .bottom-nav .message .number-badge {
    right: 10%;
  }
}

.bottom-nav .message .number-badge span {
  color: #ffffff;
}

.top-nav {
  height: 70px;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 2;
  background: #ffffff;
  max-width: 768px;
}

.top-nav svg {
  font-size: 1.2rem;
}

.page-profile h5 {
  font-size: 1rem;
}

.page-profile .pro-name h6 {
  color: #86899D;
  font-size: 0.8rem;
}

.page-profile .pro-redeem a {
  border: 1px solid #D9D9D9;
  border-radius: 10px;
}

.page-profile .pro-redeem a label {
  font-weight: 700;
}

.page-profile .pro-redeem a span {
  font-size: 0.7rem;
}

.page-profile .pro-list h6 {
  width: calc(100% - 24px);
  font-weight: 300;
  font-size: 0.8rem;
}

.page-my-purchase .nav .nav-item .nav-link.active {
  background-color: transparent;
}

.page-settings .listing > div,
.page-language .listing > div,
.page-account-security .listing > div,
.page-secure-pin .listing > div,
.page-account-management .listing > div {
  background: #ffffff;
  border-radius: 10px;
}

.page-settings .listing > div a:not(:last-child)::before,
.page-language .listing > div a:not(:last-child)::before,
.page-account-security .listing > div a:not(:last-child)::before,
.page-secure-pin .listing > div a:not(:last-child)::before,
.page-account-management .listing > div a:not(:last-child)::before {
  content: " ";
  position: absolute;
  border-bottom: 1px solid #F1F1F1;
  width: 90%;
  bottom: 0;
}

.page-refer-friends .ref-cover {
  background-image: url("/images/custom_ui/profile/refer_friends.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: -webkit-image-set(url("/images/custom_ui/profile/refer_friends.webp") 1x);
  height: 400px;
}

.page-refer-friends .ref-cover a.title {
  height: 70px;
  top: 0;
}

.page-refer-friends .ref-cover a.title svg {
  fill: #ffffff;
  font-size: 1.2rem;
}

.page-refer-friends .ref-cover a img {
  filter: invert(100%) sepia(99%) saturate(1%) hue-rotate(20deg) brightness(104%) contrast(100%);
}

.page-refer-friends .ref-content .how-works,
.page-refer-friends .ref-content .invite-history,
.page-refer-friends .ref-content .terms-conditions {
  border: 1px solid #F1F1F1;
  border-radius: 10px;
}

.page-refer-friends .ref-content .how-works span,
.page-refer-friends .ref-content .invite-history span,
.page-refer-friends .ref-content .terms-conditions span {
  width: calc(100% - 24px);
  line-height: 1.1rem;
}

.page-refer-friends .ref-content .how-works span b,
.page-refer-friends .ref-content .invite-history span b,
.page-refer-friends .ref-content .terms-conditions span b {
  font-weight: 700;
}

.page-refer-friends .ref-content .invite-history .col-6:first-child {
  border-right: 1px solid #F1F1F1;
}

.page-refer-friends .ref-content .invite-history .statistic {
  width: calc(100% - 30px);
}

.page-refer-friends .ref-content .invite-history .statistic b {
  font-size: 1.6rem;
  font-weight: 700;
}

.page-refer-friends .ref-content .invite-history img {
  filter: invert(66%) sepia(0%) saturate(4405%) hue-rotate(269deg) brightness(81%) contrast(113%);
}

.page-show-qrcode .qr-code {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 8px;
}

.page-show-qrcode .qr-code img,
.page-show-qrcode .qr-code canvas {
  width: 200px;
  height: 200px;
}

.page-invite-now .share-now a .icon {
  width: 60px;
  height: 60px;
  border-radius: 50px;
  border: 1px solid #D9D9D9;
}

.page-invite-now .share-now a span {
  font-size: 0.8rem;
}

.page-saved .saved-listing a {
  border-top: 1px solid #F1F1F1;
  border-bottom: 1px solid #F1F1F1;
}

.page-saved .saved-listing a .saved-content {
  width: calc(100% - 80px);
}

.page-saved .saved-listing a .saved-content h6 {
  color: #000;
}

.page-saved .saved-listing a .saved-content span {
  color: #86899D;
  font-size: 0.8rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-saved .saved-listing a .saved-content .tag {
  background: #FFF0ED;
  border-radius: 5px;
}

.page-my-address .address-fields form .form-group label {
  background: #ffffff;
  left: 10px;
  font-weight: 300;
  color: #86899D;
}

.page-my-address .address-fields form .form-group input {
  height: 48px;
  border-radius: 8px;
  border: 2px solid #000;
}

.page-my-address .address-fields form .btn {
  border-radius: 8px;
}

.page-my-address .address-fields .make-appointment {
  max-width: 768px;
}

.page-redemption .redemption-listing {
  border-top: 1px solid #F1F1F1;
}

.page-redemption .redemption-listing a.sort {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.65);
  border-radius: 25px;
}

.page-redemption .redemption-listing a.sort h6 {
  font-size: 0.8rem;
}

.page-redemption .redemption-listing a:not(.sort) {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 10px;
}

.page-redemption .redemption-listing a:not(.sort) .redemptions-content {
  width: calc(100% - 140px);
}

.page-redemption .redemption-listing a:not(.sort) .redemptions-content h6 {
  color: #000;
  font-size: 0.8rem;
}

.page-redemption .redemption-listing a:not(.sort) .redemptions-content span {
  color: #86899D;
  font-size: 0.7rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-redemption .redemption-listing a:not(.sort) .redemptions-content .tag {
  background: #FFF0ED;
  border-radius: 5px;
}

.page-redemption .redemption-listing a:not(.sort) .redemptions-arrow {
  width: 60px;
}

.page-redemption .redemption-listing a:not(.sort).used h6 {
  color: #86899D;
}

.page-redemption .redemption-listing a:not(.sort).used img {
  top: 0;
  right: 15px;
}

.page-redemption .redemption-listing a:not(.sort).used .used-tag {
  z-index: 1;
  transform: rotate(90deg);
  top: 20px;
  right: 13px;
  font-weight: 500;
}

.page-redemption-details .redemption-cover {
  height: 230px;
  background-position: center;
  background-size: cover;
}

.page-redemption-details .redemption-cover::before {
  content: " ";
  position: absolute;
  background-color: rgba(0, 0, 0, 0.65);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.page-redemption-details .redemption-cover a.title {
  height: 70px;
  top: 0;
}

.page-redemption-details .redemption-cover a.title svg {
  fill: #ffffff;
  font-size: 1.2rem;
}

.page-redemption-details .redemption-details {
  top: 130px;
}

.page-redemption-details .redemption-details .box {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 8px;
  background-color: #ffffff;
}

.page-redemption-details .redemption-details .box span:not(.btn-text) {
  color: #86899D;
  font-size: 0.8rem;
}

.page-redemption-details .redemption-details .box label {
  font-size: 1.2rem;
  font-weight: 500;
}

.page-redemption-details .redemption-details .box hr {
  border-style: dashed;
}

.page-redemption-details .redemption-details .content label {
  font-weight: 600;
  font-size: 1rem;
}

.page-my-redemption-details .details label {
  font-weight: 600;
  font-size: 1rem;
}

.page-my-redemption-details .details .qr-code canvas,
.page-my-redemption-details .details .qr-code img {
  width: 180px;
  height: 180px;
}

.page-membership-details .membership-cover {
  height: 230px;
  background-position: center;
  background-size: cover;
}

.page-membership-details .membership-cover a.title {
  width: 40px;
  height: 40px;
  top: 15px;
  left: 15px;
}

.page-membership-details .membership-cover a.title svg {
  fill: #ffffff;
}

.page-membership-details .membership-details {
  top: 120px;
}

.page-membership-details .membership-details .member-card {
  background: var(--background);
  height: 200px;
  border: 1px solid #ffffff;
  border-radius: 10px;
}

.page-membership-details .membership-details .member-card .rank {
  font-weight: 500;
}

.page-membership-details .membership-details .member-card .card-number {
  font-size: 1.2rem;
}

.page-membership-details .membership-details .member-card img {
  filter: invert(100%) sepia(99%) saturate(1%) hue-rotate(20deg) brightness(104%) contrast(100%);
}

.page-membership-details .membership-details .rank-details {
  color: #86899D;
  font-size: 0.7rem;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li.is-active ~ li:before,
.page-membership-details .membership-details .rank-progress .multi-steps > li.is-active:before {
  font-family: inherit;
  font-weight: 700;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li.is-active ~ li:after,
.page-membership-details .membership-details .rank-progress .multi-steps > li.is-active:after {
  background-color: #ededed;
}

.page-membership-details .membership-details .rank-progress .multi-steps {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li {
  counter-increment: stepNum;
  text-align: center;
  display: table-cell;
  position: relative;
  color: #000;
  font-size: 0.6rem;
  line-height: 0.7rem;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:before {
  content: "";
  display: block;
  margin: 0 auto 4px;
  background-color: #fff;
  width: 12px;
  height: 12px;
  line-height: 32px;
  text-align: center;
  font-weight: bold;
  border-width: 2px;
  border-style: solid;
  border-color: transparent;
  border-radius: 50%;
  z-index: 2;
  position: relative;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:first-child::before {
  background-color: #a5a5a5;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:nth-of-type(2)::before {
  background-color: #904A00;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:nth-of-type(3)::before {
  background-color: #7C7C7C;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:nth-of-type(4)::before {
  background-color: #DB9D0C;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:nth-of-type(5)::before {
  background-color: #E5E4E2;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:nth-of-type(6)::before {
  background-color: #b9f2ff;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:after {
  content: "";
  height: 2px;
  width: 100%;
  background-color: #000;
  position: absolute;
  top: 5px;
  left: 50%;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li:last-child:after {
  display: none;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li.is-active {
  font-weight: 700;
}

.page-membership-details .membership-details .rank-progress .multi-steps > li.is-active ~ li {
  color: #808080;
}

.page-membership-details .membership-details .box {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 8px;
  background-color: #ffffff;
}

.page-membership-details .membership-details .box span {
  color: #86899D;
}

.page-membership-details .membership-details .box label {
  font-size: 1.2rem;
  font-weight: 500;
}

.page-membership-details .membership-details .box hr {
  border-style: dashed;
}

.page-membership-details .membership-details .box .qrcode {
  background-color: #FF5C5C;
  padding: 5px;
  border-radius: 8px;
  width: 34px;
  height: 34px;
}

.page-membership-details .membership-details .box .qrcode img {
  filter: invert(100%) sepia(99%) saturate(1%) hue-rotate(20deg) brightness(104%) contrast(100%);
}

.page-membership-details .membership-details .box .details {
  width: calc(100% - 34px);
}

.page-membership-details .membership-details .box .details label {
  font-weight: 700;
  font-size: 1.4rem;
}

.page-membership-details .membership-details .box .details span {
  font-size: 0.7rem;
}

.page-membership-details .membership-details .box .details span.pay-via {
  color: #000;
  font-size: 0.7rem;
  font-weight: 400;
}

.page-sort .listing > div,
.page-rank-details .listing > div {
  background: #ffffff;
  border-radius: 10px;
}

.page-sort .listing > div a:not(:last-child)::before,
.page-rank-details .listing > div a:not(:last-child)::before {
  content: " ";
  position: absolute;
  border-bottom: 1px solid #F1F1F1;
  width: 100%;
  bottom: 0;
}

.page-sort .listing > div a h6,
.page-rank-details .listing > div a h6 {
  font-weight: 300;
}

.page-sort .listing > div a.checked h6,
.page-rank-details .listing > div a.checked h6 {
  font-weight: 700;
}

.page-sort .listing > div a.checked svg,
.page-rank-details .listing > div a.checked svg {
  font-size: 1.2rem;
}

.page-pay-via .box .pay-via-img,
.page-redeem-qr .box .pay-via-img {
  width: 60px;
  height: 60px;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 50px;
  background: #f6f6f6;
  left: calc(50% - 30px);
  z-index: 1;
  top: 20px;
}

.page-pay-via .box .show-qr,
.page-redeem-qr .box .show-qr {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);
}

.page-pay-via .box .show-qr .qr-code canvas,
.page-pay-via .box .show-qr .qr-code img,
.page-redeem-qr .box .show-qr .qr-code canvas,
.page-redeem-qr .box .show-qr .qr-code img {
  width: 200px;
  height: 200px;
}

.page-pay-via .box .show-qr label,
.page-redeem-qr .box .show-qr label {
  font-weight: 700;
  font-size: 1.1rem;
}

.history-list {
  background-color: #ffffff;
}

.history-list a {
  border-top: 1px solid #F1F1F1;
  border-bottom: 1px solid #F1F1F1;
}

.history-list a:first-child {
  border-top: none;
}

.history-list a .content {
  width: calc(100% - 30px);
  font-weight: 300;
  font-size: 1rem;
}

.history-list a .content h6 {
  font-weight: 400;
  font-size: 0.8rem;
}

.history-list a .content span {
  color: #86899D;
  font-size: 0.7rem;
}

.history-list a .content .title {
  font-weight: 600;
}

.page-appointment-listing a.title,
.page-appointment-history a.title {
  right: 0;
}

.page-appointment-listing a.title.back,
.page-appointment-history a.title.back {
  left: 0;
}

.page-appointment-listing .appointment-list a,
.page-appointment-listing .appointment-history a,
.page-appointment-history .appointment-list a,
.page-appointment-history .appointment-history a {
  border-top: 1px solid #F1F1F1;
  border-bottom: 1px solid #F1F1F1;
}

.page-appointment-listing .appointment-list a .content,
.page-appointment-listing .appointment-history a .content,
.page-appointment-history .appointment-list a .content,
.page-appointment-history .appointment-history a .content {
  width: calc(100% - 30px);
  font-weight: 300;
  font-size: 1rem;
}

.page-appointment-listing .appointment-list a .content h6,
.page-appointment-listing .appointment-history a .content h6,
.page-appointment-history .appointment-list a .content h6,
.page-appointment-history .appointment-history a .content h6 {
  font-weight: 400;
  font-size: 0.9rem;
}

.page-appointment-listing .appointment-list a .content span,
.page-appointment-listing .appointment-history a .content span,
.page-appointment-history .appointment-list a .content span,
.page-appointment-history .appointment-history a .content span {
  color: #86899D;
  font-size: 0.8rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-appointment-listing .appointment-list a .radio,
.page-appointment-listing .appointment-history a .radio,
.page-appointment-history .appointment-list a .radio,
.page-appointment-history .appointment-history a .radio {
  width: 24px;
  height: 24px;
  border: 0.48px solid #8F8F8F;
  border-radius: 50px;
}

.page-appointment-listing .appointment-list a.checked .circle,
.page-appointment-listing .appointment-history a.checked .circle,
.page-appointment-history .appointment-list a.checked .circle,
.page-appointment-history .appointment-history a.checked .circle {
  background: #000;
  border-radius: 50px;
  width: 16px;
  height: 16px;
}

.page-appointment-listing .make-appointment,
.page-appointment-history .make-appointment {
  background: #ffffff;
  bottom: 90px;
  max-width: 768px;
}

.page-appointment-form {
  background-color: #ffffff !important;
}

.page-appointment-form a.title {
  left: 0;
}

.page-appointment-form .form {
  background-color: #f6f6f6;
}

.page-appointment-form .form form .form-group label {
  background: #f6f6f6;
  left: 10px;
  font-weight: 300;
  color: #86899D;
}

.page-appointment-form .form form .form-group input {
  height: 48px;
  border-radius: 8px;
  border: 2px solid #000;
  background: #f6f6f6;
}

.page-appointment-form .form form .form-group textarea {
  border-radius: 8px;
  border: 2px solid #000;
  background: #f6f6f6;
  resize: none;
}

.page-appointment-form .form form .btn {
  border-radius: 8px;
}

.page-appointment-form .form form .flatpickr-calendar {
  width: 100%;
}

.page-appointment-form .form form .flatpickr-calendar .flatpickr-rContainer {
  margin: 0 auto;
}

.page-appointment-form .form form .flatpickr-calendar .flatpickr-day {
  font-size: 1rem;
}

.page-service .listing > div {
  background: #ffffff;
  border-radius: 10px;
}

.page-service .listing > div a:not(:last-child)::before {
  content: " ";
  position: absolute;
  border-bottom: 1px solid #F1F1F1;
  width: 100%;
  bottom: 0;
}

.page-service .listing > div a label {
  font-weight: 300;
}

.page-service .listing > div a.checked label {
  font-weight: 700;
}

.page-service .listing > div a.checked svg {
  font-size: 1.2rem;
}

.page-appointment-details .details label {
  font-weight: 600;
  font-size: 1rem;
}

.page-appointment-details .cancel-appointment {
  border-top: 1px solid rgba(0, 0, 0, 0.4);
}

.page-message .top-nav img,
.page-chat .top-nav img {
  border-radius: 50px;
}

.page-message .top-nav a.title,
.page-chat .top-nav a.title {
  left: 0;
}

.page-message .message-content,
.page-chat .message-content {
  background-color: #f6f6f6;
  min-height: calc(100vh - 70px);
}

.page-message .message-content .date,
.page-chat .message-content .date {
  box-shadow: 0px 0.5px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 8px;
  font-size: 0.8rem;
  background-color: #ffffff;
}

.page-message .message-content .promotion > div,
.page-message .message-content .order-details > div,
.page-chat .message-content .promotion > div,
.page-chat .message-content .order-details > div {
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 10px;
}

.page-message .message-content .promotion > div img,
.page-message .message-content .order-details > div img,
.page-chat .message-content .promotion > div img,
.page-chat .message-content .order-details > div img {
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}

.page-message .message-content .promotion > div img.product,
.page-message .message-content .order-details > div img.product,
.page-chat .message-content .promotion > div img.product,
.page-chat .message-content .order-details > div img.product {
  border-radius: 50px;
}

.page-message .message-content .promotion > div a,
.page-message .message-content .order-details > div a,
.page-chat .message-content .promotion > div a,
.page-chat .message-content .order-details > div a {
  border-radius: 25px;
}

.page-message .message-content .promotion > div a.btn-black,
.page-message .message-content .order-details > div a.btn-black,
.page-chat .message-content .promotion > div a.btn-black,
.page-chat .message-content .order-details > div a.btn-black {
  border-radius: 10px;
}

.page-message .message-content .promotion > div .product-details,
.page-message .message-content .order-details > div .product-details,
.page-chat .message-content .promotion > div .product-details,
.page-chat .message-content .order-details > div .product-details {
  width: calc(100% - 50px);
}

.page-message .message-content .promotion > div .product-details label,
.page-message .message-content .order-details > div .product-details label,
.page-chat .message-content .promotion > div .product-details label,
.page-chat .message-content .order-details > div .product-details label {
  font-size: 1rem;
}

.page-message .message-content label,
.page-chat .message-content label {
  font-size: 1.2rem;
  font-weight: 700;
}

.page-message .message-content span.category,
.page-message .message-content span.time,
.page-chat .message-content span.category,
.page-chat .message-content span.time {
  color: #86899D;
  font-size: 0.8rem;
}

.page-message .message-content span b,
.page-chat .message-content span b {
  font-weight: 700;
}

.page-message .message-content .message-chat,
.page-chat .message-content .message-chat {
  background-color: #FF5C5C;
  border-radius: 10px;
  width: 60px;
  height: 60px;
  right: 10px;
  bottom: 90px;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
}

.page-message .message-content .message-chat img,
.page-chat .message-content .message-chat img {
  filter: invert(100%) sepia(99%) saturate(1%) hue-rotate(20deg) brightness(104%) contrast(100%);
}

.page-message .message-content .chat-box > div,
.page-chat .message-content .chat-box > div {
  max-width: 70%;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.4);
}

.page-message .message-content .chat-box > div.left,
.page-chat .message-content .chat-box > div.left {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
  background-color: #ffffff;
}

.page-message .message-content .chat-box > div.right,
.page-chat .message-content .chat-box > div.right {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  background-color: #FFD2D2;
}

.page-message .message-content .chat-input,
.page-chat .message-content .chat-input {
  background-color: #ffffff;
  bottom: 0;
  height: 60px;
  max-width: 768px;
}

.page-message .message-content .chat-input a,
.page-chat .message-content .chat-input a {
  width: 60px;
}

.page-message .message-content .chat-input input,
.page-chat .message-content .chat-input input {
  width: calc(100% - 120px);
  height: 60px;
}

.page-reward .top-nav {
  box-shadow: none;
}

.page-reward a.sort {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.65);
  border-radius: 25px;
}

.page-reward a.sort h6 {
  font-size: 0.8rem;
}

.page-reward .voucher-image .content {
  min-height: 80px;
}

.page-reward-details .top-nav {
  box-shadow: none;
}

.page-reward-details .redeem-now {
  background: #ffffff;
  bottom: 0;
}

.page-my-rewards-details .details label {
  font-weight: 600;
  font-size: 1rem;
}

.page-my-rewards-details .details .qr-code canvas,
.page-my-rewards-details .details .qr-code img {
  width: 160px;
  height: 160px;
}

.page-my-rewards-details .details .input-group .input-group-append {
  right: 0;
  top: 8px;
}

.page-my-rewards-details .details .input-group .input-group-text,
.page-my-rewards-details .details .input-group input {
  border: none;
  background-color: transparent;
  font-size: 1rem;
}

.page-my-rewards-details .details .input-group input {
  font-weight: 600;
}

.voucher-image .image,
.voucher-image .content {
  border-radius: 15px;
  box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.4);
  overflow: hidden;
  flex-direction: column;
}

.voucher-image .image img,
.voucher-image .content img {
  border-radius: 15px;
}

.voucher-image .image .voucher-left,
.voucher-image .image .voucher-right,
.voucher-image .content .voucher-left,
.voucher-image .content .voucher-right {
  top: 0;
  bottom: 0;
  z-index: 1;
}

.voucher-image .image .voucher-left::before,
.voucher-image .image .voucher-right::before,
.voucher-image .content .voucher-left::before,
.voucher-image .content .voucher-right::before {
  content: " ";
  position: absolute;
  width: 30px;
  height: 30px;
  background-color: #ffffff;
  border-radius: 50%;
  z-index: 1;
  box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.4);
}

.voucher-image .image {
  overflow: hidden;
}

.voucher-image .image::before {
  content: " ";
  position: absolute;
  border: 3px solid #95989a;
  width: 100%;
  height: 4px;
  bottom: -4px;
  border-style: dashed;
}

.voucher-image .image .voucher-left {
  bottom: -15px;
  left: 0;
}

.voucher-image .image .voucher-right {
  bottom: -15px;
  right: 0;
}

.voucher-image .content {
  min-height: 150px;
}

.voucher-image .content .voucher-left,
.voucher-image .content .voucher-right {
  align-items: start;
}

.voucher-image .content .voucher-left {
  top: -15px;
  left: 0;
}

.voucher-image .content .voucher-right {
  top: -15px;
  right: 0;
}

.voucher-image .content span {
  color: #86899D;
  font-size: 0.7rem;
}

.voucher-image .content b {
  font-weight: 400;
  font-size: 0.7rem;
}

.voucher-image .content h6 {
  font-size: 0.8rem;
}

.voucher-image .content .input-group {
  border: 1px dashed #000;
}

.voucher-image .content .input-group .input-group-text,
.voucher-image .content .input-group input {
  border: none;
  background-color: transparent;
  font-size: 1rem;
}

.voucher-image .content .input-group input {
  font-weight: 600;
}

.voucher-text {
  min-height: 120px;
}

.voucher-text .type,
.voucher-text .info {
  border-radius: 10px;
  box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.4);
  overflow: hidden;
}

.voucher-text .type .voucher-left,
.voucher-text .type .voucher-right,
.voucher-text .info .voucher-left,
.voucher-text .info .voucher-right {
  top: 0;
  bottom: 0;
  z-index: 1;
}

.voucher-text .type .voucher-left::before,
.voucher-text .type .voucher-right::before,
.voucher-text .info .voucher-left::before,
.voucher-text .info .voucher-right::before {
  content: " ";
  position: absolute;
  width: 20px;
  height: 20px;
  background-color: #ffffff;
  border-radius: 50%;
  z-index: 1;
  box-shadow: inset 0px 0px 4px 0px rgba(0, 0, 0, 0.4);
}

.voucher-text .type {
  width: 50px;
  background-color: #FF5C5C;
}

.voucher-text .type label {
  color: #ffffff !important;
  z-index: 1;
  transform: rotate(270deg);
  font-size: 1.1rem;
  font-weight: 500;
}

.voucher-text .type .voucher-left {
  top: -10px;
  right: 0;
}

.voucher-text .type .voucher-right {
  bottom: -10px;
  right: 0;
}

.voucher-text .info {
  width: calc(100% - 50px);
}

.voucher-text .info label {
  font-weight: 700;
  font-size: 1rem;
}

.voucher-text .info span {
  font-size: 0.7rem;
}

.voucher-text .info .days {
  bottom: 15px;
  right: 15px;
}

.voucher-text .info .days span {
  font-size: 0.7rem;
}

.voucher-text .info .days svg {
  font-size: 0.6rem;
}

.voucher-text .info .voucher-left {
  top: -10px;
  left: 0;
}

.voucher-text .info .voucher-right {
  bottom: -10px;
  left: 0;
}

.voucher-text.used label,
.voucher-text.used span {
  color: #86899D;
}

.voucher-text.used img {
  top: 0;
  right: 15px;
}

.voucher-text.used .used-tag {
  z-index: 1;
  transform: rotate(90deg);
  top: 30px;
  right: 8px;
  font-weight: 500;
}

.page-eshop .top-nav .cart {
  right: 15px;
}

.page-eshop .top-nav .cart span {
  right: 7px;
  top: 6px;
  font-size: 0.7rem;
}

.page-eshop .search input {
  height: 50px;
  border-radius: 50px;
  border-left: 0;
}

.page-eshop .search input:focus {
  outline: none;
  box-shadow: none;
  border-color: #ced4da;
}

.page-eshop .search .input-group-text {
  background-color: transparent;
  border-top-left-radius: 50px;
  border-bottom-left-radius: 50px;
  border-right: 0;
}

.page-eshop a.sort {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.65);
  border-radius: 25px;
}

.page-product-details .product-cover {
  background-color: #c4c4c4;
  height: 55vh;
}

.page-product-details .product-cover a.title {
  width: 40px;
  height: 40px;
  background-color: #ffffff;
  border-radius: 50px;
  top: 45px;
  left: 15px;
}

.page-product-details .product-cover a.title svg {
  font-size: 1.2rem;
}

.page-product-details .product-cover a.title.favourite {
  right: 15px;
  left: unset;
}

.page-product-details .product-cover .product-image img {
  height: 55vh;
}

.page-product-details .product-cover .thumbnail {
  bottom: 10px;
}

.page-product-details .product-cover .thumbnail a {
  background-color: #ffffff;
  height: 70px;
  width: 70px;
  border-radius: 15px;
  border: 2px solid transparent;
}

.page-product-details .product-cover .thumbnail a.active {
  border: 2px solid #000;
}

.page-product-details .product-content h5 {
  font-weight: 600;
}

.page-product-details .product-content .tag.category {
  background: #FFF0ED;
  border-radius: 5px;
  bottom: 8px;
  right: 8px;
}

.page-product-details .product-content .tag.category span {
  font-size: 0.7rem;
}

.page-product-details .product-content .tag.size {
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.6);
  border-radius: 25px;
  height: 40px;
  white-space: nowrap;
}

.page-product-details .product-content .tag.size span {
  color: #000;
}

.page-product-details .product-content .tag.size:hover,
.page-product-details .product-content .tag.size.active {
  background: #FF5C5C;
  box-shadow: none;
}

.page-product-details .product-content .tag.size:hover span,
.page-product-details .product-content .tag.size.active span {
  color: #ffffff;
}

.page-product-details .product-content input {
  width: 20px;
  text-align: center;
  border: none;
  font-weight: 600;
}

.page-product-details .product-content span.description {
  font-size: 0.9rem;
  line-height: 1.3rem;
}

.page-product-details .product-content span.description .morecontent span {
  display: none;
}

.page-product-details .product-content span.description .morelink {
  display: block;
}

.page-product-details .add-cart {
  bottom: 0;
  background-color: #ffffff;
  height: 70px;
  border-top: 1px solid rgba(0, 0, 0, 0.4);
  max-width: 768px;
}

.page-product-details .add-cart .add-cart-info span {
  color: #86899D;
}

.page-product-details .add-cart .add-cart-info label {
  font-size: 1.2rem;
  font-weight: 600;
}

.page-cart .top-nav a.remove {
  right: 10px;
}

.page-cart .top-nav a.remove span {
  font-size: 0.8rem;
}

.page-cart .cart-listing {
  min-height: calc(100vh - 70px);
  background-color: #f6f6f6;
  padding-bottom: 25px;
}

.page-cart .cart-listing .radio {
  position: relative;
  width: 24px;
  height: 24px;
  border-radius: 50px;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.page-cart .cart-listing .radio::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
}

.page-cart .cart-listing .radio.checked .circle {
  background: #000;
  border-radius: 50px;
  width: 16px;
  height: 16px;
}

.page-cart .cart-listing .listing {
  background-color: #ffffff;
}

.page-cart .cart-listing .listing .cart-content {
  width: calc(100% - 24px);
}

.page-cart .cart-listing .listing .cart-content img {
  border-radius: 5px;
}

.page-cart .cart-listing .listing .cart-content h6 {
  font-weight: 400;
  font-size: 0.9rem;
}

.page-cart .cart-listing .listing .cart-content .info {
  width: calc(100% - 80px);
}

.page-cart .cart-listing .listing .cart-content .info .tag {
  background: #FFF0ED;
  border-radius: 5px;
  bottom: 8px;
  right: 8px;
}

.page-cart .cart-listing .listing .cart-content .info .tag span {
  font-size: 0.7rem;
}

.page-cart .cart-listing .listing .cart-content .info span {
  color: #86899D;
  font-size: 0.8rem;
}

.page-cart .cart-listing .listing .cart-content .info span.old-price {
  text-decoration: line-through;
}

.page-cart .cart-listing .listing .cart-content .info label,
.page-cart .cart-listing .listing .cart-content .info b {
  font-size: 0.8rem;
  font-weight: 600;
}

.page-cart .cart-listing .listing .quantity {
  width: calc(100% - 104px);
}

.page-cart .cart-listing .listing .quantity input {
  width: 50px;
  text-align: center;
  border: none;
}

.page-cart .cart-listing .listing .quantity a svg {
  font-size: 1.4rem;
}

.page-cart .cart-listing .checkout {
  bottom: 0;
  background-color: #ffffff;
  height: 70px;
  border-top: 1px solid rgba(0, 0, 0, 0.4);
  max-width: 768px;
}

.page-cart .cart-listing .checkout .checkout-info {
  width: calc(100% - 24px);
}

.page-cart .cart-listing .checkout .checkout-info span {
  color: #86899D;
}

.page-cart .cart-listing .checkout .checkout-info label {
  font-size: 1.2rem;
  font-weight: 600;
}

.page-code {
  height: 250px;
  bottom: 0;
  top: initial;
  transform: translateY(70px);
}

.page-code.show {
  transform: translateY(-70px);
}

.page-code .pop-content {
  bottom: 70px;
  min-height: 250px;
  border-radius: 0;
}

.page-code .pop-content .tab-content span {
  color: #86899D;
}

.page-code .pop-content .tab-content label,
.page-code .pop-content .tab-content b {
  font-weight: 600;
}

.page-code .pop-content .tab-content input {
  font-weight: 600;
}


/*# sourceMappingURL=custom_ui.css.map*/