:root {
  /* ==================================================COLORS */
  --clr-l-blue:#deeff7;
  --clr-dtp-blue:#0035679a;
  --clr-d-blue:#003567;
  --clr-l-green:rgb(16, 194, 186);
  --clr-blu1: hsl(219,89%,80%);
  --clr-blu2: hsl(219,89%,70%);
  --clr-blu3: hsl(219,89%,60%);
  --clr-blu3tp: rgba(62, 126, 244, 0.645);
  --clr-blu4: hsl(219,61%,37%);
  --clr-blu4tp: rgba(37, 77, 152, 0.645);
  --clr-blu5: hsl(219,89%,20%);
  --clr-blu5tp: rgba(6, 37, 96, 0.645);
  --clr-blu5b: rgba(1, 50, 142, 0.6);
  --clr-red1: hsl(345,88%,80%);
  --clr-red2: hsl(345,88%,70%);
  --clr-red3: hsl(345,88%,60%);
  --clr-red4: hsl(345,88%,46%);
  --clr-red5: hsl(345,88%,20%);
  --clr-ora1: hsl(14,100%,80%);
  --clr-ora2: hsl(14,100%,70%);
  --clr-ora3: hsl(14,100%,60%);
  --clr-ora4: hsl(14,100%,45%);
  --clr-ora5: hsl(14,100%,20%);
  --clr-gre1: hsl(176,66%,70%);
  --clr-gre2: hsl(176,66%,60%);
  --clr-gre3: hsl(176,66%,40%);
  --clr-gre4: hsl(176,66%,30%);
  --clr-gre5: hsl(176,66%,20%);
  --clr-jlo:#fdc800;
  --clr-B1:#1f4b60;
  --clr-B1tp:#1f4b60aa;
  --clr-B2:#ee9b08;
  --clr-B2tp:#ee9b08aa;
  --clr-B3:#fbdf9d;
  --clr-B3tp:#fbdf9daa;
  --clr-B4:#b95404;
  --clr-B4tp:#b95404aa;
  --clr-B5:#092a3f;
  --clr-B5tp:#092a3faa;
  --clr-D1: #202020;
  --clr-D2: #3F3F3F;
  --clr-D3: #707070;
  --clr-D4: #FFDF6C;
  --clr-D5: #FFFFFF;
  --clr-D6: #1d1e22;
  --clr-D7: #393f4d;
  --clr-D8: #d4d4dc;
  --clr-D9: #feda6a;
  --clr-G1: #164A41;
  --clr-G2: #4D774E;
  --clr-G3: #9DC88D;
  --clr-G4: #F1B24A;
  --clr-G5: #FFFFFF;
  --wid-mob1: 479px;
  --wid-tab1: 768px;
  /*=================================================== Font Sizes */
  --fs-small:1rem;
  --fs-medium:1.5rem;
  --fs-large:2rem;
  --fs-medium-large:2.5rem;
  --fs-xlarge:3rem;
  --fs-xxlarge:6rem;
  --fs-xxxlarge:8rem;
  /* ===================================================Font Weight */
  --fw-3:400;
  --fw-5:500;
  --fw-7:700;
  --fw-9:900;
  /* ===================================================font Family  */
  --ff-main:"Montserrat",Sans-sarif;
  /* ===================================================LINE HEIGHT */
  --lh-default:125%;
  /* ===================================================RESPONSOVE FONT SIZE */
  --fs-responsive:clamp(2rem,5vw,4rem);
}

/* ========================================================Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* =========================================================Remove default margin */
* {
  margin: 0;
  padding: 0;
  font: inherit;
  font-family: var(--ff-main);
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role=list],
ol[role=list] {
  list-style: none;
}

li {
  list-style: none;
  display: inline-block;
  padding: 1rem;
}

a {
  text-decoration: none;
}

/*========================================================== Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

/* body, html {
  height: 100%;
} */
/*========================================================== Set core body defaults */
body {
  text-rendering: optimizeSpeed;
  line-height: 1.1;
}

/*============================= A elements that don't have a class get default styles */
a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }
  *,
