/* 

    Theme Name:     Chirolift - Physiotherapy & Chiropractic
    Author:         Evonicmedia 
    Version:        1.0 
    URL:            https://themeforest.net/user/evonicmedia/portfolio
    Created:        08/25/2024



    [Table of Content]

	  01. Index Page Style
        section Index Page
            1.1. Header section
            1.2. Hero section
            1.3. Inputs section
            1.4. Cards section
            1.5. Healing section
            1.6. Companies section
            1.7. Best section
            1.8. Testimonials section
            1.9. Experience section
            1.10. Team section
            1.11. Steps section
            1.12. Bone section
            1.13. Blog section
            1.14. Footer section

    02. About Page Style
         section About Page
            2.1. NextPages_Hero section
            2.2. About_healing section
            2.3. Counters section
            2.4. Treatment section

    03. Contact Page Style
         section Contact Page
            3.1. Contact section
            3.2. Getinformation section
            3.3. Map section

    04. Blogs Page Style
          section Blogs Page
            4.1. Latest section

    05. BlogDetail Page Style
          section BlogDetail Page
            5.1. BlogDetail section
            5.2. BlogComment section

    06. Services Page Style
          section Services Page
            6.1. ServiceCards section
            6.2. Avail section
            6.3. ServicesForm section

    07. Testimonial Page Style
          section Testimonial Page
            7.1. Testimonial section

    08. Faq Page Style
          section Help_&_Faq Page
            8.1. Accordians section

    09. Team Page Style
          section Team Page
            9.1. Team_Hero section
            9.2. Team_Cards section
            9.3. AllTeam section

    10. Comming_ Page Style
            section Comming Page
            10.1. Comming section 

    11. Error Page Style
            section Error Page
            11.1. Error section 
            */



/* 1.1. header section */

div .spacing_services{
  padding-left: 8px !important; 
  padding-right: 8px  !important;
}
@media(max-width:500px){
  .Follow-us {
    margin-top: 10px;
    
  }
}


.float{
  position:fixed;
  width:60px;
  height:60px;
  bottom:50%;
  right:40px;
  background-color:#25d366;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  font-size:30px;
  box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.encadrer {
    display: inline-block; /* Pour que le div prenne seulement la place du texte */
    padding: 5px; /* Espacement intérieur */
    border: 1px solid #F4573D; /* Bordure de couleur */
    color: #F4573D; /* Couleur du texte */
    border-radius: 5px; /* Coins arrondis (facultatif) */
    font-weight: bold; /* Texte en gras (facultatif) */
    text-align: center; /* Centrer le texte (facultatif) */
}

.telephone {
    color: #F4573D; /* Couleur du texte */
    text-decoration: none; /* Supprimer le soulignement */
    margin-left: 10px; /* Espacement à gauche du numéro */
}

.my-float{
  margin-top:16px;
}

.float-tel{
    bottom:40%;
    background-color:#3633ff;
}


.navbar {
  padding: 10px 0px;
}

.navbar ul {
  list-style: none;
}

.nav-logo {
  z-index: 3;
}

.nav-logo img {
  width: 160px;
}

.navbar-collapse {
  justify-content: center;
}

.right-sidbar {
  width: 280px;
  position: fixed;
  height: 100vh;
  top: 0;
  left: -355px;
  overflow-x: hidden;
  transition: 0.5s;
  padding: 20px;
  z-index: 99;
  background-color: #fff;
}

.open-aside {
  display: none;
  z-index: 2;
}

.right-sidbar ul {
  list-style: none;
}




aside .fa-xmark {
  padding: 8px 13px;
  background-color: #069fea;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 22px;
}

aside .fa-caret-down {
  color: #069fea;
  font-size: 22px;
}

aside a {
  text-decoration: none;
  color: black;
}

aside a:hover {
  color: #069fea;
}

aside .active a {
  color: #069fea !important;
}

#slid-drop {
  display: none;
}

aside li {
  padding: 12px;
}

#slid-drop li {
  padding: 12px 0px;
}

.aside-dropdwon {
  display: block !important;
}

.page-btn {
  padding: 10px 0px;
  color: #069fea;
  background-color: transparent;
  border: none;
  font-size: 18px;
}

.navbar ul li a {
  color: black;
  padding: 12px;
}

.navbar ul li a:hover {
  color: #069fea;
}

.navbar ul li .active {
  color: #069fea !important;
}

.navbar .dropdown-item:hover,
.navbar .active.dropdown-item {
  color: #fff !important;
  background-color: #069fea;
}

.dropdown ul {
  width: 200px;
}

.dropdown-menu {
  display: block;
  overflow: hidden;
  padding: 0px;
  transition: all 0.3s ease-in;
  visibility: hidden;
}

.dropdown ul li a {
  color: black;
}

.open-aside {
  padding: 9px 14px;
  background-color: #069fea;
  border: none;
  border-radius: 10px;
  font-size: 25px;
  color: white;
}

.Follow-us .fa-brands,
.fab {
  color: #0197ec;
  transition: all 0.3s ease-in;
}

.Follow-us li:first-child a:hover {
  color: #2b2d2f;
}

.Follow-us a i:hover {
  color: #2b2d2f;
}

@media screen and (max-width: 1199px) {
  header .navbar ul li {
    font-size: 14px;
  }
}

@media screen and (min-width: 991px) {
  .navbar-expand-lg .navbar-collapse {
    justify-content: end;
  }
}

@media screen and (max-width: 991px) {
  .open-aside {
    padding: 8px 14px;
    display: block;
  }

  .join-btn {
    display: none;
  }

  .nav-logo img {
    width: 150px;
  }

  .side-nav-logo {
    padding-bottom: 20px;
  }

  .navbar {
    padding: 15px 0px;
  }
}

@media screen and (max-width: 768px) {
  .open-aside {
    padding: 9px 14px;
  }

  .nav-logo img {
    width: 130px;
  }

  .page-btn {
    font-size: 16px;
  }
}

@media screen and (max-width: 480px) {
  .nav-logo img {
    width: 120px;
  }

  aside .fa-xmark {
    font-size: 20px;
  }

  .open-aside {
    padding: 8px 14px;
    font-size: 22px;
  }

  .page-btn {
    font-size: 14px;
  }
}

/* End of 1.1. header section */
/* 1.2. Hero section */
.Hero {
  padding: 100px 0px 0px 0px;
}

.Hero .col-lg-5 {
  padding-bottom: 100px;
}

.Hero p {
  padding: 15px 90px 15px 0px;
  font-size: 18px;
  line-height: 1.5;
  color: #2b2d2f;
}

.Hero h1 {
  color: #2b2d2f;
  padding: 30px 0px 0px 0px;
}

.Hero .Doctor img:first-child {
  position: absolute;
  right: 32%;
  width: 76%;
  z-index: 2;
  bottom: 0px;
}

.Hero .Doctor img:nth-child(2) {
  position: absolute;
  left: 12px;
  z-index: 1;
  bottom: 0px;
  width: 77%;
}

.Hero .bg figure {
  background: url("../image/BG/Hero_Circle.png");
}

.Hero .bg figure:first-child img {
  position: absolute;
  z-index: 3;
  top: 0;
  right: 0;
}

.Hero .Doctor {
  height: 600px;
  width: 100%;
}

.Hero .bg1 {
  position: absolute;
  z-index: 4;
  right: 10%;
  bottom: 400px;
}

.Hero .bg1 figure {
  background: url("../image/BG/Hero_Circle.png");
  padding: 10px;
  background-repeat: no-repeat;
  background-size: 100%;
}

.Hero .bg1 img {
  width: 100%;
  border-radius: 50%;
  transition: transform 0.3s ease-in-out;
}

.Hero .bg1 img:hover {
  transform: rotate(15deg);
}

.Hero .bg2 {
  position: absolute;
  z-index: 4;
  right: 10%;
  bottom: 100px;
}

.Hero .bg2 figure {
  background: url("../image/bg/Hero_Circle.png");
  padding: 10px;
  background-repeat: no-repeat;
  background-size: 100%;
}

.Hero .bg2 img {
  width: 100%;
  border-radius: 50%;
  transition: transform 0.3s ease-in-out;
}

.Hero .bg2 img:hover {
  transform: rotate(15deg);
}

.Hero .hero-btn {
  padding-top: 20px;
}

@media screen and (max-width: 1399px) {
  .Hero .bg1 {
    right: 0%;
    bottom: 330px;
  }

  .Hero .bg2 {
    right: 0%;
    bottom: 80px;
  }

  .Hero .Doctor img:nth-child(2) {
    left: 68px;
  }

  .Hero .Doctor img:first-child {
    right: 24%;
  }
}

@media screen and (max-width: 1280px) {
  .Hero p {
    padding: 15px 20px 15px 0px;
  }
}

@media screen and (max-width: 1199px) {
  .Hero .Doctor img:nth-child(2) {
    left: 20px;
    width: 80%;
  }

  .Hero .Doctor img:first-child {
    right: 26%;
    width: 85%;
  }

  .Hero .bg2 figure {
    background-size: 85%;
  }

  .Hero .bg2 img {
    width: 84%;
  }

  .Hero .bg1 {
    right: -2%;
    bottom: 290px;
  }

  .Hero .bg2 {
    right: -2%;
  }

  .Hero .bg1 figure {
    background-size: 85%;
  }

  .Hero .bg1 img {
    width: 84%;
  }
}

@media screen and (max-width: 1024px) {
  .Hero p {
    padding: 15px 47px 15px 0px;
  }

  .Hero {
    padding: 10px 0px 0px 0px;
  }
}

@media screen and (max-width: 991px) {
  .Hero {
    padding: 10px 0px;
  }

  .Hero .col-lg-5 {
    padding-bottom: 30px;
  }

  .Hero .Doctor {
    height: 100%;
    width: 100%;
    padding-top: 30px;
  }

  .Hero .Doctor img:first-child {
    right: 32%;
    width: 64%;
  }

  .Hero .bg1 {
    right: 13%;
    bottom: 61%;
  }

  .Hero .bg2 {
    right: 13%;
    bottom: 21%;
  }

  .Hero .Doctor img:nth-child(2) {
    position: relative;
    left: 17%;
    width: 60%;
  }
}

@media screen and (max-width: 768px) {
  .Hero .Doctor img:nth-child(2) {
    position: relative;
    left: 17%;
    width: 68%;
  }

  .Hero h1 {
    text-align: center;
  }

  .Hero p {
    padding: 15px 30px 15px 30px;
    text-align: center;
  }

  .Hero .hero-btn {
    padding-top: 30px;
    text-align: center;
    justify-content: center;
  }

  .Hero .col-lg-5 {
    padding-bottom: 0px;
  }

  .Hero .Doctor img:first-child {
    right: 25%;
    width: 72%;
  }

  .Hero .bg2 {
    right: 4%;
    bottom: 17%;
  }

  .Hero .bg1 {
    right: 4%;
    bottom: 61%;
  }
}

@media screen and (max-width: 767px) {
  .Hero .bg1 figure {
    background-size: 70%;
  }

  .Hero h1 {
    text-align: center;
    padding: 0px;
  }

  .Hero p {
    text-align: center;
    padding: 15px 30px 15px 30px;
  }

  .Hero .bg1 {
    top: 22%;
    right: 2%;
  }

  .Hero .bg2 {
    top: 64%;
    right: 2%;
  }

  .Hero .bg1 img {
    width: 66%;
  }

  .Hero .bg2 figure {
    background-size: 70%;
  }

  .Hero .bg2 img {
    width: 66%;
  }

  .Hero .d-flex a {
    padding: 12px 30px;
  }

  .Hero h1 {
    text-align: center;
  }

  .Hero .hero-btn {
    padding-top: 25px;
    text-align: center;
  }
}

@media screen and (max-width: 540px) {
  .Hero .bg2 figure {
    rotate: 90deg;
  }

  .Hero .bg2 img {
    rotate: 270deg;
  }

  .Hero .bg1 figure {
    rotate: 90deg;
  }

  .Hero .bg1 img {
    rotate: 270deg;
  }
}

@media screen and (max-width: 480px) {
  .Hero {
    padding: 35px 0px 0px;
  }

  .Hero .bg1 figure {
    background-size: 50%;
    padding: 6px;
  }

  .Hero .bg1 img {
    width: 46%;
  }

  .Hero .bg2 figure {
    background-size: 50%;
    padding: 6px;
  }

  .Hero .bg2 img {
    width: 46%;
  }

  .Hero .bg2 {
    top: 70%;
    right: 0%;
  }

  .Hero .bg1 {
    top: 30%;
    right: 0%;
  }

  .Hero p {
    padding: 15px 0px 15px 0px;
    width: 100%;
    margin: auto;
  }
}

@media screen and (max-width: 414px) {
  .Hero .bg1 figure {
    position: relative;
    top: 20px;
    left: 12px;
  }

  .Hero .bg2 figure {
    position: relative;
    top: 20px;
    left: 12px;
  }
}

@media screen and (max-width: 360px) {
  .Hero p {
    padding: 15px 0px 15px 0px;
  }

  .Hero .bg1 figure {
    background-size: 40%;
    padding: 3px;
    top: 34px;
    left: 14px;

  }

  .Hero .bg1 img {
    width: 38%;
  }

  .Hero .bg2 figure {
    background-size: 40%;
    padding: 3px;
    left: 14px;
  }

  .Hero .bg2 img {
    width: 38%;
  }

  .Hero .d-flex a {
    padding: 6px 14px;
  }
}

@media screen and (max-width: 320px) {
  .Hero .Doctor {
    padding-top: 40px;
  }

  .Hero .bg1 {
    bottom: 40%;
  }

  .Hero .bg2 {
    bottom: 0%;
  }

  .Hero .bg1 figure {
    top: 44px;
    left: 20px;
  }

  .Hero .bg2 figure {
    top: 35px;
    left: 20px;
  }
}

/* End of 1.2. Hero section */
/*  1.3. Inputs section */
.Input_fields {
  position: relative;
  top: -20px;
  z-index: 10;
}

.Input_fields h2 {
  padding: 0px 220px 30px 220px;
  color: #2b2d2f;
}

