html,
  body {
    height: 100%;
    margin: 0;
  }

  .container-fluids {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .g_slide {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .switch_main {
    width: 100%;
    height: 100%;
    display: flex;
    overflow: hidden;
    position: relative;
  }

  .switch_item {
    flex: 1 0 auto;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .switch_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .g_slide .item {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
  }

  .switch_main {
    position: relative;
  }

  .g_slide .switch_nav {
    width: 100%;
    position: absolute;
    right: 0;
    bottom: 10px;
    z-index: 11;
    text-align: center;
  }

  .g_slide .switch_nav_item:hover {
    text-decoration: none;
    display: none;
  }

  .switch_nav_item {
    display: none;
  }

  .g_slide .switch_nav_item_current {
    background: #eb6100;
  }

  /* 
  .g_slide .prev,
  .g_slide .next {
    position: absolute;
    top: 50%;
    z-index: 10;
    margin-top: -15px;
    width: 18px;
    height: 30px;
    overflow: hidden;
    background: url(slide.png) no-repeat;
    transition: margin-left .3s ease, margin-right .3s ease;
  }

  .g_slide .prev {
    left: -18px;
  } 

  .g_slide .next {
    right: -18px;
    background-position: -19px 0;
  }

  .g_slide .prev:hover {
    background-position: 0 -70px;
  }

  .g_slide .next:hover {
    background-position: -19px -70px;
  }

  .g_slide:hover .prev {
    margin-left: 28px;
  } 

  .g_slide:hover .next {
    margin-right: 28px;
  } */

  .scroll {
    position: relative;
    width: 100%;
    height: 117px;
    border: solid 1px #dfdfdf;
    overflow: hidden;
  }

  .scroll .item {
    float: left;
    width: 100%;
    height: 100%;
    border-right: solid 1px #dfdfdf;
  }

  .scroll .switch_item {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }

  /* .scroll .prev,
  .scroll .next {
    position: absolute;
    top: 50%;
    margin-top: -20px;
    overflow: hidden;
    background: url(slide.png) no-repeat;
  }

  .scroll .prev {
    left: 0;
    background-position: 0 -31px;
  }

  .scroll .next {
    right: 0;
    background-position: -20px -31px;
  }

  .scroll .prev:hover {
    background-position: 0 -101px;
  }

  .scroll .next:hover {
    background-position: -20px -101px;
  } */





  /* --------------------------------------------------------- */

  /* html, body {
    height: 100%;
    margin: 0;
  }

  .container-fluids {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .g_slide {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .switch_main {
    width: 100%;
    height: 100%;
    display: flex;
    overflow: hidden;
  }

  .switch_item {
    flex: 1 0 auto;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .switch_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  html.body{
    height: 100%;
    padding: 0px;
    margin: 0px;
  }
  .g_slide {
    position: relative;
    width: 100%;
    height: 350PX;
    overflow: hidden;
  }
  .switch_main img{
    width: 100vw;
    height: 100vh;
  }

  .g_slide .item {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
  }

  .switch_main { position: relative; }

  .g_slide .switch_nav {
    width: 100%;
    position: absolute;
    right: 0;
    bottom: 10px;
    z-index: 11;
    text-align: center;
  }

  .g_slide .switch_nav_item {
    display: inline-block;
    margin: 0 10px 0 0;
    width: 13px;
    height: 13px;
    line-height: 200px;
    overflow: hidden;
    font-size: 0;
    border-radius: 100%;
    background: #b7b7b7;
    text-align: center;
    font-size: 18px;
    color: #fff;
  } 

  .g_slide .switch_nav_item:hover { text-decoration: none; }

  .g_slide .switch_nav_item_current { background: #eb6100; }

  .g_slide .prev,
  .g_slide .next {
    position: absolute;
    top: 50%;
    z-index: 10;
    margin-top: -15px;
    width: 18px;
    height: 30px;
    overflow: hidden;
    background: url(slide.png) no-repeat;
    transition: margin-left .3s ease, margin-right .3s ease;
  }

  .g_slide .prev {
    left: -18px;
    _left: 10px;
  }

  .g_slide .next {
    right: -18px;
    _right: 10px;
    background-position: -19px 0;
  }

  .g_slide .prev:hover { background-position: 0 -70px; }

  .g_slide .next:hover { background-position: -19px -70px; }

  .g_slide:hover .prev { margin-left: 28px; }

  .g_slide:hover .next { margin-right: 28px; }

  .scroll {
    position: relative;
    width: 100%;
    height: 117px;
    border: solid 1px #dfdfdf;
    overflow: hidden;
  }

  .switch_main { position: relative; }

  .scroll .item {
    float: left;
    width: 100%;
    height: 100%;
    border-right: solid 1px #dfdfdf;
  }

  .scroll .switch_item {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }

  .scroll .prev,
  .scroll .next {
    position: absolute;
    top: 50%;
    margin-top: -20px;
    width: 19px;
    height: 39px;
    overflow: hidden;
    background: url(slide.png) no-repeat;
  }

  .scroll .prev {
    left: 0;
    background-position: 0 -31px;
  }

  .scroll .next {
    right: 0;
    background-position: -20px -31px;
  }

  .scroll .prev:hover { background-position: 0 -101px; }

  .scroll .next:hover { background-position: -20px -101px; }   */


  /* -----------------------clinic----------------------------------------------- */
  body {
    margin: 0;
  }

  .header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    padding-right: 10px;
    background-color: #fff;
    font-family: Arial, sans-serif;
  }

  .logo {
    display: flex;
    align-items: center;
  }

  .logo img {
    width: 80px;
    height: 65px;
    margin-right: 10px;
  }

  .logo h1 {
    font-size: 1.2em;
    margin: 0;
    color: #4CAF50;
  }

  .logo p {
    margin: 0;
    color: #4CAF50;
    font-size: 0.7em;
  }

  .contact {
    display: flex;
    align-items: center;
  }

  .contact-item {
    display: flex;
    align-items: center;
    margin-left: 20px;
  }

  .contact-item img {
    width: 50px;
    height: 55px;
    margin-right: 0px;
  }

  .emailicon {
    display: flex;
    align-items: center;
    margin-left: 20px;
  }

  .emailicon img {
    width: 20px;
    height: 25px;
    margin-right: 10px;
  }

  .contact-item p,
  .emailicon p {
    margin: 0;
    color: #4CAF50;
    font-size: 0.8em;
  }

  .emailicon p:first-child {
    font-weight: bold;
  }

  .contact-item p:first-child {
    font-weight: bold;
  }

  @media (max-width: 768px) {
    .header {
      flex-direction: column;
      text-align: center;
      background: #fff;
    }

    .contact {
      flex-direction: column;
      margin-top: 10px;
      display: none;
    }

    .contact-item {
      margin-left: 0;
      margin-bottom: 10px;
      /* display: none; */
    }
  }

  .navbar {
    transition: top 0.3s;
    width: 100%;
    background: green;
  }

  .sticky {
    position: fixed;
    top: 0px;
    z-index: 1000;
  }

  .navbar-collapse {
    background: green;
    padding-left: 3rem;
  }

  .nav-item {
    color: white;
  }

  .navbar ul {

    color: white;
  }

  ul .dropdown-menu {
    background: green;
  }

  .dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
    background: white;
    color: white;
    /* color: black; */
  }

  .navbar .dropdown-item:hover {
    background: green;

  }

  .navbar-nav .nav-link {
    position: relative;
    display: inline-block;
    padding-bottom: 5px;
    color: white;
  }

  .navbar-nav .nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    display: block;
    left: 10px;
    bottom: 0;
    background: white;
    transition: width 0.3s;
    align-items: center;
    color: white;
  }

  .navbar-nav .nav-link:hover {
    color: white;
  }

  .navbar-nav .nav-link:hover::after {
    width: 70%;
    text-align: center;
  }




  .dropdown-toggle::after {
    display: none;
  }




  .navbar .nav-link {
    border: 1px solid white;

  }

  .navbar .nav-link {
    border-top: none;
    border-bottom: none;
  }

  @media (max-width:768px) {
    .navbar .nav-link {
      border: none;

    }
  }

  .carousel-item img {
    height: 90vh;
    object-fit: cover;
  }

  @media (max-width:768px) {
    .carousel-item img {
      height: 100%;
    }
  }


  .sicks-item {
    border: 1px solid black;


  }

  .sick {

    display: flex;
    justify-content: center;

    margin-top: 3rem;
    margin-bottom: 3rem;

  }


  /* ------------------------------coedpen----------- */

  .sick {
    display: flex;
    /* width: 70%; */
    /* transform: translateY(-50%); */
    z-index: 5;
    /* margin-left: 4rem; */
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 0px;

    transform: translateY(-50%);

  }

  .sickcard {
    flex: 1 1 calc(15% - 15px);
    box-sizing: border-box;
    padding: 10px;
    border: 1px solid #ccc;


  }

  .sickcard img {
    width: 20%;
    height: auto;
  }

  .sickcard h3,
  .sickcard p {
    margin: 10px 0;
    line-height: 30px;
  }





  /* -----------my responsive on sickk */

  /* 
  @media (max-width: 1000px) {
    .sick {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
    }

    .sickcard {
      width: 100%;
    }
  }

  @media (max-width: 768px) {
    .sick {
      display: grid;
      grid-template-columns: 1fr;
      gap: 20px;
    }

    .sickcard {
      width: 100%;
    }
  } */



  /* ------------my resposnive end on sick */
  /* -------------about------------------------ */
  .main-mission {
    height: 350px;
    width: 70%;
    border: 1px solid black;
    text-align: end;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    /* position: absolute; */
    /* transform: translateY(-120px); */

  }

  .mission {
    border: 1px solid black;
    height: 100%;
    width: 50%;
    background: rgb(128, 185, 128);
  }

  .vission {
    border: 1px solid black;
    height: 100%;
    width: 50%;
    background: white;
    /* margin-left: 10px; */
  }


  @media (max-width: 768px) {
    .main-mission {
      width: 100%;
      height: 100%;
      flex-direction: row;
      justify-content: center;
      align-items: center;
    }

    .mission {}

  }

  .text-section {
    position: relative;
  }








  /* ------------------------------------------------------------------------------ */

  .about {
    padding: 10px;
    display: flex;
    height: 30%;
    /* Set the height of the container */
  }

  .about_content,
  .image-content {
    flex: 1;
    box-sizing: border-box;
  }

  .about_content {
    padding: 50px;
  }

  .aboutimage-content img {

    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 50px;
    /* Ensure the image covers the container */
  }

  @media (max-width: 768px) {
    .about {
      display: grid;
      grid-template-columns: 1fr;
      height: auto;
      /* Adjust height for mobile view */
    }

    .aboutimage-content img {
      padding-left: 10px;
      height: 100%;
      width: 100%;
      /* Adjust the height to maintain aspect ratio */
    }

    .about_content {
      padding: 2px;
      height: 100%;
    }
  }

  @media (min-width: 1000px) and (max-width :1100px) {
    .text-section h2 {
      font-size: large;
      /* color: green; */
      color: black;
      font-weight: 600;
      margin-top: 1rem;
    }

    .about_us .text-section p {
      font-family: 'serif';

      font-size: 12px;
      word-spacing: 1px;
      letter-spacing: 0.5px;
    }
  }


  /* -----------------facility cards-------------------------- */
  .card-img-top {
    position: relative;
  }

  .carda {
    position: relative;
  }

  .carda img {
    top: -4rem;
  }

  .cardaimage {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 24rem;
    height: 25rem;



    border: 5px solid rgb(132, 226, 103);
    border-top-color: transparent;
    border-left-color: transparent;

    transform: translateX(8rem) translateY(0px);
  }


  /* @media (max-width:900px){
    .cardaimage{
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      width: 20rem;
      height: 23rem;
    
      border-left-color:white;
      border-bottom-color: white;
      
      border: 10px solid rgb(132, 226, 103);
    
      transform: translateX(10rem) translateY(0px) ;
    }
    .carda{
      margin-bottom: 20px;
    }
  } */
  .facility-icon {

    display: flex;
    justify-content: center;
    align-items: center;
  }

  .facility-icon img {
    width: 50px;
    /* Adjust the size as needed */
    height: auto;
    margin-top: 3rem;
  }


  /* .facilities-heading{
    margin-top: 1rem;
  } */
  .facilities {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 16px;
    padding: 20px;

  }

  .facilitycard {
    background: linear-gradient(45deg, #84cb9fa0, #d4ecda);
    /* background: #a9e0b973; */
    /* border: 1px solid black; */
    border-radius: 10px;
    /* box-shadow: 1px 1px 1px 1px#868686; */

    overflow: hidden;
    display: inline-flex;
    flex-direction: row;
    padding: 10px;




  }

  .facilitycard img {
    height: 50px;
    width: fit-content;
    object-fit: cover;
  }


  .facilitycards {
    text-align: center;
    /* padding-top: 20px; */
    display: grid;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
    height: fit-content;
    width: 100%;


  }

  @media (max-width:768px) {
    .facilitycards {
      height: fit-content;

    }

    .facilitycard {
      margin: 0 auto;
      width: 100%;
    }

  }

  .facilitycard .facilities_content_heading {

    padding-left: 10px;

  }

  #facilities_content_para {
    text-align: start;
    font-family: 'emoji';
  }


  .card-text {
    background: greenyellow;
  }

  .treate {
    text-align: start;
    font-family: sans-serif;
    font-size: x-large;
  }

  .carda {
    /* width: 25rem; */
  }

  @media (max-width:768px) {
    .facilitycard img {
      height: 30px;
      width: 30px;

    }



    .cardaimage {
      display: none;
    }
  }


  @media (min-width: 769px) and (max-width: 1190px) {
    .cardaimage {
      display: none;
    }

    .facilities {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 20px;
    }

    .facilitycards {
      display: grid;
      grid-template-columns: 1fr;
      justify-items: center;
    }

    .facilitycard {
      display: flex;
      flex-direction: row;

      width: 100%;
    }

    .facilities_content img {
      margin: 0 auto;
    }

    .carda img {
      height: auto;
    }

    .treate {
      font-size: large;
    }




  }






  /* @media (max-width: 768px) {
    .facilities {
      display: grid;
      grid-template-columns: 1fr;
    }

    .facilitycards {
      flex: 1 1 100%;
      margin: 0;
    }

    .facilitycard {
      margin: 10px 0;
    }
  } */

  @media (min-width: 1100px) {
    .facilities {
      display: flex;
    }

    .facilitycards {
      flex: 1 1 30%;
      margin: 0;
    }

    .facilitycard {
      margin: 10px;
    }
  }





  /* ---------------fo0ter-------------------- */
  /* .main_footer{
    display: flex;
    
  } */

  .footer-content .footer-logo-link img {
    width: 160;
    height: 85px;
    /* margin-right: 10px; */
    border-radius: 10px;
  }

  a {
    color: #fff;
    text-decoration: none;
  }

  .pg-footer {
    margin-top: 3rem;
    font-family: 'Roboto', sans-serif;
  }


  .footer {
    background-color: #28284b;
    color: #fff;
  }

  .footer-wave-svg {
    background-color: transparent;
    /* background-color: #f4f5f2; */
    /* background-image: url("https://www.transparenttextures.com/patterns/xv.png"); */
    display: block;
    height: 30px;
    position: relative;
    /* top: -1px; */
    width: 100%;
  }

  .footer-wave-path {
    /* background-color: #f4f5f2; */
    background-image: url("https://www.transparenttextures.com/patterns/xv.png");
    fill: #f4f5f2;
    /* fill: url("https://www.transparenttextures.com/patterns/xv.png"); */
  }

  .footer-content {
    margin-left: auto;
    margin-right: auto;
    max-width: 1230px;
    padding: 40px 15px 450px;
    position: relative;
  }

  .footer-content-column {
    box-sizing: border-box;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
    color: #fff;
  }

  .footer-content-column ul li a {
    color: #fff;
    text-decoration: none;
  }

  .footer-logo-link {
    display: inline-block;
  }

  .footer-menu {
    margin-top: 30px;
  }

  .footer-menu-name {
    color: #fffff2;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: .1em;
    line-height: 18px;
    margin-bottom: 0;
    margin-top: 0;
    text-transform: uppercase;
  }

  .footer-menu-list {
    list-style: none;
    margin-bottom: 0;
    margin-top: 10px;
    padding-left: 0;
  }

  .footer-menu-list li {
    margin-top: 5px;
  }

  .footer-call-to-action-description {
    color: #fffff2;
    margin-top: 10px;
    margin-bottom: 20px;
  }

  .footer-call-to-action-button:hover {
    background-color: #fffff2;
    color: black;
  }

  .button:last-of-type {
    margin-right: 0;
  }

  .footer-call-to-action-button {
    background-color: #098E89;
    border-radius: 21px;
    color: #fffff2;
    display: inline-block;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .1em;
    line-height: 18px;
    padding: 12px 30px;
    margin: 0 10px 10px 0;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color .2s;
    cursor: pointer;
    position: relative;
  }

  .footer-call-to-action {
    margin-top: 30px;
  }

  .footer-call-to-action-title {
    color: #098E89;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .1em;
    line-height: 18px;
    margin-bottom: 0;
    margin-top: 0;
    text-transform: uppercase;
  }

  .footer-call-to-action-link-wrapper {
    margin-bottom: 0;
    margin-top: 10px;
    color: #fff;
    text-decoration: none;
  }

  .footer-call-to-action-link-wrapper a {
    color: #fff;
    text-decoration: none;
  }





  .footer-social-links {
    bottom: 0;
    height: 54px;
    position: absolute;
    right: 0;
    width: 236px;
  }

  .footer-social-amoeba-svg {
    height: 54px;
    left: 0;
    display: block;
    position: absolute;
    top: 0;
    width: 236px;
  }

  .footer-social-amoeba-path {
    fill: #05055b;
  }

  .footer-social-link.linkedin {
    height: 28px;
    left: 3px;
    top: 11px;
    width: 32px;
  }

  .footer-social-link {
    display: block;
    padding: 10px;
    position: absolute;
  }

  .hidden-link-text {
    position: absolute;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
    clip-path: inset(0px 0px 99.9% 99.9%);
    overflow: hidden;
    height: 1px;
    width: 1px;
    padding: 0;
    border: 0;
    top: 50%;
  }

  .footer-social-icon-svg {
    display: block;
  }

  .footer-social-icon-path {
    fill: #fffff2;
    transition: fill .2s;
  }

  .footer-social-link.twitter {
    height: 28px;
    left: 62px;
    top: 3px;
    width: 32px;
  }

  .footer-social-link.youtube {
    height: 24px;
    left: 123px;
    top: 12px;
    width: 32px;
  }

  .footer-social-link.github {
    height: 34px;
    left: 172px;
    top: 7px;
    width: 34px;
  }

  .footer-copyright {
    background-color: #0e0e4a;
    color: #fff;
    padding: 15px 30px;
    text-align: center;
  }

  .footer-copyright-wrapper {
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
  }

  .footer-copyright-text {
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
    margin-bottom: 0;
    margin-top: 0;
  }

  .footer-copyright-link {
    color: #fff;
    text-decoration: none;
  }







  /* Media Query For different screens */
  @media (max-width:320px) {
    .footer-social-links {
      display: none;
    }

  }

  @media (min-width:320px) and (max-width:479px) {

    /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */
    .footer-content {
      margin-left: auto;
      margin-right: auto;
      max-width: 1230px;
      padding: 40px 15px 1050px;
      position: relative;
    }

    .footer-social-links {
      display: none;
    }
  }

  @media (min-width:480px) and (max-width:599px) {

    /* smartphones, Android phones, landscape iPhone */
    .footer-content {
      margin-left: auto;
      margin-right: auto;
      max-width: 1230px;
      padding: 40px 15px 1050px;
      position: relative;
    }
  }

  @media (min-width:600px) and (max-width: 800px) {

    /* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */
    .footer-content {
      margin-left: auto;
      margin-right: auto;
      max-width: 1230px;
      padding: 40px 15px 1050px;
      position: relative;
    }
  }

  @media (min-width:801px) {
    /* tablet, landscape iPad, lo-res laptops ands desktops */

  }

  @media (min-width:1025px) {
    /* big landscape tablets, laptops, and desktops */

  }

  @media (min-width:1281px) {
    /* hi-res laptops and desktops */

  }




  @media (min-width: 760px) {
    .footer-content {
      margin-left: auto;
      margin-right: auto;
      max-width: 1230px;
      padding: 40px 15px 450px;
      position: relative;
    }

    .footer-wave-svg {
      height: 50px;
    }

    .footer-content-column {
      width: 24.99%;
    }

  }

  @media (min-width: 568px) {
    /* .footer-content-column {
      width: 49.99%;
  } */
  }

  /* ----------------------doctorrr------- */
  #doctorh3 {
    font-weight: 900;
  }

  .doctor_section {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: column;
    padding: 2rem 0;
    width: 100%;

  }

  .main_doctor {
    width: 100%;
    text-align: center;
  }



  .doctorsh1 span {
    display: inline-block;
    font-size: 2rem;
    margin-bottom: 1rem;
  }

  .doctor {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: 1rem;
  }

  .doctorcard {
    position: relative;
    width: 15rem;
    /* Adjust as necessary */
    overflow: hidden;
    transition: transform 0.3s ease;
  }

  .doctorcard img {
    width: 100%;
    height: 50vh;
    display: block;
    object-fit: cover;
  }

  .intro {
    visibility: hidden;
    position: absolute;
    bottom: 0px;
    background: rgba(0, 0, 0, 0.7);
    /* Semi-transparent background */
    color: white;
    width: 100%;
    height: 5rem;
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: bottom 0.3s ease;
  }

  .doctorcard:hover .intro {
    bottom: 20px;
    /* Adjust as necessary */
    visibility: visible;
  }

  .doctorcard:hover {
    transform: scale(1.05);
  }

  /* Responsive styles */
  @media (max-width: 768px) {
    .doctor {
      flex-direction: column;
      align-items: center;
    }

    .doctorcard {
      width: 80%;
      /* Adjust as necessary for mobile view */
    }

    .intro {
      height: 4rem;
      /* Adjust as necessary for mobile view */
    }
  }





  /* DOCTOR END----------------------------------- */

  /* ------------------------------about us new */


  .aboutline {
    border: 3px solid #098E89;
  }

  .about_us {
    display: flex;
    gap: 20px;
    /* max-width: 1200px; */
    margin: 0 auto;
    /* background-color: #fff; */
    margin-bottom: 5rem;
    margin-top: 2rem;
  }

  .image-section {
    position: relative;
    flex: 1 1 100%;
  }

  .large-image {
    width: 100%;
    height: auto;
  }

  .small-image {
    position: absolute;
    bottom: -10px;
    left: -10px;
    width: 50%;
    border: 8px solid white;
  }

  .text-overlay {
    position: absolute;
    bottom: 20px;
    right: 20px;
    font-size: 40px;
    color: #333;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 10px;
    border-radius: 8px;
  }

  .text-section {
    flex: 1 1 100%;
    width: 100vw;
  }

  .text-section h2 {
    font-size: xx-large;
  }

  .text-section p {
    font-size: large;
  }

  .text-section h2,
  .text-section p {
    margin: 20px 0;
  }

  .button-section {
    display: flex;
    justify-content: space-around;
    align-items: center;
  }

  .button-section a,
  .contact-info a {
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
    background-color: #098E89;
    color: #fff;
    border-radius: 5px;
  }

  .button-section .contact-info:hover {
    color: #098E89;
    background: white;
    font-weight: 700;
    cursor: pointer;
  }

  .button-section a:hover {
    color: #098E89;
    background: white;
    font-weight: 700;
  }

  /* .button-section .contact-info {
    background-color: #c3f314;
    color: #333;
  } */

  @media (max-width: 768px) {
    .about_us {
      display: grid;
      grid-template-columns: 1fr;
    }

    .image-section {
      grid-column: span 1;
    }

    .text-section {
      width: 100%;
    }

    .button-section {
      flex-direction: column;
      gap: 10px;
    }
  }

  @media (max-width: 1000px) {
    .image-section {
      width: 90%;
    }

    .about_us {
      display: grid;
    }

    .image-section {
      flex: 1;
    }

    .text-section {
      /* flex: 1; */
      width: 100%;
    }

    .small-image {
      position: absolute;
      bottom: -10px;
      left: -10px;
      width: 50%;
      border: 8px solid white;
    }

  }


  /* ---------------blogsss */

  /* 
  .cards {
    width: 100%;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
    max-width: 820px;
  }

  .card--1 .card__img, .card--1 .card__img--hover {
    background-image: url('./imgs/blog/ayurvedicmassage1.png');
  }

  .card--2 .card__img, .card--2 .card__img--hover {
    background-image: url('./imgs/blog/ayurvedicmassage2.png');
  }

  .card__like {
    width: 18px;
  }

  .card__clock {
    width: 15px;
  vertical-align: middle;
    fill: #AD7D52;
  }
  .card__time {
    font-size: 12px;
    color: #AD7D52;
    vertical-align: middle;
    margin-left: 5px;
  }

  .card__clock-info {
    float: right;
  }

  .card__img {
  visibility: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 235px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;

  }

  .card__info-hover {
    position: absolute;
    padding: 16px;
  width: 100%;
  opacity: 0;
  top: 0;
  }

  .card__img--hover {
  transition: 0.2s all ease-out;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
  position: absolute;
    height: 235px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  top: 0;

  }
  .card {
  margin-right: 25px;
  transition: all .4s cubic-bezier(0.175, 0.885, 0, 1);
  background-color: #fff;
    width: 33.3%;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0px 13px 10px -7px rgba(0, 0, 0,0.1);
  }
  .card:hover {
  box-shadow: 0px 30px 18px -8px rgba(0, 0, 0,0.1);
    transform: scale(1.10, 1.10);
  }

  .card__info {
  z-index: 2;
  background-color: #fff;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  padding: 16px 24px 24px 24px;
  }

  .card__category {
    font-family: 'Raleway', sans-serif;
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 2px;
    font-weight: 500;
  color: #868686;
  }

  .card__title {
    margin-top: 5px;
    margin-bottom: 10px;
    font-family: 'Roboto Slab', serif;
  }

  .card__by {
    font-size: 12px;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
  }

  .card__author {
    font-weight: 600;
    text-decoration: none;
    color: #AD7D52;
  }

  .card:hover .card__img--hover {
    height: 100%;
    opacity: 0.3;
  }

  .card:hover .card__info {
    background-color: transparent;
    position: relative;
  }

  .card:hover .card__info-hover {
    opacity: 1;
  } */

  /* -----------blog */
  .container-fluids2 {
    background: #f3f3f3;
  }




  /* map */


  .map-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
  }

  #map-container {
    width: 100%;
    height: 100%;
  }

  iframe {
    width: 100%;
    height: 100%;
    border: 0;
  }

  .map-address {
    position: absolute;
    bottom: 30%;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(255, 255, 255, 0.8);
    padding: 10px;
    border-radius: 5px;
    text-align: center;
    height: 150px;
    width: 150px;

  }

  .map-icon {
    font-size: 24px;
    margin-bottom: 5px;
  }

  .map-address-ttl {
    font-size: 18px;
    font-weight: bold;
  }

  .paragraph-medium {
    font-size: 16px;
  }

  .paragraph-black {
    color: black;
  }


  /* ----------------------dmaxx cards */
  #service-section h2 span {
    color: #4e3b3b;
  }

  #service-section {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
  }

  #service-section h2 {
    color: #ed0606;
    position: relative;
    font-size: 2.5rem;
    margin-bottom: 30px;
    font-weight: 700;
  }

  #service-section h2::before {
    content: '';
    width: 60px;
    height: 3px;
    background: #f91942;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -10px;
    margin: 0 auto;
  }

  #service-section #paragraph {
    width: 40%;
    font-size: 0.5rem;
    color: rgba(255, 255, 255, 0.7);
    text-align: center;
    white-space: 1px;
    margin-bottom: 40px;
    text-transform: uppercase;
  }

  .service_cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    z-index: 9;
    margin-top: 0px;
  }

  .service_cards .servicecard {
    height: 310px;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    padding: 20px;
    background: rgb(43 40 91);
    position: relative;
    border-radius: 10px;
  }

  .service_cards .servicecard::before {
    position: absolute;
    content: " ";
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    border-radius: 10px;
    background: #a007078a;
    transform: rotate(0deg);
    z-index: -1;
  }

  .service_cards .servicecard:hover::before {
    transform: rotate(10deg);
  }

  .service_cards .servicecard i {
    color: var(--primary-color);
    margin-top: 5px;
    margin-bottom: 10px;
  }

  .service_cards .servicecard h3 {
    color: #fff;
    margin-bottom: 10px;
    font-size: 1.2rem;
    font-weight: bold;
  }

  .service_cards .servicecard .content p {
    color: rgba(255, 255, 255, 0.5);
    line-height: 1.8rem;
  }

  @media(max-width: 1000px) {
    .service-section {
      width: 100%;

    }

    .service_cards {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media(max-width: 768px) {
    .service-section {
      width: 100%;

    }

    #service-section h2 {
      margin-top: 30px;
    }

    .service_cards {
      grid-template-columns: 1fr;
    }

    #service-section #paragraph {
      width: 80%;
    }

    .service_cards .servicecard {
      padding-left: 10px;
      padding-right: 10px;
      padding-top: 1rem;
    }
  }

  /* ----------end of dmaxcardsds */
  /* -------treatement services lapview -mobile view close */
  /* JQUERY FOR TREATEMENT */
  @media (min-width:768px) and (max-width:2000px) {
    .treateservices {
      display: none;
    }

    .treatementservice-cardtreate {
      display: none;
    }

    .relativetreate {
      display: none;
    }

    .icondiseasetreate {
      display: none;
    }

    .flex {
      display: none;
    }

    .knowmoretreate {
      display: none;
    }

    .treatementservice-cardtreate h3 {
      display: none;
    }
  }

  @media (max-width:768px) {
    .treateservices {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-wrap: wrap;
      margin-bottom: 2rem;
      margin-top: -4rem;

    }

    .treatementservice-cardtreate {
      text-align: center;
      max-width: 300px;
      flex: 1 1 calc(33.333% - 40px);
      border-radius: 50%;
      /* background-color: #fff; */
      display: block;
      justify-content: center;
      align-items: center;
    }

    .treatementservices-icontreate {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      width: 185px;
      height: 185px;
      border-radius: 50%;
      border: 2px solid rgb(132, 226, 103);
      border-left-color: white;
      border-bottom-color: white;
      transform: translateX(60px) translateY(0px) rotate(50deg);
    }

    .relativetreate:hover .treatementservices-icontreate {
      height: 190px;
      width: 190px;
      transform: translateX(55px) translateY(0px) rotate(180deg);

    }

    .treatementservice-icontreate {
      position: relative;
      margin-bottom: 15px;
      width: 180px;
      height: 180px;
      overflow: hidden;
      border-radius: 50%;
      margin: 0 auto;
    }

    .treatementservice-icontreate img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .zoom-imagetreate {
      width: 100%;
      transition: transform 0.3s ease;
    }

    .zoom-imagetreate:hover {
      transform: scale(1.2);
    }



    .treatementservice-cardtreate h3 {
      font-size: 18px;
      margin: 15px 0;
    }

    .knowmoretreate {
      padding: 10px 20px;
      margin-top: 10px;
      background-color: #098E89;
      border: none;
      color: white;
      cursor: pointer;
      border-radius: 4px;
      margin-top: 30PX;
    }

    .knowmoretreate:hover {
      background-color: #999;
    }

    .relativetreate {
      position: relative;
    }



    .treatementservice-cardtreate .icondiseasetreate {
      text-align: center;
      width: 90px;
      height: auto;
      margin-bottom: -30px;
      filter: invert(84%) sepia(31%) saturate(665%) hue-rotate(73deg) brightness(90%) contrast(90%);
    }





    .treatementservices-icontreate {
      display: none;

    }

    .flex {
      display: flex;
      justify-content: center;
    }
  }

  @media (max-width:768px) {
    .services {
      display: none;
    }

    .treatementservice-card {
      display: none;
    }

    .icondisease {
      display: none;
    }

    .relative {
      display: none;
    }

  }


  /* -JQUERY FOR TREATEMENT END- */


  /* jquery start doctor */
  @media (min-width:768px) and (max-width:2000px) {
    .maincontainer {
      display: none;
    }

    .maindoctorcard {
      display: none;
    }

    .jquerydoctorcard_img {
      display: none;
    }
  }

  @media(max-width:768px) {

    .maindoctorcard {
      display: grid;
      gap: 20px;
      margin-top: 60px;
      overflow-x: hidden;
      scroll-behavior: auto;

    }

    .jquerydoctorcard {
      border: 1px solid #ddd;
      border-radius: 6px;
      width: 100%;
      min-width: 250px;
      text-align: center;
      margin-top: 60px;
      flex-shrink: 0;


    }

    .jquerydoctorcard_img {
      width: 160px;
      height: 160px;
      overflow: hidden;
      border-radius: 50%;
      margin: -60px auto 0;
    }

    .jquerydoctorcard_img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .jquerydoctorcard_info {
      padding: 1rem;
      background: linear-gradient(45deg, #098E89a0, #d4ecda);

    }

    .jquerydoctorcard_info h2 {
      font-size: large;
    }


    .maincontainer {
      margin: 0;
      margin-bottom: 4rem;
    }
  }

  /* jquery end doctor */







  /* j queryy lapview strat */
  .doctorcontainer {
    overflow: hidden;
    position: relative;
    margin-bottom: 5rem;
    /* margin-top: 10rem; */
    /* margin-left:4rem; */
    /* margin-right: 3rem; */
  }

  .maindoctorcards::-webkit-scrollbar {
    display: none;
  }

  .maindoctorcards {
    display: flex;
    gap: 10rem;
    margin-top: 60px;
    justify-content: center;
    overflow-x: auto;
    scroll-behavior: smooth;
    /* width: calc(350px * 3 + 5rem * 2 + 20px); */
    scrollbar-width: 1rem;

  }

  .jquerycard {
    border: 1px solid #ddd;
    border-radius: 20px 20px 6px 6px;
    max-width: 350px;
    text-align: center;
    margin-top: 60px;
    flex-shrink: 0;
    background: linear-gradient(180deg,
        rgba(9, 142, 138, 0.59) 0%,
        rgba(9, 142, 137, 1) 100%);

    /* background:linear-gradient(0deg, rgba(13,206,75,1) 0%, rgba(91,170,67,1) 20%, rgba(85,175,55,1) 24%, rgba(136,189,127,0.960463408996411) 100%); */
  }

  .jquerycard_img {
    width: 180px;
    object-fit: cover;
    height: 177px;
    overflow: hidden;
    border-radius: 100%;
    margin: -60px auto 0;
  }

  .jquerycard_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .card_info {
    padding-bottom: 8rem;
    /* background:linear-gradient(184deg, rgba(68,134,69,1) 0%, rgba(91,170,67,1) 20%, rgba(85,175,55,1) 24%, rgba(136,189,127,0.960463408996411) 100%); */
  }

  .card_info h2 {
    font-size: large;
  }

  a {
    text-decoration: none;
    color: red;
  }

  a:hover {
    color: black;
  }

  .scroll-button {
    position: absolute;
    top: 50%;

    right: 0px;
    z-index: 1000;
    background-color: #ddd;
    border: none;
    border-radius: 50%;
    padding: 10px;
    cursor: pointer;
    transform: translateY(-50%);
  }

  .scroll-button:hover {
    background-color: #bbb;
  }

  @media (max-width:768px) {
    .doctorcontainer {
      display: none;
    }
  }


  .imageleafdoctor {}

  /* jquery docotr lalpview */


  /* docoter image icon */
  .ourteam-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 10px;
  }

  .ourteam-heading .line {
    flex: 1;
    height: 1px;
    background-color: #b5a142;
    /* Adjust the color to match your design */
    margin: 0 25px;
  }

  .doctor-icon {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .doctor-icon img {
    width: 50px;
    /* Adjust the size as needed */
    height: auto;
  }


  .ourteam-heading h2 {
    font-size: 24px;
    /* Adjust the size as needed */
    color: #000;
    /* Adjust the color as needed */
    margin: 0 15px;
  }

  /* end of doctor image icon */

  /* -----aj docotr start */
  .services {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 5rem;
  }

  .treatementservice-card {
    text-align: center;
    max-width: 300px;
    flex: 1 1 calc(33.333% - 40px);
    border-radius: 50%;
    /* background-color: #fff; */
  }

  .treatementservices-icon {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 185px;
    height: 185px;
    border-radius: 50%;
    border: 2px solid #098e8a96;
    border-left-color: white;
    border-bottom-color: white;
    transform: translateX(60px) translateY(0px) rotate(50deg);
  }

  .relative:hover .treatementservices-icon {
    height: 190px;
    width: 190px;
    transform: translateX(55px) translateY(0px) rotate(180deg);

  }

  @media (max-width:768px) {
    .relative:hover .treatementservices-icon {
      display: none;
    }
  }

  .treatementservice-icon {
    position: relative;
    margin-bottom: 15px;
    width: 180px;
    height: 180px;
    overflow: hidden;
    border-radius: 50%;
    margin: 0 auto;
  }

  .treatementservice-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .zoom-image {
    width: 100%;
    transition: transform 0.3s ease;
  }

  .zoom-image:hover {
    transform: scale(1.2);
  }



  .treatementservice-card h3 {
    font-size: 18px;
    margin: 15px 0;
  }

  .knowmore {
    padding: 10px 20px;
    margin-top: 10px;
    background-color: #098e8a96;
    border: none;
    color: white;
    cursor: pointer;
    border-radius: 4px;
    margin-top: 30PX;
  }

  .knowmore:hover {
    background-color: #999;
  }

  .relative {
    position: relative;
  }

  @media (max-width: 916px) {
    .treatementservice-card {
      flex: 1 1 100%;
      /* Adjust to single column on mobile */
      max-width: 100%;
    }

    .treatementservices-icon {

      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      width: 150px;
      height: 150px;
      border-radius: 50%;
      border: 2px solid red;
      border-left-color: white;
      border-bottom-color: white;
      transform: translateX(2px) rotate(45deg);
      left: 0;
      right: 0;


    }

  }

  /* ----end of itt */

  .treatementdoctorcontainer {
    /* height: 100%; */
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* margin-top: 5rem; */
  }

  .doctortreatement {
    width: 70%;
    display: block;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 20px;
  }

  .treatement-icon img {
    width: 50px;
    height: auto;
    margin: 20px;
  }

  .treatementservice-card .icondisease {
    width: 90px;
    height: auto;
    margin-bottom: -30px;
    filter: invert(84%) sepia(31%) saturate(665%) hue-rotate(73deg) brightness(90%) contrast(90%);
  }

  .treatement-para {
    margin-top: 2rem;
    color: grey;
  }

  /* ---aj doctor endd */


  /* -----bannenr---- */
  .servicebanner {
    display: flex;
    flex-wrap: wrap;
    height: 60vh;
    width: 100%;
  }

  .banner::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgb(111 191 135 / 69%);
    z-index: 1;
  }

  .banner {
    position: relative;
    flex: 1 1 50%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    /* background: #4CAF50; */
    /* border-radius: 0px 0px 20px 20px; */
  }

  .banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    flex: 1 1 100%;
    position: relative;
  }

  .gallerytext {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: white;
    /* font-weight: bolder; */
    font-size: 4rem;
    /* text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); */
    white-space: nowrap;
    z-index: 2;
  }

  @media (max-width: 768px) {
    .banner {
      height: 50vh;
      width: 100%;
      flex: 1 1 100%;
    }

    .gallerytext {
      position: absolute;
      transform: none;
      text-align: center;
      margin-top: 10px;
      bottom: auto;
      left: auto;
      width: 100%;
    }
  }


  /* ------tretement images ----------*/

  .maintreatementimage {

    display: flex;
    justify-content: space-evenly;
    gap: 1rem;
    /* Adjust the gap between images as needed */
  }

  .treatement-images {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: auto;
    height: 20rem;
  }

  .treatement-images img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  @media (max-width: 768px) {
    .maintreatementimage {
      display: grid;
      grid-template-columns: 1fr;
      gap: 1rem;
      /* Adjust the gap between images as needed */
    }
  }

  .whyayurveda h2 {
    position: relative;
    display: inline-block;
    font-family: 'poppins';
    font-size: 45px;
  }

  .whyayurveda .underline {
    display: block;
    width: 25%;
    height: 8px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -20px;
    /* Adjust the position as needed */
    left: 0;
  }

  .whyayurveda p {
    margin-top: 2rem;
    font-size: 18px;
  }

  .whychooseus h1 {
    position: relative;
    display: inline-block;
    font-family: 'poppins';
    font-size: 45px;
  }

  .whychooseus .underline {
    display: block;
    width: 35%;
    height: 8px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -20px;
    /* Adjust the position as needed */
    left: 0;
  }

  .whychooseus p {
    margin-top: 2rem;
    font-size: 18px;
  }


  .image-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    /* Adjust the gap as needed */
    margin-top: 5rem;
  }

  .image-item {
    flex: 1;
    min-width: calc(25% - 1rem);
    /* Adjust based on the gap */
    height: 13rem;
    /* Adjust height as needed */
  }

  .image-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  @media (max-width: 768px) {
    .image-container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      /* Adjust the gap as needed */
    }

    .image-item {
      min-width: auto;
    }
  }

  /* -----what we offer */

  .weoffer h2 {
    margin-top: 5rem;
    position: relative;
    display: inline-block;
    font-family: 'poppins';
    font-size: 40px;
  }

  .weoffer .underline {
    display: block;
    width: 25%;
    height: 5px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -10px;
    /* Adjust the position as needed */
    left: 13rem;
  }

  .weoffer p {
    margin-top: 2rem;
    font-size: 18px;
  }

  /* ----treatement-details --------------------*/
  .container-treatement {
    display: flex;
    flex-wrap: wrap;
    margin: 1rem;
    padding-top: 5rem;
  }

  .treatement-content,
  .treatementimage-content {
    flex: 1;
    padding: 10px;
  }

  .treatement-content {
    order: 1;
  }

  .treatement-content h2 {
    font-size: 38px;
    font-family: 'poppins';
    padding: 10px;
  }

  .treatement-content h3 {
    font-family: "Montserrat", sans-serif;
    ;
    padding: 10px;
  }

  .treatement-content p {
    font-size: 18px;
  }

  .treatementimage-content {
    order: 2;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .treatementimage-content img {
    width: 90%;
    height: auto;
  }

  @media (max-width: 768px) {
    .container-treatement {
      display: grid;
      grid-template-columns: 1fr;
    }

    .treatement-content,
    .treatementimage-content {
      flex: none;
      order: initial;
    }

    .treatementimage-content {
      justify-content: center;
      align-items: center;
    }
  }

  /* ---service offerd treeatement */
  .treatementservices-heading h3 {
    font-family: 'poppins';
    font-size: 45px;
    padding: 10px;
    margin: 1rem;
    position: relative;
    display: inline-block;
  }

  .treatementservices-heading .underline {
    display: block;
    width: 25%;
    height: 5px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -5px;
    /* Adjust the position as needed */
    left: 1rem;
  }

  .treatementservices-heading h2 {
    margin: 2rem;
    font-size: 20px;
  }

  .treatementservices-heading i {
    font-size: 20px;
    text-align: center;
    padding: 10px;
  }

  .treatementservices-heading p {
    font-size: 18px;
    margin-top: -15px;
  }


  .treatementimage-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    /* Adjust the gap as needed */
    margin-top: 2rem;
  }

  .physioservices {
    font-size: 18px;
    font-weight: 600;
    text-align: center;

  }

  .treatementimage-item {
    flex: 1;
    min-width: calc(10% - 1rem);

    height: 13rem;
    /* Adjust height as needed */
  }

  .treatementimage-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  @media (max-width: 768px) {
    .treatementimage-container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2rem;
      /* Adjust the gap as needed */
    }

    .treatementimage-item {
      min-width: auto;
    }
  }


  /* ---ayur integration---- */
  .ayurvedic-integration-heading h2 {
    margin: 3rem;
    font-family: 'poppins';
    font-size: 38px;
    padding: 10px;

    position: relative;
    display: inline-block;

  }

  .ayurvedic-integration-heading .underline {
    display: block;
    width: 25%;
    height: 5px;
    background-color: #098E89;
    position: absolute;
    bottom: -5px;
    left: 1rem;
  }

  .ayurintegrationcard {
    /* background-color: #f8f8f8; */
    padding: 1rem;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 1rem;
    /* Add margin-bottom to ensure spacing in mobile view */
  }

  .ayurintegrationcard img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 8px;
  }

  .ayurintegrationcard p {
    /* margin-top: 1rem; */
    text-align: center;
  }

  .ayurintegrationcard h4 {
    text-align: center;
  }

  /* ------------end of ayur integration card */


  /* specialized program */
  /*  */


  .ayurvedic-specialized-program h1 {
    margin: 3rem;
    font-family: 'poppins';
    font-size: 38px;
    padding: 10px;


    position: relative;
    display: inline-block;
    font-family: 'poppins';
    /* font-size: 45px; */
  }

  .ayurvedic-specialized-program .underline {
    display: block;
    width: 25%;
    height: 5px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -5px;
    /* Adjust the position as needed */
    left: 6;
  }

  .specialized-program p {
    font-size: 18px;
    margin-top: 15px;
  }

  /* ----------------------ao rectal disease */

  /* ---ano rectal ---accordtn */


  .treatementimage-contents {
    flex: 1;
    padding: 10px;
    order: 2;
    display: flex;
    /* justify-content: center; */
    /* align-items: center; */
  }

  .treatementimage-contents img {
    width: 100%;
    height: 60%;
  }

  @media (max-width:768px) {
    .treatementimage-contents {
      flex: none;
      order: initial;
      justify-content: center;
      align-items: center;
    }
  }


  /* -----------------conditons tretted  on anorectal */
  @import "https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css";
  @import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900&subset=latin-ext');

  /* * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
  } */
  /* 
  body {
      padding: 100px 0;
  } */

  .icon img {
    width: 100%;
    vertical-align: middle;

  }

  .blog-item img {
    display: block;
  }

  .blog-item a {
    display: flex;
    padding: 50px;
    overflow: hidden;
    align-items: center;
    max-width: 1000px;
    margin: auto;
    color: #333;
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    border-radius: 6px;
    margin-bottom: 50px;
    text-decoration: none;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }

  .blog-item a:hover {
    box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.2);
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    color: black;
  }

  .blog-item .icon {
    width: 35%;
    object-fit: cover;
    margin-right: 50px;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 15px 26px rgba(0, 0, 0, 0.4);
  }

  .blog-item .content {
    width: 65%;

  }

  .blog-item .content .title {
    font-size: 21px;
    text-transform: capitalize;
    color: #0bb3adab;
    font-weight: 600;
    font-family: 'Lato', sans-serif;
  }



  .blog-item .content .title .blog-date {
    font-size: 12px;
    margin-left: 20px;
    color: #333;
    font-family: 'Lato', sans-serif;
  }

  .blog-item .content .title .blog-date:before {
    content: '/';
    color: #2bb673;
    font-size: 25px;
    top: auto;
    position: relative;
    margin-right: 10px;
  }

  .blog-item .content .rounded {
    margin-left: 0;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .blog-item .item-arrow {
    height: 20px;
    width: 15%;
    position: relative;
    text-align: center;
    font-size: 35px;
    left: 0;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }

  .blog-item a:hover>.item-arrow {
    /*padding-left: 40px;*/
    /* color: #25aae1; */
    left: 30px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }

  .rounded {
    width: 70px;
    height: 5px;
    border-radius: 6px;
    /* background-image: linear-gradient(to right, #25aae1, #40e495); */
    /* background: #2bb769; */
    margin-left: 0;
    margin-top: 10px;
    margin-bottom: 10px;
  }


  @media screen and (max-width: 768px) {

    .blog-item .content {
      width: 100%;
      margin-top: 35px;
    }

    .blog-item .content .title {
      font-size: 18px;
    }

    .blog-item .item-arrow {
      margin: auto;
    }

    .blog-item .icon {
      width: 100%;
    }

    .blog-item .icon img {
      width: 100%;
      height: 150px;
      object-fit: cover;
    }

    .blog-item {
      width: 92%;
      margin: auto;
    }

    .blog-item a {
      display: block;
      padding: 30px;
    }

  }

  /* --------------------yoga therapies treatement */
  @import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Montserrat:wght@700&display=swap");

  :root {
    /* Colors */
    --brand-color: hsl(46, 100%, 50%);
    --black: hsl(0, 0%, 0%);
    --white: hsl(0, 0%, 100%);
    /* Fonts */
    --font-title: "Montserrat", sans-serif;
    --font-text: "Lato", sans-serif;
  }

  /* RESET */

  /* Box sizing rules */


  /* Remove default margin */
  /* body,
  h2,
  p {
      margin: 0;
  } */

  /* GLOBAL STYLES */
  /* body {
      display: grid;
      place-items: center;
      height: 100vh;
  } */

  .card__title {
    font-size: 1.90rem;
    font-family: var(--font-title);
    color: var(--white);
    line-height: 1.1;
  }

  .card__description {
    font-family: var(--font-text);
    font-size: 1rem;
    line-height: 1.5;
    color: var(--white);
  }

  .flow>*+* {
    margin-top: var(--flow-space, 1em);
  }

  /* CARD COMPONENT */

  .therapycard {
    display: grid;
    place-items: center;
    width: 80vw;
    max-width: 18.875rem;
    height: 22.125rem;
    overflow: hidden;
    border-radius: 0.625rem;
    box-shadow: 0.25rem 0.25rem 0.5rem rgba(0, 0, 0, 0.25);
  }

  .therapycard>* {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }

  .card__background {
    object-fit: cover;
    max-width: 100%;
    height: 100%;
  }

  .card__content {
    --flow-space: 0.9375rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: flex-end;
    height: 75%;
    padding: 12% 1.25rem 1.875rem;
    background: linear-gradient(180deg,
        hsla(0, 0%, 0%, 0) 0%,
        hsla(0, 0%, 0%, 0.3) 10%,
        hsl(0, 0%, 0%) 100%);
    overflow-y: hidden;
  }

  .card__content--container {
    --flow-space: 1.25rem;
  }

  .card__title {
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
    /* Prefijo necesario para Firefox  */
  }

  .card__title::after {
    content: "";
    position: absolute;
    height: 0.3125rem;
    width: calc(100% + 1.25rem);
    bottom: calc((1.25rem - 0.5rem) * -1);
    left: -1.25rem;
    background-color: var(--brand-color);
  }

  .therapycard__container {
    display: flex;
    gap: 2rem;
    justify-content: center;
  }

  .therapycards__container {
    display: flex;
    gap: 2rem;
    justify-content: center;
    margin-top: 5rem;
  }

  @media (max-width:768px) {
    .therapycard__container {
      display: grid;
    }

    .therapycards__container {
      display: grid;


    }

    .card__title::after {
      content: "";
      position: absolute;
      height: 0.3125rem;
      width: calc(100% + 1.25rem);
      bottom: calc((1.25rem - 0.5rem) * -1);
      left: -1.25rem;
      background-color: var(--brand-color);
    }
  }

  @media (any-hover: hover) and (any-pointer: fine) {

    .card__content {
      transform: translateY(62%);
      transition: transform 500ms ease-out;
      transition-delay: 500ms;
    }

    .card__title::after {
      opacity: 0;
      transform: scaleX(0);
      transition: opacity 1000ms ease-in, transform 500ms ease-out;
      transition-delay: 500ms;
      transform-origin: right;
    }

    .card__background {
      transition: transform 500ms ease-in;
    }

    .card__content--container> :not(.card__title),
    .card__button {
      opacity: 0;
      transition: transform 500ms ease-out, opacity 500ms ease-out;
    }

    .therapycard:hover,
    .card:focus-within {
      transform: scale(1.05);
      transition: transform 500ms ease-in;
    }

    .therapycard:hover .card__content,
    .card:focus-within .card__content {
      transform: translateY(0);
      transition: transform 500ms ease-in;
      overflow-y: auto;
      /* Allow vertical scrolling on hover */
    }

    .card:focus-within .card__content {
      transition-duration: 0ms;
    }

    .therapycard:hover .card__background,
    .card:focus-within .card__background {
      transform: scale(1.3);
    }

    .therapycard:hover .card__content--container> :not(.card__title),
    .therapycard:hover .card__button,
    .card:focus-within .card__content--container> :not(.card__title),
    .card:focus-within .card__button {
      opacity: 1;
      transition: opacity 500ms ease-in;
      transition-delay: 1000ms;
    }

    .therapycard:hover .card__title::after,
    .card:focus-within .card__title::after {
      opacity: 1;
      transform: scaleX(1);
      transform-origin: left;
      transition: opacity 500ms ease-in, transform 500ms ease-in;
      transition-delay: 500ms;
    }
  }

  .card__content::-webkit-scrollbar {
    display: none;
  }


  /* ----appionment icon */
  .fa-regular {
    position: absolute;
    top: 24px;
    left: 0;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    color: #FFF;
    background: #087d0a;
    border-radius: 2px;
    margin: 0 auto;
  }

  /* ---------------------Reviewss------------------- */



  main {
    /* min-height: 90vh; */
    display: grid;
    place-items: center;
  }

  .title {
    text-align: center;
    margin-top: 0.1rem;
    margin-bottom: 2rem;
  }

  .underlinereview {
    height: 0.25rem;
    width: 5rem;
    background: #2364d2;
    margin-left: auto;
    margin-right: auto;
  }

  .review {
    background: white;
    padding: 1.5rem 2rem;
    border-radius: 1rem;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    transition: box-shadow 0.3s linear;
    text-align: center;
  }

  .review:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  }

  .img-container {
    position: relative;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin: 0 auto;
    margin-bottom: 1.5rem;
  }

  #person-img {
    width: 100%;
    display: block;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    position: relative;
  }

  .img-container::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f10e";
    position: absolute;
    top: 0;
    left: 0;
    width: 2.5rem;
    height: 2.5rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    transform: translateY(25%);
    background: #2364d2;
    color: white;
  }

  .img-container::before {
    content: "";
    width: 100%;
    height: 100%;
    background: #2364d2;
    position: absolute;
    top: -0.25rem;
    right: -0.5rem;
    border-radius: 50%;
  }

  #author {
    margin-bottom: 0.25rem;
  }

  #job {
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    color: gray;
    font-size: 0.85rem;
  }

  #info {

    margin-left: 18rem;
    margin-right: 20rem;
    margin-bottom: 0.75rem;
  }

  .prev-btn,
  .next-btn {
    color: #2364d2;
    font-size: 1.25rem;
    background: transparent;
    border-color: transparent;
    margin: 0 0.5rem;
    transition: color 0.3s linear;
    cursor: pointer;
  }

  .prev-btn:hover,
  .next-btn:hover {
    color: black;
  }

  .random-btn {
    margin-top: 0.5rem;
    background: #2364d2;
    color: white;
    padding: 0.25rem 0.5rem;
    text-transform: capitalize;
    border-radius: 5px;
    transition: background 0.3s linear, color 0.3s linear;
    border: 2px solid black;
    cursor: pointer;
  }

  .random-btn:hover {
    background: white;
    color: black;
  }

  @media (max-width:768px) {
    #info {
      margin: 0;

    }
  }


  /* ---------------sticky icons */
  .sticky-icons {
    position: fixed;
    bottom: 10rem;
    /* Adjust this value to position the icons higher or lower */
    right: 20px;
    /* Adjust this value to position the icons more to the left */
    display: flex;
    flex-direction: column;
    gap: 10px;
    /* Space between icons */
  }

  /* Styling the icons */
  .stikicon {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s;
  }

  .stikicon:hover {
    transform: scale(1.1);
  }
