
@media (max-width: 920px) {
  .our-initiatives .initiatives-items{
    align-items: center;
    justify-content: center;
  }

  header .links {
      display: flex;
      gap: 12px;
  }

  header .buttons a{
    padding: 10px;
  }

  .our-initiatives .initiatives-items .item{
    width: 42.5vw;
  }

  .our-initiatives .initiatives-items .item img{
    width: 40.5vw;
  }


  .involved .right{
    width: 46%;
  }

  .blogs .blog{
    width: 42.9vw;
  }

  .updates .texts{
    width: 70vw;
  }

  .main.news .other-banner .ongoing .box{
    width: 44vw;
  }

  .main.news .other-banner .ongoing .box img{
    width: 43.5vw
  }

  .read-blog{
    padding: 150px 7vw;
  }

  .read-blog .body .right .img {
    width: 14.3vw;
    height: 13.4vw;
    border-radius: 15px;
  }

  .read-blog .body .left p{
    font-size: 20px;
  }

  .recent-blogs .blogs .blog{
    width: 41vw;
  }

  .impact .testimonials .box{
    width: 360px;
    height: auto;
    padding: 16px;
  }

  section h1{
    font-size: 40px;
  }

  .focus .box .right{
    width: 47%;
  }
}

@media (max-width:650px) {
  /* general styling starts */
  /* * {
  background: #000 !important;
  color: #0f0 !important;
  outline: solid #f00 1px !important;
  } */

  *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

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

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

  body {
    min-height: 100%;
    font-family: Aloevera-Regular;
  }

  /* @font-face {
    font-family: Gotham;
    src: url(../fonts/gotham_light/GOTHAM-MEDIUM.otf);
    font-display: swap;
  }

  @font-face {
    font-family: Aloevera-Regular;
    src: url(../font/Aloevera.ttf);
    font-display: swap;
  } */

  input[type=submit]{
    cursor: pointer;
  }

  button{
    cursor: pointer;
    outline: none;
    border: none;
  }

  .imgp{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }

  .imgc{
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
  }

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

  .cta{
    border-radius: 4px;
    border: 1px solid var(--IECDI-Green, #07C8AF);
    display: flex;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: var(--IECDI-Green, #07C8AF);
    font-family: Aloevera-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: max-content;
    height: max-content;
  }

  a.cta{
    font-size: 14px;
    color: #1E1E1E;
    border-radius: 10px;
    padding: 16px 24px;
  }

  section h1{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  section p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .flex{
    display: flex;
  }
  /* general styling ends */

  /* animation starts */
  @keyframes slide {
    from{
      transform: translateX(0%);
    }

    to{
    transform: translateX(-50%);
    }

    to{
    transform: translateX(-100%);
    }
  }
  /* animation ends */

  /* header starts */
  header{
    position: fixed;
    backdrop-filter: blur(10px);
    z-index: 999999999;
    width: 100vw;
    padding-left: 1.5vw;
    padding-right: 3.5vw;
    top: 0;
  }

  header .box{
    width: 95vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #B4B4B4;
  }

  header .logo{
    width: 107.17px;
    flex-shrink: 0;
  }

  header .links{
    display: none;
  }

  #menu{
    display: block;
    font-size: 30px;
  }

  header .links .link{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  header .buttons{
    display: none;

  }

  header .buttons a{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 16px 24px;
  }

  header .buttons .border{
    border-radius: 10px;
    border: 1px solid var(--IECDI-Purple, #826BEF);
  }
  /* header ends */

  /* banner starts */
  .banner{
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding-top: 120px;
    padding-left: 2.5vw;
    padding-right: 5.5vw;
    padding-bottom: 30px;
  }

  .banner .left{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
  }

  .banner .left h1{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .banner .left p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .banner .left .btns{
    display: flex;
    gap: 20px;
  }

  .banner .left .btns a{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 16px 24px;
    border-radius: 10px;
    border: 1px solid var(--IECDI-Green, #07C8AF);
    background: var(--P-Bg-White, #F7F7F7);
  }

  .banner .left .btns a.cta{
    color: #fff;
    background: var(--IECDI-Purple, #826BEF);
    border: none;
  }

  .banner .right{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
  }

  .banner .right .top{
    display: flex;
    gap: 16px;
  }

  .banner .right .top img{
    width: 38.89vw;
    max-width: 272px;
  }

  .banner .right .down{
    display: flex;
    position: relative;
  }

  .banner .right .down img{
    width: 81.89vw;
    max-width: 560px;
  }

  .banner .right .down img.union{
    position: absolute;
    left: 0;
    top: 0;
    width: 38.89vw;
    max-width: 272px;
  }

  .banner .other-right{
    display: flex;
    gap: 31px;
  }

  .banner .other-right img{
    width: 43vw;
    height: 34vw;
    border-radius: 20px;
  }

  .banner .other-right .left{
    margin-top: 70px;
    gap: 20px;
  }

  .banner .other-right{
    gap: 20px;
  }
  /* banner ends */

  /* about starts */
  .about-us{
    background: var(--IECDI-F-Green, #DFF2F0);
  }

  .about-us .box{
    display: flex;
    flex-direction: column;
    padding: 32px 16px;
    padding-bottom: 200px;
    gap: 32px;
  }

  .about-us .box .left{
    width: 100%;
    position: relative;
    order: 2;
  }

  .about-us .box .left img{
    width: 76.9vw;
    border-radius: 10px;
  }

  .about-us .box .left .union{
    position: absolute;
    bottom: -2vw;
    right: -2vw;
    width: 40.8vw;
  }

  .about-us .box .right{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap:  30px;
  }

  .about-us .box .right .items{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
  }

  .about-us .box .right .items span{
    display: flex;
    gap: 7px;
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .about-us .box .right .items span i{
    font-size: 20px;
    color: #07C8AF;
  }

  .about-us .box .right a.cta{
    border: 1px solid var(--IECDI-Green, #07C8AF);
  }
  /* about ends */

  /* focus starts */
  .focus{
    position: relative;
    min-height: 850px;
  }

  .focus .box{
    position: absolute;
    width: 87vw;
    top: -100px;
    left: 6.5vw;
    display: flex;
    flex-direction: column;
    padding: 3vw;
    align-items: flex-start;
    align-self: stretch;
    border-radius: 20px;
    background: var(--P-Bg-White, #F7F7F7);
    box-shadow: 0px 4px 4px 0px rgba(22, 22, 22, 0.20);
    justify-content: space-between;
    gap: 32px;
  }

  .focus .box .left{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px;
    height: max-content;
  }

  .focus .box .left p.cta{
    color: #E92169;
    border: 1px solid #E92169;
  }

  .focus .box .left a.cta{
    margin-top: 6vw;
    border: 1px solid var(--IECDI-Pink, #E92169);
    background: var(--P-Bg-White, #F7F7F7);
  }

  .focus .box .right{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 5vw;
  }

  .focus .box .right .item{
    display: flex;
    width: 37.53vw;
    padding: 16px 8px;
    gap: 16px;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 10px;
  }

  .focus .box .right .item h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .focus .box .right .item p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .focus .box .right .item i{
    margin-bottom: 0px;
  }

  .focus .box .right .item{
    background: rgba(130, 107, 239, 0.10);
    color: #826BEF;
  }

  /* focus ends */

  /* initiatives starts */
  .our-initiatives{
    background-attachment: fixed;
  }

  .overlay{
    background-color: rgba(53, 24, 92, 0.80);
  }

  .our-initiatives .overlay{
    padding: 57.5px 16px 58.5px 17px;
  }

  .our-initiatives p.cta{
    color: #F7F7F7;
    border: 1px solid #F7F7F7;
  }

  .our-initiatives .texts{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
  }

  .our-initiatives .texts .cont{
    width: auto;
    gap: 16px;
  }

  .our-initiatives .texts h1{
    color: #F7F7F7 ;
  }

  .our-initiatives .texts p{
    color: #F7F7F7 ;
  }

  .our-initiatives a.cta{
    color: #F7F7F7 ;
    border: 1px solid #826BEF;
    margin-top: auto;
  }

  .our-initiatives .initiatives-items{
    display: flex;
    gap: 16px;
    padding-top: 72px;
    overflow: hidden;
    width: max-content;
    animation: linear slide 25s infinite;
    /* width: max-content; */
  }

  .our-initiatives .initiatives-items:nth-child(2){
    display: flex;
  }

  .our-initiatives .initiatives-items .item{
    display: flex;
    width: 79.5vw;
    padding: 8px;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    flex: 1 0 0;
    border-radius: 10px;
    background: var(--P-Bg-White, #F7F7F7);
  }


  .our-initiatives .initiatives-items .item img{
    width: 75.3vw;
  }

  .our-initiatives .initiatives-items .item .text{
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .our-initiatives .initiatives-items .item .text h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .our-initiatives .initiatives-items .item .text p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  /* initiatives ends */
  /* partners starts */
  .our-partners{
    display: flex;
    padding: 18px 15px;
    background: var(--IECDI-F-Green, #DFF2F0);
    flex-direction: column;
    gap: 30px;
  }

  .our-partners .texts{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: space-between;
  }

  .our-partners .texts .cont{
    width: 100%;
    gap: 24px;
  }

  .our-partners a.cta{
    margin-top: auto;
  }

  .our-partners .flex{
    width:100%;
    overflow: hidden;
  }

  .our-partners .slide{
    width: max-content;
    display: flex;
  }

  .our-partners .partners{
    display: flex;
    gap: 32px;
    overflow: hidden;
    animation: 25s slide infinite linear;
    margin-right: 20px;
  }

  .our-partners:hover .partners{
    animation-play-state: paused;
  }

  .our-partners .partners img{
    width: 30px;
  }
  /* partners ends */

  /* involved starts */
  .involved{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding:  29.469px 16.76px 29.067px 16.24px;
    flex-direction: column;
  }

  .involved .left{
    width: max-content;
  }

  .involved .left img{
    width: 92vw;
  }

  .involved .right{
    gap: 24px;
    width: 100%;
    justify-content: center;
  }

  .involved .right .btns{
    display: flex;
    gap: 24px;
    margin-top: 30px;
  }

  .involved .right .btns a.cta{
    background: var(--P-Bg-White, #F7F7F7);
    width: 50%;
  }

  .involved .right .btns a.cta.fill{
    border: none;
    color: #fff;
  }

  /* involved ends */

  /* impact starts */
  .impact{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 37px 14px 37px 15px;
    gap: 16px;
  }

  .impact .left{
    width: auto;
    gap: 24px;
  }

  .impact .left p.cta{
    color: #E92169;
    border: 1px solid #E92169;
  }

  .impact .left .cntrl{
    display: flex;
    gap: 58px;
  }

  .impact .left .cntrl button{
    display: flex;
    padding: 6px 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    border: 1px solid var(--IECDI-Fade-Grey, #444);
    font-size: 16px;
    color: #444444;
    background: #fff;
    height: max-content;
  }

  .impact .left .cntrl button.active{
    border: 1px solid var(--IECDI-Fade-Grey, #E92169);
    background: #E92169;
    color: #fff;
  }

  .impact .right{
    width: ;
    overflow: hidden;
  }

  .impact .testimonials{
    display: flex;
    gap: 2vw;
    width: max-content;
    transition: 0.5s;
  }

  .impact .testimonials .box{
    display: flex;
    width: 325px;
    min-height: 233px;
    padding: 16px 10px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
    flex-shrink: 0;
    border-radius: 20px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
  }

  .impact .testimonials .box .top{
    display: flex;
    gap: 10px;
  }

  .impact .testimonials .box .top img{
    border-radius: 50%;
    width: 60px;
    height: 60px;
  }

  .impact .testimonials .box .text{
    gap: 12px;
  }

  .impact .testimonials .box{

  }
  /* impact ends */

  /* newsletter starts */
  .newsletter{
    display: flex;
    padding: 61px 16px 60px 17px;
    justify-content: center;
    align-items: center;
    gap: 64px;
    background: #E7E7E7;
  }

  .newsletter .left{
    gap: 24px;
    width: 100%;
  }

  .newsletter .left .inputs{
    margin-top: 32px;
    display: flex;
    gap:10px;

  }

  .newsletter .left .inputs input{
    border-radius: 10px;
    border: 1px solid var(--IECDI-Grey, #888);
    background: var(--P-Bg-White, #F7F7F7);
    width: 50.3vw;
    padding: 12px;
  }

  .newsletter .left .inputs .button{
    border-radius: 10px;
    background: var(--IECDI-Pink, #E92169);
    padding: 8px 16px;
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .newsletter .img img{
    width: 21.32vw;
    display: none;
  }
  /* newsletter ends */

  /* footer starts */
  footer{

  }

  footer .overlay{
    display: flex;
    flex-direction: column;
    padding: 29px 17px 29px 16px;
  }

  footer .overlay .top{
    display: flex;
    justify-content: space-between;
    gap: 10px;
  }

  footer .overlay .top .left{
    flex-direction: column;
    width: 100%;
    gap: 5px;
    margin-bottom: 32px;
  }

  footer .overlay .top .logo{
    width: 107.17px;
    flex-shrink: 0;
    margin-bottom: 32px;
  }

  footer .overlay .top p{
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  footer .overlay .top a{
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  footer .overlay .top .right{
   width: 100%;
   flex-direction: column;
  }

  footer .overlay .top .right .txt{
    width: 100%;
  }

  footer .overlay .links{
    display: flex;
    gap: 32px;
    justify-content: normal;
  }

  footer .overlay .links .link{
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  footer .overlay .socials{
    margin-top: 32px;
    color: #fff;
    display: flex;
    gap: 16px;
    justify-content: normal;
  }

  footer .overlay .down{
    margin-top: 32px;;
    border-top: 1px solid #F7F7F7;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-top: 5px;
    gap: 5px;
  }

  footer .overlay .down p{
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  /* footer ends */

  /* other banner starts */
  .other-banner{
    display: flex;
    flex-direction: column;
    padding: 40px 20px 86px 20px;
    padding-top: 120px;
    padding-bottom: 30px;
    background: var(--IECDI-F-Green, #DFF2F0);
    justify-content: center;
    align-items: center;
    gap: 48px;
  }

  .other-banner .texts{
    gap: 16px;
    width: auto;
    align-items: center;
  }

  .other-banner .texts h1{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    text-align: start;
    font-family: Aloevera-SemiBold;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .other-banner .texts p{
    width: auto;
    color: var(--IECDI-Grey, #888);
    text-align: start;
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .other-banner .images{
    overflow: hidden;
    width: 100%;
  }

  .other-banner .images .flex{
    width: max-content;
    gap: 10px;
  }

  .other-banner .images .scroll{
    display: flex;
    gap: 10px;
    width: max-content;
  }

  .other-banner .images img{
    width: 77.6vw;
    border-radius: 20px;
  }

  .other-banner .images .big-img{
    width: 90vw;
    height: 114vw;
    border-radius: 20px;
  }
  /* other banner ends */

  /* overview starts */
  .overview{
    display: flex;
    flex-direction: column;
    padding: 59px 16px 59.756px 16px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    gap: 42px;
  }

  .overview .top{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 42px;
  }

  .overview .top b{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: 100%;
  }

  .overview .top .cont{
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    justify-content: space-between;
  }

  .overview .top .btns{
    display: flex;
    gap: 24px;
  }

  .overview a.cta{
    border: 1px solid #07C8AF;
  }

  .overview a.cta.fill{
    border: 1px solid #826BEF;
    background: #826BEF;
    color: #fff;
  }

  .overview .down{
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 32px;
  }

  .overview .down p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: 100%;
  }
  /* overview ends */

  /* vision starts */
  .vision{
    display: flex;
    flex-direction: column;
    padding: 42.5px 16px 79.5px 16px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    background: var(--IECDI-F-Green, #DFF2F0);
    gap: 80px;
  }

  .vision .left{
    width: 100%;
    gap: 16px;
  }

  .vision .left .statement{
    margin-top: 25px;
    gap: 32px;
  }

  .vision .left .statement .item{
    display: flex;
    padding: 8px 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 10px;
    background: var(--IECDI-Green, #07C8AF);
  }

  .vision .left .statement .item i{
    font-size: 24px;
    color: #fff;
  }

  .vision .left .statement .item h3{
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .vision .left .statement .item p{
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .vision .left h2{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-top: 30px;
  }

  .vision .left .vis-items{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }

  .vision .left .vis-items span{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    gap: 3px;
  }

  .vision .left .vis-items i{
    color: #07C8AF;
  }

  .vision .right{
    position: relative;
    padding-bottom: 40px;
    padding-top: 20px;
  }

  .vision .right img{
    border-radius: 20px;
    width: 72vw;
    margin-left: 10px;
    border-radius: 20px;
  }

  .vision .right .top{
    position: absolute;
    left: -20px;
    top: -50px;
    z-index: 999;
    width: 45.21vw;
    height: 28vw;
    border-radius: 20px;
  }

  .vision .right .down{
    position: absolute;
    right: -40px;
    bottom: -50px;
    z-index: 999;
    width: 41.7vw;
    height: 31.7vw;
    border-radius: 20px;
  }
  /* vision ends */

  /* init page styling starts */
  .main.init .other-banner{
    background: var(--IECDI-F-Yellow, #F7F2E3);
  }

  /* ongoing starts */
  .ongoing{
    display: flex;
    flex-direction: column;
    padding: 54px 16px 53px 16px;;
    justify-content: center;
    align-items: center;
    gap: 40px;
    background: var(--P-Bg-White, #F7F7F7);
  }

  .ongoing .top{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
  }

  .ongoing .top .fd{
    width: auto;
  }

  .ongoing .top a.cta{
    width: auto;
    border-radius: 10px;
    border: 1px solid var(--IECDI-Yellow, #FCC433);
    background: var(--P-Bg-White, #F7F7F7);
    margin-top: auto;
  }

  .ongoing .down{
    display: flex;
    flex-direction: column;
    gap: 56px;
  }

  .ongoing .down .box{
    gap: 16px;
  }

  .ongoing .down .box img{
    width: 91.5vw;
    border-radius: 20px;
  }

  .ongoing .down .box h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    width: 91vw;
  }

  .ongoing .down .box p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  /* ongoing ends */

  /* key initiatives starts */
  .key-initiatives{
    display: flex;
    padding: 72px 16px 70px 16px;
    flex-direction: column;
    background: var(--IECDI-F-Yellow, #F7F2E3);
  }

  .key-initiatives .texts{
    width: auto;
    gap: 16px;
  }

  .key-main{
    padding-top: 30px;
    display: flex;
    flex-direction: column;
    gap: 50px;
  }

  .key-main .item{
    display: flex;
    flex-direction: column;
    gap: 40px;
  }

  .key-main .item:nth-child(even) .text{
    order: 2;
  }

  .key-main .item:nth-child(even) .img{
    order: 1;
  }

  .key-main .item .img{
    width: 91.5vw;
    height: 80vw;
    border-radius: 20px;
    order: 1;
  }

  .key-main .item .text{
    order: 2;
    gap: 10px;
    width: auto;
  }

  .key-main .item .text h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    width: auto;
  }

  .key-main .item .text p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .key-main .item .text a{
    border-radius: 10px;
    background: var(--IECDI-Yellow, #FCC433);
    border: 1px solid var(--IECDI-Yellow, #FCC433);
    padding: 16px 24px;
    gap: 10px;
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: max-content;
    transition: 0.5s;
  }

  .key-main .item .text a:hover{
    box-shadow: inset 300px 0 0 0 #fff;
    color: #FCC433;
  }

  /* key initiatives ends */

  /* init page styling ends */

  /* news page styling starts */
  .main.news .other-banner{
    align-items: start;
    justify-content: start;
    background: var(--IECDI-F-Pink, #F9EEF2);
  }

  .main.news .other-banner .texts *{
    text-align: left;
    width: auto;
  }

  .main.news .other-banner .texts{
    align-items: flex-start;
    justify-content: flex-start;
  }

  .main.news .other-banner .ongoing .down{
    gap: 20px;
  }

  .main.news .other-banner .ongoing .down .flex{
    justify-content: space-between;
    flex-direction: column;
  }

  .main.news .span{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    padding: 6px 8px;
    border-radius: 4px;
    border: 1px solid var(--IECDI-Fade-Grey, #444);
    height: max-content;
    width: max-content;
  }

  .main.news .other-banner .ongoing .box{
    width: 92vw;
  }

  .main.news .other-banner .ongoing .box img{
    width: 90vw;
  }

  /* updates starts */
  .updates{
    display: flex;
    padding: 22.5px 16px;
    flex-direction: column;
    gap: 54px;
    width: 100%;
  }

  .updates .texts{
    width: auto;
  }

  .blogs{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
  }

   .blogs .blog .blogs .blog{
    width: 85vw;
    gap: 15px;
  }
   .blogs .blog{
    width: 85vw;
    gap: 15px;
  }

  .blogs .blog img{
    width: 100%;
  }

  .blogs .blog .span{
    font-size: 10px;
    padding: 6px 4px;
    width: 134px;
    border-radius: 4px;
    border: 1px solid var(--IECDI-Fade-Grey, #444);
    height: max-content;
    margin-top: auto;
    text-align: center;
  }

  .blogs .blog .flex{
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
  }

  .blogs .blog h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .blogs .blog p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  /* updates ends */

  /* news page styling ends */

  /* contact page styling starts */
  .main.contact .other-banner{
    display: flex;
    background: var(--P-Bg-White, #F7F7F7);
  }
  /* contact/volunteer starts */
  .contact-volunteer{
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .contact-volunteer .header{
    display: flex;
    gap: 2%;
  }

  .contact-volunteer .header button{
    border-radius: 10px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
    padding: 16px;
    width: 49%;
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .contact-volunteer .header .active{
    background: var(--IECDI-Purple, #826BEF);
    color: #F7F7F7
  }

  .contact-volunteer .tabcontent{
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
    margin-top: 20px;
  }

  .contact-volunteer .tabcontent .form{
    width: 100%;
    gap: 16px;
  }

  .contact-volunteer .tabcontent .form .text{
    gap: 16px;
  }

  .contact-volunteer .tabcontent .form .text h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .contact-volunteer .tabcontent .form .text p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .contact-volunteer .tabcontent .form .two-input{
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
  }

  .contact-volunteer .tabcontent .form .input{
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
  }

  .contact-volunteer .tabcontent .form .input p{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .contact-volunteer .tabcontent .form .input input{
    padding: 16px;
    border-radius: 10px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
    color: var(--IECDI-Low-Grey, #B4B4B4);
    font-family: Aloevera-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .contact-volunteer .input .amount{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
  }

  .contact-volunteer .input .amount input{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .contact-volunteer .input .btn{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 12px 20px;;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 16px;
    border-radius: 10px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
  }

  .contact-volunteer .input .active{
    background: var(--IECDI-Purple, #826BEF);
    color: #fff;
  }


  .contact-volunteer .tabcontent .form .input select{
    padding: 16px;
    border-radius: 10px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
    color: var(--IECDI-Low-Grey, #B4B4B4);
    font-family: Aloevera-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .contact-volunteer .tabcontent .form .input textarea{
    display: flex;
    height: 198px;
    padding: 16px;
    align-items: flex-start;
    gap: 10px;
    align-self: stretch;
    border-radius: 10px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
    color: var(--IECDI-Low-Grey, #B4B4B4);
    font-family: Aloevera-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .contact-volunteer .tabcontent .form .submit{
    border-radius: 10px;
    background: var(--IECDI-Purple, #826BEF);
    padding: 16px 24px;
    color: var(--IECDI-White, var(--P-Bg-White, #F7F7F7));
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 8px;
  }

  .contact-volunteer .tabcontent .information{
    width: 100%;
    gap:16px
  }

  .contact-volunteer .tabcontent .information .info{
    gap: 8px;
  }

  .contact-volunteer .tabcontent .information .info h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .contact-volunteer .tabcontent .information .info p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .contact-volunteer .tabcontent .information .volun {
    height: 100%;
    display: none;
    padding: 47px 30px;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 20px;
  }

  .contact-volunteer .tabcontent .information .volun .texts{
    display: flex;
    width: 100%;
    min-height: 260px;
    padding: 16px 24px;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
    border-radius: 10px;
    background: var(--P-Bg-White, #F7F7F7);
    gap: 10px;
    margin-top: auto;
  }

  .contact-volunteer .tabcontent .information .volun img{
    width: 108px;
  }

  .contact-volunteer .tabcontent .information .volun p{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: 100%;
  }
  /* contact/volunteer ends */

  /* partner-with /donate starts */
  .partner-with{
    background: var(--P-Bg-White, #F7F7F7);
  }

  .partner-with .contact-volunteer .tabcontent .form .text{
    margin-bottom: 30px;
  }

  .partner-with .contact-volunteer .tabcontent .form .submit{
    margin-top: 30px;
  }

  .donate{

  }

  .contact-volunteer .tabcontent .donate .input textarea{
    height: 89px;
  }

  /* partner-with /donate ends */

  /* contact page styling ends */

  /* read-blog starts */
  .read-blog{
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 100px 20px 50px 20px;
    background: var(--P-Bg-White, #F7F7F7);
  }

  .read-blog img{

  }

  .read-blog .body{
    gap: 3%;
    width: 100%;
  }

  .read-blog .body h2{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .read-blog .body .top{
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;
    gap: 10px;
  }

  .read-blog .body .top p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: auto;
  }

  .read-blog .body .top .span{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border-radius: 4px;
    border: 1px solid var(--IECDI-Fade-Grey, #444);
    padding: 6px 8px;
    margin-top: auto;
    height: max-content;
  }

  .read-blog .body .down{
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 40px;
  }

  .read-blog .body .left {
    gap: 40px;
    width: 100%;
  }

  .read-blog .body .left p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .read-blog .body .right {
    gap: 32px;
    width: 100%;
  }

  .read-blog .body .right h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .read-blog .body .right .images{
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
  }

  .read-blog .body .right .img{
      width: 40.9vw;
      height: 29.4vw;
  }

  /* recent-blogs starts */
  .recent-blogs{
    padding: 0 20px;
    gap: 56px;
    background: var(--P-Bg-White, #F7F7F7);
    padding-bottom: 40px;
  }

  .recent-blogs .texts{
    gap: 10px;
  }

  .recent-blogs .texts h3{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 56px;
    align-self: stretch;
  }

  .recent-blogs .texts p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .recent-blogs .blogs{

  }

  .pagination{
    display: flex;
    justify-content: space-between;
    width: 100%;
  }

  .pagination button{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    width: 97.468px;
    padding: 10px 16px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    border: 1px solid var(--IECDI-Fade-Grey, #444);
    background: #fff;
  }

  .pagination .num{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    gap: 5px;
  }

  .pagination .active{
    border-radius: 50%;
    height: 20px;
    width: 20px;
    color: #fff;
    background: var(--IECDI-Fade-Grey, #444);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* recent-blogs ends */

  /* read-blog ends */

  /* read-initiatives starts */
  .text-area h2{
    font-size: 20px;
  }

  .text-area{
    display: flex;
    padding: 50px 16px 63px 16px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    background: var(--IECDI-F-Purple, #EBE9F6);
    color: var(--IECDI-Grey, #888);
    text-align: center;
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  /* purpose starts */
  .purpose{
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 60px 40px;
    justify-content: center;
    align-items: center;
    background: var(--P-Bg-White, #F7F7F7);
  }

  .purpose .items{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 4vw;
    justify-content: center;
  }

  .purpose .items .item{
    width: 100%;
    display: flex;
    padding: 8px 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
    border-radius: 20px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
  }

  .purpose .items .item i{
    color: #07C8AF;
    font-size: 16px;
  }

  .purpose .items .item h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .purpose .items .item p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
  /* purpose ends */

  /* gallery starts */
  .gallery{
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 57.268px 15.5px 57.268px 16.5px;
    justify-content: center;
    align-items: center;
  }

  .gallery-images{
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    column-gap: 16px;
  }

  .gallery-images .img{
    width: 42vw;
    height: 29vw;
    border-radius: 10px;
  }

  .gallery{

  }
  /* gallery ends */

  /* statistics starts */
  .statistics{
    gap: 20px;
    flex-direction: column;
    background: var(--IECDI-F-Purple, #EBE9F6);
    padding: 44px 9px 43px 16px;
    justify-content: center;
    align-items: center;
  }

  .statistics .flex{
    gap: 32px;
    flex-direction: column;
  }

  .statistics .stats{
    width: 360px;
    gap: 30px;
    justify-content: center;
    align-items: center;
  }

  .statistics .stats h2{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .statistics .stats p{
    color: var(--IECDI-Grey, #888);
    text-align: center;
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .statistics .btns{
    display: flex;
    gap: 20px;
  }

  .statistics .btns a.cta{
    border: 1px solid #FCC433;
  }

  .statistics .btns a.cta.fill{
    background: var(--IECDI-Pink, #E92169);
    border: 1px solid #E92169;
    color: #fff;
  }

  /* statistics ends */

  /* read-initiatives ends */

  /* calendar-box starts */
  .calendar-box{
    display: flex;
    flex-direction: column;
    gap: 52px;
    margin: 0 auto;
  }

  .calendar-box #calendar{
    width: 100%;
  }

  .calendar-box .events{
    width: 100%;
    gap: 16px;
  }

  .calendar-box .events h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .calendar-box .events-items{
    gap: 16px;
  }

  .calendar-box .events-items .item{
    display: flex;
    padding: 8px 24px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 10px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    background: var(--P-Bg-White, #F7F7F7);
  }

  .calendar-box .events-items .item .header{
    display: flex;
    flex-direction: column;
    border-right: 1px solid #B4B4B4;
    padding-right: 5px;
    height: 26vw;
    justify-content: initial;
    gap: 5px;
  }

  .calendar-box .events-items .item .header h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .calendar-box .events-items .item .header h4{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .calendar-box .events-items .item .header p{
    color: var(--IECDI-Purple, #826BEF);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .calendar-box .events-items .item .text{
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .calendar-box .events-items .item .text h3{
    color: var(--IECDI-Dark-Grey, #1E1E1E);
    font-family: Aloevera-SemiBold;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }

  .calendar-box .events-items .item .text p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  /* calendar styling starts */
  .fc .fc-button .fc-icon{
    font-size: 2.4em;
  }
  .fc-today-button{
    display: none !important;
  }

  .fc-theme-standard td, .fc-theme-standard th{
    border: none;
  }

  .fc .fc-scrollgrid-liquid{
    border-radius: 10px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    padding: 16px;
  }

  .fc .fc-daygrid-day-top{
    justify-content: center;
  }

  .fc-button-group{
    display: flex;
    gap: 20px;
  }

  .fc-direction-ltr .fc-button-group > .fc-button:not(:last-child){
    border-radius: 4px;
    border: 1px solid var(--IECDI-Low-Grey, #B4B4B4);
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #B4B4B4;
  }

  .fc-direction-ltr .fc-button-group > .fc-button:not(:first-child){
    border: none;
    border-radius: 4px;
    background: var(--IECDI-Purple, #826BEF);
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .fc .fc-daygrid-day-frame {
    display: flex;
    flex-direction: column;

  }

  .fc .fc-daygrid-day.fc-day-today{
    display: flex;
    flex-direction: column;
    background: #826BEF;
    color: #fff;
    border-radius: 5px;
  }

  .fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events{
    display: none;
  }

  .fc .fc-daygrid-day-top{
    order: 1;
    padding: 20px;
  }

  .fc-day-sat{
    color: #826BEF;
  }

  .fc-day-sun{
    color: #826BEF;
  }
  /* calendar styling ends */

  /* calendar-box ends */

  /* mobile header starts */
  .mobile-header{
    position: fixed;
    height: 100vh;
    width: 100vw;
    left: -100vw;
    top: 0;
    background: #fff;
    padding: 24px 16px 60px 16px;
    gap: 20%;
    transition: 0.5s;
    background: var(--P-Bg-White, #F7F7F7);
  }

  .active{
    left: 0;
  }

  .mobile-header .top{
    display: flex;
    justify-content: space-between;
  }

  .mobile-header .links{
    display: flex;
    flex-direction: column;
    gap: 5vw;
  }

  .mobile-header .links .link{
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .mobile-header .buttons{
    display: flex;
    flex-direction: column;
    gap: 5vw;
    color: var(--IECDI-Fade-Grey, #444);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .mobile-header .buttons a{
    border: none;
    padding: 0;
  }

  .mobile-header .socials{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    font-size: 20px;
  }

  /* mobile header ends */

  /* slider starts */
  .slider-outer{
    width: 100%;
    overflow: hidden
  }

  .slider-inner{
    width: max-content;
    display: flex;
    gap: 20px;
  }

  /* slider ends */


  /* gallery popup starts */

  #gallery-image-popup{
    position: fixed;
    height: 100vh;
    width: 100vw;
    top: 0;
    left: 0;
    z-index: 99999999999999999;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
    justify-content: center;
    align-items: center;
  }

  #gallery-image-popup .controls{
    display: flex;
    width: 100%;
    padding: 6px;
    top: 49%;
    justify-content: space-between;
    font-size: 20px;
    color: #fff;
    position: absolute;
  }

  #gallery-image-popup .fa-x{
    position: absolute;
    top: 15px;
    right: 15px;
    color: red;
    cursor: pointer;
    font-size: 25px;
  }


  .banner .left .btns a.ini-cta{
    width: 90vw;
  }


  .slider_container .img{
    height: 55vw;
    width: 82vw;
    border-radius: 20px;
  }

  .read-blog .body .slider_container .img{
    height: 65vw;
    width: 80vw;
    border-radius: 20px;
  }

  .mck_slider{
    display: none;
  }

  .fade{
    animation: fade 1.5s;
  }

  @keyframes fade {
    from {
  	opacity: .4
  	}

    to {
  	opacity: 1
        }
  }

  /* gallery popup ends */
  /* team starts */
  .team-box{
    display: flex;
    flex-direction: column;
    padding: 20px;
    background: var(--IECDI-F-Yellow, #F7F2E3);
  }

  .team-box .texts{

  }

  .team-box .team{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
    justify-content: center;
  }

  .team-box .team .item{
    width: 80vw;
  }

  .team-box .team .item img{
    width: 100%;
  }

  .team-box .team .item .text{
    display: flex;
    flex-direction: column;
    padding: 4px 8px;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    background: var(--IECDI-Purple, #826BEF);
  }

  .team-box .team .item .text h3{
    color: var(--IECDI-White, #F7F7F7);
    font-family: Aloevera-Bold;
    font-size: 20spx;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
  }

  .team-box .team .item .text p{
    color: var(--IECDI-White, #F7F7F7);
    font-family: Aloevera-Regular;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }

  .team-box .category-items{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2vw;
  }

  .team-box .category-wrapper .category-header{
    margin-bottom: 10px;
    position: relative;
    display: flex;
  }

  .team-box .category-wrapper .category-header p{
    color: var(--IECDI-Grey, #888);
    font-family: Aloevera-Regular;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    background: #F7F2E3;
    padding-right: 5px;
    position: relative;
    z-index: 99999;
  }

  .team-box .category-wrapper .category-header hr{
    width: 100%;
    /* content: ''; */
    height: 1px;
    background: #B4B4B4;
    position: absolute;
    bottom: 9px;
    right: 0;
    display: flex;
  }


  /* team ends */

}