.Input_fields .Input_fields_Bg {
  padding: 50px 30px;
  background: rgba(255, 255, 255, 1);
  border: 1px solid rgba(216, 241, 255, 1);
  border-radius: 20px;
  box-shadow: 0px 37px 40px 0px #0000000d;
}

.Input_fields input,
select {
  width: 100%;
  outline: none;
  padding: 15px 15px;
  border: 1px solid rgba(241, 241, 241, 1);
  border-radius: 7px;
  color: #848a8f;
}

.Input_fields option[hidden] {
  display: none;
}

.Input_fields input::placeholder {
  color: rgba(132, 138, 143, 1);
}

.Input_fields button {
  width: 100%;
  padding: 15px 15px;
  outline: none;
  border: none;
  border-radius: 7px;
  background-color: #1d448e;
  color: #fff;
}

.Input_fields .align-items-center {
  gap: 20px;
}

.Input_fields .Input1st {
  width: 42%;
  gap: 20px;
}

.Input_fields .Service {
  width: 42%;
  gap: 20px;
  position: relative;
}

.Input_fields .Service::after {
  content: "\f0dd";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  color: gray;
  font-size: 16px;
  position: absolute;
  right: 6px;
  top: 25%;
  transform: translateX(-100%);
  pointer-events: none;
}

.Input_fields .Service select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
}

.Input_fields .book-now {
  width: 16%;
}

@media screen and (max-width: 1199px) {
  .Input_fields .Input1st {
    width: 100%;
  }

  .Input_fields .Service {
    width: 100%;
  }

  .Input_fields .align-items-center {
    flex-direction: column;
  }

  .Input_fields .book-now {
    width: 100%;
  }

  .Input_fields .hover1 {
    width: 100%;
  }

  .Input_fields h2 {
    padding: 0px 120px 30px 120px;
  }

  .Input_fields button {
    width: 49%;
  }
}

@media screen and (max-width: 991px) {
  .Input_fields h2 {
    font-size: 36px;
  }

  .Input_fields .book-now {
    text-align: center;
  }
}

@media screen and (max-width: 768px) {
  .Input_fields h2 {
    padding: 0px 70px 25px 70px;
  }

  .Input_fields .Input_fields_Bg {
    padding: 50px 30px;
  }

  .Input_fields .book-now {
    text-align: center;
  }
}

@media screen and (max-width: 767px) {
  .Input_fields h2 {
    font-size: 28px;
  }

  .Input_fields .Input1st {
    flex-direction: column;
  }

  .Input_fields .Service::after {
    top: 68%;
  }

  .Input_fields .Service {
    flex-direction: column;
  }

  .Input_fields .hover1 {
    width: 100%;
  }

  .Input_fields button {
    width: 100%;
  }

  .Input_fields .Input_fields_Bg {
    padding: 30px 20px;
  }
}

@media screen and (max-width: 480px) {
  .Input_fields h2 {
    padding: 0px 0px 20px 0px;
    font-size: 22px;
  }

  .Input_fields input {
    padding: 12px 12px;
  }

  .Input_fields button {
    padding: 15px 12px;
  }
}

@media screen and (max-width: 360px) {
  .Input_fields h2 {
    font-size: 18px;
  }

  .d-flex .hover3 {
    padding: 12px 18px 12px 18px;
  }

  .Input_fields .Input_fields_Bg {
    padding: 50px 30px;
  }
}

@media screen and (max-width: 320px) {
  .Input_fields .Input_fields_Bg {
    padding: 24px 12px;
  }
}

/* End of 1.3. Inputs section */
/*  1.4. Cards section */
.Cards {
  padding: 80px 0px 100px;
}

.Cards .flex-column {
  border: 1px solid #d8f1ff;
  box-shadow: 0px 37px 40px 0px #0000000d;
  background: #ffffff;
  border-radius: 20px;
  padding: 40px 30px;
  text-align: center;
}

.Cards img[alt="Health"] {
  width: 66px;
}

.Cards img[alt="Trusted"] {
  width: 84px;
}

.Cards img[alt="Therapist"] {
  width: 66px;
}

.Cards .col-lg-3 a {
  padding: 10px 16px;
  border-radius: 50%;
  border: 0.8px solid #37e7d5;
  background: #ffffff;
  position: absolute;
  bottom: -18px;
  right: 42%;
  z-index: 1;
}

.Cards h4 {
  padding: 15px 0px;
  color: #2b2d2f;
}

.Cards p {
  color: #2b2d2f;
  font-size: 16;
  line-height: 1.3;
  flex-grow: 1;
}

.Cards .flex-column a i {
  color: #37e7d5;
}

