@font-face {
    font-family: 'TERMINABOLD';
    src: url('../fonts/TerminaTest-Bold.woff') format('woff'),


}

@font-face {
    font-family: 'TERMINADEMI';
    src: url('../fonts/TerminaTest-Demi.woff') format('woff'),


}


@font-face {
    font-family: 'TERMINAMEDI';
    src: url('../fonts/TerminaTest-Medium.woff') format('woff'),


}



@font-face {
    font-family: 'TERMINA';
    src: url('../fonts/TerminaTest-Regular.woff') format('woff'),


}


@font-face {
    font-family: 'PROXIMAREG';
    src: url('../fonts/ProximaNova-Regular.woff') format('woff'),


}

@font-face {
    font-family: 'PROXIMASEMI';
    src: url('../fonts/ProximaNova-Semibold.woff') format('woff'),


}

@font-face {
    font-family: 'PROXIMALIGHT';
    src: url('../fonts/ProximaNova-Light.woff') format('woff'),


}


@font-face {
    font-family: 'POPPINSMEDI';
    src: url('../fonts/Poppins-Medium.woff') format('woff'),


}


@font-face {
    font-family: 'POPPINSREG';
    src: url('../fonts/Poppins-Regular.woff') format('woff'),


}


body{
    overflow-x: clip;


    background-image:url('../images/gym.jpg'); 

  background-repeat: no-repeat;


  background-position: center center;

  background-size: cover;

 
  margin: 0;

      background-color: #81D3F0;
    background-blend-mode: soft-light;

}




.container {
margin: 0 auto;
  max-width: 1272px;
  min-width: 420px;
  padding-left: 30px;
  padding-right: 30px;
  min-height: 100vh;

  

}


.containerTwo {
margin: 0 auto;
  max-width: 1272px;
  min-width: 420px;
  padding-left: 30px;
  padding-right: 30px;
  min-height: 100vh;


  

}

.containerThree {
margin: 0 auto;
  max-width: 1272px;
  min-width: 420px;
  padding-left: 30px;
  padding-right: 30px;
  min-height: 100vh;


  

}


.containerFour {
margin: 0 auto;
  max-width: 1272px;
  min-width: 420px;
  padding-left: 30px;
  padding-right: 30px;
  min-height: 100vh;
  

}





.bodyHolder{
    width: 1272px;
    position: relative;
    display: flex;


}


h4{
  font-size: clamp(0.75rem, 2vh, 1.1rem);
   font-family: PROXIMASEMI;
    color: #6B1234;
    margin: 0;

}



h3{
   font-size: clamp(0.75rem, 2.5vh, 1.5rem);
   font-family: PROXIMASEMI;
    color: #6B1234;
    margin: 0;


}


h1 {
  font-size: clamp(0.9rem, 3vh, 1.5rem);
  font-family: PROXIMAREG;
  color: #6B1234;
  margin: 0;
}

h2 {
  font-size: clamp(1rem, 3.5vh, 1.8rem);
  font-family: PROXIMASEMI;
  color: #6B1234;
  margin: 0;
}

p {
  font-size: clamp(0.65rem, 2vh, 1.1rem);
  font-family: PROXIMAREG;
  color: #6B1234;
  margin: 0;
}


.symbolHolder{
    width: 98%;
    z-index: 99;
    display: flex;
    position: absolute;
    top: 1.2em;

    
}



.logo{
    background-image:url('../images/logo-blue.png'); 
    background-repeat: no-repeat;
    background-size:contain;
     width: 3em;
     height: 3em;
     display: block;
     margin-right: auto;
     transition: 500ms ease-out;
     
}


.logo:hover{
  background-image:url('../images/logo.png'); 
  background-repeat: no-repeat;
  background-size:contain;
  width: 3em;
     height: 3em;
     display: block;
     background-color: lightblue;
     border-radius: 12px;
     transition: 500ms ease-out;
}


.ai{
    background-image:url('../images/ai.png'); 
    background-repeat: no-repeat;
    background-size:contain;
     width: 3em;
     height: 3em;
     display: block;


}


.settings{
      background-image:url('../images/settings.png'); 
    background-repeat: no-repeat;
    background-size:contain;
   width: 2.3em;
  height: 2.3em;
     display: block;
     margin-left: 30px;

    
}



