@media screen and (max-width: 1300px) {
  .customNavbar {
    max-width: 1200px;
    width: 98%;
  }
}

@media screen and (max-width: 1200px) {
  .sidebar {
    min-height: 100%;
    height: 100%;
    width: 100%;
    position: absolute;
    left: -100vw;
    top: 0;
    z-index: 99;
    transition: all 0.4s ease-in;
  }
  .sidebar.open {
    left: 0;
  }
}
@media screen and (max-width: 992px) {
  .brandLogo {
    width: 160px;
    height: auto;
  }
  .flexHeader {
    flex-direction: column;
    align-items: start;
    flex-wrap: wrap;
    gap: 3rem;
  }
  .flexHeader .lgHeading {
    font-size: 50px;
  }
  .themeColor,
  .darkColor {
    font-size: 15px;
    height: 40px;
  }
}

@media screen and (max-width: 768px) {
  .customDarkNavBar .customNavbarContainer .brandLogo {
    width: 120px;
  }
  .constantSpacing {
    padding: 4rem 0;
  }

  .lgHeading {
    font-size: 50px;
  }
  .mainText {
    font-size: 15px;
  }
  .mdHeading {
    font-size: 25px;
  }
  .counterCard .mainText {
    font-size: 15px;
  }

  .homePageHeroSection .mainButtonTheme,
  .homePageHeroSection .mainButtonWhite {
    font-size: 15px;
  }
  /* heroShapeContainer */
  .heroShapeContainer .mdHeading {
    font-size: 25px;
  }
  .heroShapeContainer .mainText {
    font-size: 12px;
  }
  .heroShapeContainerText {
    padding: 2rem;
  }
  .arrowButton {
    width: 40px;
    height: 40px;
    font-size: 1.1rem;
  }
  .comunitySectionShapeTextWrapper {
    padding: 1.4rem;
  }
  .iconCircle {
    width: 56px;
    height: 56px;
  }
  .iconCircle img,
  .clockImage {
    width: 22px;
    height: auto;
  }
  .comunitySectionShapeTextContent .mdHeading {
    font-size: 18px;
  }
  .comunitySectionShapeTextContent .mainText {
    font-size: 13px;
  }
  .comunitySectionShapeTextContent {
    margin-top: 0.6rem;
  }
  .comunitySectionShapeTextWrapper .counterCard .mdHeading {
    font-size: 14px;
  }
  .comunitySectionShapeTextWrapper .counterCard .mainText {
    font-size: 10px;
  }
  .sectionHeading {
    font-weight: 400;
    font-size: 40px;
    word-break: break-all;
    word-wrap: break-word;
    text-wrap: wrap;
  }
  .comunitySectionShapeTextContent .themeColor {
    font-size: 12px;
    height: 36px;
  }
  .comunitySectionShapeWrapper .arrowButton {
    bottom: 1rem;
  }
  .comunitySectionShape2TextWrapper {
    padding: 1.5rem;
    min-height: 200px;
  }
  .comunitySectionShape2TextWrapper .mdHeading {
    font-size: 1rem;
  }
  .themeColor {
    font-size: 13px;
    height: 38px;
  }
  .darkColor {
    font-size: 13px;
    height: 38px;
  }
  .sponcerslogos {
    max-width: 150px;
  }

  .themeHeading {
    font-size: 18px;
  }
  .agencySectionContent .mainText {
    font-size: 13px;
  }
  .agencySectionContent .mdHeading {
    font-size: 14px;
  }
  .agencySectionContent .counterCard .mdHeading {
    font-size: 18px;
  }

  .agencySectionContent .counterCard .mainText {
    font-size: 13px;
  }
  .agencySection .blurBoxDrop .mainText {
    font-size: 13px;
  }
  .smButton {
    padding: 0.2rem 0.5rem;
    font-size: 11px;
  }
  .blurBoxDrop {
    padding: 2rem;
  }
  .footeSection .mdHeading {
    font-size: 13px;
  }
  .footerHeading {
    font-size: 17px;
  }
  .footerLink {
    font-size: 14px;
    margin-bottom: 0.3rem;
  }
  /* socialLinkButton */
  .socialLinkButton {
    width: 35px;
    height: 35px;
    font-size: 15px;
  }

  .newLattersFooter {
    margin-top: 3rem;
    margin-bottom: 2rem;
  }
  /* footerInput */
  .footerInput {
    font-size: 14px;
  }

  /* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> pageHeroSectionAlignment <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<  */
  .pageSubtitleWrapper {
    padding: 0.7rem 0;
  }
  .pageSubtitleWrapper .mdHeading {
    font-size: 25px;
  }

  /* sysStoryContainer */
  .sysStoryContainer {
    padding: 1.1rem;
  }
  .sysStoryContentWrapper .sectionHeading {
    font-size: 25px;
  }
  .sysStoryContentWrapper .mainText {
    font-size: 13px;
  }

  .memberCard {
    border-radius: 30px;
    padding: 1rem;
  }
  .memberCardImageWrapper {
    border-radius: 30px;
  }
  .memberCardBody .mdHeading {
    font-size: 25px;
  }
  .memberCardBody .mainText {
    font-size: 20px;
  }
  .footerSection {
    padding: 1em;
  }

  /* sectionHeaderPara */
  .sectionHeaderPara {
    font-size: 20px;
  }

  /* supportersCard */
  .supportersCard {
    padding: 1rem;
  }
  .supportersCard .mdHeading {
    font-size: 22px;
  }
  .supportersCard .mainText {
    font-size: 13px;
  }
  .supportersCard .smText {
    font-size: 11.65px;
  }
  .supportersCardContent .flexDiv {
    width: 100%;
  }
  .supportersCard .lgHeading {
    font-size: 14px;
  }
  .supportersCard .lgHeading span {
    font-size: 20px;
  }
  .supportersCardDetails .mdHeading {
    font-size: 15px;
  }
  .supportersCardDetails .mainText {
    font-size: 12px;
  }

  .dashboardUserInfoWrapper .mdHeading {
    font-size: 15px;
  }
  .dashbaordHeader .sectionHeading {
    font-size: 28px;
  }
  .mainDashboardContentContainer {
    padding: 1rem;
  }

  .PerformanceCard {
    padding: 1.1rem;
  }
  .PerformanceCard .mdHeading {
    font-size: 21.33px;
  }
  .PerformanceCard .mdHeading span {
    font-size: 14.33px;
  }
  .PerformanceCard .mainText {
    font-size: 13px;
  }

  .clubCardCol {
    border-left: none;
  }
  .backArrow {
    width: 16px;
    height: auto;
  }

  .blogPage2Section .sectionHeading {
    font-size: 24px;
  }

  .sysStoryImageWrapper {
    aspect-ratio: 16/10;
    border-radius: 17px;
  }
  .videoCard .sectionHeading {
    font-size: 21.64px;
  }
  .videoCard .sectionHeading img {
    width: 10px;
    height: auto;
  }
}