
.carousel-fade .carousel-item {
  display: block;
  position: absolute;
  opacity: 0;
  transition: opacity .75s ease-in-out;
}

.carousel-fade .carousel-item img {
  height: 100vh;
  width: 100%;
  object-fit: cover;
}

.carousel-fade,

.carousel-inner,
.carousel-item {
  width: 100%;
  height: 100%;
}

.carousel-fade {
  position: absolute;
  top: 0;
  left: 0;
  height: 100vh;
  z-index: 0;
}



.wrapper {
  margin-top: 0px
}

.customNavbar {
  position: relative;
}


.catList {
  position: relative;
  z-index: 1;
}

.scroll_body {
  height: 65vh;
  overflow-y: scroll;

}
.catList{
  border-radius:22px;
}

.scroll_body::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
  background-color: #ffffff;
}

/* scrollbar */
.scroll_body::-webkit-scrollbar {
  width: 4px;
  background-color: #F5F5F5;
  height: 10px;
}

.scroll_body::-webkit-scrollbar-thumb {
  background-color: #000000;
  border-radius: 100px;
}
.service_card{
  overflow:hidden;
  border-radius: 10px !important;
  height: auto !important;
  box-shadow:none !important;
  border: 1px solid #DED4BF;
  margin-bottom: 0px !important;
}

.service_card:hover{
  background-color: #eee !important;
  transition-duration: 0.8s !important;
}

.service_card img{
  width:100%;
  object-fit:cover;
  height:150px;
  min-height: auto;
  object-position:center;
  border-radius: 10px !important;
}
.custom_badge{
  background-color:#DED4BF;
  color:#000;
  margin:10px 0px;
  font-weight:600;
  padding:6px 22px;
}
.card-text p{
  overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 3; /* number of lines to show */
           line-clamp: 3;
   -webkit-box-orient: vertical;
}
.catSelect{
  display: flex;
  height: 100%;
}
.catList .card-body .card-title{
  font-weight: 600 !important;
}

/* login */
#bookingForm input {
border-color: #CDCDCD !important;
border-radius: 8px !important;
}



#otp-modal .modal-content.loginCard {
width: 100%;
margin: 0 auto;
text-align: center;
padding: 1.5rem 2rem 1.5rem;
border-radius: 12px;
position: relative;
box-shadow: none;
}

#otp-modal .modal_heading {
font-size: 22px;
font-style: normal;
font-weight: 600;
}

#otp-modal .modal-dialog {
max-width: 525px;
}

#otp-modal.modal.show {
background-color: rgb(0 0 0 / 58%);
backdrop-filter: blur(5px);
}


#otp-modal .modal-body.loginForm {
padding: 1rem 4rem;
}

#otp-modal .modal-header {
padding: 0;
border: none;
position: absolute;
top: 10px;
right: 1rem;
}

#otp-modal .close span {
color: #BDBDBD;
font-size: 1.9rem;
font-weight: 500;
}


/* Category page */
.service_types {
  position: relative;
  z-index: 1;
  border-radius: 22px;
}
.service_type_card img{
height:150px;
object-fit:cover;
}


.service_type_card {
  padding: 8px 8px;
  overflow: hidden;
  border-radius: 10px !important;
  height: auto !important;
  box-shadow: none !important;
  border: 1px solid #DED4BF;
}

.service_type_card img {
  border-radius: 10px;
}