.headerShape{
        position: absolute;
         width: 100%;
        height: 150px;
        aspect-ratio: 7.146;
        aspect-ratio: 7.482;
        clip-path: shape(from 98.82% 0%,line to 1.18% 0%,curve to 0% 8.82% with 0.53% 0%/0% 3.95%,line to 0% 41.76%,curve to 1.18% 50.59% with 0% 46.64%/0.53% 50.59%,line to 24.29% 50.59%,curve to 25.47% 59.41% with 24.94% 50.59%/25.47% 54.54%,line to 25.47% 91.18%,curve to 26.65% 100% with 25.47% 96.05%/26% 100%,line to 98.82% 100%,curve to 100% 91.18% with 99.47% 100%/100% 96.05%,line to 100% 8.82%,curve to 98.82% 0% with 100% 3.95%/99.47% 0%,close);
        background-color: #6B1234;
        mix-blend-mode: hard-light;
        display: flex;
      justify-content: center;
      transition: width 200ms ease-out;
}

.headerShapeTwo{
        position: absolute;
         width: 100%;
        height: 150px;
    aspect-ratio: 7.088;
    clip-path: shape(from 98.82% 0%,line to 1.18% 0%,curve to 0% 8.36% with 0.53% 0%/0% 3.74%,line to 0% 47.92%,line to 0% 90.83%,curve to 1.18% 99.18% with 0% 95.44%/0.53% 99.18%,line to 22.41% 99.18%,curve to 23.58% 90.83% with 23.06% 99.18%/23.58% 95.44%,line to 23.58% 56.28%,curve to 24.76% 47.92% with 23.58% 51.66%/24.11% 47.92%,line to 49.76% 47.92%,curve to 50.94% 56.28% with 50.42% 47.92%/50.94% 51.66%,line to 50.94% 91.64%,curve to 52.13% 100% with 50.94% 96.27%/51.47% 100.01%,line to 98.82% 99.2%,curve to 100% 90.85% with 99.47% 99.19%/100% 95.45%,line to 100% 8.36%,curve to 98.82% 0% with 100% 3.74%/99.47% 0%,close);
       background-color: #6B1234;
        mix-blend-mode: hard-light;
        display: flex;
      justify-content: center;
      transition: width 200ms ease-out;
}


.headerShapeThree{
        position: absolute;
         width: 100%;
        height: 150px;
  aspect-ratio: 7.146;
  clip-path: shape(from 98.82% 0%,line to 1.18% 0%,curve to 0% 8.43% with 0.53% 0%/0% 3.77%,line to 0% 48.31%,line to 0% 91.57%,curve to 1.18% 100% with 0% 96.23%/0.53% 100%,line to 23.58% 100%,line to 47.88% 100%,curve to 49.06% 91.57% with 48.53% 100%/49.06% 96.23%,line to 49.06% 56.74%,curve to 50.24% 48.31% with 49.06% 52.09%/49.58% 48.31%,line to 75.24% 48.31%,curve to 76.42% 56.74% with 75.89% 48.31%/76.42% 52.09%,line to 76.42% 91.57%,curve to 77.59% 100% with 76.42% 96.23%/76.94% 100%,line to 98.82% 100%,curve to 100% 91.57% with 99.47% 100%/100% 96.23%,line to 100% 8.43%,curve to 98.82% 0% with 100% 3.77%/99.47% 0%,close);

       background-color: #6B1234;
        mix-blend-mode: hard-light;
        display: flex;
      justify-content: center;
      transition: width 200ms ease-out;
}


.headerShapeFour{
        position: absolute;
         width: 100%;
        height: 150px;
      aspect-ratio: 7.086;
      clip-path: shape(from 98.82% 0%,line to 1.18% 0%,curve to 0% 8.36% with 0.53% 0%/0% 3.74%,line to 0% 47.91%,line to 0% 90.81%,curve to 1.18% 99.16% with 0% 95.42%/0.53% 99.16%,line to 23.58% 99.16%,line to 50.94% 100%,line to 73.35% 100%,curve to 74.53% 91.64% with 74% 100%/74.53% 96.26%,line to 74.53% 56.27%,curve to 75.71% 47.91% with 74.53% 51.65%/75.06% 47.91%,line to 98.82% 47.91%,curve to 100% 39.55% with 99.47% 47.91%/100% 44.17%,vline to 8.36%,curve to 98.82% 0% with 100% 3.74%/99.47% 0%,close);


       background-color: #6B1234;
        mix-blend-mode: hard-light;
        display: flex;
      justify-content: center;
      transition: width 200ms ease-out;
}




