.clr{ clear:both; }
#carouselExampleCaptions,
#carouselExampleCaptions .carousel-innr,
#carouselExampleCaptions .carousel-inner > .carousel-item {
    overflow: hidden;
}
#carouselExampleCaptions .carousel-inner > .carousel-item.active,
#carouselExampleCaptions .carousel-inner > .carousel-item-next {
    display: flex;
    flex-wrap: nowrap;
}
#carouselExampleCaptions .carousel-inner:before {
    position:absolute;
    top:0;
    bottom: 0;
    right: 100%;
    left: 0;
    content:"";
    display:block;
    background-color: #fff;
    z-index: 2;
}
#carouselExampleCaptions .carousel-inner:after {
    position:absolute;
    top:0;
    bottom:0;
    right: 0;
    left: 100%;
    content:"";
    display:block;
    background-color:#fff;
    z-index: 2;
}

#carouselExampleCaptions .carousel-control-prev {
    z-index: 20;
    left: 0;
    background: #feca0d;
    padding: 0;
    margin: 0;
    top: 50%;
    height: 30px;
    width: 22px;
}

#carouselExampleCaptions .carousel-control-next {
    z-index: 20;
    right: 0;
    background: #feca0d;
    padding: 0;
    margin: 0;
    top: 50%;
    height: 30px;
    width: 22px;
}
#turn { display:none; }
.social-club-button button.btn-primary{ font-size:1rem!important }
.services-bar2{ width:100%; float:left; display: block !important; }
.services-bar2 li{ float:left; }
.upcoming_services button.social-buttons{ font-size:calc(1.05rem + .12vw) !important }
.breadcrumb .breadcrumb-item.breadcrumb-arrow:after{ content: ">"; font-size: 18px;}
.bg-body-inner{background:#fdfcf7 !important;}
.select2-container--default .select2-selection--single {
      height: 38px;
      padding-right: 40px; /* give space for icon */
      border: 1px solid #ced4da;
      border-radius: 0.375rem;
    }

    /* Remove the default Select2 dropdown arrow */
    .select2-container--default .select2-selection--single .select2-selection__arrow {
      display: none;
    }
.select2-container--default .select2-selection--single .select2-selection__rendered{ line-height:1.3 !important }
.select2-container--default .select2-selection--single .select2-selection__clear{ display:none; }
.badge-open{ color:#0C4A21; background:#C4F1D3; }
.upcoming-services-scroll{display: -webkit-box; overflow-x: auto;}
.resend-button button{ font-family:Poppins,Helvetica,sans-serif; }
.resend-button button:hover{ color:black !important; }
.resend-button button:hover i{ color:black !important; }
.listing-page-bg {    background-size: cover;    background-position: center;}
.listing-page-bg:before{content: "";position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0;
    background: radial-gradient(ellipse at center,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.79) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.amenities-hours strong{ color:#a58972; }
.amenities-hours img{filter: brightness(0.1);height: 25px; margin-right: 5px}
.text-new-color1{ color:rgba(124, 78, 43, 1); }
.saving-amount{ color:rgba(12, 74, 33, 1); }
.get_price_box{ margin-top:-240px; margin-bottom:20px }
.table-UI thead{background: #f7f4ec; font-weight: bold; text-transform: uppercase;}
.table-UI thead tr th:first-child {border-top-left-radius: 12px;}
.table-UI thead tr th:last-child {border-top-right-radius: 12px;}
.table-UI thead tr.table-heading th:first-child {border-top-left-radius: 0;border-bottom-left-radius: 12px; }
.table-UI thead tr.table-heading th:last-child {border-top-right-radius: 0;border-bottom-right-radius: 12px; }
.table-UI tr th, .table-UI tr td{ padding:15px !important; }
.table-UI thead tr.table-heading th{ padding-top:0px !important }
.table-UI tbody tr td:first-child {border-radius: 12px 0 0 12px; }
.table-UI tbody tr td:last-child {border-radius: 0 12px 12px 0; }
.table-UI tbody tr td{ box-shadow: 1px 2px 4px -2px rgba(0, 0, 0, 0.05); }
.dialerObjectClass .fa.service-tag{border: 1px solid rgba(124, 78, 43, 1);
    color: rgba(124, 78, 43, 1);}
.booking-detail-01{ background:rgba(247, 244, 234, 1); }
.booking-detail-01 h2{color: rgba(124, 78, 43, 1);}
.booking-detail-02 { border:1px solid rgba(247, 244, 234, 1); }
.font-color-01{ color:rgba(124, 78, 43, 1) }
.upload-doc:before{ content:""; z-index: 2; background: #00000069; top: 0; left: 0; position:absolute; width:100%; height:100%; border-radius:20px 20px 0 0; }
.table-responsive::-webkit-scrollbar {
  height: 8px; /* customize scrollbar height */
}

.table-responsive::-webkit-scrollbar-thumb {
  background-color: #888;
  border-radius: 4px;
}

.table-responsive::-webkit-scrollbar-track {
  background-color: #f1f1f1;
}
.internalheading p.internalheadingp{ color:#7F5738; }
.listing-hover:hover .next-page img {
            transform: rotate(57deg);
        }
.coupon-card {
      display: flex;
      border-radius: 12px;
      overflow: hidden;
      max-width: 420px;
      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
      background: #fff;
    }

    .coupon-left {
      writing-mode: vertical-lr;
      text-orientation: mixed;
    }

    /* Create notch effect */
    .coupon-left::before {
      content: "";
    position: absolute;
    top: 50%;
    left: -30%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background: #fdfcf7;
    border-radius: 50%;
    box-shadow: -2px 0 4px rgba(0, 0, 0, 0.1);
    }

    .coupon-right {
      padding: 20px;
      flex-grow: 1;
    }

.plusminusdiv{ border: 1px solid rgba(124, 78, 43, 1) !important; color:rgba(124, 78, 43, 1) !important; }
.plusminustext{color:rgba(124, 78, 43, 1) !important;}
.boarding-pass-butt{ background:#C4F1D3 !important; }
.boarding-verification{ background:#F1EFC4; }
.internalheading .form-control {
    height: calc(3.75rem + 7px);
    min-height: calc(3.75rem + 7px);
    line-height: 1.25;}
.internalheading .form-floating label{    line-height: 2.3;}
.form-control {
    height: calc(3.75rem + 2px);
    min-height: calc(3.75rem + 2px);
    line-height: 1.25;
}
.discount-amount::after{ content:""; background:red; height:1px; position:absolute; bottom:38%; width:100%; left:0; }

/* (A) WRONG ORIENTATION - SHOW MESSAGE HIDE CONTENT */
@media screen and (orientation:landscape), (min-width:990px) {
  #turn { background: #feca0d;
    height: 100%;
    display: flex;
    align-items: center; }
  #potrait { display:none; }
}
 
/* (B) CORRECT ORIENTATION - SHOW CONTENT HIDE MESSAGE */
@media screen and (orientation:portrait), (min-width:990px) {
  #turn { display:none; }
  #potrait { display:block; }
}

.box-shadow-circle{
    -webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.75);
    box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.75);
}

.tabs-shadow{
-webkit-box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.38);
-moz-box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.38);
box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.38);
}
.tabs-shadow li{flex: auto; text-align: center; margin: 1px 1px 0 !important;}
.tabs-shadow li a{ margin:0 !important; }
.tabs-shadow .active{
     color: #feca0d !important; border: none !important; border-radius: 15px;padding: 0 5px; text-align: center;  
    -webkit-box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.38);
-moz-box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.38);
box-shadow: inset 0px 0px 6px 0px rgba(0,0,0,0.38);
background: #fff !important;
}

.gradient {
    background-image: -webkit-linear-gradient(58deg, #d4c6c6 45%, #faf2f2 0%);
    background-image:    -moz-linear-gradient(58deg, #d4c6c6 45%, #faf2f2 0%);
    background-image:     -ms-linear-gradient(58deg, #d4c6c6 45%, #faf2f2 0%);
}
#animation-demo {
    
    position: relative;
} 

.animated {
    -webkit-animation-duration: 5s;
    animation-duration: 5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}

@-webkit-keyframes flipInX { 
    0% { 
        -webkit-transform: perspective(400px) rotateX(90deg); 
        opacity: 0; 
    } 
    40% { 
        -webkit-transform: perspective(400px) rotateX(-10deg); 
    } 
    70% { 
        -webkit-transform: perspective(400px) rotateX(10deg); 
    } 
    100% { 
        -webkit-transform: perspective(400px) rotateX(0deg); 
        opacity: 1; 
    } 
} 
@keyframes flipInX { 
    0% { 
        transform: perspective(400px) rotateX(90deg); 
        opacity: 0; 
    } 
    40% { 
        transform: perspective(400px) rotateX(-10deg); 
    } 
    70% { 
        transform: perspective(400px) rotateX(10deg); 
    } 
    100% { 
        transform: perspective(400px) rotateX(0deg); 
        opacity: 1; 
    } 
} 
.flipInX { 
    -webkit-backface-visibility: visible !important; 
    -webkit-animation-name: flipInX; 
    backface-visibility: visible !important; 
    animation-name: flipInX; 
}
.carddiv{
    -webkit-box-shadow: 0px 3px 0px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 3px 0px 0px rgba(0,0,0,0.75);
box-shadow: 0px 3px 0px 0px rgba(0,0,0,0.75);
}
.cardimg{
    -webkit-box-shadow: 0px 26px 31px -11px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 26px 31px -11px rgba(0,0,0,0.75);
box-shadow: 0px 26px 31px -11px rgba(0,0,0,0.75); 
}

.checkmark {
  width: 150px;
  display: block;
  margin: 40px auto 0;
}

.path {
  stroke-dasharray: 1000;
  stroke-dashoffset: 0;
  &.circle {
    -webkit-animation: dash .9s ease-in-out;
    animation: dash .9s ease-in-out;
  }
  &.line {
    stroke-dashoffset: 1000;
    -webkit-animation: dash .9s .35s ease-in-out forwards;
    animation: dash .9s .35s ease-in-out forwards;
  }
  &.check {
    stroke-dashoffset: -100;
    -webkit-animation: dash-check .9s .35s ease-in-out forwards;
    animation: dash-check .9s .35s ease-in-out forwards;
  }
}

p {
  &.success {
    color: #73AF55;
  }
  &.error {
    color: #D06079;
  }
}


@-webkit-keyframes dash {
  0% {
    stroke-dashoffset: 1000;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@keyframes dash {
  0% {
    stroke-dashoffset: 1000;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

@-webkit-keyframes dash-check {
  0% {
    stroke-dashoffset: -100;
  }
  100% {
    stroke-dashoffset: 900;
  }
}

@keyframes dash-check {
  0% {
    stroke-dashoffset: -100;
  }
  100% {
    stroke-dashoffset: 900;
  }
}



@-webkit-keyframes flipInY { 
    0% { 
        -webkit-transform: perspective(400px) rotateY(90deg); 
        opacity: 0; 
    } 
    40% { 
        -webkit-transform: perspective(400px) rotateY(-10deg); 
    } 
    70% { 
        -webkit-transform: perspective(400px) rotateY(10deg); 
    } 
    100% { 
        -webkit-transform: perspective(400px) rotateY(0deg); 
        opacity: 1; 
    } 
} 
@keyframes flipInY { 
    0% { 
        transform: perspective(400px) rotateY(90deg); 
        opacity: 0; 
    } 
    40% { 
        transform: perspective(400px) rotateY(-10deg); 
    } 
    70% { 
        transform: perspective(400px) rotateY(10deg); 
    } 
    100% { 
        transform: perspective(400px) rotateY(0deg); 
        opacity: 1; 
    } 
} 
.flipInY { 
    -webkit-backface-visibility: visible !important; 
    -webkit-animation-name: flipInY; 
    backface-visibility: visible !important; 
    animation-name: flipInY; 
}

.welcomebg{
    background-image:url('../../assets/img/configure/conf.jpg'); position: relative;background-size: cover; background-position: top;
}
.welcomebg::before{ position:absolute; background:#fff; height:100%; width:100% }
.cardbutton{ background:#013b43 !important; }

@keyframes float {
  0% {
   
    transform: translatey(0px);
  }
  50% {
   
    transform: translatey(-20px);
  }
  100% {
    
    transform: translatey(0px);
  }
}


.avatar {
  position: fixed;
  box-sizing: border-box;
  transform: translatey(0px);
  animation: float 6s ease-in-out infinite;
  z-index: 1; right:0; bottom: -30px; 
}
.avatar img { width:100% }
.body_bg{background: url(../../assets/img/configure/main-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;}
.mainbg{ overflow:hidden; width:100%; height:100%; position:absolute; }

 .mainbg::before{content: "";width:100%; height:100%;top:0%; left:0%;  position:absolute;

}
.addons-benefits input[type="checkbox"] {visibility: hidden;position: absolute}
#msg{ border:none; background:transparent; color:#7e8299; font-weight:500; outline:none; }
.animatable {
  
  /* initially hide animatable objects */
  visibility: hidden;
  
  /* initially pause animatable objects their animations */
  -webkit-animation-play-state: paused;   
  -moz-animation-play-state: paused;     
  -ms-animation-play-state: paused;
  -o-animation-play-state: paused;   
  animation-play-state: paused; 
}

/* show objects being animated */
.animated {
  visibility: visible;
  
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  -ms-animation-duration: 1.5s;
  -o-animation-duration: 1.5s;
  animation-duration: 1.5s;

  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -ms-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
}

@-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3);
    }
    50% {
        -webkit-transform: scale(1.05);
    }

    70% {
        -webkit-transform: scale(.9);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

@-moz-keyframes bounceIn {
    0% {
        opacity: 0;
        -moz-transform: scale(.3);
    }

    50% {
        -moz-transform: scale(1.05);
    }

    70% {
        -moz-transform: scale(.9);
    }

    100% {
        opacity: 1;
        -moz-transform: scale(1);
    }
}

@-o-keyframes bounceIn {
    0% {
        opacity: 0;
        -o-transform: scale(.3);
    }

    50% {
        -o-transform: scale(1);
    }

    70% {
        -o-transform: scale(1);
    }

    100% {
        opacity: 1;
        -o-transform: scale(1);
    }
}

@keyframes bounceIn {
    0% {
        opacity: 0;
        transform: scale(.3);
    }

    50% {
        transform: scale(1);
    }

    70% {
        transform: scale(1);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}
.animated.bounceIn {
    -webkit-animation-name: bounceIn;
    -moz-animation-name: bounceIn;
    -o-animation-name: bounceIn;
    animation-name: bounceIn;
}

.nav-active .btn-sm.btn-light.active{ background-color:#181c32 !important; color: #fff; outline: none;}
.table.gy-4 td.td_remove, .table.gy-4 th{border-right: 1px dashed #e4e6ef;}
.table.gy-4 td.td_remove:last-child, .table.gy-4 th:last-child{ border:0; }
/*.service-border{border-bottom: 1px dashed #e4e6ef;}*/
.cvpbanner{
    background: rgb(140,159,177);
background: linear-gradient(0deg, rgba(140,159,177,1) 0%, rgba(57,88,116,1) 100%);
}
.custometabs .nav-item a{background: #f9f9f9 !important; border: 0 !important; margin: 0 5px 0 !important}
.custometabs .nav-item a.active{background: #181c32 !important; color: #fff; border: 0;}
.custometabs .nav-item a:hover{background: #181c32 !important; color: #fff; border: 0;}
.selectwidth { width: auto !important; min-width: 250px; }
.gradient-effect img{ border-radius:20px; }
.gradient-effect:after{content:""; border-radius: 20px; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
background: rgb(0,0,0);
background: linear-gradient(0deg, rgb(0 0 0) 0%, rgba(0, 0, 0, 0.6951155462184874) 22%, rgba(0, 212, 255, 0) 100%);}
.tns-outer{margin: 0 0 20px !important}
.tns-outer .tns-nav{bottom: -16px; position: absolute; width: 100%; z-index:99; }
.offercard{background: rgb(140, 159, 177);
    background: linear-gradient(0deg, rgba(140, 159, 177, 1) 0%, rgba(57, 88, 116, 1) 100%);}
    .bell-animation{
  display:block;
  width: 15px;
  height: 15px;
  font-size: 15px;
  margin:0px auto 0;
  color: #9e9e9e;
  -webkit-animation: ring 4s .7s ease-in-out infinite;
  -webkit-transform-origin: 50% 4px;
  -moz-animation: ring 4s .7s ease-in-out infinite;
  -moz-transform-origin: 50% 4px;
  animation: ring 4s .7s ease-in-out infinite;
  transform-origin: 50% 4px;
}

@-webkit-keyframes ring {
  0% { -webkit-transform: rotateZ(0); }
  1% { -webkit-transform: rotateZ(30deg); }
  3% { -webkit-transform: rotateZ(-28deg); }
  5% { -webkit-transform: rotateZ(34deg); }
  7% { -webkit-transform: rotateZ(-32deg); }
  9% { -webkit-transform: rotateZ(30deg); }
  11% { -webkit-transform: rotateZ(-28deg); }
  13% { -webkit-transform: rotateZ(26deg); }
  15% { -webkit-transform: rotateZ(-24deg); }
  17% { -webkit-transform: rotateZ(22deg); }
  19% { -webkit-transform: rotateZ(-20deg); }
  21% { -webkit-transform: rotateZ(18deg); }
  23% { -webkit-transform: rotateZ(-16deg); }
  25% { -webkit-transform: rotateZ(14deg); }
  27% { -webkit-transform: rotateZ(-12deg); }
  29% { -webkit-transform: rotateZ(10deg); }
  31% { -webkit-transform: rotateZ(-8deg); }
  33% { -webkit-transform: rotateZ(6deg); }
  35% { -webkit-transform: rotateZ(-4deg); }
  37% { -webkit-transform: rotateZ(2deg); }
  39% { -webkit-transform: rotateZ(-1deg); }
  41% { -webkit-transform: rotateZ(1deg); }

  43% { -webkit-transform: rotateZ(0); }
  100% { -webkit-transform: rotateZ(0); }
}

@-moz-keyframes ring {
  0% { -moz-transform: rotate(0); }
  1% { -moz-transform: rotate(30deg); }
  3% { -moz-transform: rotate(-28deg); }
  5% { -moz-transform: rotate(34deg); }
  7% { -moz-transform: rotate(-32deg); }
  9% { -moz-transform: rotate(30deg); }
  11% { -moz-transform: rotate(-28deg); }
  13% { -moz-transform: rotate(26deg); }
  15% { -moz-transform: rotate(-24deg); }
  17% { -moz-transform: rotate(22deg); }
  19% { -moz-transform: rotate(-20deg); }
  21% { -moz-transform: rotate(18deg); }
  23% { -moz-transform: rotate(-16deg); }
  25% { -moz-transform: rotate(14deg); }
  27% { -moz-transform: rotate(-12deg); }
  29% { -moz-transform: rotate(10deg); }
  31% { -moz-transform: rotate(-8deg); }
  33% { -moz-transform: rotate(6deg); }
  35% { -moz-transform: rotate(-4deg); }
  37% { -moz-transform: rotate(2deg); }
  39% { -moz-transform: rotate(-1deg); }
  41% { -moz-transform: rotate(1deg); }

  43% { -moz-transform: rotate(0); }
  100% { -moz-transform: rotate(0); }
}

@keyframes ring {
  0% { transform: rotate(0); }
  1% { transform: rotate(30deg); }
  3% { transform: rotate(-28deg); }
  5% { transform: rotate(34deg); }
  7% { transform: rotate(-32deg); }
  9% { transform: rotate(30deg); }
  11% { transform: rotate(-28deg); }
  13% { transform: rotate(26deg); }
  15% { transform: rotate(-24deg); }
  17% { transform: rotate(22deg); }
  19% { transform: rotate(-20deg); }
  21% { transform: rotate(18deg); }
  23% { transform: rotate(-16deg); }
  25% { transform: rotate(14deg); }
  27% { transform: rotate(-12deg); }
  29% { transform: rotate(10deg); }
  31% { transform: rotate(-8deg); }
  33% { transform: rotate(6deg); }
  35% { transform: rotate(-4deg); }
  37% { transform: rotate(2deg); }
  39% { transform: rotate(-1deg); }
  41% { transform: rotate(1deg); }

  43% { transform: rotate(0); }
  100% { transform: rotate(0); }
}

.coming-soon{
    background: #bdc3c7;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #2c3e50, #bdc3c7);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #2c3e50, #bdc3c7); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.tier{ -webkit-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13);
-moz-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13);
box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13);}
.tier strong{ font-weight:500; color:#000; }
.tier strong small{ font-size:0.7em }
.tier p{ text-align: left; margin:3px 0 0; color:#008100; }
.tier .tier-after{position: absolute;
     position: absolute;
    height: 25px;
    width: 50px;
    /* background: green; */
    /* background: #fff;
    right: 50%; */
    bottom: -24px;
    left: 50%;
  transform: translate(-50%, 0) !important;
    color: #AC8B67;
    content: "";
    background-image: url(../../assets/img/tier-arrow-down.png);
    background-repeat: no-repeat;
    background-position: center;    cursor: pointer;
    transform: rotate(0deg);
    /* -webkit-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13); */
    -moz-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13);
    /* box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13); */
    background-size: contain;}
.tier .tier-after-up{position: absolute;
     position: absolute;
    height: 25px;
    width: 50px;
    /* background: green; */
    /* background: #fff; 
    right: 50%;*/
    left: 50%;
    transform: translate(-50%, 0) !important;
    bottom: -24px;
    color: #AC8B67;
    content: "";
    background-image: url(../../assets/img/tier-arrow-up.png);
    background-repeat: no-repeat;
    background-position: center;    cursor: pointer;
    transform: rotate(0deg);
    /* -webkit-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13); */
    -moz-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13);
    /* box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.13); */
    background-size: contain;}
.tier-detail{ padding: 20px; }
@import "color-schemer";
/* Mixins */
/* Color Variables */
/* Theme Variables */
/* Animations */
@keyframes bounce {
  0% {
    transform: scale(1);
  }
  33% {
    transform: scale(0.9);
  }
  66% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
/* Base Styles */
.tier-detail svg {
  margin: -50px 0 0;
  display: block; float: right; width: 300px; overflow: visible;
}

.tier-detail path {
  stroke-linecap: round;
  stroke-width: 2;
}

.tier-detail path.grey {
  stroke: #DDE2E9;
}

.tier-detail path.blue {
  stroke: #008100;
  stroke-dasharray: 198;
  stroke-dashoffset: 198;
  animation: dash 3s ease-out forwards;
}

.text-grey, .text-grey p{ color:#717171; }
@keyframes dash {
    from {
    stroke-dashoffset: 200;
  }
  to {
    stroke-dashoffset: 130; /* <---- changed to "1" from "0"  */
  }
}
.comparebutton{ background:#F58220; color:#fff; float:right; }
.tier-list{ display:none; }
.tier-bar{ justify-content: end;}

.tier-toggle .tier-progress{ display:block !important; }
.tier-toggle .tier-bar{ display: block !important;}
.fw-thin{ font-weight:300; color:#211B04 }
.fw-thin1{ font-weight:200; color:#211B04 }
.fw-thin2{ font-weight:400; color:#211B04 }
.ff-roboto1{font-family:Roboto Serif;}
.bg-black{}
.font-premium{ 
/*    font-family:Roboto Serif;*/
font-style: italic;
letter-spacing: -4%;
 }
 .font-gateway{
letter-spacing: -4%;
}
.font-normal{
font-weight: 300;
font-size: 16px;
line-height: 26px;
letter-spacing: 4%;
}
.login-panel{backdrop-filter: blur(50px); border: 1px solid #E4E4E4BF;}
.services-list ul li a.active{ background: radial-gradient(47.5% 103.66% at 50% 103.66%, rgba(254, 202, 13, 0.2) 5.87%, rgba(250, 132, 67, 0.2) 51.48%, rgba(250, 132, 67, 0) 100%);
border-bottom: 2px solid;border-image-source: linear-gradient(315deg, #FECA0D 0%, #FA8443 75.03%);
}
.service-tag{background: linear-gradient(315deg, #fff3d0 0%, #fee7da 75.03%);
}
.service-name{color: #9E6C46;}
.footer-bg{background: #E9EAE2;}
.button-arrow{     padding: 7px 4px;margin: -4px 0 0; }
.border-hover-dark:hover .button-arrow{background: #000; color: #feca0d !important;}
.scan-lounge:hover .button-arrow{background: #000; color: #feca0d !important;}
/*.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    background: rgb(253,190,136);
    background: linear-gradient(191deg, rgba(253,190,136,1) 0%, rgba(253,217,113,1) 100%);
    font-weight: normal;
    color: #212121; border-radius: 10px; 
}
#tabs .ui-state-active a{ margin:0; padding:7px 15px;color: #000; border:0; }
#tabs .ui-state-active a img{ display:inline; }
#tabs a{ margin:0; padding:7px 15px; border:0; color:#fff; }
#tabs a img{ display:none; }*/
#goTop {z-index:999; border:none; opacity:0; transition: opacity 0.4s linear;  }
#goTop.is-visible { opacity:0.6;  }
#goTop.is-visible:hover { opacity:1;  }
.tab-bullets .bullet{ width:8px; height:8px; border-radius:50%; margin-right: 0; background:#a7a7a7; list-style:none; }
.tab-bullets .bullet.active{ width:48px; border-radius:30px; }
.nav_link { margin:0; padding:7px 15px; border:0; color:#fff; }
.nav_link img{ display:none; }
        .nav_link.active {margin:0; padding:7px 15px;color: #000; border:0; 
            display: block;background: rgb(253,190,136);
    background: linear-gradient(191deg, rgba(253,190,136,1) 0%, rgba(253,217,113,1) 100%);
    font-weight: normal;
    color: #212121; border-radius: 10px; 
        }
        .nav_link.active img{ display:inline; }
        .tab_pane {
            display: none;
        }
        .tab_pane.active {
            display: block;
        }
        .bullets {
            margin-top: 10px;
        }
        .bullet {
            height: 10px;
            width: 10px;
            margin: 5px;
            background: gray;
            display: inline-block;
            border-radius: 50%;
            cursor: pointer;
        }
        .bullet.active {
            background: white;
        }
.ribbon-pop {
  background: linear-gradient(119.77deg, #f8e8b9 13.2%, #fad7bb 84.51%);
  display: inline-block;
  padding: 5px 10px 5px 12px;
  color: #242424; font-weight: 600;
  position: absolute; left: 2px; top: 26px; z-index: 1;
}
.ribbon-pop:after {
    content: "";
    width: 0;
    height: 0;
    top: 0;
    position: absolute;
    right: -14px;
    border-width: 14px 14px 15px 0;
    border-color: #fad7bb #ffffff00 #fad7bb #fad7bb;
    border-style: solid;
}
.ribbon-pop:before {
  height: 0;
    width: 0;
    border-bottom: 10px solid #f4e5b5;
    border-left: 8px solid transparent;
    top: -9px;
    position: absolute;
    content: "";
    left: 0;
}
.shared-benefit-info{ background:#f27d3a; color:#fff; font-weight:400; font-size:14px; }
.shared-benefit-info i{ font-size:8px; float:right; margin:2px 0 0 4px }
.upcoming-div{padding:20px; background: linear-gradient(293.2deg, rgba(255, 255, 255, 0) 0.92%, rgba(255, 242, 209, 0.5) 0.92%, rgba(254, 227, 217, 0.5) 97.71%);
}


.shared-card {
      background-color: #121212; display: none;
      color: white;
      border-radius: 10px;
      padding: 10px 20px 20px;
      text-align: center;
      margin-top: 0px; position: absolute; bottom: 10px; z-index: 1; left: 50%;-ms-transform: translate(-50%, -50%);
    transform: translate(-50%, 0%);
    }
.shared-card span{ font-size:12px; font-weight:normal; text-align:right }
    .shared-card .option {
      display: flex;
      justify-content: end;
      align-items: center;
      margin: 15px 0;
      font-size: 16px;
    }
    .shared-card .option .optionspan{
        font-family:Roboto Serif;
    }

    .shared-card .divider {
      margin: 0; font-size: 12px;position: relative;z-index: 1;
      color: #999;

      &:before {
        border-top: 1px solid #999;
        content:"";
        margin: 0 auto; /* this centers the line to the full width specified */
        position: absolute; /* positioning must be absolute here, and relative positioning must be applied to the parent */
        top: 50%; left: 0; right: 0; bottom: 0;
        width: 95%;
        z-index: -1;
    }
    span { 
        /* to hide the lines from behind the text, you have to set the background color the same as the container */ 
        background: #121212; 
        padding: 0 5px; 
    }
    }


    .shared-card .count {
      background-color: #333; line-height: 25px; text-align: center;
    }

    .shared-card .bottom-badge {
      position: absolute;
      bottom: 15px;
      left: 50%;
      transform: translateX(-50%);
      background-color: #f37021;
      color: white;
      font-size: 12px;
      font-weight: bold;
      padding: 5px 12px;
      border-radius: 15px;
    }
.divider-text {
      display: flex;
      align-items: center;
      text-align: center;
      font-weight: bold;
      text-transform: uppercase;
      letter-spacing: 1px; 
    }
    .divider-text::before,
    .divider-text::after {
      content: '';
      flex: 1;
      border-bottom: 1px solid gray;
      margin: 0 10px;
    }
.bill-input-wrapper {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 64px;
      font-weight: 500;
      margin-bottom: 10px;
      position: relative;
    }

    .currency-symbol {
      margin-right: 5px;
    }

    .bill-input {
      background: transparent;
      border: none;
      border-bottom: 1px solid #444;
      
      font-size: 64px;
      font-weight: 500;
      text-align: center;
      outline: none;
      min-width: 50px;
      padding: 0;
    }

    #mirror {
      position: absolute;
      visibility: hidden;
      white-space: pre;
      font-size: 64px;
      font-weight: 500;
      font-family: inherit;
    }

    .subtext {
      font-size: 16px;
      font-weight: 500;
      margin-top: 20px;    }
      .speech-bubble {
      position: relative;
      background-color: #dfdfdf;
      border-radius: 20px;
      padding: 12px 20px;
      display: inline-flex;
      align-items: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    }

    .speech-bubble::after {
      content: "";
      position: absolute;
      top: -10px;
      left: 50%;
      transform: translateX(-50%);
      width: 0;
      height: 0;
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-bottom: 10px solid #dfdfdf;
    }

    .emoji {
      font-size: 28px;
      margin-right: 10px;
    }

    .message {
      font-size: 18px;
      font-weight: 500;
      color: #000;
    }

    .message .highlightS {
      font-weight: 700;
    }

    .bill-container {
      max-width: 400px;
      margin: 10px auto;
      border-radius: 16px;
      padding: 2rem;
      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
      text-align: center;
    }
    .bill-container-gradiant{
        --s: 100px; /* control the size */
  --c1: #181c32;
  --c2: #23263d;
  
  --_s: calc(2*var(--s)) calc(2*var(--s));
  --_g: var(--_s) conic-gradient(at 40% 40%,#0000 75%,var(--c1) 0);
  --_p: var(--_s) conic-gradient(at 20% 20%,#0000 75%,var(--c2) 0);
  background:
    calc( .9*var(--s)) calc( .9*var(--s))/var(--_p),
    calc(-.1*var(--s)) calc(-.1*var(--s))/var(--_p),
    calc( .7*var(--s)) calc( .7*var(--s))/var(--_g),
    calc(-.3*var(--s)) calc(-.3*var(--s))/var(--_g),
    conic-gradient(from 90deg at 20% 20%,var(--c2) 25%,var(--c1) 0) 
     0 0/var(--s) var(--s);
  animation: m 3s infinite;
}
@keyframes m {
  0% {
   background-position: 
    calc( .5*var(--s)) calc( .5*var(--s)),
    calc(-.1*var(--s)) calc(-.1*var(--s)),
    calc( .7*var(--s)) calc( .7*var(--s)),
    calc(-.3*var(--s)) calc(-.3*var(--s)),0 0
  }
  25% {
   background-position: 
    calc(1.5*var(--s)) calc( .5*var(--s)),
    calc(-1.1*var(--s)) calc(-.1*var(--s)),
    calc(1.7*var(--s)) calc( .7*var(--s)),
    calc(-1.3*var(--s)) calc(-.3*var(--s)),0 0
  }
  50% {
   background-position: 
    calc(1.9*var(--s)) calc(-.1*var(--s)),
    calc(-1.1*var(--s)) calc( .9*var(--s)),
    calc(1.7*var(--s)) calc(-.3*var(--s)),
    calc(-1.3*var(--s)) calc( .7*var(--s)),0 0
  }
  75% {
   background-position: 
    calc(2.9*var(--s)) calc(-.1*var(--s)),
    calc(-2.1*var(--s)) calc( .9*var(--s)),
    calc(2.7*var(--s)) calc(-.3*var(--s)),
    calc(-2.3*var(--s)) calc( .7*var(--s)),0 0
  }
  100% {
   background-position: 
    calc(2.9*var(--s)) calc(-1.1*var(--s)),
    calc(-2.1*var(--s)) calc(1.9*var(--s)),
    calc(2.7*var(--s)) calc(-1.3*var(--s)),
    calc(-2.3*var(--s)) calc(1.7*var(--s)),0 0
  }
}

    .original-price {
      text-decoration: line-through;
      color: #888;
      font-size: 1rem;
    }
    .final-price {
      font-size: 2.5rem;
      font-weight: 700;
      color: #0d0d0d;
    }
    .discount-bubble {
      background-color: #e0e0e0;
      border-radius: 30px;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin: 1.5rem auto;
      font-weight: 600;
      font-size: 1rem;
      position: relative;
    }
    .discount-bubble::before {
      content: "";
      position: absolute;
      top: -10px;
      left: 50%;
      transform: translateX(-50%);
      border: 10px solid transparent;
      border-bottom-color: #e0e0e0;
    }
    .bill-table td,.bill-table th {
      padding: 0.75rem 1rem !important;
      border-bottom: 1px solid #eee;
    }
    .bill-table .payable {
      background-color: #eef0f5;
      font-weight: 600;
    }
    .btn-payment {
      background-color: #ffc107;
      border: none;
      font-weight: 600;
      padding: 0.6rem 1.2rem;
      border-radius: 8px;
      margin-top: 1.5rem;
      transition: background-color 0.3s ease;
    }
    .btn-payment:hover {
      background-color: #e0a800;
    }
    .paided{ display:none; }
    .form-check.form-check-dark .form-check-input{ border:1px solid #000; }
    .form-check.form-check-dark .form-check-input:checked{
    background-color:#000; border: #000;
}

@media screen and (max-width: 1299px) {
    #tabs a{ padding:7px 5px; }
}
@media screen and (max-width: 767px) {
    .get_price_box{ margin-top: 20px}
    .services-bar{ }
    .services-bar .nav-item{ float:left; }
    .services-bar .nav-item a{ display:flex;align-items:center; border: 1px solid #242424 !important;font-size: 14px;padding: 10px !important; border-box; border-radius: 10px; margin:0 10px 10px 0 !important; }
    .services-bar .nav-item a.active{background: linear-gradient(119.18deg, #FBD1BB 13.31%, #FFF0BD 87.56%) padding-box,
              linear-gradient(315deg, #FECA0D 0%, #FA8443 75.03%) border-box;
              border: 1px solid transparent !important; }
    .services-bar .nav-item a img{ width:15px !important; margin-right:5px !important; }
    .upcoming-services-scroll{display: block; overflow-x: inherit;}
}
@media screen and (max-width:767px) {
    .tier-detail svg{ float:none; margin:-20px auto 0 }
    .comparebutton{ margin:0 auto; float:none;}
    .tier-bar{ text-align:center; }
}
@media screen and (max-width:340px) {
    .tier-detail svg{margin: -20px auto 0 -23px;}
}