*::before,
*::after {
    -webkit-animation-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    -webkit-animation-iteration-count: 1 !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
/* ................................................ */
/* ========================================================MODE DAY NIGHT */
.modeChange {
  background-color: black;
}

/*========================================================= FADE ANIMATION */
.fadeIn_left {
  transform: translateX(100px);
  transition: 1s;
  opacity: 0;
}

.fadeIn_left.show {
  transform: translateX(0px);
  /* transition: ease; */
  opacity: 1;
}

.fadeIn_right {
  transform: translateX(-100px);
  transition: 1s;
  opacity: 0;
}

.fadeIn_right.show {
  transform: translateX(0px);
  /* transition: ease; */
  opacity: 1;
}

/* ==================================================FONT WEIGHT*/
.fw-regular {
  font-weight: var(--fw-3);
}

.fw-semiBold {
  font-weight: var(fw-5);
}

.fw-bold {
  font-weight: var(--fw-7);
}

.fw-xbold {
  font-weight: var(--fw-9);
}

/* ==================================================FONT SIZE */
.fs-heading1 {
  font-size: var(--fs-xlarge);
}

.fs-heading1a {
  font-size: var(--fs-medium-large);
}

.fs-heading2 {
  font-size: var(--fs-large);
}

.fs-heading3 {
  font-size: var(--fs-medium);
}

.margin-normal {
  margin: 1em;
}

.margin-top-bottom-normal {
  margin: 1em 0em;
}

.margin-normal2 {
  margin: 1.5em;
}

.margin-top-bottom-normal2 {
  margin: 1.5em 0em;
}

.margin-normal3 {
  margin: 2em;
}

.margin-top-bottom-normal3 {
  margin: 2em 0em;
}

.padding-normal {
  padding: 1em;
}

.padding-top-bottom {
  padding: 1em 0em;
}

.padding-normal2 {
  padding: 1.5em;
}

.padding-top-bottom2 {
  padding: 1.5em 0em;
}

.padding-normal3 {
  padding: 2em;
}

.padding-top-bottom3 {
  padding: 2em 0em;
}

.fc-white {
  color: white;
}

.fc-black {
  color: black;
}

.clr-blu5 {
  color: var(--clr-blu5);
}

/* ===================================================FONT FAMILY*/
.ff-body {
  font-family: var(--ff-main);
}

.ff-primary {
  font-family: var(--ff-main);
}

.ff-spsecial {
  font-family: var(--ff-main);
}

.blur {
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
}

/* =====================================================GRID COLUMNS */
.grid {
  display: grid;
  /* gap: 1rem; */
}

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

.col-3 {
  grid-template-columns: repeat(3, 1fr);
}

.col-4 {
  grid-template-columns: repeat(4, 1fr);
}

.col-5 {
  grid-template-columns: repeat(5, 1fr);
}

.col-6 {
  grid-template-columns: repeat(6, 1fr);
}

.col-8 {
  grid-template-columns: repeat(8, 1fr);
}

.row-2 {
  /* grid-auto-rows: repeat(2,1fr); */
  grid-template-rows: repeat(2, 1fr);
}

.row-3 {
  grid-template-rows: repeat(3, 1fr);
}

.flex {
  display: flex;
  /* gap: 1rem; */
}

.fd-column {
  flex-direction: column;
}

/* 
  @media only screen and (min-width:50em){
    .col-2 , .col-3, .col-4, .col-5, .col-6{

      grid-auto-flow: column;
      grid-auto-columns: 1fr;
    }
  } */
/* =======================================================ALIGN ITEMS CENTER */
.xy-center {
  justify-content: center;
  align-items: center;
}

.y-center {
  align-items: center;
}

.x-center {
  justify-content: center;
}

/* ========================================================TEXT CENTER */
.txt-center {
  text-align: center;
}

.cta {
  padding: 0.4rem 0.9rem;
  background-color: var(--clr-blu5);
  border-radius: 30px;
  border: none;
  cursor: pointer;
  color: #111;
  cursor: pointer;
}
.cta a {
  color: white;
}

/* ===================================================================================DEFAULT CSS END */
/* =============================================HEADER */
.header {
  background-color: rgba(255, 255, 255, 0.7725490196);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  position: fixed;
  width: 100%;
  height: 10vh;
  z-index: 10000;
  display: flex;
  justify-content: center;
  align-items: center;
}

.header .showMenu {
  transform: translate3d(0vw, 0, 0);
}
.header .menuOpen {
  display: none;
}
.header .logo {
  height: 135px;
  background-color: rgb(255, 255, 255);
  padding: 1rem;
  margin-top: 70px;
  left: 150px;
}
.header li a {
  color: black;
  font-weight: var(--fw-5);
}

@media only screen and (max-width: 1135px) {
  .header {
    width: 100%;
    height: 9vh;
    justify-content: start;
    align-items: flex-start;
  }
  .header .menuOpen {
    display: block;
    margin-left: auto;
    width: 65px;
    height: auto;
    padding: 10px;
    margin-right: 1em;
  }
  .header .logo {
    margin-left: 1em;
    width: 90px;
    height: auto;
    margin-top: 0px;
  }
  .header nav {
    width: 50vw;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.907);
    transform: translate3d(-50vw, 0, 0);
    transition: transform 0.6s ease-out;
    text-align: center;
    color: var(--clr-blu4);
    font-weight: var(--fw-7);
    z-index: 10001;
    position: absolute;
    -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
  }
  .header nav ul {
    display: grid;
    margin-top: 3rem;
    justify-content: center;
    gap: 1rem;
  }
  .header nav ul li a {
    font-weight: 700;
  }
}
/* ==============================================HERO SECTION */
.heroSection {
  width: 100%;
  height: 100vh;
  background-image: linear-gradient(rgba(196, 196, 196, 0.056), rgba(175, 175, 175, 0.227)), url(images/1-3.webp);
  /* clear: both; */
  padding: 10vh 0vh 0px 0px;
  /* grid-template-rows: repeat(4,1fr); */
}
.heroSection .hero {
  height: 100%;
  width: 100%;
  gap: 0px;
}
.heroSection .hero .one {
  /* background-color: #8d07178e; */
  background-color: rgba(255, 255, 255, 0.7725490196);
  color: var(--clr-blu5);
  /* text-shadow: 2px 2px 6px rgb(200, 199, 199); */
  flex-direction: column;
  padding: 1.5rem;
  text-align: center;
}
.heroSection .hero .one h1 {
  font-size: clamp(1.5em, 3vw, 2em);
}
.heroSection .hero .one p {
  letter-spacing: 2px;
}
.heroSection .hero .one:hover {
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  z-index: 10;
  /* transform: scale(1.1);
  transition: transform 0.2s ease-in-out; */
}
.heroSection .hero .four {
  z-index: 10;
}