.bodyShape{
position: absolute;
width: 100%;
height: 85vh;
top: 100px;
aspect-ratio: 1.531;
clip-path: shape(from 22.01% 0%,curve to 23.58% 2.41% with 22.88% 0%/23.58% 1.08%,vline to 9.27%,curve to 25.16% 11.67% with 23.58% 10.6%/24.29% 11.67%,hline to 98.43%,curve to 100% 14.08% with 99.3% 11.67%/100% 12.75%,vline to 97.59%,curve to 98.43% 100% with 100% 98.92%/99.3% 100%,hline to 1.57%,curve to 0% 97.59% with 0.7% 100%/0% 98.92%,vline to 13.96%,vline to 11.67%,vline to 2.41%,curve to 1.57% 0% with 0% 1.08%/0.7% 0%,hline to 7.55%,line to 22.01% 0%,close);
background-color: #81D3F0;
mix-blend-mode: multiply;
transition: width 200ms ease-out;
align-items: center;
  display: flex;
  justify-content: center;



}


.bodyShapeTwo{
position: absolute;
width: 100%;
height: 85vh;
top: 100px;
  aspect-ratio: 1.531;
  clip-path: shape(from 49.06% 2.41%,curve to 47.48% 0% with 49.06% 1.08%/48.35% 0%,hline to 27.04%,curve to 25.47% 2.41% with 26.18% 0%/25.47% 1.08%,vline to 9.27%,curve to 23.9% 11.67% with 25.47% 10.6%/24.77% 11.67%,hline to 23.58%,hline to 1.49%,curve to 0% 13.96% with 0.67% 11.67%/0% 12.7%,vline to 97.59%,curve to 1.57% 100% with 0% 98.92%/0.7% 100%,hline to 98.43%,curve to 100% 97.59% with 99.3% 100%/100% 98.92%,vline to 14.08%,curve to 98.43% 11.67% with 100% 12.75%/99.3% 11.67%,hline to 50.63%,curve to 49.06% 9.27% with 49.76% 11.67%/49.06% 10.6%,vline to 2.41%,close);
background-color: #81D3F0;
mix-blend-mode: multiply;
transition: width 200ms ease-out;
align-items: center;
  display: flex;
  justify-content: center;



}

.bodyShapeThree{
position: absolute;
width: 100%;
height: 85vh;
top: 100px;
aspect-ratio: 1.531;
clip-path: shape(from 23.58% 11.67%,hline to 25.47%,hline to 49.37%,curve to 50.94% 9.27% with 50.24% 11.67%/50.94% 10.6%,vline to 2.41%,curve to 52.52% 0% with 50.94% 1.08%/51.65% 0%,hline to 72.96%,curve to 74.53% 2.41% with 73.82% 0%/74.53% 1.08%,vline to 9.27%,curve to 76.1% 11.67% with 74.53% 10.6%/75.23% 11.67%,hline to 98.43%,curve to 100% 14.08% with 99.3% 11.67%/100% 12.75%,vline to 97.59%,curve to 98.43% 100% with 100% 98.92%/99.3% 100%,hline to 1.57%,curve to 0% 97.59% with 0.7% 100%/0% 98.92%,vline to 13.96%,curve to 1.49% 11.67% with 0% 12.7%/0.67% 11.67%,hline to 23.58%,close);
background-color: #81D3F0;
mix-blend-mode: multiply;
transition: width 200ms ease-out;
align-items: center;
  display: flex;
  justify-content: center;



}



