@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
figure,
dl,
dd,
ul,
ol,
menu,
fieldset,
legend,
pre {
    margin: 0;
}

html {
    scroll-behavior: smooth;
}


body {
    overflow-x: hidden;
}

a:hover {
    text-decoration: none;
}

.topBar {
    width: 100%;
    background-color: #165829;
    color: white;
    text-align: center;
    padding: 10px 0;
    font-size: 14px;
}

.whitePara {
    font-family: Poppins;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    vertical-align: middle;
    color: #FFFFFF;
}

.mobileHeader {
    display: none;
    position: sticky;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 20;
}

.mobileNavWrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 15px;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    width: 100%;

}

.burgerWrapper {
    padding: 5px;
    border: 1px solid #cdcdcd;
    cursor: pointer;
}

.burgerWrapper .fa {
    color: #000;
    font-size: 30px;

}

.desktopHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 100px;
    background-color: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    position: sticky;
    top: 0;
    z-index: 100;
}

.desktopNavLogoWrap {
    max-width: 131px;
}

.desktopNavLogoWrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.deskopNavLists {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.desktopNavLink {
    font-family: Poppins;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    color: #000000;
}

.desktopNavLink:hover {
    color: #000000;
}

.greenBtn {
    font-family: Poppins;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    color: #FFFFFF;
    background: linear-gradient(90deg, #279A47 0%, #0D3418 100%);
;
    border-radius: 8px;
    padding: 8px 16px;
    transition: all 0.4s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.greenBtn:hover {
    background: linear-gradient(90deg, #0D3418 0%, #279A47 100%);
    color: #FFFFFF;
}

.secondaryGreenBtn {
    font-family: Poppins;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    color: #FFFFFF;
    background: #279A47;
    border-radius: 0 4px 4px 0;
    padding: 8px 16px;
    transition: all 0.4s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: none;
    outline: none;
    padding: 10px 16px;
}

.secondaryGreenBtn:hover {
    color: #22792D;
    background-color: #fff;
}

.coursesSearchBar {
    font-family: Poppins;
    font-weight: 500;
    font-size: 17px;
    color: #A6A6A6;
    padding: 6px 32px;
    border-radius: 4px 0 0 4px;
    min-width: 500px;
    outline: none;
    border: none;
}

.sfList {
    display: none;
    position: absolute;
    width: 43.8%;
    background: #fff;
    z-index: 99;
    box-shadow: 0 26px 64px 0 rgba(0, 0, 0, .6);
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    height: 300px;
    overflow-y: hidden;
}

.sfList:hover {
    overflow-y: auto;
}

.sfList ul {}

.sfList ul li {}

.sfList ul li a {
    display: block;
    color: #2b333a;
    padding: 10px;
    border-bottom: 1px solid #efefef;
    font-size: 14px;
    font-weight: 600;
}

.sfList ul li a:hover {
    background: #eee;
}

.sfList ul li:last-child a {
    border-bottom: 0px solid #efefef;
}

.sfList {
    position: absolute;
    left: 50%;
    top: 200px;
    transform: translateX(-50%);
    z-index: 30;
}

.owl-theme .owl-nav [class*=owl-]:hover {
    background-color: transparent;
}

.searchBarWrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

.searchBarSection {
    background-color: #165829;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.headerSliderImageWrap {
    position: relative;
    padding-top: 42%;
}

.headerSliderImageWrap::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background-color: rgba(0, 0, 0, 0.1);
}

.headerSliderImageWrap img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.homeHeaderSlider .owl-prev {
    position: absolute;
    left: 5%;
    top: 50%;
    transform: translateY(-50%);
}

.homeHeaderSlider .fa {
    background-color: rgba(0, 0, 0, 0.4);
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    color: #05C832;
    font-size: 24px;
}

.homeHeaderSlider .owl-next {
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translateY(-50%);
}

.heroSectionTextWrap {
    max-width: 885px;
    margin: 15px auto 30px auto;
}

.headingWrap {
    margin-bottom: 20px;
}

.mainHeading {
    font-family: Poppins;
    font-weight: 600;
    font-size: 35px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
    color: #000000;
}

.blackPara {
    font-family: Poppins;
    font-weight: 400;
    font-size: 16px;
    line-height: 18px;
    text-align: center;
    color: #000000;
}

.heroCard {
    background-color: #fff;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding: 5px 15px 24px 15px;
    text-align: center;
    min-height: 173px;
    margin-bottom: 30px;
    transition: all 0.9s;
    cursor: pointer;
    position: relative;
}

.heroCard:hover {
    animation: flipOnce 0.9s forwards;
}

@keyframes flipOnce {
    from {
        transform: rotateY(0deg);
    }

    to {
        transform: rotateY(360deg);
    }
}

.heroCardTitle {
    font-family: Poppins;
    font-weight: 500;
    font-size: 15px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}

.heroCardLogoWrap {
    max-width: 95px;
    margin: 0 auto 10px auto;
}

.heroCardLogoWrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.heroShadowWrap {
    height: 96px;
    width: 96px;
    padding: 15px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        0px 0px 10px rgba(0, 0, 0, 0.1),
        0px 0px 8px rgba(255, 60, 0, 0.5);
}

.heroShadowWrap img {
    height: 96px;
    max-width: 96px;
    object-fit: contain;
    margin: 0 auto;
}

.ourCoursesSection {
    background-color: #E9FFEE80;
    padding: 30px 0;
}

.secondaryHeading {
    font-family: Poppins;
    font-weight: 600;
    font-size: 35px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    color: #000000;
}

.ourCoursesCard {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.courseCardImageWrap {
    position: relative;
    padding-top: 52%;
    overflow: hidden;
}

.courseCardImageWrap:hover img {
    transform: scale(1.2);
    transition: all 0.8s;
}

.courseCardImageWrap img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ourCoursesCardTextWrap {
    padding: 20px 15px 30px 15px;
}

.courseCardTitle {
    font-family: Poppins;
    font-weight: 700;
    font-size: 21px;
    line-height: 35px;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    text-transform: capitalize;
}

.whiteBtn {
    font-family: Poppins;
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    vertical-align: middle;
    text-transform: capitalize;
    color: #000000;
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid #269A47;
    transition: all 0.4s;
}

.whiteBtn:hover {
    color: #fff;
    background-color: #269A47;
}

.courseParaWrap {
    min-height: 140px;
}

.journeySection {
    margin: 30px auto 38px auto;
}

.journeyTextWrap {
    max-width: 823px;
    margin: 0 auto;
}

.journeyImageWrap {
    height: 146px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    position: relative;
    padding-top: 20%;
}

.journeyImageWrap:hover img {
    transform: scale(1.2);
}

.journeyImageWrap img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.4s;
}

.ourMissionImageWrap {
    position: relative;
    padding-top: 88%;
}

.ourMissionImageWrap img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ourMissionCard {
    border-radius: 8px;
    padding: 20px 15px;
    margin-bottom: 30px;
    box-shadow:
        0px 0px 10px rgba(0, 0, 0, 0.1),
        0px 0px 8px rgba(94, 255, 0, 0.5);
}

.missionParaWrap {
    max-width: 600px;
    margin: 0 auto;
}

.serviceCard {
    position: relative;
    border-radius: 8px;
    padding: 34px 10px 20px 10px;
    background-color: #F6F6F6;
    border: 1px solid #0000004D;
    height: 100%;
}

.serviceCardTitle {
    font-family: Poppins;
    font-weight: 600;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
}

.serviceCardBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: Poppins;
    font-weight: 600;
    font-size: 15px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;
    text-transform: capitalize;
    color: #000000;
    transition: all 0.5s;
}

.serviceCardBtn:hover {
    color: #000000;
    transform: translateX(5px);
}

.serviceCardGreenBar {
    content: '';
    position: absolute;
    left: -14px;
    top: 5%;
    width: 26px;
    height: 72px;
    background-color: #1D9238;
    border-radius: 10px;
    z-index: -1;
}

.serviceParaWrap {
    min-height: 134px;
}

.serviceLogoWrap {
    height: 86px;
    width: 86px;
    padding: 10px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        0px 0px 10px rgba(0, 0, 0, 0.1),
        0px 0px 8px rgba(255, 60, 0, 0.5);
}

.serviceLogoWrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.professinalDevSection {
    margin: 30px 0 40px 0;
}

.professinalSectionTextWrap {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 15px;
}

.professionalDevCard {
    border-radius: 4px;
    padding: 24px 10px 10px 10px;
    display: flex;
    flex-direction: row-reverse;
}

.greenBg {
    background-color: #1D923833;
}

.blueBg {
    background-color: #23CAEF33;
}

.profDevTitle {
    font-family: Poppins;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    vertical-align: middle;

}

.profDevCardImage {
    float: right;
    max-width: 265px;
    height: 182px;
}

.whyChooseUsImageWrap {
    position: relative;
    padding-top: 44%;
}

.whyChooseUsImageWrap img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.studentTestimonialSection {
    margin: 40px 0;
}

.testimonialCard {
    position: relative;
    border-radius: 40px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    padding: 0 20px 15px 20px;
    overflow: visible;
}

.testimonialInfoWrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.studentTestimonialCarousel .owl-dots .owl-dot span {
    background-color: #1D9238;
}

.studentTestimonialCarousel .owl-dots .owl-dot.active span {
    background-color: #1D923859;
}


.ratingsWrap {
    display: flex;
    align-items: center;
    gap: 5px;
}

.testimonialAuthor {
    font-family: Poppins;
    font-weight: 700;
    font-size: 17px;
    line-height: 32.8px;
    letter-spacing: 0%;
    color: #1869B5;
}

.authorPostion {
    font-family: Poppins;
    font-weight: 400;
    font-size: 12px;
    line-height: 23.4px;
    letter-spacing: 0%;
    color: #1869B5;
}

.testimonialImageWrap {
    width: 123px;
    height: 123px;
    padding: 5px;
    border-radius: 50%;
    position: relative;
    left: 50%;
    top: -40px;
    transform: translateX(-50%);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
    z-index: 3;
}

.topbubble {
    position: absolute;
    left: 5%;
    top: -13px;
    z-index: 5;
}

.bottombubble {
    position: absolute;
    right: 5%;
    bottom: -13px;
    z-index: 5;
}

.testimonialImageWrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    z-index: 3;
}

.studentTestimonialCarousel .owl-stage-outer {
    overflow: visible;
}

.testimonialHeadingWrap {
    margin-bottom: 60px;
}

.ourCollaborationSection {
    margin: 30px 0;
    position: relative;
    min-height: 380px;
}

.ourCollaborationSection::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 8%;
    height: 100%;
    background: linear-gradient(270deg, rgba(29, 146, 56, 0) 0%, rgba(29, 146, 56, 0.25) 100%);
    z-index: 10;
}