.service_type_card .card-title {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.service_type_card .card-text {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  /* number of lines to show */
  line-clamp: 3;
  -webkit-box-orient: vertical;
  font-size: 12px;
}



.service_type_card .bottom_btn .button{
width: 100%;
  min-height: 107px;
}
.bottom_btn {
  text-align: center;
  width: calc(32% - 0px);
  /* margin: 0 auto; */
}
.serivce_couple_btn .btn-secondary:first-child {
margin-right: 5px;
}
.serivce_couple_btn .btn-secondary:last-child  {
margin-left: 5px;
}
.card-div{
  padding:0px !important;
}
.border-btn{
background: #fff;
  /* border: 1px solid #000; */
  color: #000;
  padding: 5px 5px;
  border: 1px solid #DED4BF;
border-radius: 10px !important;
  /* border-radius: 100px !important; */
}
.border-btn:hover , .border-btn.active{
color: #fff !important;
background-color: #000 !important;
}

.bottom_btn .button {
  padding: 1rem 0.8rem 0.42rem;
  border: 1px solid #DED4BF;
  color: #000;
  display: inline-block;
  line-height: 100%;
  border-radius: 10px;
  position: relative;
  text-decoration: none;
  z-index: 0;
  -webkit-transition: border-color .35s ease, background .35s ease;
  transition: border-color .35s ease, background .35s ease;
}

.bottom_btn .button i {
  color: #DED4BF;
  font-size: 1.5rem;
}

.bottom_btn .button:before {
  background-color: black;
  content: "";
  display: block;
  position: absolute;
  top: 100%;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  -webkit-transition: all .35s ease;
  transition: all .35s ease;
  border-radius: 10px;
}

.bottom_btn .button:hover:before {
  top: 0;
}

.bottom_btn .button:hover {
  color: #DED4BF;
  transition: 0.25s;
}

.bottom_btn .button:after {
  position: absolute;
  right: 2.34375rem;
  top: 50%;
  -webkit-transform: translateY(-50%) translateX(50%);
  -ms-transform: translateY(-50%) translateX(50%);
  transform: translateY(-50%) translateX(50%);
  font-size: 1.75em;
}

.bottom_btn h6 {
  margin: 10px 0px 2px;
  font-size: 0.875rem;
  font-weight: 600;
}

.bottom_btn p {
  margin: 0px;
  font-size: 10px;
}

.back_btn {
  position: absolute;
  left: 2rem;
  background: #fff;
  border: 1px solid #000;
  color: #000;
  padding: 6px 30px;
  border-radius: 100px;
  top: 0.5rem;
}

.responsive_back_btn {

  display: none;
}

.web_back_btn {
  display: block;
}


/* login form */







.numberBox .iti__flag-container {
/* border-right: 0 !important; */
border-radius: 8px !important;
border-color: #CDCDCD !important;
border-top-right-radius: 0px !important;
border-bottom-right-radius: 0px !important;
}

.numberBox #phone {
border-left: 0;
border-top-left-radius: 0px !important;
border-bottom-left-radius: 0px !important;
width: inherit;
margin-left: inherit;
}

.loginCard .loginForm .numberBox .iti {
flex-wrap: nowrap;
}

.loginCard {
padding: 0rem 2rem 0rem;
width: 82%;
}

.seprater {
position: relative;
}

.seprater::before {
content: '';
background: #EAEAEA;
width: 35%;
height: 2px;
display: block;
position: absolute;
top: 50%;
left: 5%;
}

.seprater::after {
content: '';
background: #EAEAEA;
width: 35%;
height: 2px;
display: block;
position: absolute;
top: 50%;
right: 5%;
}

.inner_slider .carousel-indicators li {
width: 8px;
height: 8px;
border-radius: 100%;
opacity: .3;
}

.inner_slider .carousel-indicators .active {
opacity: 1 !important;
}

/* .inner_slider .carousel-item {
height: 580px;
} */

.customNavbar {
position: relative;
}

.mobile_image_wrapper {
display: none;
}

#name {
display: none;
}



.get-otp-sms {
border: 1px solid #CCC;
background: transparent;
color: #000;
}

.get-otp-sms:hover {
color: #000;
}

#otp .form-control.form-control-solid {
border: 1px solid #BDBDBD;
border-radius: 10px !important;
height: 50px !important;
}

.loginCard .loginForm .otpBox {
margin-bottom: 0px !important;
}

.otp-time {
font-size: 0.875rem;
font-style: normal;
font-weight: 600;
color: #9A9079;
}