.bodyShapeFour{
position: absolute;
width: 100%;
height: 85vh;
top: 100px;

  aspect-ratio: 1.532;
  clip-path: shape(from 23.58% 11.62%,hline to 25.47%,hline to 49.06%,hline to 74.84%,curve to 76.42% 9.21% with 75.71% 11.62%/76.42% 10.54%,vline to 2.41%,curve to 77.99% 0% with 76.42% 1.08%/77.12% 0%,hline to 98.43%,curve to 100% 2.41% with 99.3% 0%/100% 1.08%,vline to 11.62%,vline to 97.59%,curve to 98.43% 100% with 100% 98.92%/99.3% 100%,hline to 1.57%,curve to 0% 97.59% with 0.7% 100%/0% 98.92%,vline to 13.91%,curve to 1.49% 11.62% with 0% 12.64%/0.67% 11.62%,hline to 23.58%,close);

background-color: #81D3F0;
mix-blend-mode: multiply;
transition: width 200ms ease-out;
align-items: center;
  display: flex;
  justify-content: center;



}



.listHolder{
font-family: PROXIMASEMI;
  font-size: 1rem;
  color: #81D3F0;
  z-index: 99;
  display: flex;
  justify-content: space-between;
  padding: 0.5rem 6.5em;
  position: absolute;
  top: 110px;
  transition: width 200ms ease-out;
 width: 100%;

}



.buttonHolder{
font-family: PROXIMASEMI;
  font-size: 1rem;
  color: #81D3F0;
  z-index: 9999;
  display: flex;
  justify-content: space-between;

  position: absolute;
  top: 100px;
  transition: width 200ms ease-out;
  width: 100%;

}


.dashboardButton {
  background: none;
  border: none;
  padding: 15px 30px;
  margin: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit; /* Keeps accessibility for keyboard users */
  appearance: none; /* Removes OS-specific native styling */
  color: #81D3F0;
  width: 300px;
  height: 50px;
  transition: border-radius 400ms ease-out;


}


.dashboardButton:hover{
  border: solid;
  border-color: #81D3F0;
  border-width: 5px;
  border-radius: 15px;
  transition: border-radius 400ms ease-out;

}




.designButton {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit; /* Keeps accessibility for keyboard users */
  appearance: none; /* Removes OS-specific native styling */
  color: #81D3F0;
  width: 300px;
  height: 50px;
   transition: border-radius 400ms ease-out;
}


.designButton:hover{
  border: solid;
  border-color: #81D3F0;
  border-width: 5px;
  border-radius: 15px;
  transition: border-radius 400ms ease-out;

}


.communityButton {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit; /* Keeps accessibility for keyboard users */
  appearance: none; /* Removes OS-specific native styling */
  border-color: #81D3F0;
  width: 300px;
  height: 50px;
  transition: border-radius 400ms ease-out;
}

.communityButton:hover{
  border: solid;
  border-color: #81D3F0;
  border-width: 5px;
  border-radius: 15px;
  transition: border-radius 400ms ease-out;

}



.healthServicesButton {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit; /* Keeps accessibility for keyboard users */
  appearance: none; /* Removes OS-specific native styling */
  color: #81D3F0;
  width: 300px;
  height: 50px;
  transition: border-color 400ms ease-out;
}



.healthServicesButton:hover{
  border: solid;
  border-color: #81D3F0;
  border-width: 5px;
  border-radius: 15px;
  transition: border-color 400ms ease-out;

}





.learnMore{
background-color: #6B1234;
  color: white;
  padding: 15px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  position: relative;
  border: none;
  border-radius: 12px;
  mix-blend-mode: hard-light;


}



ul{
display: flex;
  list-style: none;
  gap: 262px;
  transition: gap 200ms ease-out;


}

.insideHolder{
    height: 68vh;
    align-content: center;
    display: flex;
  position: absolute;


}


.insideHolderTwo{
    height: 50vh;
    align-content: center;
    display: flex;
  position: absolute;


}

.firstTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
  left: 6%;
  top: 36%;
  transform: translate(-50%, -50%);
  width: fit-content;
  mix-blend-mode: hard-light;
}


.secondTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: last baseline;
  box-sizing: border-box;
  left: 13%;
  top: 88%;
  mix-blend-mode: hard-light;
 
  

}


.thirdTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: last baseline;
  box-sizing: border-box;
  left: 16%;
  top: 24%;
  mix-blend-mode: hard-light;
 
  

}



.fourthTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
 left: 29%;
  top: 57%;
  transform: translate(-50%, -50%);
  width: fit-content;
  mix-blend-mode: hard-light;
 
  

}


.fifthTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
  left: 44%;
  top: 69%;
  transform: translate(-50%, -50%);
  width: fit-content;
 
    mix-blend-mode: hard-light;
  

}



.sixTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
  left: 50%;
  top: 34%;
  transform: translate(-50%, -50%);
  width: fit-content;
  align-items: last baseline;
  mix-blend-mode: hard-light;
 
  

}


.sevenTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
  left: 52%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: fit-content;
  align-items: last baseline;
  mix-blend-mode: hard-light;
 
  

}


.eightTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
 left: 70%;
  top: 34%;
  transform: translate(-50%, -50%);
  width: fit-content;
  mix-blend-mode: hard-light;
  align-items: last baseline;

  

}



.nineTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
  left: 70%;
  top: 50vh;
  transform: translate(-50%, -50%);
  width: fit-content;
  align-items: last baseline;
  mix-blend-mode: hard-light;

  

}

.tenTextHolder {
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
 left: 82%;
  top: 9%;
  transform: translate(-50%, -50%);
  width: fit-content;
  align-items: last baseline;
  mix-blend-mode: hard-light;

  

}



.elevenTextHolder{
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
  left: 9%;
  top: 20%;
  transform: translate(-50%, -50%);
  mix-blend-mode: hard-light;
  height: 30%;
  justify-content: center;
  align-content: center;
}


.twelveTextHolder{
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(5px, 2vh, 15px);
  padding: clamp(15px, 3vw, 25px);
  box-sizing: border-box;
  left: 30%;
  top: 31%;
  transform: translate(-50%, -50%);
  mix-blend-mode: hard-light;
  height: 30%;
  justify-content: center;
  align-content: center;
}


.thirteenTextHolder{
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(10px, 30vh, 20px);
  padding: clamp(20px, 10vw, 25px);
  box-sizing: border-box;
  left: 24%;
  top: 59%;
  transform: translate(-50%, -50%);
  mix-blend-mode: hard-light;
  height: 30%;
  justify-content: center;
  align-content: center;
}



.fourteenTextHolder{
position: absolute;
  display: flex;
  flex-direction: column;
  align-items: last baseline;
  gap: clamp(10px, 30vh, 15px);
  box-sizing: border-box;
  left: 55%;
  top: 38%;
  transform: translate(-50%, -50%);
  mix-blend-mode: hard-light;
  width: 23%;
}


.fifteenTextHolder{
position: absolute;
  display: flex;
  flex-direction: column;

  gap: clamp(7px, 3vh, 10px);
  box-sizing: border-box;
  left: 59%;
  top: 58%;
  transform: translate(-50%, -50%);
  mix-blend-mode: hard-light;
  width: 13%;
  height: 5vh;
}






.smallButtonHolder{
font-family: PROXIMASEMI;
  font-size: 1rem;
  color: #81D3F0;
  z-index: 9999;
  position: absolute;
  top: 83%;
  transition: width 200ms ease-out;
  width: 20%;
  height: 10%;
  background-color: #6B1234;
  mix-blend-mode: hard-light;
  text-align: center;
  align-content: center;
  border-radius: 12px;
  left: 2%;
}



.smallButtonHolderTwo{
font-family: PROXIMASEMI;
  font-size: 1rem;
  color: #81D3F0;
  z-index: 9999;
  position: absolute;
  top: 32%;
  transition: width 200ms ease-out;
  width: 20%;
  height: 10%;
  background-color: #6B1234;
  mix-blend-mode: hard-light;
  text-align: center;
  align-content: center;
  border-radius: 12px;
  left: 73%;
}



.smallMap{
width: 40%;
  height: 40%;
  position: absolute;
  display: flex;
  align-content: center;
  background-image: url('../images/map.png');
  background-repeat: no-repeat;
  background-size: contain;
  top: 45%;
  left: 73%;

}


.smallPros{
width: 15%;
  height: 15%;
  position: absolute;
  display: flex;
  align-content: center;
  background-image: url('../images/object.png');
  background-repeat: no-repeat;
  background-size: contain;
  top: 67%;
  left: 55%;

}