.insta_icn{
    font-size: 20px;
      width: 55px;
      height: 55px;
      display: flex;
      padding: 10px;
      align-items: center;
      justify-content: center;
      color: white;
      font-size: 30px;
      border: 2px solid;
      border-radius: 50%;
      position: fixed;
      right: 18px;
      bottom: 43%;
      z-index: 999;
      background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);


      a{
        text-decoration: none;
        color: white;
      }

  }

  .insta_icn:hover {
    transform: scale(1.1);
    color: white;
  }


  /* Responsive design */
  @media (max-width: 768px) {
    .sticky-icons {
      bottom: 10rem;
      right: 10px;
    }


    .stikicon {
      width: 50px;
      height: 50px;
    }
    .insta_icn{
      width: 55px;
      height: 55px;
      right: 8px;
      bottom: 39%;

    }

    .blogitem-container-ano {
      overflow-x: hidden;
    }
  }

  .blogitem-container-ano {
    overflow-x: hidden;
  }

  .treatement-content {
    overflow-x: hidden;
  }

  /* --------end of sticky icon */



  /* ------review google */
  .googleimagereview {
    display: flex;
  }

  .googleimagereview img {
    height: 100px;
    /* width: 50px; */
  }

  /* ----------reviewg google */

  .reviewcard-container {
    /* border: 1px solid black; */
    height: fit-content;
    width: 30rem;
    padding: 10px;
    gap: 10px;

  }

  .greviewcard {
    display: flex;
    justify-content: center;
  }



  .name {
    font-size: larger;

  }

  .date {
    font-size: 10px;
  }

  .pichead {
    padding: 10px;
    width: 4rem;
    height: 4rem;
  }

  .pichead img {
    width: 100%;
    height: 100%;
    transform: translateY(90deg 10%);
  }


  .star {
    padding: 10px;
    display: flex;
    justify-content: center;
  }

  .star img {
    height: 1rem;
    width: 1rem;
  }

  .greviewpara {
    text-align: center;
    margin-top: 0rem;
    margin-left: 1rem;
    color: grey;
  }

  /*==================================================================
                        section-7 acrylic-scn
  ==================================================================*/
  .acrylic-scn {
    min-height: 320px;

    .slider {
      padding-bottom: 30px;

      .slick-arrow {
        position: absolute;
        bottom: 0;
        top: 0;
        margin: auto;
        z-index: 1;
        height: 26px;
        width: 14px;
        /* background-image: url(../img/icons/arrow.png); */
        background-image: url();
        background-repeat: no-repeat;
        background-repeat: no-repeat;
        overflow: hidden;
        color: transparent;
        /* border: 0; */
        background-color: transparent;
      }

      .slick-prev {
        left: 15px;
        transform: scaleX(-1);
      }

      .slick-next {
        right: 15px;
      }
    }

    .slide {
      padding-top: 20px;
      padding-bottom: 20px;
      transition: 0.4s;
      /* overflow: hidden; */
    }

    .slide .img-div {
      /* height: 150px; */
      width: 100%;
      transition: 0.4s;

      img {
        object-fit: contain;
      }
    }

  }



  .reviewcard-container {
    width: 100%;
    height: 100%;
  }

  .img-div {
    height: fit-content;
  }

  /* -------------slider main carosil */
  /* ================================================= */
  /* =============why choose for ano rectal=========== */
  .anowhychoose h2 {
    position: relative;
    display: inline-block;
    font-family: 'poppins';
    font-size: 40px;
    margin-top: 3rem;

  }

  .anowhychoose .underline {
    display: block;
    width: 45%;
    height: 5px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -10px;
    /* Adjust the position as needed */
    left: 0;
  }

  .mainchoose .whychoosecontent {
    margin-top: 2rem;
  }

  .anowhychooseuscontent h3 {}

  /* ================end of ano why choose us========= */



  /* =================varicose start============ */

  .varicose-treatehead h2 {
    position: relative;
    display: inline-block;
    font-family: 'poppins';
    font-size: 35px;
    margin-top: 3rem;
  }

  .varicose-treatehead .underline {
    display: block;
    width: 25%;
    height: 5px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -10px;
    /* Adjust the position as needed */
    left: 20%;
  }

  /* ---------------------------------------------------- */
  .therapies h3 {
    position: relative;
    display: inline-block;
    font-family: 'poppins';
    font-size: 25px;
    margin-top: 1rem;
  }

  .therapies .underline {
    display: block;
    width: 25%;
    height: 3px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -10px;
    /* Adjust the position as needed */
    left: 0;
  }

  .therapiesincludes {
    display: flex;
    justify-content: center;
    gap: 3rem;
    margin-top: 2rem;
  }

  .therapiesincludes>div {
    font-weight: bold;
    text-align: center;
    padding: 1rem;
    width: 20rem;
    height: fit-content;
    border: 1px solid black;
  }

  .therapiesincludes>div:hover {
    background-color: white;
    border: none;
  }

  @media (max-width:768px) {
    .therapiesincludes {
      display: grid;
    }
  }

  /* ==============varicose end=================== */


  .treatement-content h2 {
    font-size: 38px;
    font-family: 'poppins';
    padding: 10px;
  }

  /* ------------spine management--------------------- */
  /* ======= understanting spine mangmnt======= */

  .lielements {
    gap: 20px;
    justify-content: start;
  }

  .lielements ul {
    font-size: 18px;
  }

  .spine-approach h2 {
    position: relative;
    display: inline-block;
    font-family: 'poppins';
    font-size: 35px;
    margin-top: 3rem;
    padding: 1rem;



  }

  .spine-approach .underline {
    display: block;
    width: 25%;
    height: 4px;
    /* Adjust the height as needed */
    background-color: #098E89;
    /* Adjust the color as needed */
    position: absolute;
    bottom: -0px;
    /* Adjust the position as needed */
    left: 10%;
  }

  @media (max-width:768px) {
    .nbsp {
      display: none;
    }
  }


  /*--======== faq style start =============== */