.bg-common {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-blend-mode: color;
}

@media only screen and (max-width: 768px) {
  .heroSection {
    height: 80vh;
    overflow: hidden;
  }
  .hero {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
  }
  .hero .one {
    margin-top: auto;
    margin-bottom: 1rem;
  }
  .hero .one h1 {
    font-size: clamp(2em, 3vw, 3em);
  }
  .hero .four {
    display: none;
  }
}
/*=================================================== TAGE SECTION START */
.tagsSection {
  width: 100%;
  height: auto;
}
.tagsSection .tags {
  grid-template-columns: 10% 1fr 1fr 1fr 10%;
  grid-template-areas: ". tag1 tag2 tag3 .";
}
.tagsSection .tags .tag1 {
  grid-area: tag1;
}
.tagsSection .tags .tag2 {
  grid-area: tag2;
}
.tagsSection .tags .tag3 {
  grid-area: tag3;
}
.tagsSection .tags .tag {
  width: 100%;
  height: auto;
  /* border: 1px solid black; */
  box-shadow: 2px 2px 8px gray;
  background-color: rgba(255, 255, 255, 0.631372549);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  flex-direction: column;
  padding: 2rem;
  gap: 1em;
  z-index: 100;
  text-align: center;
  margin-top: -50px;
}
.tagsSection .tags .tag h2 {
  font-size: var(--fs-medium);
  font-weight: var(--fw-5);
  color: var(--clr-blu5);
}
.tagsSection .tags .tag p {
  color: black;
}

@media only screen and (max-width: 1150px) {
  .tagsSection .tags {
    grid-template-columns: 10% 1fr 1fr 1fr 10%;
  }
}
@media only screen and (max-width: 900px) {
  .tagsSection .tags {
    grid-template-columns: 5% 1fr 1fr 1fr 5%;
  }
}
@media only screen and (max-width: 768px) {
  .tagsSection {
    width: 100%;
    height: auto;
  }
  .tagsSection .tags {
    gap: 1em;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, 1fr);
    grid-template-areas: "tag1" "tag2" "tag3";
    overflow: hidden;
  }
  .tagsSection .tags .tag {
    margin-top: 0%;
  }
  .tagsSection .tags .tag1 {
    grid-area: tag1;
  }
  .tagsSection .tags .tag2 {
    grid-area: tag2;
  }
  .tagsSection .tags .tag3 {
    grid-area: tag3;
    margin-bottom: 1em;
  }
}
/* =============================================TAG SECTION END */
/* =============================================ABOUT SECTION START */
.aboutSection {
  width: 100%;
  height: auto;
  margin-top: 4em;
  text-align: center;
  color: var(--clr-blu5);
  /* clear: both; */
}
.aboutSection .about {
  width: 80%;
  height: auto;
  margin: 0 auto;
}
.aboutSection .about .about-txt h2 {
  margin: 0.6rem;
}
.aboutSection .about .about-img {
  padding-top: 2rem;
}
.aboutSection .about .about-img img {
  width: 100%;
  max-width: 700px;
  height: auto;
}

@media only screen and (max-width: 768px) {
  .aboutSection .about {
    width: 100%;
    padding: 0.3rem;
  }
}
/* ====================================================ABOUT BANNER END */
/*.image {
  width: 120px;
  height: 120px;
  margin:-60px 0 0 -60px;
  animation:spin 4s linear infinite;
}
@keyframes spin { 
  100% { 
    transform:rotate(360deg); 
  }
 } */