.plusLogo{
width: 40%;
  height: 40%;
  position: absolute;
  display: flex;
  align-content: center;
  background-image: url('../images/plus.png');
  background-repeat: no-repeat;
  background-size: contain;
  top: 0;

}




.firstShape{
    height: 70vh;
    background-color: #BAEDFF;
    aspect-ratio: 1.723;
    clip-path: shape(from 62.5% 38.99%,hline to 70.64%,curve to 71.78% 40.95% with 71.27% 38.99%/71.78% 39.87%,vline to 58.65%,curve to 70.64% 60.6% with 71.78% 59.73%/71.27% 60.6%,hline to 62.5%,curve to 61.36% 62.56% with 61.87% 60.6%/61.36% 61.48%,vline to 96.42%,curve to 62.5% 98.38% with 61.36% 97.5%/61.87% 98.38%,hline to 67.95%,curve to 69.08% 96.42% with 68.57% 98.38%/69.08% 97.5%,vline to 88.17%,curve to 70.22% 86.22% with 69.08% 87.09%/69.59% 86.22%,hline to 78.36%,curve to 79.5% 84.26% with 78.99% 86.22%/79.5% 85.34%,vline to 31.65%,curve to 78.36% 29.69% with 79.5% 30.57%/78.99% 29.69%,hline to 62.5%,curve to 61.36% 31.65% with 61.87% 29.69%/61.36% 30.57%,vline to 37.03%,curve to 62.5% 38.99% with 61.36% 38.11%/61.87% 38.99%,close,move to 37.5% 18.92%,curve to 38.64% 20.88% with 38.13% 18.92%/38.64% 19.8%,vline to 58.4%,curve to 39.77% 60.36% with 38.64% 59.48%/39.15% 60.36%,hline to 57.95%,curve to 59.09% 62.32% with 58.58% 60.36%/59.09% 61.24%,vline to 77%,curve to 57.95% 78.96% with 59.09% 78.08%/58.58% 78.96%,hline to 38.64%,hline to 35.7%,hline to 21.59%,curve to 20.45% 77% with 20.96% 78.96%/20.45% 78.08%,vline to 47.96%,curve to 19.32% 46% with 20.45% 46.88%/19.95% 46%,hline to 15.44%,curve to 14.3% 44.05% with 14.81% 46%/14.3% 45.13%,vline to 20.88%,curve to 15.44% 18.92% with 14.3% 19.8%/14.81% 18.92%,hline to 20.45%,hline to 37.5%,close,move to 40.91% 45.46%,vline to 54.49%,curve to 42.05% 56.44% with 40.91% 55.57%/41.42% 56.44%,hline to 68.13%,curve to 69.27% 54.49% with 68.76% 56.44%/69.27% 55.57%,vline to 45.62%,curve to 68.13% 43.66% with 69.27% 44.54%/68.76% 43.66%,hline to 60.23%,curve to 59.09% 41.71% with 59.6% 43.66%/59.09% 42.79%,vline to 29.69%,curve to 57.95% 27.73% with 59.09% 28.61%/58.58% 27.73%,hline to 42.05%,curve to 40.91% 29.69% with 41.42% 27.73%/40.91% 28.61%,vline to 43.66%,vline to 45.46%,close,move to 24.84% 11.91%,line to 24.84% 5.88%,curve to 23.7% 3.92% with 24.84% 4.79%/24.33% 3.92%,line to 7.17% 3.99%,curve to 6.39% 4.52% with 6.88% 3.99%/6.6% 4.18%,line to 0.54% 14%,curve to 0% 16.09% with 0.2% 14.55%/0% 15.3%,line to 0% 62.99%,curve to 1.85% 65.94% with 0% 64.62%/0.83% 65.94%,line to 8.8% 65.94%,curve to 10.65% 68.9% with 9.82% 65.94%/10.65% 67.27%,line to 10.65% 97.05%,curve to 12.5% 100% with 10.65% 98.68%/11.48% 100%,line to 36.79% 100%,curve to 38.64% 97.05% with 37.81% 100%/38.64% 98.68%,line to 38.64% 85.92%,curve to 36.79% 82.97% with 38.64% 84.29%/37.81% 82.97%,line to 19.98% 82.97%,curve to 18.14% 80.02% with 18.96% 82.97%/18.14% 81.65%,line to 18.14% 51.87%,curve to 16.29% 48.92% with 18.14% 50.24%/17.31% 48.92%,line to 13.74% 48.92%,curve to 11.89% 45.96% with 12.72% 48.92%/11.89% 47.59%,line to 11.89% 17.81%,curve to 13.74% 14.86% with 11.89% 16.18%/12.72% 14.86%,line to 23% 14.86%,curve to 24.84% 11.91% with 24.02% 14.86%/24.84% 13.54%,close,move to 92.94% 0%,hline to 86.67%,hline to 72.73%,curve to 71.59% 1.96% with 72.1% 0%/71.59% 0.88%,vline to 21.18%,curve to 72.73% 23.14% with 71.59% 22.26%/72.1% 23.14%,hline to 80.61%,curve to 81.74% 25.1% with 81.23% 23.14%/81.74% 24.02%,vline to 45.53%,vline to 83.85%,curve to 82.88% 85.81% with 81.74% 84.93%/82.25% 85.81%,hline to 91%,curve to 92.14% 83.85% with 91.63% 85.81%/92.14% 84.93%,vline to 73.16%,curve to 93.28% 71.21% with 92.14% 72.08%/92.65% 71.21%,hline to 98.86%,curve to 100% 69.25% with 99.49% 71.21%/100% 70.33%,vline to 1.96%,curve to 98.86% 0% with 100% 0.88%/99.49% 0%,hline to 92.94%,close);  display: block;
  position: relative;
  text-align: center;
  animation-name: slideDownAnimation;
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.68,-0.55,0.27,1.55);
  animation-direction: normal;
  animation-fill-mode: both;


}