.ourCollaborationSection::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 8%;
    height: 100%;
    background: linear-gradient(90deg, rgba(29, 146, 56, 0) 0%, rgba(29, 146, 56, 0.25) 100%);
    z-index: 10;
}

.collaborationItemWrap {
    max-width: 165px;
}

.collaborationItemWrap img {
    object-fit: contain;
    width: 100%;
}

.ourCollaboratonCarousel {
    position: relative;
}

.ourCollaboratonCarousel .owl-nav {
    position: absolute;
    right: 5%;
    margin-top: 30px;
}

.ourCollaboratonCarousel .owl-dots {
    margin-top: 30px;
}

.ourCollaboratonCarousel .owl-dots .owl-dot span {
    background-color: #1D923859;
    width: 20px;
    height: 10px;
    border-radius: 50px;
}

.ourCollaboratonCarousel .owl-dots .owl-dot.active span {
    background-color: #1D9238;
    width: 30px;
    height: 10px;
    border-radius: 50px;
}

.ourCollaboratonCarousel .owl-nav .fa {
    background-color: #1D923859;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    color: rgba(0, 0, 0, .6);
    font-size: 18px;
}

.mediaCarousel .owl-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
}

.mediaCarousel .owl-nav .fa {
    background-color: #1D923859;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    color: rgba(0, 0, 0, .6);
    font-size: 18px;
}