.banSection {
  width: 100%;
  height: auto;
  background-color: #fdc800;
}
.banSection .banr {
  padding: 4em 0em 0em 0em;
  grid-template-columns: 0.2fr 1fr 0.5fr 0.2fr;
  grid-template-areas: ". g1 g2 .";
}
.banSection .banr .firs {
  grid-area: g1;
}
.banSection .banr .firs ul {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-template-rows: repeat(3, 1fr);
  grid-gap: 1rem;
}
.banSection .banr .firs ul li {
  width: 97px;
  height: 95px;
  border: 1px solid black;
  background-repeat: no-repeat;
  background-size: cover;
}
.banSection .banr .seco {
  width: 100%;
  height: 100%;
  grid-area: g2;
  background-color: var(--clr-blu5);
}
.banSection .banr .seco h4 {
  font-weight: var(--fw-5);
  font-size: var(--fs-medium);
  padding: 1em 1em 0.3em 1em;
  color: white;
}
.banSection .banr .seco .cta {
  margin: 0 auto;
}

@media only screen and (max-width: 1080px) {
  .banSection {
    width: 100%;
    height: auto;
  }
  .banSection .banr {
    overflow: hidden;
    padding: 3rem;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 0.4fr;
    grid-template-areas: "g1" "g2";
  }
  .banSection .banr .firs {
    grid-area: g1;
  }
  .banSection .banr .firs ul {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(4, 1fr);
    width: 100%;
    height: 100%;
    gap: 0.2em;
  }
  .banSection .banr .firs ul li {
    width: 97px;
    height: 95px;
  }
  .banSection .banr .seco {
    grid-area: g2;
    text-align: center;
  }
}
@media only screen and (max-width: 668px) {
  .banSection {
    width: 100%;
    height: auto;
  }
  .banSection .banr {
    overflow: hidden;
    padding: 3rem;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 0.4fr;
    grid-template-areas: "g1" "g2";
  }
  .banSection .banr .firs {
    grid-area: g1;
  }
  .banSection .banr .firs ul {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
    width: 100%;
    height: 100%;
    gap: 0.2em;
  }
  .banSection .banr .firs ul li {
    width: 97px;
    height: 96px;
  }
  .banSection .banr .seco {
    grid-area: g2;
    text-align: center;
    width: 100%;
    height: 100%;
  }
}
.workflowSection {
  width: 100vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.workflowSection .workflow {
  overflow: hidden;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 0.4fr 1fr;
  grid-template-areas: "wtxt wtxt wtxt wtxt" "workflow-img workflow-img workflow-img workflow-img";
  padding: 4em 8em;
}
.workflowSection .workflow .workflow-txt {
  grid-area: wtxt;
  padding: 3rem;
}
.workflowSection .workflow .workflow-txt h2 {
  margin: 1rem 0px;
}
.workflowSection .workflow .workflow-txt span {
  width: 6rem;
  height: 0.5rem;
  background-color: var(--clr-jlo);
}
.workflowSection .workflow .workflow-img {
  grid-area: workflow-img;
  text-align: center;
}
.workflowSection .workflow .workflow-img img {
  width: 12rem;
  height: auto;
  padding: 0.5rem;
  border-radius: 50%;
  border: 0.2rem solid var(--clr-blu5);
}
.workflowSection .workflow .workflow-img img:hover {
  border: 0.2rem solid var(--clr-B4);
}
.workflowSection .workflow .workflow-img .material-symbols-outlined {
  fill: 0;
  font-weight: 400;
  font-optical-sizing: 48;
}
.workflowSection .workflow .workflow-img h4 {
  color: var(--clr-blu5);
  font-size: var(--fs-small);
  font-weight: var(--fw-7);
  padding: 0.4em 0.1em;
}

@media only screen and (max-width: 868px) {
  .workflowSection .workflow {
    padding: 2em;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: "wtxt" "workflow-img";
  }
  .workflowSection .workflow .workflow-img {
    grid-area: workflow-img;
    flex-direction: column;
    gap: 1em;
  }
  .workflowSection .workflow .workflow-img span {
    transform: rotate(90deg);
  }
  .workflowSection .workflow .workflow-txt {
    text-align: center;
    grid-area: wtxt;
  }
}
.mySlides {
  display: none;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
          animation-name: fade;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-timing-function: ease-in ease-out;
          animation-timing-function: ease-in ease-out;
}

@-webkit-keyframes fade {
  0% {
    transform: translate3d(50vw, 0, 0);
  }
  100% {
    transform: translate3d(0vw, 0, 0);
  }
}

@keyframes fade {
  0% {
    transform: translate3d(50vw, 0, 0);
  }
  100% {
    transform: translate3d(0vw, 0, 0);
  }
}
.testimonials-section {
  width: 100%;
  min-height: fit-content(6em);
  overflow-x: hidden;
  padding: 3em 0px;
  margin: 2rem 0rem;
}
.testimonials-section .testimonials {
  grid-template-columns: 1fr 0.2fr 0.2fr 1fr;
  grid-template-rows: 0.5fr 1fr 0.4fr;
}
.testimonials-section .testimonials .testimonial-heading {
  grid-column: 1/4;
  grid-row: 1/3;
  background-color: var(--clr-jlo);
  height: auto;
  padding: 3em;
}
.testimonials-section .testimonials .testimonial-heading h2 {
  margin-top: 0.1em;
}
.testimonials-section .testimonials .testimonial-heading span {
  display: block;
  width: 11em;
  height: 4px;
  background-color: var(--clr-blu5);
  margin-bottom: 2em;
}
.testimonials-section .testimonials .testimonial-img-txt {
  grid-column: 3/5;
  grid-row: 2/4;
  background-color: var(--clr-blu5);
  text-align: center;
  color: white;
  font-style: italic;
  line-height: var(--lh-default);
  min-height: fit-content(24em);
}
.testimonials-section .testimonials .testimonial-img-txt img {
  width: 170px;
  height: auto;
  border-radius: 50%;
  padding: 2em;
  margin-top: -5em;
  z-index: 1000;
}
.testimonials-section .testimonials .testimonial-img-txt h5 {
  margin: 1rem 0rem 0rem;
}
.testimonials-section .testimonials .testimonial-img-txt p {
  padding: 0em 2em 2em 2em;
}

@media only screen and (max-width: 768px) {
  .testimonials-section {
    width: 100%;
    height: auto;
  }
  .testimonials-section .testimonials {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .testimonials-section .testimonials .testimonial-heading {
    width: 100%;
    height: auto;
    padding: 3rem;
  }
  .testimonials-section .testimonials .testimonial-heading .testimonial-img-txt {
    height: auto;
  }
}
.vSec {
  background: url(images/1-1.webp), linear-gradient(rgba(0, 0, 13, 0.666), rgba(2, 2, 27, 0.671));
  background-position: top center;
  background-size: cover;
  background-blend-mode: soft-light;
  margin: 0rem 0rem 3rem 0rem;
  width: 100%;
  min-height: 60vh;
  height: auto;
  margin: 1em 0em 0em 0em;
}
.vSec .videos {
  color: white;
}
.vSec .videos h2 {
  font-size: var(--fs-large);
  padding: 1rem;
}
.vSec .videos p {
  margin-bottom: 1rem;
}
.vSec .videos img {
  background-color: white;
}

.reasonsSection {
  width: 90%;
  margin: 0 auto;
  grid-template-columns: 0.7fr 1fr;
  grid-template-areas: "reason-img reason-txt";
  padding: 2em 6em;
  gap: 2em;
  color: var(--clr-blu5);
}
.reasonsSection .reason-img {
  grid-area: reason-img;
}
.reasonsSection .reason-img img {
  width: 100%;
  height: auto;
}
.reasonsSection .reason-txt {
  grid-area: reason-txt;
}
.reasonsSection .reason-txt .reason .material-symbols-outlined {
  transform: rotate(90deg);
  padding-left: 1rem;
}
.reasonsSection .reason-txt .reason .reason-p {
  display: none;
}
.reasonsSection .reason-txt span {
  display: block;
  background-color: var(--clr-blu5);
  height: 3px;
  width: auto;
  margin: 0.5em 0em;
}

.reason p {
  margin-bottom: 2em;
}

@media only screen and (max-width: 768px) {
  .reasonsSection {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    padding: 1em 2em;
  }
}
.news-headingSection {
  width: 80%;
  height: auto;
  margin: 6em auto 2em auto;
  color: var(--clr-blu5);
}

.newsSection {
  grid-template-columns: 1fr 1fr;
  width: 80%;
  height: auto;
  margin: 0 auto;
  gap: 1em;
}
.newsSection .news-img-txt img {
  width: 100%;
  height: auto;
}
.newsSection .news-img-txt .news1 {
  padding: 1em;
  background-color: rgba(170, 224, 246, 0.227);
}
.newsSection .news-img-txt .news1 p {
  margin: 1em 0em;
}
.newsSection .news-txt {
  height: 100%;
}
.newsSection .news-txt .neus {
  background-color: rgba(170, 224, 246, 0.227);
  padding: 1em;
  margin-bottom: 2rem;
}
.newsSection .news-txt .neus h4 {
  line-height: 1.3em;
}
.newsSection .news-txt .neus p {
  margin: 1em 0em;
}

.fontgap {
  line-height: 2rem;
}

@media only screen and (max-width: 768px) {
  .news-headingSection .news-heading2 {
    grid-template-columns: 1fr;
  }
  .newsSection {
    grid-template-columns: 1fr;
    width: 100%;
    height: auto;
  }
}

.footer {
  width: 100%;
  height: auto;
  background-color: var(--clr-blu4);
}
.footer .upper-footer {
  padding: 4rem;
  gap: 1em;
  color: white;
}
/*.footer .upper-footer img {*/
/*  background-color: white;*/
/*  width: 150px;*/
/*  height: 180px;*/
/*  padding: 1.5em;*/
/*  border-radius: 1em;*/
/*}*/
.footer .upper-footer .footer-img-txt {
  gap: 2rem;
}
.footer .upper-footer .social-media span {
  display: block;
  height: 3px;
  width: 100%;
  background-color: black;
}
.footer .upper-footer .social-media .fa {
  padding: 5px;
  font-size: 30px;
  width: 30px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
}
.footer .upper-footer .social-media .sm {
  color: #ffffff;
}
.footer .upper-footer .links span {
  display: block;
  height: 3px;
  width: 100%;
  background-color: white;
}
.footer .upper-footer .links h6 {
  font-size: var(--fs-medium);
  padding: 1em;
}
.footer .upper-footer .links li a {
  color: white;
}
.footer .upper-footer .services-footer span {
  display: block;
  height: 3px;
  width: 100%;
  background-color: white;
}
.footer .upper-footer .services-footer h6 {
  font-size: var(--fs-medium);
  padding: 1em;
}
.footer .upper-footer .services-footer li a {
  color: white;
}
.footer .upper-footer .social-media span {
  display: block;
  height: 3px;
  width: 100%;
  background-color: white;
}
.footer .upper-footer .social-media h6 {
  font-size: var(--fs-medium);
  padding: 1em;
}


.footer .lower-footer {
  text-align: center;
  padding: 1em;
  width: 100%;
  height: 10vh;
  color: white;
  background-color: var(--clr-blu5);
}

@media only screen and (max-width: 768px) {
  footer .upper-footer {
    grid-template-columns: 1fr 1fr;
  }
}
.topBanner-section {
  width: 100%;
  height: 70vh;
  color: white;
  padding-top: 9vh;
}
.topBanner-section .top-banner {
  background: url(images/course-img-two-526x470.webp), linear-gradient(rgba(0, 0, 0, 0.847), rgba(0, 0, 0, 0.682));
  background-blend-mode: soft-light;
  height: 100%;
  display: grid;
  place-content: center;
  text-align: center;
}
.topBanner-section .top-banner h3 {
  font-size: 3rem;
}
.topBanner-section .top-banner p {
  font-weight: 700;
}

.about-section {
  width: 100%;
  height: auto;
  padding: 4em 0px 6em 0px;
  margin: 0em 0em 5rem 0rem;
  background: url(images/bg-buildings.uk.jpg);
  background-size: cover;
  background-repeat: no-repeat;
}
.about-section .about-about {
  width: 80%;
  margin: 0 auto;
  gap: 1em;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.about-section .about-about .about-col-one {
  display: flex;
  flex-direction: column;
  line-height: var(--lh-default);
}
.about-section .about-about .about-col-one h4 {
  font-size: 20px;
  font-weight: var(--fw-5);
  margin-bottom: 1em;
}
.about-section .about-about .about-col-one p {
  margin-bottom: 1em;
}
.about-section .about-about .about-col-one .about-signature h5 {
  font-weight: var(--fw-5);
  font-size: 20px;
}
.about-section .about-about .about-col-one .vision-icon-heading p:nth-child(2) {
  margin-bottom: 5px;
}
.about-section .about-about .about-col-one .vision-icon-heading h3:nth-child(3) {
  margin-bottom: 2em;
  font-size: 20px;
  font-weight: var(--fw-5);
}
.about-section .about-about .about-col-one .vision-icon-heading img {
  float: left;
  margin-right: 1.5em;
  background-color: orangered;
  border-radius: 50%;
  padding: 10px;
}
.about-section .about-about .about-col-two {
  height: 100%;
  line-height: var(--lh-default);
}
.about-section .about-about .about-col-two h3 {
  font-size: var(--fs-medium);
  font-weight: var(--fw-7);
  color: var(--clr-blu5);
  margin-bottom: 5px;
}
.about-section .about-about .about-col-two div:nth-child(1), .about-section .about-about .about-col-two div:nth-child(2) {
  border-bottom: 1px solid rgba(115, 115, 115, 0.355);
}
.about-section .about-about .about-col-two .about-sub-col2 {
  padding: 2em;
}
.about-section .about-about .about-col-two img {
  float: left;
  margin-right: 1.5em;
}

@media only screen and (max-width: 700px) {
  .about-section {
    width: 100%;
    height: auto;
  }
  .about-section .about-about {
    width: 96%;
    grid-template-columns: 1fr;
  }
}
.thirdSection {
  width: 100%;
  height: auto;
}
.thirdSection .third-imgs {
  display: grid;
  width: 80%;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
  grid-template-columns: repeat(3, 1fr);
  gap: 1em;
}
.thirdSection .third-imgs img {
  width: 100%;
  height: auto;
  margin-top: -130px;
}
.thirdSection .third-imgs img:hover {
  transform: scale(1.03);
  transition-duration: 1s;
}
.thirdSection .third-imgs h3 {
  background-color: var(--clr-blu5);
  color: white;
  font-size: var(--fs-small);
  padding: 0.3em;
}

@media only screen and (max-width: 700px) {
  .thirdSection .third-imgs {
    width: 98%;
    grid-template-columns: 1fr;
  }
  .thirdSection .third-imgs img {
    margin-top: 0px;
  }
}
.faq-heading {
  margin-top: 8rem;
}
.faq-heading p {
  color: orangered;
}
.faq-heading h2 {
  font-size: var(--fs-large);
  font-weight: var(--fw-7);
}
.faq-heading span {
  display: inline-block;
  width: 60px;
  height: 4px;
  background-color: orangered;
}

.faqSection {
  display: grid;
  grid-template-columns: 0.6fr 1fr;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  padding: 4em 8em 8em 8em;
  gap: 2rem;
  text-align: left;
}

.faqImg img {
  width: 100%;
  max-width: 450px;
  height: auto;
}

.faqTxt {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: auto;
}

.accordition {
  padding: 1rem 1.5rem;
  margin-bottom: 0.3rem;
  background-color: var(--clr-blu5);
  color: white;
  cursor: pointer;
  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  font-size: var(--fs-small);
  font-weight: var(--fw-7);
  text-align: start;
  line-height: var(--lh-default);
}

.accordition span {
  margin-left: auto;
}

.accordition.active {
  background-color: orangered;
  color: white;
}

.panel {
  width: 100%;
  padding: 0.3rem 0.5rem;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: none;
  line-height: 1.2;
}

@media only screen and (max-width: 1000px) {
  .faqSection {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    padding: 1rem 3rem;
    gap: 0.8rem;
  }
  .faqImg {
    display: none;
  }
}
@media only screen and (max-width: 600px) {
  .faqSection {
    padding: 1rem;
  }
}
.services-servicesSection {
  width: 100%;
  height: auto;
}
.services-servicesSection .services-services {
  width: 80%;
  margin: 0 auto;
  padding: 4em;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  gap: 1.7em;
}
.services-servicesSection .service {
  margin: 2rem 0rem;
  box-shadow: 10px 0px 20px 1px rgba(0, 0, 0, 0.088);
}
.services-servicesSection .service img {
  width: 100%;
  height: auto;
}
.services-servicesSection .service h3 {
  font-size: 20px;
  font-weight: 500;
  padding: 1rem;
  color: var(--clr-blu5);
}
.services-servicesSection .service p {
  padding: 1rem;
  color: rgb(138, 131, 131);
}
.services-servicesSection .service .service-inside {
  display: flex;
  align-items: center;
  border: 0.5px solid rgb(154, 154, 154);
  height: 30px;
  width: 100%;
  margin-top: 2em;
}
.services-servicesSection .service .service-inside img {
  width: 30px;
  height: auto;
  padding: 5px;
  opacity: 0.5;
}
.services-servicesSection .service .service-inside span {
  padding: 5px;
  opacity: 0.5;
}
.services-servicesSection .service .service-inside button {
  margin-left: auto;
  background-color: orangered;
  border: none;
  font-size: 14px;
  padding: 0px 1rem;
  height: 100%;
}
.services-servicesSection .service .service-inside button a {
  color: white;
}

@media only screen and (max-width: 1260px) {
  .services-servicesSection .services-services {
    width: 90%;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(5, 1fr);
    padding: 2em;
    gap: 0.8;
  }
}
@media only screen and (max-width: 890px) {
  .services-servicesSection .services-services {
    width: 98%;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(9, 1fr);
    padding: 0.4em;
    gap: 0.3;
  }
}
.about-medical-practitionerSection {
  width: 100%;
  height: auto;
}

.about-treatment {
  width: 80%;
  height: auto;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5rem;
  padding: 4rem;
}

.about-treatment img {
  width: 100%;
  min-width: 340px;
  height: auto;
}

.about-treatmentTxt h1 {
  font-size: var(--fs-xlarge);
  font-family: var(--ff-main);
  font-weight: var(--fw-7);
  color: var(--clr-blu4);
}

.about-treatmentTxt h4 {
  font-size: var(--fs-medium);
  margin: 1.2rem 0px;
  color: var(--clr-blu4);
}

@media only screen and (max-width: 1300px) {
  .about-treatment {
    width: 88%;
    gap: 3rem;
    padding: 3rem;
  }
}
@media only screen and (max-width: 1168px) {
  .about-treatment {
    width: 92%;
    gap: 2rem;
    padding: 2rem;
  }
}
@media only screen and (max-width: 900px) {
  .about-treatment {
    width: 100%;
    gap: 2rem;
    padding: 1rem;
  }
}
/* ................................................TREATMENT SECTION */
.treatmentSection {
  display: grid;
  grid-template-columns: 1fr 0.4fr;
  gap: 1rem;
  width: 80%;
  height: auto;
  margin: 0px auto;
}

.treatmentImg img {
  width: 100%;
  max-width: auto;
  max-height: 500px;
  height: auto;
}

.treatmentTxt h2 {
  font-size: var(--fs-large);
  font-weight: var(--fw-7);
  color: var(--clr-blu4);
}

.treatmentTxt p {
  margin: 2rem 0px;
}

.treatmentImgTxt {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  background-color: rgb(241, 240, 240);
  justify-content: center;
  align-items: center;
}

.treatmentImgTxt img {
  width: 100%;
  height: auto;
}

.treatmentImgTxt h4 {
  font-size: var(--fs-medium);
  font-weight: var(--fw-7);
  font-family: var(--ff-main);
  padding: 1rem;
  color: var(--clr-blu4);
}

.treatmentImgTxt p {
  padding: 1rem;
}

.side-menuLinks {
  border: 1px solid rgb(169, 167, 167);
  padding: 2rem;
  display: grid;
}

.side-menuLinks a {
  margin: 0.3rem 0px;
  background-color: var(--clr-ora3);
  text-align: start;
  padding: 0.2rem;
  /* border: 0.2px solid rgb(167, 166, 166); */
}

.side-menuLinks button {
  border: none;
  background-color: transparent;
  font-size: var(--fs-small);
  font-weight: var(--fw-5);
  cursor: pointer;
  padding: 0.4rem;
  color: white;
}

.side-menuLinks h3 {
  font-size: var(--fs-medium);
  font-weight: var(--fw-7);
  font-family: var(--ff-main);
  margin-bottom: 1rem;
  color: var(--clr-blu4);
}

.side-openingHrs {
  border: 1px solid rgb(169, 167, 167);
  padding: 3rem;
  margin: 2rem 0px;
}

.side-openingHrs h3 {
  font-size: var(--fs-medium);
  font-weight: var(--fw-5);
  margin: 1rem 0px;
  color: var(--clr-blu4);
}

.side-openingHrs p {
  margin-bottom: 0.3rem;
  font-size: var(--fs-small);
  font-weight: var(--fw-7);
}

.side-appointment {
  border: 1px solid rgb(169, 167, 167);
  padding: 3rem;
}

.side-appointment h3 {
  font-size: var(--fs-medium);
  font-weight: var(--fw-5);
  color: var(--clr-blu4);
}

.side-appointment button {
  margin: 1rem 0px;
  padding: 0.5rem 2rem;
  background-color: var(--clr-ora3);
  color: white;
  font-family: var(--ff-main);
  font-weight: var(--fw-7);
  text-align: start;
  border: none;
}

@media only screen and (max-width: 1350px) {
  .about-treatment {
    width: 88%;
    gap: 3rem;
    padding: 3rem;
  }
  .treatmentSection {
    width: 86%;
  }
}
@media only screen and (max-width: 1260px) {
  .treatmentSection {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
    width: 100%;
    padding: 0.6rem;
    overflow: hidden;
  }
  .treatmentImgTxt {
    gap: 0.5rem;
  }
  .treatmentImgTxt h4 {
    padding: 0.3rem;
  }
  .treatmentImgTxt p {
    padding: 0.3rem;
    -moz-text-align-last: justify;
         text-align-last: justify;
  }
  .side-menuLinks {
    overflow: hidden;
  }
  .side-menuLinks button {
    border: none;
  }
}
@media only screen and (max-width: 1168px) {
  .about-treatment {
    width: 92%;
    gap: 2rem;
    padding: 2rem;
  }
}
@media only screen and (max-width: 900px) {
  .about-treatment {
    width: 100%;
    gap: 2rem;
    padding: 1rem;
  }
}
@media only screen and (max-width: 700px) {
  .top-banner {
    height: 35vh;
    background-position-x: right;
    overflow: hidden;
    margin-top: -8px;
  }
  .bannerTxt h1 {
    text-shadow: 1px 1px 2px black;
  }
  /*........................................................ BENNER END HERE */
  .about-medical-practitionerSection {
    overflow: hidden;
    height: auto;
  }
  .about-treatment {
    width: 100%;
    flex-direction: column-reverse;
    gap: 1rem;
    padding: 1.2rem;
  }
}
.internship {
  background: url(images/intership-banner.png), linear-gradient(rgba(0, 0, 0, 0.847), rgba(0, 0, 0, 0.682));
}

.school-trips {
  background: url(images/wh08-32.webp), linear-gradient(rgba(0, 0, 0, 0.847), rgba(0, 0, 0, 0.682));
  background-position:center center;
}

.commonBanner {
  height: 100%;
  display: grid;
  place-content: center;
  text-align: center;
  background-size: cover;
}
.commonBanner h3 {
  font-size: 3rem;
}
.commonBanner p {
  font-weight: 700;
}/*# sourceMappingURL=style.css.map */