@keyframes slideDownAnimation {
  0% { transform: translateY(-100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}


.secondShape{
    height: 65vh;
    background-color: #BAEDFF;
    aspect-ratio: 1.723;
  aspect-ratio: 1.853;
  clip-path: shape(from 17.05% 0%,hline to 1.14%,curve to 0% 2.11% with 0.51% 0%/0% 0.94%,vline to 25%,curve to 1.14% 27.11% with 0% 26.16%/0.51% 27.11%,hline to 3.98%,curve to 5.11% 29.21% with 4.6% 27.11%/5.11% 28.05%,vline to 30.18%,curve to 6.25% 32.28% with 5.11% 31.34%/5.62% 32.28%,hline to 17.05%,curve to 18.18% 30.18% with 17.67% 32.28%/18.18% 31.34%,vline to 2.11%,curve to 17.05% 0% with 18.18% 0.94%/17.67% 0%,close,move to 1.48% 80.24%,curve to 1.48% 80.24% with 1.48% 80.24%/1.48% 80.24%,line to 8.81% 80.24%,curve to 10.2% 77.44% with 9.58% 80.24%/10.2% 78.99%,line to 10.2% 39.3%,curve to 11.6% 36.51% with 10.2% 37.76%/10.83% 36.51%,line to 19.05% 36.51%,curve to 20.44% 33.71% with 19.82% 36.51%/20.44% 35.26%,line to 20.44% 22.62%,curve to 21.84% 19.82% with 20.44% 21.08%/21.07% 19.82%,line to 37.77% 19.82%,curve to 38.6% 22.62% with 38.54% 19.82%/38.6% 21.08%,line to 38.6% 48.88%,curve to 39.99% 51.67% with 38.6% 50.42%/39.22% 51.67%,line to 47.47% 51.67%,curve to 48.86% 54.47% with 48.24% 51.67%/48.86% 52.93%,line to 48.86% 61.01%,curve to 47.47% 63.81% with 48.86% 62.56%/48.24% 63.81%,line to 42.7% 63.81%,curve to 41.3% 66.6% with 41.93% 63.81%/41.3% 65.06%,line to 41.3% 77.44%,curve to 39.91% 80.24% with 41.3% 78.99%/40.68% 80.24%,line to 25.81% 80.24%,curve to 24.42% 83.03% with 25.05% 80.24%/24.42% 81.49%,line to 24.42% 93.87%,curve to 23.03% 96.67% with 24.42% 95.41%/23.8% 96.67%,line to 1.39% 96.67%,curve to 0% 93.83% with 0.62% 96.67%/-0.01% 95.39%,line to 0.08% 82.99%,curve to 1.48% 80.23% with 0.09% 81.46%/0.71% 80.24%,curve to 1.48% 80.24% with 1.48% 80.23%/1.48% 80.24%,close,move to 68.18% 51.75%,hline to 52.27%,curve to 51.14% 53.86% with 51.65% 51.75%/51.14% 52.7%,vline to 97.89%,curve to 52.27% 100% with 51.14% 99.06%/51.65% 100%,hline to 60.23%,curve to 61.36% 97.89% with 60.85% 100%/61.36% 99.06%,vline to 91.92%,curve to 61.93% 90.09% with 61.36% 91.17%/61.58% 90.47%,line to 68.75% 82.8%,curve to 69.32% 80.98% with 69.1% 82.43%/69.32% 81.73%,vline to 53.86%,curve to 68.18% 51.75% with 69.32% 52.7%/68.81% 51.75%,close,move to 100% 37.05%,vline to 28.42%,curve to 98.86% 26.32% with 100% 27.26%/99.49% 26.32%,hline to 42.05%,curve to 40.91% 28.42% with 41.42% 26.32%/40.91% 27.26%,vline to 45.09%,curve to 42.05% 47.19% with 40.91% 46.25%/41.42% 47.19%,hline to 70.45%,curve to 71.59% 49.3% with 71.08% 47.19%/71.59% 48.14%,vline to 87.54%,curve to 72.73% 89.65% with 71.59% 88.71%/72.1% 89.65%,hline to 98.86%,curve to 100% 87.54% with 99.49% 89.65%/100% 88.71%,vline to 77.36%,curve to 99.67% 75.87% with 100% 76.8%/99.88% 76.27%,line to 96.69% 70.35%,curve to 96.35% 68.86% with 96.47% 69.96%/96.35% 69.42%,vline to 47.87%,curve to 96.57% 46.64% with 96.35% 47.43%/96.43% 47%,line to 99.79% 38.27%,curve to 100% 37.05% with 99.93% 37.91%/100% 37.48%,close);
 position: relative;
  text-align: center;
  animation-name: slideDownAnimation;
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.68,-0.55,0.27,1.55);
  animation-direction: normal;
  animation-fill-mode: both;


}


@keyframes slideDownAnimation {
  0% { transform: translateY(-100px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}







@media (max-width: 1350px) {
  

  .bodyShape{
    width: 80%;
  
 
  }

  .bodyShapeTwo{
    width: 80%;
  
 
  }

  .headerShape{
    width: 80%;
  }

  .headerShapeTwo{
    width: 80%;
  }


  .headerShapeThree{
    width: 80%;
  }

    .bodyShapeThree{
    width: 80%;
  
 
  }


  .headerShapeFour{
    width: 80%;
  }

    .bodyShapeFour{
    width: 80%;
  
 
  }


  .firstShape{
    scale: 80%;
}

.secondShape{
    scale: 80%;
}

  .listHolder{
    padding: 0.5rem 5em;
  }


  .dashboardButton{
    width: 240px;
    height: 50px;
  }

  .designButton{
    width: 240px;
    height: 50px;
    left: 259px;
    position: absolute;
  }


.communityButton{
    width: 240px;
    height: 50px;
    position: absolute;
    left: 519px;
  }


  .healthServicesButton{
    width: 240px;
    height: 50px;
    left: 778px;
    position: absolute;
  
  }

  ul{
    gap: 182px;
  }







  
}


@media (max-width: 1055px) {
  
  .bodyShape{
    width: 60%;
    
  
 
  }

  .headerShape{
    width: 60%;
    
  }
    .bodyShapeTwo{
    width: 60%;
    
  
 
  }

  .headerShapeTwo{
    width: 60%;
    
  }


    .bodyShapeThree{
    width: 60%;
    
  
 
  }

  .headerShapeThree{
    width: 60%;
    
  }

   .bodyShapeFour{
    width: 60%;
    
  
 
  }

  .headerShapeFour{
    width: 60%;
    
  }




  .firstShape{
    scale: 60%;
  }
  .secondShape{
    scale: 60%;
  }


ul{
    gap: 119px;
}




.listHolder{
  padding: 0.5rem 3em;
}



  
}


\