/* =================mott-faq============================== */

    @media (max-width:765px) {
        .mott-faq-section {

            /* h5 {
            font-size: 25px !important;
        } */
            h2 {
                font-size: 2rem !important;
            }
        }
    }

    .mott-faq-section {
        position: relative;

        h2 {
            font-weight: bold;
            font-size: 3rem;
            color: black;
            text-align: center;
        }

        .qstn {
            font-weight: bold;
            font-size: 3rem;
            color: #0C8D89;

            /* background: linear-gradient(135deg, #63CE4A 0%, #008455 100%);

            background-clip: text !important;
            text-align: center; */
        }

        .accordion {
            border-radius: 15px;
            color: black;
            cursor: pointer;
            padding: 20px 15px;
            width: 100%;
            border: none;
            text-align: left;
            outline: none;
            font-size: 14px;
            display: flex;
            justify-content: space-between;
            transition: all 0.3s ease;
        }

        .accordion:hover,
        .accordion.active {
            background: #0C8D89;
        }

        .accordion:hover p,
        .accordion.active p {
            color: white;
        }

        .accordion p {
            margin-bottom: 0;
        }

        .accordion span {
            font-weight: bold;
            font-size: 1.5rem;
            color: #D46028;
            /* background: #0C8D89; */
            /* background-clip: text !important; */
            margin-right: 10px;
        }

        .accordion i {
            color: #0486BF;
            font-size: 22px;
            transition: transform 0.3s ease;
        }

        .panel {
            padding: 0px 18px;
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.8s ease-out;
        }

        .panel p {
            padding-top: 10px;
            font-size: 15px;
        }

        /* On mobile view */
        @media screen and (max-width: 600px) {
            .accordion {
                width: 100%;
            }

            p {
                font-size: 18px;
            }
        }
    }

    /* ==========================mott-faq======================= */





  /*--======== faq style start =============== */