#bookingForm .voucher input{
border-radius:4px !important ;
}
#bookingForm .voucher_btn {
background-color: #000 !important;
font-size: 12px;
margin-left: 10px;
border-radius: 4px !important;
}
.therapist-container {
display: flex;
flex-wrap: wrap;
justify-content: space-between;

}
.therapist-list {
width: 48% !important;
border: 1px solid #D9D9D9;
border-radius: 8px;
padding: 7px;
align-items: center;
margin-bottom: 15px;
position: relative;
min-width: 225px;
}
.therapist-list span {
min-width: 43px;
height: 44px;
background: #D9D9D9;
display: block;
font-size: 18px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 6px;
}
.therapist-list span i.fa.fa-user {
border: 1px solid;
border-radius: 50%;
width: 25px;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
}
.therapist-list h1 {
font-size: 16px;
color: #1E2429;
margin-bottom: 0;
margin-top: 3px;
max-width: 126px;
height: 19px;
text-align: left;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.therapist-detials {
display: flex;
flex-direction: column;
}
.rating-wrap {
display: flex;
font-weight: lighter;
}
.rating-wrap .starts{
margin-right: 5px;
}
.rating-wrap .starts i {
font-size: 10px;
color:#D9D9D9;
margin: 2px;
cursor: pointer;
}
.rating-wrap .starts i.selected{
color: #9A9079;
border: none !important;
}
.therapist-list .checked{
color: #D9D9D9;
}

.therapist-list .custom-checkbox-input:checked ~ .custom-checkbox-text {
background-color: #fff;
color: #000;
}

.therapist-list  label.custom-checkbox{
margin-bottom: 0;
}

.therapist-list .custom-checkbox-text {
display: flex;
flex-direction: row;
padding: 0;
border: none;
align-items: center;
}

.therapist-list  .checked {
margin-left: auto;
color: #B7B7B7;
}
.therapist-list .custom-checkbox-input:checked ~ .custom-checkbox-text .checked{
color: #000 !important;
}

.therapist-list i.fa.fa-heart {
font-size: 16px;
color: #B7B7B7;
right: 28px;
/* position: absolute; */
cursor: pointer;
top: calc(50% - 8px);
}

.therapist-list i.fa.fa-heart.active, .therapist-list i.fa.fa-heart:hover{
color: #000;
}
.noaviablity_img{
  width: 15%;
}

@media only screen and (max-width: 1024px) {
.therapist-list {
  width: 100%;
}

}
@media only screen and (max-width: 768px) and (min-width: 650px) {
.therapist-container{
  padding-left: 10px;
  padding-right: 10px;
}
.loginCard {
    padding: 0rem 1rem 0rem;
    width: 100%;
}

.loginFormText p {
    font-size: 12px;
}
.noaviablity_img{
  width: 25%;
}
}



.service_type_card .card-body p{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
margin-bottom: 0;
}

.service_type_card .card-title {
font-size: 1rem;
font-weight: 700;
margin-bottom: 0.5rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
min-height: 36px;
}
.image_flag_wrap{
  height: 60px;
}
.image_flag_wrap img{
  object-fit: contain;
    height: 100%;
    width: 100%;

}
.wrapper_city{
  background:#F6F6F6;
  border: 1px solid #0000000D;
  margin:0px 1rem 0rem;
  padding:1rem;
  border-radius:10px;
  color:#000;
}
.wrapper_city h4{
  font-size:20px;
  margin-bottom: 0;
}
.wrapper_city:hover{
  border: 1px solid #000;
  color:#000;
}
.heading_reva{
  position: relative;
  padding-bottom: 0px;
  letter-spacing: 10px;
}
.sub-heading-city{
  font-size: 26px;
}
/* .heading_reva:after{
  content: '';
    background: #000;
    width: 6%;
    position: absolute;
    height: 4px;
    bottom: 0px;
    left: 0;
    right: 0;
    margin: 0 auto;
} */
.City_modal{
  /* top: 5.8vh; */
position: static !important;
  padding: 0px !important;
  background-color: transparent !important;
}
.City_modal .modal-content{
  box-shadow: none !important;
  border:none !important;
}
.City_modal_wrapper{
  max-width: 1125PX;
  /* margin-top: 1rem; */
}
.City_modal_wrapper .modal-content{
  border-radius: 22px;
}
.cities_scroll{
  height: 44vh !important;
  overflow-y: scroll;
  overflow-x: hidden;

}

@media screen and (max-width:768px) {
  .cities_scroll{
    height: 50vh !important;
  }
  .City_modal_wrapper{
    max-width: 720px;
    /* margin-top: 0.5rem; */
  }
  .image_flag_wrap{
   margin-bottom: 10px;
  }
  .image_flag_wrap img{
    object-position: left;
  }
  .wrapper_city{
    margin: 0px;
  }
  .wrapper_city h4 span:last-child{
    margin-top: 5px !important;
    font-size: 14px;
  }
  .wrapper_city h4{
    font-size: 16px;
  }
  .sub-heading-city{
    font-size: 24px;
  }
  .wrapper_city h4 .line-middle{
    display: none;
  }
  .wrapper_city h4 span{
    display: block;
    padding: 0 !important;
    margin: 0 !important;
  }

}
@media screen and (max-width:640px) {
  .cities_scroll{
    height: 60vh !important;
  }
  .City_modal_wrapper{
    max-width: auto;
    width: auto;
    margin-left: 7.5px;
    margin-right: 7.5px;
  }
  /* .City_modal {
    top: 9vh;} */
  .image_flag_wrap{
   margin-bottom: 10px;
  }
  .image_flag_wrap img{
    object-position: left;
  }
  .wrapper_city{
    margin: 0px;
  }
  .wrapper_city h4 span:last-child{
    margin-top: 5px !important;
    font-size: 14px;
  }
  .wrapper_city h4{
    font-size: 16px;
  }
  .sub-heading-city{
    font-size: 24px;
  }
  .wrapper_city h4 .line-middle{
    display: none;
  }
  .wrapper_city h4 span{
    display: block;
    padding: 0 !important;
    margin: 0 !important;
  }

  .noaviablity_img{
    width: 25%;
  }
  #otp-modal .modal-body.loginForm{
    padding:0rem !important;
  }
  .service_type_card .card-title{
    min-height: auto;
  }
  .catList {
    border-radius: 15px;
    padding-top: 10px;
}
.catList .scroll_body{
  height: 75vh;
}
.catList p.bold{
  margin-bottom:10px;
}
  .catList .scroll_body::-webkit-scrollbar {
  width: 0px;
  background-color: #F5F5F5;
  height: 10px;
}
.catList .card-body{
  position: static;
  margin-bottom: 0.5rem;
}
.catList .card-body .card-title,.catList .card-body p{
  display: block;
  margin-bottom: 0;
  color:#000;
}
.catList .card-body p{
  font-size: 12px;
}
.service_card img{
  margin-bottom:10px;
}
.custom_badge{
  margin: 6px 0px;
    font-weight: 600;
    padding: 3px 15px;
    font-size: 10px;
}

.service_types {
  border-radius: 15px;
  padding-top: 10px;
}

p.bold {
  margin-bottom: 10px;
}

.scroll_body {
  height: 75vh;
}

.catList p.bold {
  margin-bottom: 10px;
}

.scroll_body::-webkit-scrollbar {
  width: 0px;
  background-color: #F5F5F5;
  height: 10px;
}

.responsive_back_btn {
  display: block;
}

.web_back_btn {
  display: none;
}

.back_btn {
  left: 1rem;
  border: 0px solid #000;
  padding: 0;
  top: 0rem;
}

.bottom_btn {
  width: calc(32% - 0px);
}

.bottom_btn:first-child {
  margin-left: 0px;
}

.bottom_btn:last-child {
  margin-right: 0px;
}



.bottom_btn .button {
  display: flex;
  padding: 0.5rem 0.4rem 0.42rem;
  justify-content: space-evenly;
  align-items: center;
  border-radius: 6px;
}

.bottom_btn h6 {
  margin-top: 0px;
}

.bottom_btn .button i {
  font-size: 1rem;
}

.bottom_btn .button:before {

  border-radius: 6px;
}
#otp-modal  .modal-dialog-centered {
align-items: flex-end;
min-height: calc(100% - 0rem);
margin: 0;
}

#otp-modal  .modal-body.loginForm {
padding: 0rem;
}

#otp-modal.modal.fade .modal-dialog {
-webkit-transform: translate(0, 100%);
transform: translate(0, 100%);
}

#otp-modal.modal.show .modal-dialog {
-webkit-transform: none;
transform: none;
}

#otp-modal  .modal-content.loginCard {
border-radius: 20px 20px 0px 0px;
}

}
