* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: "Ubuntu", sans-serif;
}

.navbarMobile {
    display: none;
}

.desktopNavbar {
    display: flex;
    justify-content: space-between;
    padding: 1rem 4rem 10px 4rem;
    align-items: center;
    font-weight: 500;
}

.Logo img {
    height: 65px;
    width: 65px;
}

.navElements {
    display: flex;
    column-gap: 6rem;
    align-items: center;
    font-size: 20px;
}

.navElements ul {
    list-style: none;
    display: flex;
    column-gap: 5rem;
    margin-bottom: 0;
}

.dropdown .dropdown-menu {
    display: none
}

.dropdown .dropdownButton {
    border: none;
    background-color: transparent;
    color: #000033 !important;
    outline: none !important;
    box-shadow: none !important;
    font-weight: 400;
    font-size: 20px;
    padding: 0;
}

.navElements li.activeMenuItem {
    border-bottom: 3px solid #6378e9;
    font-weight: 600;
}

.navElements li.activeMenuItem .navLink {
    font-weight: 600 !important;
}

.navElements li.activeMenuItem .navLink::after {
    content: none;
}

.navElements ul li a {
    text-decoration: none;
    color: #000033;
    font-weight: 400;
}

.navElements ul li:nth-child(2) a i {
    padding-left: 15px;
    color: #525252;
}

.navElements a {
    text-decoration: none;
}

.navButton {
    padding: 8px 1.2rem;
    display: flex;
    column-gap: 15px;
    align-items: center;
    background-color: #6378e9;
    color: white;
    border: none;
    border-radius: 5px;
    font-weight: 500;
    font-size: 20px;
    cursor: pointer;
}

.navButton:hover{
    text-decoration: none;
    color: white;
  }
  

.navLink::after {
    content: '';
    display: block;
    width: 0;
    height: 3px;
    background: #6378e9;
    transition: width .4s ease-in;
}

.navLink.active {
    border-bottom: 3px solid #6378e9;
}

.navLink:hover {
    font-weight: 600;
}

.navLink:hover::after {
    width: 100%;
}

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

.visionSection .visionLeftSide {
    width: 50%;
}

.visionLeftSide .rightImage {
    display: block;
    margin-inline: auto;
    height: 500px;
    width: 500px;
}

.visionDataContainer {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
    width: 50%;
    margin-right: 3rem;
}

.visionSectionInfo .headingTitle {
    display: flex;
    column-gap: 1rem;

}