.Cards .col-lg-3 .flex-column:hover a,
.Cards .col-lg-3 .flex-column:hover {
  background: linear-gradient(#0197ec, #39ead5);
}

.Cards .flex-column:hover a i {
  color: #ffffff;
}

@media screen and (max-width: 1199px) {
  .Cards .flex-column {
    padding: 40px 16px;
  }
}

@media screen and (max-width: 991px) {
  .Cards .row {
    gap: unset;
  }
}
.modal-title{
  font-weight: bolder;
}

@media screen and (max-width: 768px) {
  .Cards {
    padding: 50px 0px 70px;
  }

  .Cards img[alt="Trusted"] {
    width: 66px;
  }
}

@media screen and (max-width: 767px) {
  .Cards .row {
    row-gap: 30px;
  }

  .Cards {
    padding: 30px 0px 50px;
  }

  .Cards .col-lg-3 a {
    right: 46%;
  }
}

@media screen and (max-width: 540px) {
  .Cards .col-lg-3 a {
    right: 45%;
  }
}

@media screen and (max-width: 360px) {
  .Cards .col-lg-3 a {
    right: 42%;
    padding: 10px 17px;
  }
}

/* End of 1.4. Cards section */
/* 1.5. Healing section */
.Healing {
  padding: 100px 0px 80px 0px;
  position: relative;
}

.Healing p {
  color: #2b2d2f;
}

.Healing .flex-column h2 {
  color: #2b2d2f;
}

.Healing figure img {
  position: absolute;
  top: -8%;
  width: 50%;
  left: 10%;
}

.Healing h2 span {
  font-family: "Marcellus", serif;
}

.Healing .Rating {
  background-color: rgba(251, 251, 251, 1);
  border: 1px solid rgba(216, 241, 255, 1);
  border-radius: 20px;
  padding: 30px 30px;
  box-shadow: 0px 0px 30px 0px #00000012;
}

.Healing .Rating hr {
  color: rgba(216, 216, 216, 1);
  margin: 5px;
  opacity: 1;
  width: 100%;
}

.Healing .Rating_Contant {
  padding: 40px 26px;
  background: linear-gradient(to bottom,
      rgba(1, 151, 236, 1),
      rgba(57, 234, 213, 1));
  border-radius: 20px;
}

.Healing .gap-2 .Cases {
  position: relative;
  left: -5px;
}

.Healing .col-lg-4 img {
  width: 100%;
  border-radius: 20px;
}

.Healing .col-lg-5 .gap-3 {
  padding: 25px 40px 0px 50px;
}

.Healing .col-lg-5 .mt-lg-4 {
  padding: 0px;
}

.Healing .text-lg-start h2 {
  padding-right: 50px;
}

.Healing span {
  font-family: "Inspiration", "cursive";
  font-weight: 400;
  font-size: 44px;
  line-height: 54px;
  color: rgba(43, 45, 47, 1);
  width: max-content;
  display: inline-block;

}

.Healing .col-lg-5 hr {
  margin: 0px;
  opacity: 1;
  color: rgba(43, 45, 47, 1);
  position: absolute;
  width: 100%;
  bottom: 21%;
}

.Healing img[alt="Cases"] {
  width: 28px;
  padding-top: 10px;
}

.Healing img[alt="Winner"],
img[alt="Happiness"] {
  width: 43px;
  padding-top: 10px;
}

.Healing .col-lg-5 .mt-3 .gap-2 i {
  color: rgba(55, 231, 213, 1);
}

.Healing .hr-bottom {
  width: 100%;
  margin-top: 120px;
  border: 1px solid #d8f1ff;
  opacity: 1;
}

@media screen and (max-width: 1400px) {
  .Healing figure img {
    top: -8%;
    width: 48%;
  }

  .Healing .Rating {
    padding: 20px 30px;
  }

  .Healing .Rating_Contant {
    padding: 28px 26px;
  }

  .Healing .col-lg-5 .gap-3 {
    padding: 0px 20px 0px 25px;
  }

  .Healing .col-lg-5 .mt-lg-4 {
    padding: 0px;
  }
}

@media screen and (max-width: 1280px) {
  .Healing .hr-bottom {
    margin-top: 100px;
  }
}

@media screen and (max-width: 1199px) {
  .Healing .hover3 {
    padding: 18px 20px 18px 20px;
  }

  .Healing .col-lg-5 .gap-3 {
    padding: 0px 0px 0px 10px;
  }

  .Healing .Rating_Contant {
    padding: 15px 16px;
  }

  .Healing .Rating {
    padding: 0px 20px;
  }

  .Healing .mt-lg-3 {
    padding: 0px;
  }

  .Healing .mt-lg-3 .hover3 {
    padding: 14px 20px;
  }
}

@media screen and (max-width: 1024px) {
  .Healing .col-lg-4 div {
    height: 100%;
  }

  .Healing .col-lg-4 img {
    width: 100%;
    height: 98%;
    object-fit: cover;
  }

  .Healing .Rating {
    padding: 10px 15px;
  }

  .Healing figure img {
    top: -4%;
    width: 49%;
    left: 9%;
  }
}

@media screen and (max-width: 991px) {
  .Healing {
    padding: 70px 0px 50px 0px;
  }

  .Healing .col-lg-4 img {
    width: 72%;
  }

  .Healing .row {
    row-gap: 20px;
  }

  .Healing .col-lg-5 .gap-3 {
    padding: 30px 0px 0px;
  }

  .Healing .col-lg-5 .text-lg-start p {
    text-align: start;
  }

  .Healing .col-lg-5 .text-lg-start h2 {
    text-align: start;
    padding-bottom: 10px;
  }

  .Healing .col-lg-5 .text-lg-start .gap-lg-3 p {
    padding: 0px;
  }

  .Healing .col-md-12 .gap-md-3 {
    padding-right: 270px;
  }

  .Healing figure img {
    display: none;
  }

  .Healing .hr-bottom {
    margin-top: 50px;
  }

  .Healing .w-50 {
    width: 80% !important;
  }

  .Healing .w-25 {
    width: 18% !important;
  }

  .Healing .w-25 hr {
    width: 100%;
  }
}

@media screen and (max-width: 912px) {
  .Healing .col-lg-4 img {
    width: 78%;
  }

  .Healing .w-25 {
    width: 20% !important;
  }
}

@media screen and (max-width: 820px) {
  .Healing .col-lg-4 img {
    width: 88%;
  }

  .Healing .w-25 {
    width: 26% !important;
  }
}

@media screen and (max-width: 768px) {
  .Healing {
    padding: 40px 0px 50px 0px;
  }

  .Healing .col-lg-4 div {
    display: flex;
    justify-content: center;
  }

  .Healing .col-lg-4 img {
    width: 90%;
    height: 100%;
    object-fit: cover;
  }

  .Healing .col-lg-5 {
    order: 1;
  }

  .Healing .col-lg-3 {
    order: 2;
  }

  .Healing .col-lg-4 {
    order: 3;
  }

  .Healing .row {
    row-gap: 50px;
  }

  .Healing .col-md-12 .gap-md-3 {
    padding-right: 0px;
  }

  .Healing .col-lg-5 .text-lg-start h2 {
    text-align: center;
    padding-bottom: 10px;
    padding-right: 0px;
  }

  .Healing .col-lg-5 .justify-content-around {
    justify-content: center !important;
    width: 80%;
    margin: auto;
  }

  .Healing .col-lg-5 .text-lg-start p {
    text-align: center;
    padding: 0px 30px 0px 30px;
  }

  .Healing .col-lg-5 .mt-lg-4 {
    justify-content: center;
  }

  .Healing .Rating {
    gap: 10px !important;
    padding: 15px 15px 20px;
  }
}

@media screen and (max-width: 767px) {
  .Healing {
    padding: 50px 0px 25px 0px;
  }

  .Healing .row {
    row-gap: 25px;
  }

  .Healing .w-50 {
    padding-right: 86px;
  }

  .Healing .Rating {
    padding: 20px 15px;
    gap: 15px !important;
  }

  .Healing .hr-bottom {
    margin-top: 25px;
    margin-bottom: 0px;
  }

  .Healing .col-lg-5 .gap-3 {
    padding: 0px 0px 0px;
  }

  .Healing .col-lg-5 .mt-lg-4 {
    padding-top: 20px;
  }

  .Healing .col-lg-5 .text-lg-start p {
    padding: 0px;
  }

  .Healing .col-lg-4 img {
    width: 100%;
  }
}

@media screen and (max-width: 540px) {
  .Healing .w-50 {
    flex-direction: column;
  }

  .Healing img[alt="Cases"] {
    position: relative;
    left: -5px;
  }

  .Healing .hover3 {
    padding: 14px 16px 14px 16px;
  }
}

@media screen and (max-width: 480px) {
  .Healing .flex-column h2 {
    padding: 0px 0px 0px 8px;
  }

  .Healing .gap-2 p {
    padding-left: 7px;
  }

  .Healing .w-50 {
    padding-right: 0px;
  }

  .Healing .col-lg-5 .mt-lg-3 {
    padding: 10px 0px;
  }
}

@media screen and (max-width: 414px) {
  .Healing .w-50 {
    width: unset !important;
  }

  .Healing .col-md-12 .align-items-end {
    gap: 20px;
  }

  .Healing .col-lg-5 .justify-content-around {
    justify-content: space-between !important;
    width: 100%;
  }
}

@media screen and (max-width: 360px) {

  .Healing .col-lg-5 .mt-lg-4 {
    flex-direction: column;
  }
}

@media screen and (max-width: 320px) {
  .Healing .col-md-12 .align-items-end {
    flex-direction: column;
    align-items: center !important;
  }

  .Healing .col-lg-5 .justify-content-around {
    justify-content: center !important;
  }
}

/* End of 1.5. Healing section */
/* 1.6. Companies section */
.Companies {
  padding: 0px 0px 100px;
}

.Companies h2 {
  color: #2b2d2f;
}

.Companies .Trusted-companies {
  margin: auto;
  text-align: center;
  padding-bottom: 30px;
}

.Companies .CompaniesSlider {
  width: 90%;
  max-width: 1120px;
  margin: auto;
}

.Companies .CompaniesSlider img {
  width: 170px;
  opacity: 0.5;
  margin: 0 auto;
}

.CompaniesSlider div a {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 1024px) {
  .Companies .CompaniesSlider img {
    width: 140px;
  }
}

@media screen and (max-width: 991px) {
  .Companies {
    padding: 0px 0px 70px;
  }

  .Companies .CompaniesSlider img {
    width: 180px;
  }
}

@media screen and (max-width: 768px) {
  .Companies .CompaniesSlider img {
    width: 160px;
  }
}

@media screen and (max-width: 480px) {
  .Companies .CompaniesSlider img {
    width: 140px;
  }

  .Companies {
    padding: 0px 0px 50px;
  }
}

/* End of 1.6. Companies section */
/* 1.7. Best section */
.Best {
  background: linear-gradient(to bottom, #eeedfc, #f3f3f5);
  padding: 100px 0px 150px 0px;
  position: relative;
}

.Best .circle img {
  position: absolute;
  top: 30%;
  right: 6%;
  width: 48%;
  z-index: 1;
}

.Best h2:nth-of-type(1) {
  padding: 0px 250px 0px 250px;
  text-align: center;
  color: #2b2d2f;
}

.Best p:nth-child(2) {
  text-align: center;
  padding: 15px 230px 50px 230px;
  color: #2b2d2f;
}

.Best .col-lg-8 .text-center {
  width: 40%;
  flex-grow: 1;
  border-radius: 20px;
  border: 1px solid #d8f1ff;
  background-color: #ffff;
  padding: 35px 67px;
  box-shadow: 0px 37px 40px 0px #0000000d;
}

.Best .col-lg-12 .text-center {
  width: 30%;
  flex-grow: 1;
  border-radius: 20px;
  border: 1px solid #d8f1ff;
  background-color: #ffff;
  padding: 35px 67px;
  box-shadow: 0px 37px 40px 0px #0000000d;
}


.Best .col-lg-8 .text-center:hover {
  border: 1px solid #0197EC;
}

.Best .col-lg-8 h4 {
  color: #2b2d2f;
}

.Best .col-lg-8 p {
  font-size: 14px;
  line-height: 16px;
  color: #2b2d2f;
}

.Best figure img {
  width: 96%;
  border-radius: 20px;
}

.Best .col-md-4 .proudly_text {
  width: 273px;
  border-radius: 20px;
  padding: 30px 40px;
  text-align: center;
  background: linear-gradient(to bottom, #0197ec, #39ead5);
  position: absolute;
  bottom: -12%;
  left: 15%;
  z-index: 2;
}

.Best .col-md-12 .gap-3 a {
  color: #2b2d2f;
}

.Best img[alt="therapy"] {
  width: 66px;
}

.Best img[alt="Message"] {
  width: 68px;
}

.Best img[alt="Sport"] {
  width: 72px;
}

.Best img[alt="chiropratic"] {
  width: 56px;
}

@media screen and (max-width: 1400px) {
  .Best .circle img {
    top: 35%;
    width: 51%;
  }

  .Best .col-md-12 .gap-3 {
    bottom: -25%;
    left: 10%;
  }

  .Best p:nth-child(2) {
    padding: 15px 180px 50px 180px;
  }

  .Best .col-md-4 .proudly_text {
    bottom: -24%;
    left: 10%;
  }
}

@media screen and (max-width: 1280px) {
  .Best .circle img {
    right: 10%;
    width: 50%;
  }
}

@media screen and (max-width: 1199px) {
  .Best .circle img {
    right: 5%;
    width: 58%;
  }

  .Best .col-md-12 .gap-3 {
    bottom: -46%;
    left: 2%;
  }

  .Best .col-lg-4 .text-center {
    padding: 30px 30px;
  }

  .Best p:nth-child(2) {
    padding: 15px 100px 50px 100px;
  }
}

@media screen and (max-width: 1024px) {
  .Best .circle img {
    width: 56%;
    right: 6%;
    top: 38%;
  }

  .Best .col-md-4 .proudly_text {
    width: 282px;
    padding: 35px 40px;
    bottom: -44%;
    left: 0%;
  }

  .Best .col-lg-8 .text-center {
    padding: 20px 47px;
  }

}

@media screen and (max-width: 991px) {
  .Best .circle img {
    display: none;
  }

  .Best .col-lg-8 .text-center {
    padding: 20px 20px;
  }

  .Best .col-md-4 .proudly_text {
    width: 92%;
    bottom: -34%;
    left: 2%;
  }
}

@media screen and (max-width: 820px) {
  .Best .col-md-4 .proudly_text {
    width: 92%;
    bottom: -45%;
    padding: 20px 16px;
  }

  .Best .col-lg-8 .text-center {
    padding: 20px 20px;
  }
}

@media screen and (max-width: 768px) {
  .Best {
    padding: 70px 0px;
  }

  .Best figure img {
    width: 100%;
  }

  .Best .col-md-4 .proudly_text {
    width: 100%;
    left: unset;
  }

  .Best .col-md-4 .proudly_text {
    bottom: -54%;
    padding: 40px 16px;
  }
}

@media screen and (max-width: 767px) {
  .Best {
    padding: 50px 0px;
  }

  .Best .col-lg-8 .text-center {
    padding: 30px 20px;
  }

  .Best p:nth-child(2) {
    padding: 15px 20px 50px 20px;
  }

  .Best .col-md-4 .proudly_text {
    bottom: 0%;
    padding: 20px 16px;
  }

  .Best figure {
    text-align: center;
  }

  .Best h2:nth-of-type(1) {
    padding: 0px 50px 0px 50px;
  }
}

@media screen and (max-width: 480px) {
  .Best .col-lg-8 .text-center {
    width: 100%;
  }

  .Best p:nth-child(2) {
    padding: 15px 0px 50px 0px;
  }
}

@media screen and (max-width: 360px) {
  .Best figure img {
    width: 100%;
  }

  .Best .col-md-12 .gap-3 {
    width: 100%;
  }
}

/* End of 1.7. Best section */
/* 1.8. Testimonials section */
.Testimonials {
  background-color: #fbfbfb;
}

.Testimonials .row .col-md-12 {
  padding: 0px;
}

.Testimonials figure {
  width: 780px;
  height: 100%;
  position: relative;
}

.Testimonials h2 {
  padding: 10px 240px 0px 240px;
  color: rgba(43, 45, 47, 1);
  color: #2b2d2f;
}

.Testimonials .Main-P {
  padding: 15px 290px 0px 290px;
  color: rgba(43, 45, 47, 1);
  color: #2b2d2f;
}

.Testimonials .bg {
  background: linear-gradient(72.65deg,
      #0197ec 1.46%,
      rgba(57, 234, 213, 0.65) 90.12%);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}

.Testimonials figure::before {
  position: absolute;
  z-index: -1;
}

.Testimonials figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.Testimonials .content {
  position: relative;
  padding: 100px 0px;
}

.TestimonialsSlider {
  display: flex;
  position: relative;
  padding: 100px 0px 50px 0px;
}

.TestimonialsSlider p {
  color: #2b2d2f;
}

.Testimonials .row {
  margin-right: 0px;
  margin-left: 0px;
  padding-left: 0px;
  padding-right: 0px;
}

.Testimonials h6 {
  color: #01afec;
  padding-bottom: 5px;
}

.Testimonials .Person {
  padding: 25px 60px;
  border-radius: 20px;
  background-color: #ffff;
  box-shadow: 3px 25px 20px 1px #0000000d;
  position: relative;
}

.Testimonials .stars .fa-star {
  color: #ffcd06;
  padding-bottom: 10px;
}

.Testimonials .Person .d-flex img {
  position: absolute;
  width: 130px;
  bottom: 12px;
  right: 4px;
  border-radius: 50%;
}

.TestimonialsSlider .Person a {
  padding-top: 10px;
  color: #01afec;
}

.TestimonialsSlider .slick-track {
  display: flex;
  gap: 20px;
}

.TestimonialsSlider .slick-list {
  overflow-x: clip !important;
  overflow-y: visible !important;
}

@media screen and (min-width: 1440px) {
  .Testimonials figure {
    width: 123%;
  }
}

@media screen and (max-width: 1280px) {

  .Testimonials figure {
    width: 700px;
  }

  .Testimonials .Person .d-flex img {
    width: 110px;
    bottom: 20px;
    right: -28px;
  }

  .Testimonials .Person {
    padding: 25px 40px;
  }

  .Testimonials .Main-P {
    padding: 10px 250px 10px 250px;
  }
}

@media screen and (max-width: 1024px) {
  .Testimonials figure {
    width: 550px;
  }

  .Testimonials .Main-P {
    padding: 10px 90px 10px 157px;
  }

  .Testimonials .content {
    position: relative;
    padding: 40px 0px;
  }

  .TestimonialsSlider {
    padding: 40px 0px 50px 0px;
  }

  .Testimonials .Person .d-flex img {
    width: 110px;
    bottom: 20px;
    right: 0px;
  }
}

@media screen and (max-width: 991px) {
  .TestimonialsSlider {
    right: 0%;
  }

  .Testimonials figure {
    width: 100%;
  }

  .Testimonials .Main-P {
    padding: 10px 0px 10px 0px;
    display: flex;
    justify-content: center;
  }
}

@media screen and (max-width: 768px) {
  .Testimonials .content {
    padding: 10px 0px 70px 0px;
  }

  .Testimonials figure {
    height: 90%;
  }
}

@media screen and (max-width: 767px) {
  .Testimonials .content {
    padding: 15px 0px 50px;
  }

  .TestimonialsSlider {
    padding: 40px 0px 30px 0px;
  }
}

@media screen and (max-width: 540px) {
  .Testimonials h2 {
    padding: 0px;
  }

  .Testimonials .Main-P {
    width: 70%;
    text-align: center;
    margin: auto;
  }
}

@media screen and (max-width: 360px) {
  .Testimonials .Person .d-flex img {
    width: 101px;
    bottom: 29px;
    right: -5px;
  }

  .Testimonials .Main-P {
    width: 100%;
  }
}

@media screen and (max-width: 320px) {
  .Testimonials .Person .d-flex img {
    width: 90px;
    bottom: 0;
    right: -28px;
  }
}

/* End of 1.8. Testimonials section */
/* 1.9. Experience section */
.Experience {
  padding: 100px 0px;
  position: relative;
  background: linear-gradient(180deg,
      rgba(78, 224, 163, 0.1) 0%,
      rgba(78, 224, 163, 0) 100%);
}

.Experience .background2 img {
  position: absolute;
  left: -1%;
  top: 1%;
  width: 46%;
  z-index: 1;
}

.Experience .Doctor {
  width: 450px;
}

.Experience .Doctor img {
  width: 100%;
  border-radius: 20px;
}

.Experience .text-center {
  width: 273px;
  border-radius: 20px;
  padding: 35px 40px;
  background: linear-gradient(180deg, #0197ec 0%, #39ead5 100%);
  position: absolute;
  top: 320px;
  left: 305px;
  z-index: 1;
}

.Experience h2 {
  color: #2b2d2f;
  padding: 0px 50px 10px 0px;
}

.Experience h4 {
  color: #2b2d2f;
}

.Experience .gap-4 p {
  width: 350px;
  color: #2b2d2f;
}

.Experience .gap-1 hr {
  width: 80%;
  margin: 10px 0;
}

.Experience .flex-column .mt-4 {
  padding-top: 20px;
  align-items: center;
}

.Experience img[alt="trainer"] {
  width: 56px;
}

.Experience img[alt="prices"] {
  width: 50px;
}

.Experience img[alt="services"] {
  width: 58px;
}

@media screen and (max-width: 1400px) {
  .Experience .text-center {
    left: 260px;
  }

  .Experience .background2 img {
    width: 50%;
  }
}

@media screen and (max-width: 1024px) {
  .Experience .text-center {
    top: 84%;
    left: unset;
    width: 94%;
    padding: 25px 30px;
  }

  .Experience .background2 img {
    width: 51%;
    bottom: 12%;
  }



  .Experience .background2 img {
    display: none;
  }
}

@media screen and (max-width: 991px) {
  .Experience .gap-1 .gap-4 p {
    width: 100%;
  }

  .Experience .gap-1 hr {
    width: 100%;
  }

  .Experience .Doctor {
    width: 100%;
  }

  .Experience .flex-column .mt-4 {
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }

  .Experience .text-center {
    top: 79%;
  }

  .Experience h2 {
    padding: 0px 0px 15px 0px;
  }

}

@media screen and (max-width: 768px) {
  .Experience {
    padding: 70px 0px;
  }

  .Experience h2 {
    padding: 0px 0px 15px 0px;
  }
}

@media screen and (max-width: 767px) {
  .Experience {
    padding: 50px 0px;
  }

  .Experience .row {
    row-gap: 50px;
    flex-direction: column-reverse;
  }

  .Experience .col-lg-6:first-child {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .Experience .Doctor {
    display: flex;
    justify-content: center;
    align-items: center;
  }

}

@media screen and (max-width: 540px) {
  .Experience h2 {
    padding: 0px 0px 20px 0px;
  }

  .Experience .gap-1 hr {
    width: 100%;
  }

  .Experience .text-center {
    padding: 30px;
  }
}

@media screen and (max-width: 480px) {
  .Experience h2 {
    padding: 0px 0px 20px 0px;
  }

  .Experience .text-center {
    width: 90%;
    padding: 20px;
    top: 82%;
  }

  .Experience {
    padding: 50px 0px;
  }
}

@media screen and (max-width: 360px) {
  .Experience {
    padding: 50px 0px 90px;
  }

  .Experience .gap-1 .mt-4 {
    flex-direction: column;
  }

  .Experience .text-center {
    bottom: -40px;
  }
}

@media screen and (max-width: 320px) {
  .Experience .gap-1 .gap-4 {
    align-items: center !important;
    flex-direction: column;
    text-align: center;
    gap: 10px !important;
  }

  .Experience .gap-1 .gap-4 div p {
    margin: auto;
  }

  .Experience .text-center {
    width: 93%;
  }

  .Experience h2 {
    text-align: center;
  }
}

/* End of 1.9. Experience section */
/* 1.10. Team section */
.Team {
  padding-bottom: 100px;
}

.Team .content h2 {
  color: #2b2d2f;
}

.Team .content p {
  color: #2b2d2f;
  padding-top: 15px;
}

.Team .Doctor {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
}

.Team .Doctor img {
  width: 100%;
}

.Team .hover {
  position: absolute;
  bottom: 0;
  right: 0;
  background: linear-gradient(180deg, #0197ec 0%, #39ead5 99.02%);
  overflow: hidden;
  width: 100%;
  height: 80%;
  transition: all 0.4s ease;
  border-radius: 50%;
  opacity: 0;
  left: -50px;
  top: 100%;
}

.Team .Doctor:hover .hover {
  top: 120px;
  opacity: 1;
}

.Team .hover_data {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-40%, -50%);
  opacity: 0;
  transition: opacity 0.2s ease 0.2s, top 0.4s ease 0.2s;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.Team .Doctor:hover .hover_data {
  top: 50%;
  opacity: 1;
}

.Team .Doctor .hover h4,
.Team .Doctor .hover p {
  color: #ffffff;
}

.Team .hover_icons {
  display: flex;
  justify-content: space-between;
  width: 100px;
}

.Team .hover_icons a i {
  transition: all 0.2s ease-in;
  color: #ffffff;
}

.Team .hover_icons a i:hover {
  color: #2b2d2f;
  transform: translateY(-10%);
}

.Team .content {
  text-align: center;
  margin-bottom: 50px;
}

.Team .dr-images {
  display: flex;
  justify-content: space-between;
}

.Team .d-flex {
  margin-top: 40px;
}

@media screen and (max-width: 1280px) {
  .Team .hover {
    left: -35px;
  }
}

@media screen and (max-width: 1199px) {
  .Team .hover {
    left: -28px;
  }

  .Team .Doctor:hover .hover {
    top: 85px;
  }

  .Team .Doctor .hover_data h4 {
    font-size: 20px;
  }
}

@media screen and (max-width: 1024px) {
  .Team .Doctor:hover .hover {
    top: 88px;
  }

  .Team {
    padding-bottom: 70px;
  }
}

@media screen and (max-width: 991px) {
  .Team .hover_data {
    gap: 4px;
  }
}

@media screen and (max-width: 820px) {
  .Team .Doctor:hover .hover {
    top: 62px;
  }

  .Team .hover {
    width: 108%;
    height: 88%;
  }
}

@media screen and (max-width: 768px) {
  .Team .Doctor:hover .hover {
    top: 70px;
  }

  .Team .hover {
    left: -24px;
  }

  .Team .Doctor .hover_data h4 {
    font-size: 18px;
  }

  .Team {
    padding-bottom: 50px;
  }

  .Team .hover .hover_icons a {
    font-size: 12px;
  }

  .Team .hover_icons {
    justify-content: unset;
    gap: 10px;
  }
}

@media screen and (max-width: 540px) {
  .Team .hover .hover_icons a {
    font-size: 20px;
  }

  .Team .hover {
    width: 85%;
    left: -80px;
  }

  .Team .hover_icons {
    gap: 16px;
  }

  .Team .hover_data {
    gap: 12px;
  }

  .Team .Doctor:hover .hover {
    height: 66%;
    top: 284px;
  }

  .Team .Doctor {
    margin-bottom: 20px;
  }

  .Team .view-all-btn {
    margin-top: 20px;
  }

  .Team .d-flex {
    margin-top: 15px;
  }
}

@media screen and (max-width: 480px) {
  .Team .Doctor:hover .hover {
    top: 240px;
  }
}

@media screen and (max-width: 375px) {
  .Team .Doctor:hover .hover {
    top: 194px;
  }

  .Team .hover {
    left: -55px;
  }

  .Team .content p {
    margin: auto;
    width: 100%;
  }

  .Team .content {
    margin-bottom: 30px;
  }
}

@media screen and (max-width: 320px) {
  .Team .Doctor:hover .hover_data {
    top: 39%;
    gap: 2px;
  }

  .Team .Doctor:hover .hover {
    width: 100%;
    height: 80%;
    top: 150px;
  }
}

/* End of 1.10. Team section */
/* 1.11. Steps section */
.Steps {
  background-color: #f5f5f5;
  padding: 100px 0px;
}

.Steps .gap-3 h2 {
  color: #2b2d2f;
  padding-top: 30px;
  padding-bottom: 10px;
}

.Steps .gap-3 p {
  color: #2b2d2f;
}

.Steps .gap-md-2 .gmail_p {
  width: min-content;
}

.Steps .gap-3 h4 {
  color: #2b2d2f;
}

.Steps .align-items-start {
  display: flex;
  gap: 50px;
  padding: 20px 0px 0px;
}

.Steps .flex-column hr {
  width: 82%;
  color: #3d3f41;
  opacity: 1;
}

.Steps .gap-2 figure {
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  padding: 20px;
  display: flex;
  background: #0197ec;
  border-radius: 50%;
}

.Steps .gap-2 figure img {
  width: 22px;
}

.Steps .mt-lg-4 {
  padding-top: 10px;
}

.Steps .Doctor {
  position: relative;
  right: -18%;
  z-index: 1;
}

.Steps .Doctor img {
  width: 100%;
  border-radius: 20px;
}

.Steps .z-2 {
  top: 30px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.Steps .d-flex .numbers {
  width: 82px;
  height: 82px;
  padding: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 18px solid #ffffff;
  background: linear-gradient(to bottom, #0197ec, #39ead5);
}

.Steps .d-flex .numbers h2 {
  color: #ffffff;
  transform: scale(0.9);
}

.Steps .position-relative .d-flex h4 {
  color: #2b2d2f;
}

.Steps .position-relative .d-flex p {
  color: #2b2d2f;
  padding: 10px 0px;
}

.Steps .position-relative .d-flex hr {
  width: 100%;
  height: 2px;
  opacity: 1;
  color: #3d3f41;
}

@media screen and (max-width: 1400px) {
  .Steps .z-2 {
    top: 25px;
    gap: 0px;
  }

  .Steps .Doctor img {
    width: 111%;
  }

  .Steps .Doctor {
    right: -12%;
  }

  .Steps .position-relative .d-flex hr {
    margin: 10px 0;
  }
}

@media screen and (max-width: 1199px) {
  .Steps .gap-lg-4 {
    flex-direction: column;
    align-items: start !important;
  }

  .Steps .flex-lg-column {
    flex-direction: row !important;
  }

  .Steps .d-flex .numbers h2 {
    transform: scale(0.7);
  }

  .Steps h4 {
    font-size: 18px;
  }

  .Steps .d-flex .numbers {
    padding: 26px;
  }

  .Steps .Doctor img {
    width: 132%;
  }

  .Steps .Doctor {
    right: 6%;
  }

  .Steps .gap-3 h2 {
    padding-top: 0px;
  }
}

@media screen and (max-width: 991px) {
  .Steps .Doctor img {
    width: 90%;
  }

  .Steps .row {
    row-gap: 50px;
  }

  .Steps .row .col-md-7 {
    align-content: center;
  }

  .Steps .Doctor {
    position: static;
  }

  .Steps .z-2 {
    position: static;
    top: unset;
  }

  .Steps .gap-lg-4 {
    flex-direction: row;
  }

  .Steps .mt-lg-4 {
    padding-top: 20px;
  }

  .Steps .col-md-12 .gap-3:first-child {
    padding-right: 290px;
  }

  .Steps .gap-3 h2 {
    padding-bottom: 0px;
  }
}

@media screen and (max-width: 820px) {
  .Steps .Doctor img {
    width: 95%;
  }
}

@media screen and (max-width: 768px) {
  .Steps .Doctor img {
    width: 100%;
  }

  .Steps {
    padding: 70px 0px 70px;
  }

  .Steps .col-md-12 .gap-3:first-child {
    padding-right: 0px;
    align-items: center;
    justify-content: center;
  }

  .Steps .align-items-start {
    gap: 50px;
  }
}

@media screen and (max-width: 767px) {
  .Steps .Doctor img {
    width: 100%;
  }

  .Steps .gap-3 h2 {
    text-align: center;
  }

  .Steps .gap-3 p {
    text-align: center;
  }

  .Steps .align-items-start {
    gap: 80px;
    justify-content: center;
  }

  .Steps .mt-lg-4 {
    justify-content: center;
    display: flex;
  }

  .Steps .Doctor {
    display: flex;
    justify-content: center;
  }

  .Steps {
    padding: 50px 0px;
  }

  .Steps .z-2 {
    gap: 20px;
    align-items: center;
  }

  .Steps .flex-lg-column .flex-column {
    gap: 0 !important;
  }

  .Steps .col-md-12 .gap-3:first-child {
    padding-right: 0px;
  }

  .Steps .flex-column hr {
    width: 100%;
  }
}

@media screen and (max-width: 480px) {
  .Steps .pe-lg-4 {
    padding: 0px 25px 0px 25px;
  }

  .Steps .align-items-start {
    gap: 8px;

  }

  .Steps .d-flex .numbers h2 {
    transform: scale(1);
  }

  .Steps .row {
    row-gap: 25px;
  }

  .Steps .hover3 {
    padding: 12px 20px;
  }
}

@media screen and (max-width: 430px) {
  .Steps .align-items-start {
    gap: 20px;
    flex-direction: column;
    margin: auto;
    padding: 0px;
  }

  .Steps .d-flex .numbers {
    border: 14px solid #ffffff;
  }

  .Steps .d-flex .numbers h2 {
    transform: scale(1.2);
  }

  .Steps .gap-2 figure img {
    width: 20px;
  }

  .Steps .flex-column hr {
    margin: 0px;
  }

  .Steps .pe-lg-4 {
    padding: 0px;
  }

  .Steps .mt-lg-4 {
    padding-top: 0px;
  }

}

@media screen and (max-width: 320px) {
  .Steps .d-flex .numbers h2 {
    transform: scale(1.2);
  }

  .Steps .z-2 .gap-2 {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }

  .Steps .Doctor img {
    width: 100%;
  }
}

/* End of 1.11. Steps section */
/* 1.12. Bone section */
.Bone {
  margin: 150px 0px;
  background-image: linear-gradient(to bottom, #029aeb, #33e1d7);
}

.Bone_Contant {
  padding: 100px 0px;
}

.Bone h2 {
  padding: 0px 100px 0px 0px;
  color: #2b2d2f;
}

.Bone p {
  padding: 15px 180px 25px 0px;
  color: #2b2d2f;
}

.Bone .gap-3 {
  display: flex;
  align-items: center;
}

.Bone_Doctor figure:first-child {
  position: absolute;
  bottom: -125px;
  right: 177px;
}

.Bone_Doctor figure:first-child img {
  width: 740px;
}

.Bone .disease span {
  font-family: "Roboto", sans-serif;
  color: #2b2d2f;
}

.Bone .disease hr {
  position: absolute;
  background-color: #fff;
  color: #fff;
  width: 60px;
  opacity: 1;
  margin: 0px;
  height: 2px;
}

.Bone .disease div {
  color: #2b2d2f;
  background: #fff;
  border-radius: 50%;
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.Bone .disease1 {
  border: 2px solid #fff;
  padding: 5px;
  border-radius: 50%;
  position: absolute;
  left: 5%;
  bottom: 360px;
}

.Bone .disease1 hr {
  left: 110px;
  top: 50px;
}

.Bone .disease2 {
  border: 2px solid #fff;
  padding: 5px;
  border-radius: 50%;
  position: absolute;
  bottom: 25px;
  left: 0%;
}

.Bone .disease2 hr {
  top: 53px;
  left: 110px;
}

.Bone .disease3 {
  border: 2px solid #fff;
  padding: 5px;
  border-radius: 50%;
  position: absolute;
  bottom: 57px;
  left: 37%;
}

.Bone .disease3 hr {
  top: 54px;
  right: 110px;
}

.Bone_Doctor figure:nth-child(2) {
  position: absolute;
  bottom: 0;
  right: 0px;
}

.Bone_Doctor figure:nth-child(2) img {
  width: 560px;
}

.Bone .gap-3 .hover2 {
  z-index: 10;
}

@media screen and (max-width: 1400px) {
  .Bone_Doctor figure:nth-child(2) img {
    width: 543px;
  }

  .Bone .disease3 {
    left: 31%;
  }

  .Bone_Doctor figure:first-child {
    right: 152px;
  }

  .Bone .disease1 {
    left: -7%;
    bottom: 385px;
  }

  .Bone .disease2 {
    bottom: 156px;
    left: -7%;
  }
}

@media screen and (max-width: 1199px) {
  .Bone {
    margin: 0px 0px 100px 0px;
  }

  .Bone .mt-3 .hover3 {
    padding: 14px 20px 14px 20px;
  }

  .Bone h2 {
    padding: 0px 20px 0px 0px;
  }

  .Bone p {
    padding: 15px 50px 25px 0px;
  }

  .Bone_Doctor figure:first-child {
    right: 60px;
  }

  .Bone_Doctor figure:nth-child(2) {
    right: -32px;
  }

  .Bone_Doctor figure:nth-child(2) img {
    width: 450px;
  }

  .Bone .disease1 {
    left: -13%;
    bottom: 415px;
  }

  .Bone .disease2 {
    bottom: 150px;
    left: -10%;
  }

  .Bone .disease3 {
    left: 34%;
  }

}

@media screen and (max-width: 1024px) {
  .Bone h2 {
    padding: 0px;
  }

  .Bone_Doctor figure:nth-child(2) {
    right: 0px;
  }

  .Bone p {
    padding: 15px 80px 25px 0px;
  }

  .Bone_Doctor figure:nth-child(2) {
    right: -12px;
  }

  .Bone_Doctor figure:nth-child(2) img {
    width: 410px;
  }

  .Bone_Doctor figure:first-child img {
    width: 690px;
  }

  .Bone_Doctor figure:first-child {
    bottom: -14%;
  }

  .Bone .disease hr {
    width: 45px;
  }

  .Bone .disease div {
    width: 85px;
    height: 85px;
  }

  .Bone_Doctor figure:first-child {
    right: 72px;
  }

  .Bone .disease2 {
    bottom: 162px;
    left: -5%;
  }

  .Bone .disease2 hr {
    top: 46px;
    left: 97px;
  }

  .Bone .disease3 {
    left: 32%;
  }

  .Bone .disease3 hr {
    top: 47px;
    right: 96px;
  }

  .Bone .disease1 hr {
    left: 97px;
    top: 46px;
  }

  .Bone .disease1 {
    left: -3%;
    bottom: 390px;
  }
}

@media screen and (max-width: 991px) {
  .Bone {
    margin: 0px;
  }

  .Faqs_Bone {
    margin-bottom: 100px;
  }

  .Bone_Contant {
    padding: 70px 0px;
  }

  .Bone_Doctor {
    display: flex;
  }

  .Bone_Doctor figure:first-child {
    position: relative;
    right: 50px;
  }

  .Bone_Doctor figure:nth-child(2) {
    position: relative;
    right: 70px;
    align-items: end;
    justify-content: end;
    display: flex;
  }

  .Bone_Doctor figure:first-child img {
    width: 135%;
  }

  .Bone_Doctor figure:nth-child(2) img {
    width: 135%;
  }

  .Bone .Position {
    position: unset;
  }

  .Bone .disease3 {
    left: 39%;
    bottom: 187px;
  }

  .Bone .disease1 {
    left: 16%;
    bottom: 76%;
  }

  .Bone .disease2 {
    bottom: 30%;
    left: 15%;
  }

  .Bone h2 {
    padding: 0px 150px 0px 150px;
    text-align: center;
  }

  .Bone p {
    padding: 15px 200px 25px 200px;
    text-align: center;
  }

  .Bone .mt-3 {
    align-items: center;
    justify-content: center;
  }

  .Bone_Contant {
    padding: 70px 0px 20px 0px;
  }
}

@media screen and (max-width: 912px) {
  .Bone .disease1 {
    left: 15%;
  }

  .Bone .disease3 {
    left: 38%;
    bottom: 136px;
  }
}

@media screen and (max-width: 820px) {
  .Bone .disease1 {
    left: 12%;
    bottom: 76%;
  }

  .Bone .disease2 {
    bottom: 25%;
    left: 11%;
  }

  .Bone .disease3 {
    bottom: 154px;
  }
}

@media screen and (max-width: 768px) {
  .Faqs_Bone {
    margin-bottom: 70px;
  }

  .Bone .disease1 {
    left: 11%;
    bottom: 74%;
  }

  .Bone .disease2 {
    bottom: 28%;
  }

  .Bone .disease3 {
    bottom: 118px;
    left: 38%;
  }

  .Bone h2 {
    padding: 0px 50px 0px 50px;
    text-align: center;
  }

  .Bone p {
    padding: 15px 100px 25px 100px;
    text-align: center;
  }

  .Bone_Contant {
    padding: 70px 0px 20px 0px;
  }

  .Bone h2 {
    width: 90%;
    margin: auto;
  }

  .Bone p {
    width: 90%;
    margin: auto;
  }
}

@media screen and (max-width: 540px) {
  .Faqs_Bone {
    margin-bottom: 50px;
  }

  .Bone .disease2 {
    left: 2%;
  }

  .Bone .disease1 {
    left: 1%;
    bottom: 70%;
  }

  .Bone .disease3 {
    bottom: 40px;
    left: 38%;

  }
}

@media screen and (max-width: 480px) {
  .Bone_Contant {
    padding: 50px 0px;
  }

  .Bone_Doctor figure:nth-child(2) {
    right: 20px;
  }

  .Bone_Doctor figure:first-child {
    right: 20px;
  }

  .Bone span {
    font-size: 12px;
  }

  .Bone .disease div {
    width: 65px;
    height: 65px;
  }

  .Bone .disease1 hr {
    left: 77px;
    top: 37px;
    width: 30px;
  }

  .Bone .disease2 hr {
    top: 37px;
    left: 75px;
    width: 30px;
  }

  .Bone .disease3 hr {
    top: 35px;
    right: 76px;
    width: 30px;
  }

  .Bone .disease1 {
    left: 10%;
  }

  .Bone .disease2 {
    left: 9%;
    bottom: 26%;
  }

  .Bone .disease3 {
    top: 67%;
    left: 41%;
    bottom: unset;
  }

  .Bone h2 {
    padding: 0px;
    width: 100%;
  }

  .Bone p {
    padding: 15px 0px 25px 0px;
    width: 100%;
  }

  .Bone_Contant {
    padding: 50px 0px 20px 0px;
  }

  .Bone .mt-3 {
    flex-direction: column;
    gap: 20px;
  }
}

@media screen and (max-width: 430px) {
  .Bone .disease1 {
    left: 7%;
  }

  .Bone .disease2 {
    left: 8%;
    bottom: 33%;
  }
}

@media screen and (max-width: 414px) {
  .Bone .disease2 {
    left: 7%;
    bottom: 32%;
  }

  .Bone .disease1 {
    left: 6%;
  }

  .Bone .disease3 {
    top: 65%;
  }
}

@media screen and (max-width: 375px) {
  .Bone .disease2 {
    left: 4%;
    bottom: 31%;
  }

  .Bone .disease1 {
    left: 2%;
  }

  .Bone .disease3 {
    top: 65%;
  }
}

@media screen and (max-width: 360px) {
  .Bone .disease {
    border: 1px solid #fff;
    padding: 3px;
  }

  .Bone .disease2 {
    left: 2%;
    bottom: 17%;
  }

  .Bone .disease1 {
    left: 5%;
    bottom: 64%;
  }

  .Bone .disease1 hr {
    left: 72px;
    top: 32px;
    width: 24px;
    height: 1px;
  }

  .Bone .disease2 hr {
    top: 32px;
    left: 71px;
    width: 24px;
    height: 1px;
  }

  .Bone .disease3 hr {
    top: 32px;
    right: 72px;
    width: 24px;
    height: 1px;
  }

  .Bone .disease3 {
    top: 62%;
    left: 40%;
  }

  .Bone_Doctor figure:nth-child(2) {
    right: 0px;
  }
}

@media screen and (max-width: 320px) {
  .Bone .disease1 {
    left: 1%;
  }

  .Bone .disease2 {
    left: 1%;
    bottom: 24%;
  }

  .Bone .disease3 {
    top: 60%;
  }

  .Bone_Doctor figure:nth-child(2) img {
    width: 153%;
  }

  .Bone_Doctor figure:nth-child(2) {
    right: -10px;
  }
}

/* End of 1.12. Bone section */
/*  1.13. Blog section */
.Blog {
  padding: 50px 0px 100px;
}

.Blog .BlogCard {
  border: 1px solid #f1f1f1;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0px 37px 40px 0px #0000000d;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 100%;
}

.Blog .BlogCard div:first-child {
  overflow: hidden;
}

.Blog .BlogCard h4 {
  color: #2b2d2f;
  transition: all 0.3s ease-in;
}

.Blog .BlogCard p {
  color: #2b2d2f;
  flex-grow: 1;
}

.Blog .BlogCard img {
  width: 100%;
  transition: all 0.3s ease-in;
}

.Blog .BlogCard img:hover {
  transform: scale(1.1) rotate(3deg);
  border-radius: 10px;
}

.Blog .BlogCard i {
  font-size: 20px;
  color: rgb(1, 175, 236, 0.9);
}

.Blog .BlogCard a:hover h4 {
  color: #01afece6;
}

.Blog .BlogCard a {
  color: #1d448e;
  font-weight: 400;
}

.Blog .BlogCard p {
  color: #2b2d2f;
  padding-right: 50px;
}

.Blog .content {
  padding-top: 110px;
}

.Blog .content h2 {
  color: #2b2d2f;
}

.Blog .content p {
  padding: 15px 40px 0px 0px;
  color: #2b2d2f;
}

.Blog .content .mt-4 .hover2 {
  color: #2b2d2f;
}

.Blog .hover2:hover {
  color: #01afece6;
}

@media screen and (max-width: 1400px) {
  .Blog .content {
    padding-top: 90px;
  }
}

@media screen and (max-width: 1024px) {
  .Blog .BlogCard p {
    padding-right: 0px;
  }

  .Blog .content {
    padding-top: 75px;
  }
}

@media screen and (max-width: 991px) {
  .Blog .BlogCard {
    height: 100%;
  }

  .Blog .content h2 {
    font-size: 32px;
  }

  .Blog .content {
    padding-top: 70px;
  }
}

@media screen and (max-width: 768px) {
  .Blog .content {
    padding: 0px 0px 24px;
    text-align: center;
    width: 80%;
    margin: auto;
  }

  .Blog .content h2 {
    font-size: 32px;
  }

  .Blog .content p:nth-child(2) {
    padding-right: 0px;
  }

  .Blog .content p:nth-child(3) {
    padding: 30px 0px 10px 0px;
  }

  .Blog {
    padding: 70px 0px;
  }

  .Blog .content .d-flex .hover2 {
    margin-top: 20px;
  }

  .Blog .BlogCard {
    height: 100%;
  }

  .Blog .col-lg-4:nth-of-type(1) {
    order: 3;
    flex-basis: 50%;
  }

  .Blog .col-lg-4:nth-of-type(2) {
    order: 2;
    flex-basis: 50%;
  }

  .Blog .col-lg-4:nth-of-type(3) {
    order: 1;
    flex-basis: 100%;
  }

  .Blog .BlogCard p {
    padding-right: 50px;
  }
}

@media screen and (max-width: 767px) {
  .Blog {
    padding: 50px 0px;
  }

  .Blog .row {
    row-gap: 20px;
  }

  .Blog .content {
    width: 100%;
    margin: auto;
    padding: 0px 0px 20px 0px;
    text-align: center;
  }

  .Blog .content p:nth-child(3) {
    padding: 15px 0px 0px 0px;
  }

  .Blog .content p:nth-child(2) {
    padding-top: 18px;
  }
}

@media screen and (max-width: 540px) {

  .Blog .col-lg-4:nth-of-type(1) {
    flex-basis: 100%;
  }

  .Blog .col-lg-4:nth-of-type(2) {
    flex-basis: 100%;
  }
}

@media screen and (max-width: 360px) {
  .Blog .content p {
    font-size: 14px;
  }

  .Blog .content .d-flex {
    justify-content: center;
  }

  .Blog .BlogCard p {
    padding-right: 20px;
  }
}

/* End of 1.13. Blog section */
/*  1.14. Footer section */
footer {
  background-color: #1d448e;
  padding-top: 50px;
}

footer .footer-menu a:hover {
  color: #069fea;
}

footer .col-md-4 .gap-md-4 a {
  width: min-content;
}

footer img {
  width: 240px;
}

footer .SocialIcon {
  padding-top: 10px;
}

footer .SocialIcon i {
  color: #fff;
  transition: all 0.1s ease-in;
  font-size: 21px;
}

footer .SocialIcon i:hover {
  color: #029aeb;
  transform: translateY(-10%);
}

footer p {
  color: #ffff;
  padding: 15px 150px 25px 0px;
}

footer .subscribe .d-flex {
  width: 100%;
  justify-content: space-between;
  align-items: center;
  padding: 40px 0px 40px 0px;
}

footer .subscribe .d-flex h4 {
  color: #ffff;
  white-space: nowrap;
  padding-right: 30px;
}

footer .subscribe .d-flex form {
  width: 100%;
  gap: 20px;
  opacity: 0px;
  display: flex;
  align-items: center;
}

footer .subscribe .d-flex form input {
  width: 70%;
  padding: 14px 20px;
  color: #ffffff;
  gap: 10px;
  border: 0.5px solid #ffffff;
  background-color: transparent;
  outline: none;
  border-radius: 7px;
}

footer .subscribe .d-flex input::placeholder {
  color: #ffff;
}

footer .subscribe .d-flex form button {
  width: 30%;
  padding: 14px 0px;
  font-weight: 500;
  border: none;
  border-radius: 7px;
  color: #1d448e;
  border: 0.6px solid#ffffff;
  background-color: #ffffff;
  transition: 0.3s ease-in-out;
}

footer .subscribe .d-flex form button:hover {
  background-color: transparent;
  color: #ffff;
  border: 0.6px solid #ffff;
}

footer .FooterLinks {
  padding: 40px 0px 20px 0px;
  display: flex;
  justify-content: space-between;
  border: none;
}

footer .subscribe .FooterLinks a {
  color: #fff;
  text-decoration: none;
}

footer .subscribe .FooterLinks ul li {
  padding-bottom: 20px;
}

footer .subscribe .FooterLinks ul li a:hover {
  color: #029aeb;
}

footer hr {
  color: #FFFFFF;
  height: 0.6px;
  opacity: 1;
}

footer .copyright p {
  text-align: center;
  width: 100%;
  padding: 10px 0px 20px 0px;
}

@media screen and (max-width: 1280px) {
  footer p {
    padding: 15px 100px 25px 0px;
  }

  footer .FooterLinks {
    padding: 30px 0px 20px 0px;
  }
}

@media screen and (max-width: 1199px) {
  footer .subscribe .d-flex {
    gap: 10px;
    flex-direction: column;
    padding: 50px 0px 30px 0px;
  }

  footer .gap-md-4 {
    padding-top: 43px;
  }
}

@media screen and (max-width: 1024px) {
  footer .subscribe .d-flex {
    align-items: start;
  }

  footer .FooterLinks {
    padding: 30px 0px 0px 0px;
  }

  footer p {
    padding: 10px 40px 20px 0px;
  }
}

@media screen and (max-width: 991px) {
  .footer-menu {
    padding: 28px 38px 0px 0px;
  }

  .footer-menu ul li a {
    font-size: 14px;
  }

  footer .FooterLinks {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 40px 0px 0px 0px;
  }

  footer .FooterLinks ul {
    width: 150px;
    padding-bottom: 20px;
  }

  footer .gap-md-4 {
    padding-top: 40px;
  }
}

@media screen and (max-width: 820px) {

  footer .gap-md-4 {
    padding-top: 24px;
  }

  footer .FooterLinks {
    padding: 40px 0px 0px 0px;
  }
}

@media screen and (max-width: 768px) {
  footer {
    padding-top: 70px;
  }

  footer .subscribe .d-flex h4 {
    padding-right: 0px;
  }

  footer .gap-md-4 {
    padding-top: 64px;
  }

  footer img {
    width: 200px;
  }

  footer .SocialIcon {
    padding: 24px 0px 0px 0px;
  }

  footer .subscribe .d-flex {
    align-items: start;
    padding: 0px 0px 10px 0px;
  }

  footer .FooterLinks ul {
    width: 35%;
    padding-bottom: 0px;
  }

  footer .FooterLinks {
    padding: 40px 0px 20px 0px;
  }

  footer .FooterLinks ul:nth-child(3) {
    display: none;
  }

  footer .gap-md-4 {
    padding-top: 0px;
  }
}

@media screen and (max-width: 767px) {
  footer .subscribe .d-flex {
    padding: 25px 0px 50px 0px;
  }

  footer p {
    text-align: center;
    padding: 0px 150px 0px 150px;
  }

  footer {
    padding-top: 50px;
  }

  footer .SocialIcon {
    padding: 20px 0px 0px 0px;
    justify-content: center;
  }

  footer .gap-md-4 {
    flex-direction: column !important;
    align-items: center;
    justify-content: center;
  }

  footer .FooterLinks {
    padding: 10px 10px 0px 10px;
  }

  footer .FooterLinks ul {
    padding-bottom: 0px;
  }

  footer .subscribe .d-flex {
    align-items: center;
  }

  footer hr {
    margin: 0px 0px;
  }
}

@media screen and (max-width: 540px) {
  footer form {
    flex-direction: column;
  }

  footer p {
    padding: 0px 100px 0px 100px;
  }

  footer .subscribe .d-flex form input {
    width: 100%;
    padding: 12px 20px;
  }

  footer .subscribe .d-flex form button {
    padding: 12px 0px;
    width: 100%;
  }
}

@media screen and (max-width: 480px) {
  footer .gap-md-4 {
    flex-direction: column !important;
    align-items: center;
    padding-top: 25px;
    width: 100%;
    margin: auto;
    padding: 0px 20px 0px 20px;
    text-align: center;
  }

  footer .FooterLinks {
    padding: 30px 0px 10px 0px;
  }

  footer .subscribe .d-flex form {
    gap: 12px;
  }

  footer .copyright {
    padding-top: 10px;
  }

  footer img {
    width: 180px;
  }

  footer p {
    padding: 0px;
  }

  footer .FooterLinks ul {
    width: 40%;
  }

  footer .FooterLinks ul:nth-child(4) {
    flex-grow: 1;
  }
}

/* End of 1.14. Footer section */
/*========  2.1. NextPages_Hero section ========*/
.NextPages_Hero {
  background: linear-gradient(180deg,
      rgba(6, 158, 235, 0.8) 0%,
      rgba(51, 224, 216, 0.8) 100%),
    url("../image/bg/help-bg.png");
  width: 100%;
  background-position: right;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 100px 0px;
}

.NextPages_Hero h1 {
  color: #2b2d2f;
}

.NextPages_Hero p {
  width: 32%;
  color: #2b2d2f;
}

@media screen and (max-width: 1400px) {
  .NextPages_Hero p {
    width: 46%;
  }
}

@media screen and (max-width: 1024px) {
  .NextPages_Hero p {
    width: 56%;
  }
}

@media screen and (max-width: 768px) {
  .NextPages_Hero {
    padding: 70px 0px;
  }

  .NextPages_Hero h1 {
    text-align: center;
  }

  .NextPages_Hero p {
    width: 100%;
    text-align: center;
    margin: auto;
  }
}


@media screen and (max-width: 767px) {
  .NextPages_Hero {
    text-align: center;
  }

  .NextPages_Hero p {
    width: 100%;
  }
}

@media screen and (max-width: 480px) {
  .NextPages_Hero {
    padding: 50px 0px;
  }
}

/*======== End of 2.1. NextPages_Hero section ========*/
/*======== 2.2. About_healing section ========*/
.About_healing {
  padding: 150px 0px 100px;
}

.About_healing .Doctor {
  width: 100%;
  height: 100%;
}

.About_healing .Doctor img {
  width: 100%;
  border-radius: 20px;
}

.About_healing .gap-lg-4 img {
  width: 90%;
  height: 100%;
  border-radius: 20px;
}

.About_healing .col-lg-5 .gap-lg-2 {
  gap: 24px !important;
  padding: 0px 80px 0 20px;
}

.About_healing .col-lg-5 .mt-3 .gap-2 i {
  color: rgba(55, 231, 213, 1);
}

.About_healing .col-lg-5 span {
  font-family: "Inspiration", "cursive";
  font-weight: 400;
  font-size: 44px;
  line-height: 54px;
  color: rgba(43, 45, 47, 1);
  width: max-content;
  display: inline-block;
}

.About_healing .col-lg-5 hr {
  margin: 0px;
  opacity: 1;
  color: rgba(43, 45, 47, 1);
  position: absolute;
  width: 100%;
  bottom: 21%;
}

.About_healing figure img {
  position: absolute;
  top: -12%;
  width: 48%;
  left: 3%;
}

@media screen and (max-width: 1400px) {
  .About_healing .col-lg-5 .gap-lg-2 {
    gap: 10px !important;
    padding: 0px 30px 0 20px;
  }
}

@media screen and (max-width: 1199px) {
  .About_healing .col-lg-5 .gap-lg-2 {
    padding: 0px;
  }

  .About_healing .hover3 {
    padding: 18px 25px;
  }
}

@media screen and (max-width: 991px) {
  .About_healing {
    padding: 100px 0px 100px;
  }

  .About_healing figure img {
    display: none;
  }

  .About_healing .col-lg-5 .gap-lg-2 {
    gap: 30px !important;
    padding-right: 300px;
  }

  .About_healing .row {
    row-gap: 50px;
  }

  .About_healing .col-md-12 {
    order: 1;
  }

  .About_healing .col-md-7 {
    order: 2;
  }

  .About_healing .col-md-5 {
    order: 3;
  }

  .About_healing .gap-lg-4 img {
    width: 96%;
  }
}

@media screen and (max-width: 768px) {
  .About_healing {
    padding: 70px 0px 70px;
  }

  .About_healing .col-lg-5 .gap-lg-2 {
    padding-right: 0px;
    gap: 20px !important;
  }

  .About_healing .col-lg-5 p {
    width: 90%;
    margin: auto;
    text-align: center;
  }

  .About_healing .col-lg-5 .gap-lg-2 h2 {
    text-align: center;
  }

  .About_healing .col-lg-5 .justify-content-around {
    justify-content: center !important;
  }

  .About_healing .col-lg-5 .justify-content-around p {
    width: 100%;
    text-align: start !important;
  }

  .About_healing .col-lg-5 .mt-lg-3 {
    padding-top: 15px;
    justify-content: center;
  }
}

@media screen and (max-width: 767px) {
  .About_healing {
    padding: 50px 0px 50px;
  }

  .About_healing .col-lg-3 .flex-sm-row {
    gap: 30px;
  }

  .About_healing .gap-lg-4 img {
    width: 100%;
  }

  .About_healing .col-lg-5 .gap-lg-2 {
    padding-right: 0px;
    gap: 20px !important;
  }

  .About_healing .col-lg-5 .flex-sm-column {
    flex-direction: column;
    width: 100% !important;
  }

  .About_healing .row {
    row-gap: 28px;
  }

  .About_healing .col-lg-5 p {
    width: 100%;
  }
}

@media screen and (max-width: 360px) {
  .About_healing .col-lg-5 .mt-lg-3 {
    flex-direction: column;
  }
}

@media screen and (max-width: 320px) {
  .About_healing .col-lg-5 .align-items-end {
    flex-direction: column;
    align-items: center !important;
    gap: 20px;
    margin: auto;
  }
}

/*======== End of 2.2. About_healing section ========*/
/*======== 2.3. Counters section ========*/
.Counters {
  padding: 70px 0px;
}

.Counters hr {
  opacity: 1;
  width: 100%;
  height: 2px;
  color: #D8F1FF;
  margin-top: 100px;
  margin-bottom: 0px;
}

.Counters .col-md-4 .gap-4 {
  background: #FBFBFB;
  border: 1px solid #D8F1FF;
  border-radius: 20px;
  padding: 20px 20px;
  box-shadow: 0px 37px 40px 0px #0000000D;
}

.Counters .col-md-4 .gap-4 span {
  font-size: 44px;
  line-height: 54px;
  font-weight: 400;
  color: #2b2d2f;
}

.Counters .col-md-4 .gap-4 h2 {
  color: #2b2d2f;
}

.Counters .col-md-4 .gap-4 p {
  color: #2b2d2f;
}

.Counters .col-md-4 img[alt="Winner"] {
  padding-top: 15px;
  width: 44px;
}

.Counters .col-md-4 img[alt="Cases"] {
  padding-top: 15px;
  width: 28px;
}

.Counters .col-md-4 img[alt="Happy"] {
  padding-top: 15px;
  width: 44px;
}

.Counters .col-md-4 .Raiting {
  width: 32%;
}

@media screen and (max-width: 1400px) {
  .Counters .col-md-4 .Raiting {
    width: 40%;
  }

  .Counters {
    padding: 70px 0px;
  }
}

@media screen and (max-width: 1199px) {
  .Counters .col-md-4 .Raiting {
    width: 56%;
  }

  .Counters {
    padding: 0px 0px 70px;
  }
}

@media screen and (max-width: 768px) {
  .Counters {
    padding: 0px 0px 35px;
  }

  .Counters .col-md-4 img[alt="Winner"] {
    padding-top: 5px;
  }

  .Counters .col-md-4 img[alt="Cases"] {
    padding-top: 5px;
  }

  .Counters hr {
    margin-top: 35px;
  }
}

@media screen and (max-width: 767px) {
  .Counters {
    padding: 0px 0px 40px;
  }

  .Counters .col-md-4 .Raiting {
    width: unset;
  }

  .Counters .col-md-4 img[alt="Cases"] {
    padding-top: 14px;
    position: relative;
    left: -5px;
  }

  .Counters .col-md-4 img[alt="Winner"] {
    padding-top: 14px;
  }

  .Counters hr {
    margin-top: 50px;
  }

  .Counters .row {
    row-gap: 20px;
  }
}

/*======== End of 2.3. Counters section ========*/
/*========  2.4. Treatment section ========*/
.Treatment {
  padding: 100px 0px;
  background: linear-gradient(360deg, rgba(211, 207, 255, 0) -8.63%, rgba(203, 199, 255, 0.3) 100%);
}

.Treatment .content h2 {
  color: #2b2d2f;
  padding-right: 160px;
}

.Treatment h3 {
  color: #2b2d2f;
}

.Treatment .col-lg-5 figure img {
  width: 96%;
  border-radius: 20px;
}

.Treatment .treatment-p {
  color: #2b2d2f;
  padding: 15px 200px 0px 0px;
}

.Treatment .flex-column {
  padding: 30px 0px 0px;
}

.Treatment .flex-column p {
  width: 410px;
  padding: 10px 0px 20px;
  color: #2b2d2f;
}

.Treatment .circle img {
  width: 46%;
  position: absolute;
  top: -6%;
  right: -1%;
  z-index: -1;
}

.Treatment img[alt="Mission"] {
  width: 48px;
  padding-top: 5px;
}

.Treatment img[alt="Vision"] {
  padding-top: 5px;
  width: 50px;
}

@media screen and (max-width: 1400px) {
  .Treatment .col-lg-5 figure {
    position: relative;
    top: 18%;
  }

  .Treatment .content h2 {
    padding-right: 70px;
  }

  .Treatment .circle img {
    top: 10%;
  }
}

@media screen and (max-width: 1280px) {
  .Treatment .col-lg-5 figure {
    top: 10%;
  }

  .Treatment .treatment-p {
    padding: 30px 0px 0px 0px;
  }

  .Treatment .content h2 {
    padding-right: 0px;
  }
}

@media screen and (max-width: 1199px) {
  .Treatment .circle img {
    width: 43%;
    right: 1px;
  }
}

@media screen and (max-width: 1024px) {
  .Treatment .col-lg-5 figure {
    top: 25%;
  }

  .Treatment .circle img {
    width: 45%;
    top: 22%;
    right: -1%;
  }

  .Treatment .treatment-p {
    padding: 20px 30px 0px 0;
  }
}

@media screen and (max-width: 991px) {
  .Treatment .circle img {
    display: none;
  }

  .Treatment .col-lg-7 .content {
    padding-right: 300px;
  }

  .Treatment .flex-column p {
    width: 100%;
  }

  .Treatment .col-lg-5 figure {
    position: static;
    top: unset;
    padding-top: 30px;
    display: flex;
    justify-content: center;
  }

  .Treatment .col-lg-5 figure img {
    width: 80%;
  }
}

@media screen and (max-width: 768px) {
  .Treatment {
    padding: 70px 0px;
  }

  .Treatment .flex-column {
    width: 78%;
    margin: auto;
  }

  .Treatment .flex-column p {
    padding: 10px 0px 10px;
  }

  .Treatment .col-lg-7 .content {
    padding-right: 0px;
  }

  .Treatment .content h2 {
    text-align: center;
  }

  .Treatment .treatment-p {
    margin: auto;
    width: 90%;
    text-align: center;
    padding: 15px 0px 0px 0;
  }
}

@media screen and (max-width: 767px) {
  .Treatment {
    padding: 50px 0px;
  }

  .Treatment .content h2 {
    margin: auto;
    text-align: center;
  }

  .Treatment .treatment-p {
    width: 100%;
    text-align: center;
    margin: auto;
    padding: 20px 0px;
  }

  .Treatment .flex-column p {
    width: 100%;
    margin: auto;
  }

  .Treatment .flex-column {
    width: 100%;
    text-align: center;
    margin: auto;
    padding: 0px;
  }

  .Treatment .gap-3 {
    flex-direction: column;
  }

  .Treatment .col-lg-7 .content {
    padding-right: 0px;
  }
}

@media screen and (max-width: 480px) {
  .Treatment .col-lg-5 figure img {
    width: 100%;
  }

  .Treatment .col-lg-5 figure {
    padding-top: 40px;
  }
}

/*======== End of 2.4. Treatment section ========*/
/*  3.1. Contact section */
.Contact {
  background: linear-gradient(180deg,
      rgba(6, 158, 235, 0.8) 0%,
      rgba(51, 224, 216, 0.8) 100%);
  width: 100%;
  padding: 100px 0px;
  color: #2b2d2f;
}

.Contact p {
  width: 32%;
}

@media screen and (max-width: 1400px) {
  .Contact p {
    width: 38%;
  }
}

@media screen and (max-width: 1024px) {
  .Contact p {
    width: 56%;
  }
}

@media screen and (max-width: 768px) {
  .Contact {
    padding: 70px 0px;
  }

  .Contact p {
    width: 47%;
  }
}

@media screen and (max-width: 767px) {
  .Contact {
    padding: 50px 0px;
  }

  .Contact h1 {
    width: 100%;
    text-align: center;
  }

  .Contact p {
    text-align: center;
    width: 100%;
  }
}

/* End of 3.1. Contact section */
/*  3.2. Getinformation section */
.Getinformation {
  padding: 100px 0px 0px;
}

.Getinformation .justify-content-center {
  width: 80px;
  height: 80px;
  background: #ffffff;
  border-radius: 50%;
  border: 1px solid #d8f1ff;
  box-shadow: 0px 37px 40px 0px #0000000d;
}

.Getinformation .justify-content-center a i {
  font-size: 26px;
  background: linear-gradient(180deg, #01AFEC 50%, #19B5A2 50%);
  color: transparent;
  background-clip: text;
}

.Getinformation .gap-1 {
  width: 384px;
}

.Getinformation p,
.Getinformation h2,
.Getinformation h4 {
  color: #2b2d2f;
}

.Getinformation .lets-talk {
  width: 100%;
  border: 1px solid #d8f1ff;
  box-shadow: 0px 37px 40px 0px #0000000d;
  background: #ffffff;
  padding: 40px;
  border-radius: 20px;
  position: absolute;
  top: -230px;
  right: 8px;
}

.Getinformation .lets-talk .hover3 {
  padding: 14px 36px 14px 36px;
}

.Getinformation form input {
  padding: 14px;
  color: #848a8f;
  margin-bottom: 16px;
}

.Getinformation form input:focus {
  box-shadow: none;
}

.Getinformation form textarea {
  padding: 14px 0px 80px 14px;
}

.Getinformation form textarea:focus {
  box-shadow: none;
}

.Getinformation hr {
  width: 100%;
  height: 2px;
  border: 2px solid #d8f1ff;
  opacity: 1;
  margin: 100px 0px 150px 0px;
}

@media screen and (max-width: 1024px) {
  .Getinformation .lets-talk {
    width: 95%;
    top: -180px;
  }

  .Getinformation .justify-content-center {
    padding: 20px;
  }
}

@media screen and (max-width: 991px) {
  .Getinformation .lets-talk {
    width: 95%;
  }

  .Getinformation {
    padding: 100px 0px 150px;
  }

  .Getinformation .justify-content-center {
    padding: 30px;
  }

  .Getinformation hr {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .Getinformation {
    padding: 70px 0px 100px;
  }

  .Getinformation .lets-talk {
    top: -150px;
  }

  .Getinformation .justify-content-center {
    width: 70px;
    height: 70px;
  }
}

@media screen and (max-width: 767px) {
  .Getinformation .gap-1 {
    width: 100%;
  }

  .Getinformation {
    padding: 50px 0px 0px;
  }

  .Getinformation h2 {
    text-align: center;
  }

  .Getinformation .lets-talk p {
    text-align: center;
  }

  .Getinformation .lets-talk div:last-child {
    text-align: center;
  }

  .Getinformation .gap-1 {
    width: 100%;
  }

  .Getinformation .lets-talk {
    width: 100%;
    position: static;
    margin: 70px auto;
    padding: 25px 20px;
  }

  .Getinformation .justify-content-center a i {
    font-size: 22px;
  }

  .Getinformation .lets-talk .hover3 {
    width: 100%;
  }

}

@media screen and (max-width: 480px) {
  .Getinformation .gap-1 {
    width: 100%;
  }

  .Getinformation .lets-talk {
    margin: 50px auto;
  }

  .Getinformation .justify-content-center {
    padding: 30px;
  }

  .Getinformation .lets-talk {
    width: 100%;
    text-align: center;
  }
}

@media screen and (max-width: 320px) {
  .Getinformation .gap-5 .gap-4 {
    flex-direction: column;
    text-align: center;
  }

  .Getinformation .justify-content-center {
    margin: auto;
  }
}

/* End of 3.2. Getinformation section */
/*  3.3. Map section */
.Map {
  padding: 100px 0px;
}

.Map .social-media {
  width: 254px;
  background: linear-gradient(180deg, #0197ec 0%, #39ead5 99.02%);
  padding: 24px 60px;
  text-align: center;
  border-radius: 20px;
  box-shadow: 0px 37px 40px 0px #0000000d;
  position: absolute;
  top: -26%;
  right: 15%;
}

.Map h4 {
  color: #ffff;
  padding-bottom: 24px;
}

.Map .justify-content-center {
  width: 50px;
  height: 50px;
  background: #ffffff;
  border-radius: 50%;
}

.Map .d-flex {
  gap: 14px;
  text-align: center;
  margin-bottom: 10px;
}

.Map .d-flex a {
  color: #ffffff;
}

.Map .d-flex a i {
  font-size: 26px;
  color: rgb(1, 175, 236, 0.9);
  display: inline-block;
}

@media screen and (max-width: 768px) {
  .Map {
    padding: 70px 0px 70px 0px;
  }

  .Map .social-media {
    top: -90px;
  }
}

@media screen and (max-width: 767px) {
  .Map {
    padding: 50px 0px 50px 0px;
  }

  .Map .social-media {
    position: absolute;
    top: -10%;
    right: 15%;
  }
}

@media screen and (max-width: 540px) {
  .Map .social-media {
    width: 60%;
    position: relative;
    top: -60px;
    right: unset;
    display: flex;
    flex-direction: column;
    margin: auto;
    padding: 15px 20px 10px 20px;
  }

  .Map .d-flex {
    gap: 20px;
    margin: 5px auto;
  }

  .Map h4 {
    width: 60%;
    margin: auto;
    padding-bottom: 5px;
  }
}

@media screen and (max-width: 480px) {
  .Map h4 {
    width: 70%;
  }
}

@media screen and (max-width: 360px) {
  .Map .social-media {
    width: 100%;
    top: -55px;
    align-items: center;
  }

  .Map .d-flex {
    gap: 10px;
  }

  .Map h4 {
    width: 56%;
  }
}

/* End of 3.3. Map section */
/*======== 4.1. Latest section */
.Latest {
  padding: 100px 0px;
}

.Latest .row {
  row-gap: 20px;
}

.Latest h2 {
  color: #2b2d2f;
}

.Latest .BlogCard {
  height: 100%;
}

.Latest .justify-content-between {
  padding: 0px 0px 50px 0px;
}

.Latest form {
  display: flex;
  position: relative;
  align-items: center;
}

.Latest form input {
  padding: 14px 100px 14px 10px;
  border-radius: 10px;
  border: 1px solid #848a8f;
}

.Latest form input:focus {
  outline: none;
}

.Latest form button {
  position: absolute;
  right: 10px;
  border: none;
  background: none;
}

.Latest form button i {
  font-size: 20px;
  color: #848a8f;
}

@media screen and (max-width: 991px) {
  .Latest .BlogCard h4 {
    padding-right: 50px;
  }
}

@media screen and (max-width: 768px) {
  .Latest form button {
    right: 0;
    width: 0;
  }

  .Latest {
    padding: 70px 0px;
  }

  .Latest .col-lg-4:nth-of-type(1),
  .Latest .col-lg-4:nth-of-type(2),
  .Latest .col-lg-4:nth-of-type(3) {
    flex-basis: unset;
  }

  .Latest .justify-content-between {
    padding: 0px 0px 30px 0px;
  }
}

@media screen and (max-width: 767px) {

  .Latest {
    padding: 50px 0px;
  }
}

@media screen and (max-width: 480px) {
  .Latest .justify-content-between {
    flex-direction: column;
  }

  .Latest form input {
    width: 100%;
    padding: 12px 160px 12px 10px;
    margin-top: 10px;
  }

  .Latest form button {
    top: 16px;
  }
}

@media screen and (max-width: 360px) {
  .Latest form input {
    padding: 10px 50px 10px 10px;
  }

  .Latest .BlogCard h4 {
    padding-right: 20px;
  }
}

/*========End of 4.1. Latest section */
/*  5.1. BlogDetail section */
.BlogDetail {
  background: linear-gradient(180deg, #0197ec 0%, #39ead5 100%);
  width: 100%;
  padding: 120px 0px;
  position: relative;
}

.BlogDetail h1 {
  color: #2b2d2f;
}

.BlogDetail p {
  padding: 15px 0px 0px 0px;
  width: 40%;
  color: #2b2d2f;
}

@media screen and (max-width: 1400px) {
  .BlogDetail p {
    width: 46%;
  }
}

@media screen and (max-width: 1024px) {
  .BlogDetail p {
    width: 56%;
  }
}

@media screen and (max-width: 768px) {
  .BlogDetail {
    padding: 70px 0px;
  }

  .BlogDetail p {
    padding-bottom: 15px;
    text-align: center;
    width: 100%;
  }

  .BlogDetail h1 {
    text-align: center;
  }
}

@media screen and (max-width: 767px) {
  .BlogDetail {
    padding: 50px 0px;
  }

  .BlogDetail p {
    margin: auto;
    width: 100%;
    padding-bottom: 25px;
  }
}

@media screen and (max-width: 480px) {
  .BlogDetail p {
    padding-bottom: 15px;
  }
}

/* End of 5.1. BlogDetail section */
/*  5.2. BlogComment section */
.BlogComment {
  position: relative;
  top: -110px;
}

.BlogComment h2 {
  color: #2b2d2f;
}

.BlogComment p {
  color: #2b2d2f;
}

.BlogComment figure img {
  width: 100%;
  border-radius: 20px;
}

.BlogComment .reply {
  width: 600px;
  margin-top: 30px;
}

.BlogComment .gap-4 i {
  font-size: 22px;
  color: rgb(1, 175, 236, 0.9);
}

.BlogComment .reply .pt-lg-4 {
  color: #2b2d2f;
}

.BlogComment .reply form {
  padding-top: 50px;
}

.BlogComment .reply form .gap-2 input {
  margin-top: 6px !important;
}

.BlogComment .reply form label {
  color: #2b2d2f;
}

.BlogComment .reply form textarea {
  padding: 20px;
  border-color: #848a8f;
}

.BlogComment .reply form textarea:focus {
  box-shadow: none;
}

.BlogComment .reply form input {
  padding: 20px;
  border-color: #848a8f;
}

.BlogComment .reply form input:focus {
  box-shadow: none;
}

.BlogComment .reply form div:last-child {
  margin-top: 50px;
}

.BlogComment .hover3 {
  padding: 16px 36px 16px 36px;
}

@media screen and (max-width: 1199px) {
  .BlogComment {
    top: -80px;
  }
}

@media screen and (max-width: 991px) {
  .BlogComment p {
    padding-right: 215px;
  }

  .BlogComment .reply {
    margin-top: 20px;
  }
}

@media screen and (max-width: 768px) {
  .BlogComment {
    top: -64px;
  }

  .BlogComment p {
    padding-right: 0px !important;
    text-align: center;
    margin: auto;
  }

  .BlogComment h2 {
    text-align: center;
  }

  .BlogComment .reply form {
    padding-top: 30px;
  }

  .BlogComment form p {
    text-align: start;
  }

  .BlogComment .reply form input {
    padding: 15px;
  }

  .BlogComment .reply {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .BlogComment p {
    padding-right: 0px;
  }

  .BlogComment .gap-4 i {
    font-size: 20px;
  }

  .BlogComment .reply form input {
    padding: 12px;
  }

  .BlogComment .reply form textarea {
    padding: 12px;
  }

  .BlogComment .reply button {
    display: flex;
    margin: auto;
  }

  .BlogComment .reply form div:last-child {
    margin-top: 25px;
  }

  .BlogComment .hover3 {
    padding: 12px 20px 12px 20px;
  }

  .BlogComment .reply form {
    padding-top: 15px;
  }
}

@media screen and (max-width: 480px) {
  .BlogComment .reply form textarea {
    padding: 0px;
  }

  .BlogComment .reply form input {
    padding: 8px;
  }

  .BlogComment {
    top: -50px;
  }
}

/* End of 5.2. BlogComment section */
/*======== 6.1. ServiceCards section ========*/
.ServiceCards {
  position: relative;
  top: 160px;
  z-index: 2;
}

.ServiceCards .text-center {
  background: #ffffff;
  border: 1px solid #d8f1ff;
  box-shadow: 0px 37px 40px 0px #0000000d;
  border-radius: 20px;
  padding: 64px;
  height: 100%;
}

.ServiceCards .text-center:hover {
  border: 1px solid #0197EC;
}

.ServiceCards .row {
  row-gap: 25px;
}


.ServiceCards p {
  color: #2b2d2f;
  font-size: 14px;
  line-height: 16px;
}

.ServiceCards h4 {
  color: #2b2d2f;
}

.ServiceCards .text-center img {
  width: 66px;
}

.ServiceCards .text-center img[alt="Message"] {
  width: 68px;
}

.ServiceCards .text-center img[alt="sport"] {
  width: 72px;
}

.ServiceCards .text-center img[alt="therapy"] {
  width: 56px;
}

.ServiceCards .text-center img[alt="pilates"] {
  width: 59px;
}

@media screen and (max-width: 1199px) {
  .ServiceCards .text-center {
    padding: 28px;
  }
}

@media screen and (max-width: 1024px) {
  .ServiceCards {
    top: 150px;
  }
}

@media screen and (max-width: 991px) {
  .ServiceCards {
    top: 144px;
  }
}

@media screen and (max-width: 768px) {
  .ServiceCards .text-center {
    padding: 30px 10px;
  }

  .ServiceCards {
    top: 80px;
  }
}

@media screen and (max-width: 767px) {
  .ServiceCards {
    position: relative;
    height: 100%;
    top: unset;
    padding: 50px 0px 50px 0px;
  }

  .ServiceCards .text-center {
    padding: 30px 30px;
  }
}

@media screen and (max-width: 320px) {
  .ServiceCards .text-center {
    padding: 40px 20px;
  }
}

/*========End of 6.1. ServiceCards section ========*/
/*======== 6.2. Avail section ========*/
.Avail {
  background: linear-gradient(180deg, #0197ec 0%, #39ead5 100%);
  width: 100%;
  padding: 200px 0px 150px;
  z-index: 2;
}

.Avail p,
.Avail h2 {
  color: #2b2d2f;
}

.Avail .text {
  margin: auto;
  width: 662px;
  padding-top: 30px;
  text-align: center;
}

@media screen and (max-width: 991px) {
  .Avail .text {
    padding-top: 0px;
  }
}

@media screen and (max-width: 768px) {
  .Avail {
    padding: 100px 0px 100px;
  }

  .Avail .text {
    width: 496px;
  }
}

@media screen and (max-width: 767px) {
  .Avail {
    padding: 40px 0px 80px;
  }

  .Avail .text {
    width: 100%;
  }
}

/*========End of 6.2. Avail section ========*/
/*  6.3. ServicesForm section ==*/
.ServicesForm {
  position: relative;
  top: -80px;
}

.ServicesForm .Service-input {
  padding: 50px 30px;
}

@media screen and (max-width: 768px) {
  .ServicesForm {
    padding-bottom: 25px;
  }
}

@media screen and (max-width: 767px) {
  .ServicesForm {
    padding-bottom: 15px;
    top: -48px;
  }
}

/* End of 6.3. ServicesForm section ==*/
/*======== 7.1. Testimonial section ========*/
.Testimonial {
  padding: 125px 0px 100px;
}

.Testimonial .person {
  background: #ffffff;
  box-shadow: 0px 37px 40px 0px #0000000d;
  padding: 30px 50px;
  border-radius: 20px;
  position: relative;
}

.Testimonial .row {
  row-gap: 80px;
}

.Testimonial .person p {
  color: #2b2d2f;
}

.Testimonial .person img {
  width: 140px;
  position: absolute;
  top: -40px;
  right: 30px;
  border-radius: 50%;
}

.Testimonial .person a {
  color: #0197ec;
}

.Testimonial .d-flex i {
  color: #f5b83d;
}

@media screen and (max-width: 1280px) {
  .Testimonial .person {
    padding: 30px 36px;
  }
}

@media screen and (max-width: 1199px) {
  .Testimonial .person {
    padding: 30px 20px;
  }

  .Testimonial .person img {
    width: 110px;
  }
}

@media screen and (max-width: 768px) {
  .Testimonial {
    padding: 90px 0px 70px;
  }
}

@media screen and (max-width: 767px) {
  .Testimonial {
    padding: 70px 0px 50px;
  }
}

@media screen and (max-width: 320px) {
  .Testimonial .person img {
    top: 10px;
    width: 80px;
  }

  .Testimonial .person p {
    padding: 0px 0px 5px 0px !important;
  }

  .Testimonial .person .pt-4 {
    padding: 4px 0px 0px !important;
  }
}

/*======== End of 7.1. Testimonial section ========*/
/*  8.1. Accordians section */
.Accordians {
  padding: 100px 0px 80px;
  background-color: #fbfbfb;
}

.Accordians .accordion-button {
  font-family: "Marcellus", serif;
  font-size: 22px;
}

.Accordians .accordion-button:not(.collapsed) {
  color: #F1F1F1;
}

.Accordians .accordion-button.collapsed,
.Accordians p {
  color: #2b2d2f;
}

.Accordians .accordion-item .accordion-body {
  padding: 14px;
}

.Accordians .accordion-button::after {
  background-image: url("../image/icons/accordion-btn.svg");
}

.Accordians .accordion-button:not(.collapsed)::after {
  transform: rotate(180deg);
  background-image: url("../image/icons/accordion-btn-open.svg");
  color: #F1F1F1;
}

.Accordians .accordion-button:not(.collapsed) {
  background-color: #1d448e !important;
  color: #F1F1F1;
  border: none;
  border-radius: 7px;
}

.Accordians .accordion-button:focus {
  box-shadow: none;
  border: none;
}

.Accordians .accordion-button .collapsed {
  background-color: transparent !important;
  border: none;
}

.Accordians .accordion .accordion-button {
  padding: 14px;
}

.Accordians .accordion .accordion-item {
  margin-bottom: 20px;
  border: none;
  border-radius: 7px;
}

@media screen and (max-width: 768px) {
  .Accordians {
    padding: 70px 0px 40px;
  }

  .Accordians .accordion-button {
    font-size: 18px;
  }
}

@media screen and (max-width: 480px) {
  .Accordians {
    padding: 50px 0px 30px;
  }

  .Accordians .accordion-item .accordion-body {
    font-size: 14px;
  }
}

@media screen and (max-width: 320px) {
  .Accordians .accordion .accordion-button {
    padding: 8px;
  }
}

/* End of 8.1. Accordians section */
/* 9.1. Team_Hero section */
.Team_Hero {
  background: linear-gradient(180deg, #0197ec 0%, #39ead5 100%);
  width: 100%;
  padding: 100px 0px;
}

.Team_Hero p {
  color: #2b2d2f;
  width: 40%;
}

.Team_Hero .pt-2,
.Team_Hero h1 {
  color: #2b2d2f;
}

@media screen and (max-width: 1400px) {
  .Team_Hero p {
    width: 46%;
  }
}

@media screen and (max-width: 1024px) {

  .Team_Hero p {
    width: 56%;
  }
}

@media screen and (max-width: 768px) {
  .Team_Hero {
    padding: 70px 0px;
  }

  .Team_Hero h1 {
    text-align: center;
  }

  .Team_Hero p {
    width: 90%;
    text-align: center;
    margin: auto;
    padding-bottom: 15px;
  }
}

@media screen and (max-width: 767px) {
  .Team_Hero {
    padding: 50px 0px;
    text-align: center;
  }

  .Team_Hero p {
    width: 100%;
  }
}

/*======== End of 9.1. Team_Hero section ========*/
/*========  9.2. Team_Cards section ========*/
.Team_Cards .flex-column {
  width: 50%;
  padding: 40px 16px;
  border-radius: 20px;
  border: 1px solid #d8f1ff;
  box-shadow: 0px 40px 40px 0px #0000000d;
  background: #ffffff;
}

.Team_Cards .flex-column:hover {
  border: 1px solid #0197EC;
}

.Team_Cards p,
.Team_Cards h4 {
  color: #2b2d2f;
}

.Team_Cards img {
  width: 65px;
}

.Team_Cards {
  position: relative;
  top: -120px;
}

@media screen and (max-width: 1024px) {
  .Team_Cards {
    top: -90px;
  }
}

@media screen and (max-width: 991px) {
  .Team_Cards {
    top: -65px;
  }

  .Team_Cards .flex-column {
    padding: 50px 40px;
  }
}

@media screen and (max-width: 767px) {
  .Team_Cards {
    position: static;
    padding: 50px 0px;
  }

  .Team_Cards .row .d-flex:first-child {
    flex-direction: column;
  }

  .Team_Cards .flex-column {
    width: 100%;
  }
}

/*======== End of 9.2. Team_Cards section ========*/
/*========  9.3. AllTeam section ========*/
.AllTeam {
  padding: 0px 0px 100px;
}

.AllTeam .row {
  row-gap: 50px;
}

@media screen and (max-width: 1024px) {
  .AllTeam {
    padding: 0px 0px 100px;
  }
}

@media screen and (max-width: 991px) {
  .AllTeam .Doctor:hover .hover {
    top: 126px;
  }
}

@media screen and (max-width: 768px) {
  .AllTeam {
    padding: 0px 0px 70px;
  }

  .AllTeam .Doctor:hover .hover {
    top: 100px;
  }
}

@media screen and (max-width: 540px) {
  .AllTeam .row {
    row-gap: 15px;
  }

  .AllTeam {
    padding: 0px 0px 50px;
  }

  .AllTeam .Doctor:hover .hover {
    top: 270px;
  }
}

@media screen and (max-width: 480px) {
  .AllTeam .Doctor:hover .hover {
    top: 250px;
  }
}

@media screen and (max-width: 360px) {
  .AllTeam .Doctor:hover .hover {
    top: 194px;
  }
}

@media screen and (max-width: 320px) {
  .AllTeam .Doctor:hover .hover {
    top: 150px;
  }
}

/* End of 9.3 AllTeams section */
/* 10.1. Comming section */

.Comming {
  width: 100%;
  min-height: 100svh;
  background: linear-gradient(180deg,
      rgba(1, 151, 236, 0.9) 0%,
      rgba(57, 234, 213, 0.9) 100%),
    url("../image/BG/comming.jpg") no-repeat center/cover;
  background-attachment: fixed;
  padding: 150px 0px 10px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.Comming .gap-2 {
  padding: 0px 30px 0px 30px;
  width: 80%;
  margin: auto;
}

.Comming .gap-2 h1 {
  font-size: 150px;
  color: #2b2d2f;
}

.Comming .gap-2 .pt-2 {
  padding-top: 50px !important;
}

.Comming p {
  color: #2b2d2f;
}

.Comming .gap-2 p {
  width: 698px;
  padding-top: 70px;
}

.Comming .gap-3 p {
  width: 298px;
}

.Comming .flex-column:nth-child(2) {
  padding-top: 70px;
}

.Comming .flex-column .gap-3 .gap-3 {
  padding: 20px 0px;
}

.Comming .flex-column .gap-3 p {
  width: 330px;
  text-align: center;
}

.Comming .flex-column .gap-3 a i {
  color: #2b2d2f;
  font-size: 22px;
  transition: all 0.2s ease-in;
}

.Comming .flex-column .gap-3 a i:hover {
  color: #0197ec;
  transform: translateY(-20%);
}

@media screen and (max-width: 1400px) {
  .Comming .gap-2 {
    width: 100%;
  }
}

@media screen and (max-width: 1199px) {
  .Comming .gap-2 h1 {
    font-size: 130px;
  }
}

@media screen and (max-width: 820px) {
  .Comming .gap-2 h1 {
    font-size: 110px;
  }

  .Comming .gap-2 .pt-2 {
    padding-top: 20px !important;
  }

  .Comming {
    padding: 100px 0px 10px 0px;
  }

  .Comming .gap-2 p {
    padding-top: 50px;
  }
}

@media screen and (max-width: 767px) {
  .Comming .gap-2 p {
    width: 100%;
  }

  .Comming .gap-2 h1 {
    font-size: 80px;
  }
}

@media screen and (max-width: 540px) {
  .Comming .gap-2 {
    padding: 0px 0px 0px 0px;
  }

  .Comming .gap-2 p {
    padding-top: 40px;
  }
}

@media screen and (max-width: 480px) {
  .Comming .gap-2 h1 {
    font-size: 60px;
  }

  .Comming p {
    width: 100%;
  }
}

@media screen and (max-width: 375px) {
  .Comming .gap-2 h1 {
    font-size: 50px;
  }

  .Comming .gap-2 .pt-2 {
    padding-top: 10px !important;
  }
}

@media screen and (max-width: 360px) {
  .Comming .gap-2 h1 {
    font-size: 44px;
  }

  .Comming .gap-2 .pt-2 {
    padding-top: 0px !important;
  }

  .Comming .gap-2 p {
    padding-top: 20px;
  }

  .Comming .flex-column:nth-child(2) {
    padding-top: 50px;
  }

  .Comming .gap-3 p {
    width: 100%;
  }
}

@media screen and (max-width: 320px) {
  .Comming .gap-2 h1 {
    font-size: 40px;
  }
}

/* End of 10.1. Comming section */
/* 11.1. Error section */
.Error {
  width: 100%;
  min-height: 100svh;
  background: linear-gradient(180deg,
      rgba(1, 151, 236, 0.9) 0%,
      rgba(57, 234, 213, 0.9) 100%),
    url("../image/BG/error.jpg") no-repeat center/cover;
  background-attachment: fixed;
  padding: 150px 0px 10px 0px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.Error h1 {
  color: #2b2d2f;
}

.Error p {
  color: #2b2d2f;
}

.Error .gap-3 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 0px 30px 0px 30px;
}

.Error .gap-3 h1 {
  font-size: 150px;
}

.Error .gap-3 p {
  color: #2b2d2f;
  width: 680px;
  padding-top: 40px;
}

.Error .gap-3 .d-flex {
  margin-top: 40px;
}

.Error .flex-column {
  margin-top: 40px;
}

.Error .flex-column:last-child p {
  color: #2b2d2f;
  width: 280px;
  text-align: center;
}

.Error .flex-column a i {
  color: #2b2d2f;
  font-size: 22px;
  transition: all 0.2s ease-in;
}

.Error .flex-column .gap-4 a i:hover {
  transform: translateY(-20%);
  color: #0197ec;
}

@media screen and (max-width: 1024px) {
  .Error .gap-3 h1 {
    font-weight: 400;
  }
}

@media screen and (max-width: 767px) {
  .Error .gap-3 p {
    width: 100%;
    padding-top: 70px;
  }

  .Error .gap-3 {
    padding: 0px;
  }

  .Error .gap-3 .d-flex {
    margin-top: 15px;
  }

  .Error .flex-column {
    margin-top: 15px;
  }

  .Error {
    padding: 50px 0px 10px 0px;
  }
}

@media screen and (max-width: 480px) {
  .Error .gap-3 h1 {
    font-size: 120px;
  }

  .Error .flex-column .gap-3 {
    padding: 10px 0px;
  }

  .Error .gap-3 p {
    padding-top: 50px;
  }

  .Error .flex-column p {
    width: 100%;
  }

  .Error .hover3 {
    padding: 12px 20px;
  }
}

@media screen and (max-width: 320px) {
  .Error .flex-column:last-child p {
    width: 100%;
  }
}

/*End of 11.1. Error section */