.ourAffiliationSection {
    margin: 30px 0;
}

.ourAffiliationImageWrap {
    max-width: 1102px;
    margin: 0 auto;
    position: relative;
    padding-top: 13%;
}

.ourAffiliationImageWrap img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.mediaSection {
    margin: 40px 0;
}

.empowerTextWrapper {
    max-width: 635px;
}

.homeBannerSection {
    background-image: url("../images/updated-home/bg-image.webp");
    min-height: 200px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 80px 0;
}

.bannerContentSection {
    display: flex;
    align-items: center;
    gap: 40px;
}

.whiteHeadingSmall {
    font-family: Poppins;
    font-weight: 600;
    font-size: 35px;
    line-height: 38px;
    color: #fff;

}

.whitePara {
    font-family: Poppins;
    font-weight: 400;
    font-size: 18px;
    line-height: 20px;
    vertical-align: middle;
    color: #fff;
}

.whiteBtnSecondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border-radius: 8px;
    color: #22792D;
    padding: 8px 16px;
    font-family: Poppins;
    font-weight: 500;
    font-size: 16px;
    text-align: center;
    transition: all 0.4s;
}

.whiteBtnSecondary:hover {
    color: #fff;
    background-color: #22792D;
}

.footerSection {
    background-color: #1D9238;
    padding: 40px 0;
}