.visionSectionInfo {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.headingTitle h4 {
    font-size: 22px;
    color: #6378e9;
    position: relative;
    margin-left: 3rem;
}

.headingTitle h4::before {
    content: " ";
    display: block;
    height: 2px;
    width: 30px;
    position: absolute;
    top: 50%;
    left: -45px;
    background: #6378e9
}

.visionSectionInfo h3 {
    font-weight: 500;
    font-size: 32px;
    color: #10375C;
    line-height: 50px;
}

/* .visionDataContainer .visionTitle {
    display: flex;
    flex-direction: column;
    row-gap: 3rem;
}


.visionTitle p {
    font-size: 20px;
    color: #384356;
    line-height: 35px;
}

.visionTitle button {
    width: 25%;
    padding: 12px;
    color: white;
    background-color: #6378e9;
    border: none;
    border-radius: 25px;
    font-size: 20px;
} */

.missionSection {
    display: flex;
    width: 100%;
    margin-block: 5rem;
    align-items: center;
}

.missionSectionMobile {
    display: none;
}

.missionSection .missionLeftContainer {
    width: 50%;
    display: flex;
    flex-direction: column;
    row-gap: 3rem;
    margin-left: 3rem;
}

.missionSection .sectionTopData {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.missionLeftContainer .headingTitle {
    display: flex;
    column-gap: 1rem;
}

.sectionTopData h3 {
    font-size: 35px;
    color: #132238;
}

.sectionTopData p {
    font-size: 18px;
    line-height: 25px;
    color: #424E60;
}

.missionLeftContainer .missionCardContainer {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
}

.missionCardContainer .missionCard {
    display: flex;
    column-gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid #E6E8EB
}

.missionCard .cardData {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
}

.cardData h4 {
    font-size: 20px;
}

.cardData p {
    color: #424E60;
    font-size: 18px;
}

.missionSection .missionRightContainer {
    width: 50%;
}

.missionRightContainer img {
    display: block;
    margin-inline: auto;
    height: 550px;
}

.benefitsGrid {
    margin-block: 5rem;
    margin-inline: 4rem;
}

.benefitsGrid .headingTitle {
    display: flex;
    column-gap: 10px;
    align-items: center;
    color: #6378e9;
    font-size: 20px;
}

.benefitsGrid .sectionIntro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 1rem;
    margin-top: 1rem;
}

.sectionIntro p {
    font-size: 35px;
    color: #132238;
    font-weight: bold;
}

.gallery {
    display: grid;
    grid-template-columns: auto auto auto;
    grid-gap: 15px;
    margin-top: 2rem;
}

.gallery .gridCard {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
    border: 1px solid #E2E2E2
}

.gridCard .cardNumber {
    color: #6378E9;
    font-size: 30px;
    background-color: #DEE3FD;
    width: fit-content;
    height: auto;
    border-radius: 30px;
    padding: 10px;
}

.gridCard .cardTitle {
    color: #141414;
    font-size: 25px;
    font-weight: 600;
}

.gridCard .cardDescription {
    font-size: 20px;
    font-weight: 100;
    line-height: 30px;
}

.gallery .gridCard:hover {
    background-color: #ECEFFF;
}

.cardDescription .readMoreText {
    color: #6378E9;
    font-weight: 500;
    margin-left: 12px;
    cursor: pointer;
}

/* .testimonials {
    margin-top: 5rem;
    margin-inline: 4rem;
}

.testimonials .headingTitle {
    display: flex;
    column-gap: 10px;
    align-items: center;
    color: #6378e9;
    font-size: 20px;
}

.testimonials .sectionIntro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 1rem;
    margin-top: 1rem;
}

.testimonials .testimonialContainer {
    display: flex;
    margin-top: 3rem;
}

.testimonialContainer .testimonialContent {
    width: 60%;
    background-color: #F5F6F7;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
}

.testimonialContent .individualTestimonial {
    font-size: 18px;
    line-height: 25px;
}

.testimonialContent .individualInfo {
    display: flex;
    column-gap: 2rem;
    align-items: center;
}

.individualInfo .individualName {
    font-size: 22px;
    font-weight: 600;
}

.individualInfo .individualOrganization {
    font-size: 18px;
    color: #5E6971;
}

.testimonialContainer .individualPic {
    width: 40%;
}

.individualPic img {
    display: block;
    margin-inline: auto;
}

.serviceProvidedSection {
    margin-top: 5rem;
    margin-inline: 4rem;
}

.serviceProvidedSection .headingTitle {
    display: flex;
    column-gap: 10px;
    align-items: center;
    color: #6378e9;
    font-size: 20px;
}

.serviceProvidedSection .cardContainer {
    margin-top: 10px;
}

.serviceProvidedSection .sectionIntro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 1rem;
    border-bottom: 1px solid #D9D9D9;
    margin-top: 1rem;
}

.sectionIntro p {
    font-size: 35px;
    font-weight: 500;
    color: #10375C;
}

.sectionIntro .seeAllButton {
    display: flex;
    column-gap: 10px;
    border: none;
    background-color: transparent;
    font-size: 15px;
    color: #12141D;
    align-items: center;
    font-weight: 600;
}

.cardContainer .cardSection {
    display: flex;
    column-gap: 2rem;
    margin-bottom: 3rem;
}

.cardSection .card {
    justify-content: center;
    display: flex;
    flex-direction: column;
    row-gap: 14px;
    box-shadow: 0px 31.86px 37.55px 0px #0000001A;
    text-align: center;
    padding: 2rem;
}

.card i {
    background-color: #6378e9;
    color: white;
    width: fit-content;
    font-size: 60px;
    padding: 30px 35px;
    border-radius: 60px;
    margin-inline: auto;
}

.card h3 {
    color: #2b2b2b;
    font-size: 26px;
    font-weight: 500;
}

.card p {
    color: #696984;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px;
}

.card button {
    border: 1px solid #6378E9;
    border-radius: 8px;
    padding: 10px 1rem;
    margin-inline: auto;
    background-color: transparent;
    font-size: 18px;
    color: #6378E9;
} */

/* .footer {
    background-color: #6378e9;
    color: white;
    padding: 4rem;
}

.footerMobile {
    display: none;
}

.footer .footerContainer {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ffffff;
    padding-bottom: 2rem;
}

.footerContainer .copyRightSection {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.footerMainContent {
    display: flex;
    column-gap: 5rem;
}

.footerMainContent .mainContentSection {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.mainContentSection .mainContent {
    display: flex;
    flex-direction: column;
    row-gap: 10px;
}

.footerContainer .footerLastSection {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
}

.footerLastSection .findUsSection {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.findUsSection .socialMediaIcons {
    display: flex;
    column-gap: 2rem;
}

.footerLastSection .newsLetterSection {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.newsLetterSection .getUpdateBox {
    display: flex;
    column-gap: 1rem;
}

.emailSection {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    background-color: white;
    column-gap: 10px;
}

.emailSection i {
    font-size: 15px;
    color: #94a3b8;
}

.emailSection input {
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}

.getUpdateBox button {
    padding: 10px 15px;
    border: 1px solid white;
    background-color: transparent;
    color: white;
    border-radius: 4px;
    display: flex;
    column-gap: 1rem;
    align-items: center;
}

.footerElements {
    margin-top: 2rem;
}

.footerElements ul {
    list-style: none;
    display: flex;
    column-gap: 3rem;
    font-weight: 600;
}

.footerElements ul li a {
    text-decoration: none;
    color: white;
} */

.footer {
    background-color: #6378e9;
    color: white;
    padding: 4rem;
}

.footer .footerContainer {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ffffff;
    padding-block: 3rem;
    /* align-items: baseline; */
}

.footerContainer .copyRightSection {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.footerMainContent {
    display: flex;
    column-gap: 5rem;
}

.footerContainer .mainContentSection {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
}

.mainContentSection h3 {
    margin: 0;
    font-size: 25px;
}

.mainContentSection .mainContent {
    display: flex;
    flex-direction: column;
    row-gap: 1rem;
}

.mainContent p {
    margin: 0;
    font-size: 15px;
}

.footerContainer .footerLastSection {
    display: flex;
    flex-direction: column;
    row-gap: 5rem;
}

.footerLastSection .findUsSection {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
}

.findUsSection .findUsStatement {
    margin: 0;
    font-size: 25px;
}

.findUsSection .socialMediaIcons {
    display: flex;
    column-gap: 2rem;
}

.socialMediaIcons a {
    font-size: 15px;
    color: white;
    font-weight: 100;
}

.footerLastSection .newsLetterSection {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
}

.newsLetterSection h3 {
    margin: 0;
    font-size: 25px;
}

.newsLetterSection .getUpdateBox {
    display: flex;
    column-gap: 1rem;
}

.emailSection {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    background-color: white;
    column-gap: 10px;
}

.emailSection i {
    font-size: 15px;
    color: #94a3b8;
}

.emailSection input {
    background: transparent;
    border: none;
    outline: none;
    width: 100%;
}

.getUpdateBox button {
    padding: 10px 15px;
    border: 1px solid white;
    background-color: transparent;
    color: white;
    border-radius: 4px;
    display: flex;
    column-gap: 1rem;
    align-items: center;
}

.bottomFooter {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.bottomFooter p {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
}

.bottomFooter p a {
    color: #ffffff;
}

.footerElements {
    margin-top: 2rem;
}

.footerElements ul {
    list-style: none;
    display: flex;
    column-gap: 3rem;
    font-weight: 500;
    font-size: 18px;
    margin-bottom: 0;
}

.footerElements ul li a {
    text-decoration: none;
    color: white;
}

.footerMobile {
    display: none;
}


@media screen and (min-width: 320px) and (max-width: 520px) {
    .desktopNavbar {
        display: none;
    }

    .navbarMobile {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1rem;
    }

    .navbarMobile .dropdown .dropdownButton {
        font-size: 15px;
    }

    .navbarMobile .hamburgerNav {
        position: fixed;
        background-color: white;
        padding: 1.5rem;
        display: flex;
        flex-direction: column;
        z-index: 1;
        height: 100vh;
        row-gap: 2rem;
        right: -200px;
        top: 0;
        transition: .3s all linear;
        box-shadow: 0px 4px 40px 0px #00000033;
    }

    .hamburgerNav.show {
        right: -1px;
    }

    .hamburgerNav button {
        background-color: transparent;
        border: none;
    }

    .hamburgerNav ul {
        list-style: none;
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
    }

    .hamburgerNav ul a {
        text-decoration: none;
        color: #000033;
    }

    .hamburgerNav .closeMark {
        text-align: end;
    }

    .closeMark i {
        font-size: 25px;
        color: #6378e9;
        margin-right: 5px;
    }

    ul li a .loginButton {
        padding: 8px 12px;
        display: flex;
        column-gap: 12px;
        align-items: center;
        background-color: #6378e9;
        color: white;
        border: none;
        border-radius: 5px;
        font-weight: 500;
        font-size: 16px;
        cursor: pointer;
    }

    .loginButton fa-arrow-right {
        font-size: 15px;
        color: white;
    }

    .navbarMobile .hamburger {
        font-size: 30px;
        color: #6378e9;
        position: relative;
    }


    .visionSection {
        display: flex;
        flex-direction: column;
        row-gap: 2rem;
        margin: 1rem 2rem;
    }

    .visionSection .visionLeftSide {
        width: 100%;
    }

    .visionLeftSide .rightImage {
        display: block;
        width: 100%;
        height: 100%;
    }

    .headingTitle h4::before {
        width: 15px;
        left: -30px;
        margin-left: 0rem;
    }

    .headingTitle h4 {
        font-size: 15px;
        color: #6378e9;
        margin-left: 2rem;
    }

    .visionDataContainer {
        display: flex;
        flex-direction: column;
        row-gap: 2rem;
        width: 100%;
        margin-right: 0rem;
    }

    .visionSectionInfo h3 {
        font-size: 16px;
        line-height: 22px;
    }

    .missionSection {
        display: none;
    }

    .missionSectionMobile {
        display: flex;
        flex-direction: column;
        row-gap: 2rem;
        margin: 3rem 2rem;
    }

    .missionRightContainer img {
        height: 100%;
        width: 100%;
    }

    .sectionTopData h3 {
        font-size: 16px;
    }

    .sectionTopData p {
        font-size: 14px;
        line-height: 20px;
    }

    .missionSectionMobile .missionLeftContainer {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
    }

    .missionLeftContainer .sectionTopData {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
    }

    .missionLeftContainer .missionCardContainer {
        row-gap: 1rem;
    }

    .missionCardContainer .missionCard {
        column-gap: 12px;
        align-items: flex-start;
        padding: 1rem;
    }

    .cardData h4 {
        font-size: 16px;
    }

    .cardData p {
        font-size: 14px;
        line-height: 20px;
    }

    .missionCard img {
        height: 25px;
    }

    .benefitsGrid {
        margin: 3rem 2rem;
    }

    .benefitsGrid .sectionIntro {
        padding-bottom: 0rem;
    }

    .sectionIntro p {
        font-size: 16px;
        line-height: 20px;
    }

    .gallery {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
        margin-top: 1rem;
    }

    .gallery .gridCard {
        padding: 1rem;
    }

    .gridCard .cardNumber {
        font-size: 15px;
    }

    .gridCard .cardTitle {
        font-size: 16px;
    }

    .gridCard .cardDescription {
        font-size: 14px;
        line-height: 22px;
    }

    .footer {
        display: none;
    }

    .footerMobile {
        display: block;
    }

    .footerMainContent .mainContentSection {
        display: flex;
        flex-direction: column;
        row-gap: 2rem;
    }

    .footerMobile .footerMobileContainer {
        background-color: #6378e9;
        color: white;
        padding: 2rem;
        flex-direction: column;
        display: flex;
        row-gap: 2rem;
    }

    .footerMobileContainer .followLogoSection {
        display: flex;
        justify-content: space-between;
    }

    .followLogoSection .copyRightSection {
        width: min-content;
    }

    .followLogoSection .copyRightSection img {
        width: 130px;
    }

    .findUsSection {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
    }

    .findUsSection .findUsStatement {
        font-size: 15px;
    }

    .findUsSection .socialMediaIcons {
        display: flex;
        column-gap: 1rem;
    }

    .footerMainContent {
        margin-block: 2rem;
        column-gap: 0rem;
        justify-content: space-between;
    }

    .footerMainContent .mainContentSection h3 {
        font-size: 18px;
    }

    .footerMobile .newsLetterSection h3 {
        font-size: 18px;
    }

    .mainContent p {
        font-size: 13px;
    }

    .newsLetterSection h3 {
        margin-bottom: 10px;
    }

    .emailSection {
        column-gap: 4px;
        padding: 6px;
    }

    .getUpdateBox button {
        font-size: 12px;
        white-space: nowrap;
        column-gap: 10px;
        padding: 6px
    }

    .footerMobile .footerElements {
        background-color: #6378e9;
        color: white;
        padding-block: 2rem;
        margin-top: 0;
        border-block: 1px solid white;
    }

    .footerElements ul li a {
        font-size: 15px;
    }

    .bottomFooterMobile p {
        margin-top: 1rem;
    }

    .bottomFooterMobile p a {
        color: #ffffff;
    }

    .footerElements ul {
        display: grid;
        column-gap: 1rem;
        grid-template-columns: auto auto;
        grid-gap: 5px;
    }

}

@media screen and (min-width: 992px) and (max-width: 1100px) {
    .navbar {
        padding: 2rem 2rem;
    }

    .navElements {
        column-gap: 3rem;
        font-size: 15px;
    }

    .navElements ul {
        list-style: none;
        display: flex;
        column-gap: 2rem;
    }

    .navButton {
        font-size: 15px;
    }

    .visionSection {
        margin: 3rem 0 0 0;
    }

    .visionSection .rightImage {
        height: fit-content;
        width: 375px;
    }

    .headingTitle h4 {
        font-size: 18px;
    }

    .visionDataContainer {
        row-gap: 1rem;
    }


    .visionSectionInfo h3 {
        font-size: 22px;
        line-height: 35px;
    }

    /* 
    .visionDataContainer .visionTitle {
        row-gap: 2rem;
    }


    .visionTitle p {
        font-size: 15px;
        line-height: 25px;
    }

    .visionTitle button {
        width: 32%;
        border-radius: 22px;
        font-size: 15px;
    } */

    .missionSection .missionLeftContainer {
        row-gap: 1rem;
    }

    .sectionTopData p {
        font-size: 15px;
        line-height: 22px;
    }

    .missionSection .sectionTopData {
        row-gap: 10px;
    }

    .sectionTopData h3 {
        font-size: 22px;
    }

    .sectionTopData p {
        font-size: 15px;
    }

    .missionLeftContainer .missionCardContainer {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
    }

    .missionCard .cardData p {
        font-size: 15px;
    }

    .missionRightContainer img {
        height: 400px;
    }

    .gallery .gridCard {
        padding: 1rem;
        row-gap: 12px;
    }

    .gridCard .cardNumber {
        font-size: 25px;
        padding: 8px;
    }

    .gridCard .cardTitle {
        font-size: 22px;
    }

    .gridCard .cardDescription {
        font-size: 16px;
        line-height: 25px;
    }

    /* .testimonials .testimonialContainer {
        margin-top: 0rem;
    }

    .testimonialContainer .testimonialContent {
        padding: 1rem;
        row-gap: 1rem;
        margin-right: 2rem;
    }

    .testimonialContent .individualTestimonial {
        font-size: 15px;
        line-height: 22px;
    }

    .individualInfo .individualName {
        font-size: 20px;
    }

    .individualInfo .individualOrganization {
        font-size: 15px;
    }

    .individualPic img {
        height: 185px;
    }

    .sectionIntro {
        margin-top: 10px;
    }

    .cardContainer .cardSection {
        margin-block: 3rem;
        column-gap: 1rem;
    }

    .cardSection .card {
        padding: 0rem;
    }

    .sectionIntro p {
        font-size: 22px;
    }

    .cardContainer p {
        font-size: 22px;
    }

    .card i {
        padding: 22px 30px;
    }

    .card h3 {
        font-size: 20px;
    }

    .card p {
        font-size: 15px;
        line-height: 22px;
        margin-top: -5px;
    }

    .card img {
        height: 100px;
    }

    .card button {
        font-size: 15px;
    } */

    /* .footer {
    padding: 4rem 2rem;
  } */

    .copyRightSection p {
        font-size: 11px;
    }

    .copyRightSection .grantLoungeLogo {
        height: 28px;
    }

    .copyRightSection .logoImg {
        height: 65px;
    }

    .footerMainContent {
        column-gap: 14px;
    }

    .mainContentSection h3 {
        font-size: 20px;
    }

    .findUsSection .findUsStatement {
        font-size: 20px;
    }

    .mainContentSection .mainContent {
        width: max-content;
    }

    .mainContent p {
        font-size: 14px;
    }

    .footer .footerContainer {
        column-gap: 1rem;
    }

    .footerLastSection h3 {
        font-size: 20px;
    }

    .newsLetterSection .getUpdateBox {
        column-gap: 10px;
    }

    .getUpdateBox .emailSection {
        padding: 10px 10px;
    }

    .getUpdateBox button {
        padding: 5px 10px;
        column-gap: 10px;
    }

    .bottomFooter p {
        font-size: 12px;
    }

    .footerElements ul {
        font-size: 15px;
        column-gap: 2rem;
    }
}

@media screen and (min-width: 1101px) and (max-width: 1200px) {
    .navbar {
        padding: 2rem 2rem;
    }

    .navElements {
        font-size: 18px;
    }

    .navButton {
        font-size: 15px;
    }

    .visionSection {
        margin: 3rem 3rem 0 3rem;
        column-gap: 2rem;
    }

    .visionSection .rightImage {
        height: fit-content;
        width: 400px;
    }

    .headingTitle h4 {
        font-size: 20px;
    }

    .visionDataContainer {
        row-gap: 1rem;
    }

    .visionSectionInfo h3 {
        font-size: 25px;
        line-height: 38px;
    }

    /* .visionDataContainer .visionTitle {
        row-gap: 2rem;
    }



    .visionTitle p {
        font-size: 16px;
        line-height: 28px;
    }

    .visionTitle button {
        width: 25%;
        border-radius: 22px;
        font-size: 18px;
    } */

    .missionSection .missionLeftContainer {
        row-gap: 1rem;
    }

    .sectionTopData p {
        font-size: 15px;
        line-height: 22px;
    }

    .missionSection .sectionTopData {
        row-gap: 10px;
    }

    .sectionTopData h3 {
        font-size: 22px;
    }

    .sectionTopData p {
        font-size: 16px;
    }

    .missionLeftContainer .missionCardContainer {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
    }

    .missionCard .cardData p {
        font-size: 15px;
    }

    .missionRightContainer img {
        height: 465px;
    }

    .gallery .gridCard {
        padding: 1.5rem;
        row-gap: 12px;
    }

    .gridCard .cardNumber {
        font-size: 25px;
        padding: 8px;
    }

    .gridCard .cardTitle {
        font-size: 22px;
    }

    .gridCard .cardDescription {
        font-size: 16px;
        line-height: 25px;
    }

    /* .testimonials .testimonialContainer {
        margin-top: 1rem;
    }

    .testimonialContainer .testimonialContent {
        padding: 1rem;
        row-gap: 1rem;
    }

    .testimonialContent .individualTestimonial {
        font-size: 16px;
        line-height: 25px;
    }

    .individualInfo .individualName {
        font-size: 20px;
    }

    .individualInfo .individualOrganization {
        font-size: 15px;
    }

    .individualPic img {
        height: 185px;
    }

    .sectionIntro {
        margin-top: 10px;
    }

    .sectionIntro p {
        font-size: 22px;
    }

    .cardContainer p {
        font-size: 22px;
    }

    .card i {
        padding: 22px 30px;
    }

    .card h3 {
        font-size: 22px;
    }

    .card p {
        font-size: 15px;
        line-height: 22px;
        margin-top: -5px;
    }

    .card img {
        height: 100px;
    } */

    /* .footer {
    padding: 4rem 2rem;
  } */

    .copyRightSection p {
        font-size: 12px;
    }

    .footerMainContent {
        column-gap: 20px;
    }

    .mainContentSection h3 {
        font-size: 18px;
    }

    .mainContent p {
        font-size: 14px;
    }

    .footer .footerContainer {
        column-gap: 2rem;
    }

    .footerLastSection h3 {
        font-size: 18px;
    }

    .getUpdateBox button {
        padding: 5px 10px;
        column-gap: 10px;
    }

    .footerElements ul {
        font-size: 16px;
        column-gap: 2rem;
    }
}

@media screen and (min-width: 1201px) and (max-width: 1400px) {
    .navbar {
        padding: 2rem 2rem;
    }

    .navElements {
        font-size: 18px;
    }

    .navButton {
        font-size: 15px;
    }

    .visionSection {
        margin: 3rem 3rem 0 3rem;
        column-gap: 2rem;
    }

    .visionSection .rightImage {
        height: fit-content;
        width: 500px;
    }

    .headingTitle h4 {
        font-size: 20px;
    }

    .visionDataContainer {
        row-gap: 2rem;
    }

    .visionSectionInfo h3 {
        font-size: 30px;
    }

    /* .visionDataContainer .visionTitle {
        row-gap: 3rem;
    }


    .visionTitle p {
        font-size: 18px;
        line-height: 28px;
    }

    .visionTitle button {
        width: 25%;
        border-radius: 22px;
        font-size: 18px;
    } */

    .missionSection .missionLeftContainer {
        row-gap: 1rem;
    }

    .sectionTopData p {
        font-size: 15px;
        line-height: 22px;
    }

    .missionSection .sectionTopData {
        row-gap: 10px;
    }

    .sectionTopData h3 {
        font-size: 22px;
    }

    .sectionTopData p {
        font-size: 16px;
    }

    .missionLeftContainer .missionCardContainer {
        display: flex;
        flex-direction: column;
        row-gap: 1rem;
    }

    .missionCard .cardData p {
        font-size: 15px;
    }

    .missionRightContainer img {
        height: 465px;
    }

    .gridCard .cardNumber {
        font-size: 25px;
        padding: 8px;
    }

    .gridCard .cardTitle {
        font-size: 22px;
    }

    .gridCard .cardDescription {
        font-size: 16px;
        line-height: 25px;
    }

    /* .testimonials .testimonialContainer {
        margin-top: 1rem;
    }

    .testimonialContainer .testimonialContent {
        padding: 1rem;
        row-gap: 1rem;
    }

    .testimonialContent .individualTestimonial {
        font-size: 16px;
        line-height: 25px;
    }

    .individualInfo .individualName {
        font-size: 20px;
    }

    .individualInfo .individualOrganization {
        font-size: 15px;
    }

    .individualPic img {
        height: 185px;
    }

    .sectionIntro {
        margin-top: 10px;
    }

    .sectionIntro p {
        font-size: 22px;
    }

    .cardContainer p {
        font-size: 22px;
    }

    .card i {
        padding: 22px 30px;
    }

    .card h3 {
        font-size: 22px;
    }

    .card p {
        font-size: 15px;
        line-height: 22px;
        margin-top: -5px;
    }

    .card img {
        height: 100px;
    } */

    .copyRightSection p {
        font-size: 12px;
    }

    .footerMainContent {
        column-gap: 2rem;
    }

    .mainContentSection h3 {
        font-size: 18px;
    }

    .mainContent p {
        font-size: 14px;
    }

    .footerLastSection h3 {
        font-size: 18px;
    }

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