.footerHeading {
    font-family: Poppins;
    font-weight: 600;
    font-size: 20px;
    color: #fff;
    text-transform: uppercase;
}

.footerLinkList {
    list-style: none;
}

.footerLinkList li {
    margin-bottom: 15px;
}

.footerLink {
    font-family: Poppins;
    font-weight: 300;
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
}

.footerLink:hover {
    color: #fff;
}

.footerCompanyInfo {
    display: flex;
    align-items: center;
    gap: 15px;
}

.footerCompanyInfo img {
    flex: 0 0 22px;
}

.footerBottom {
    background-color: #000;
    padding: 15px 0;
}

.footerbottomContainer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.socialLinksContainer {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
}

.copyrightText {
    font-family: Poppins;
    font-weight: 300;
    font-size: 16px;
    color: #fff;
}

/* media queries */
@media (max-width: 1200px) {
    .desktopHeader {
        padding: 8px 15px;
    }



}

@media (max-width: 991px) {
    .desktopHeader {
        display: none;
    }

    .mobileHeader {
        display: flex;
    }

    .studentTestimonialCarousel .owl-stage-outer {
        overflow: hidden;
    }

    .testimonialImageWrap{
        top: 10px;
        margin: 20px 0 30px 0;
    }

    .footerbottomContainer{
        flex-wrap: wrap;
        justify-content: center;
        gap: 15px;
    }

    .coursesSearchBar{
        min-width: unset;
    }

    

}

@media (max-width: 767px) {
    .footerHeading{
        text-align: center;
    }

    .footerLinkList li{
        text-align: center;
    }

    .footerCompanyInfo{
        justify-content: center;
    }

    .copyrightText{
        text-align: center;
    }

}

@media (max-width: 576px) {
    .professionalDevCard{
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
        padding: 24px 10px 24px 10px;
    }

    .professionalCardContent{
        text-align: center;
    }

    .bannerContentSection{
        flex-wrap: wrap;
        justify-content: center;
    }

    .bannerContentWrap{
        text-align: center;
    }

    .homeBannerSection{
        padding: 40px 15px;
    }

    .empowerTextWrapper{
        text-align: center;
    }


}