/* Home Banner Slider */
.HomeBannerSection{overflow-x:hidden}
.HomeBannerSection .homeSlideSection .home-banner-slider .homeSlideMain{position: relative;}
.HomeBannerSection .homeSlideSection .home-banner-slider .homeSlideMain::before{content: "";position: absolute;width: 60%;height: 100%;top: 0px;left: 0px;background: RGBA(0, 0, 0, 0.69);background: linear-gradient(90deg, rgba(0, 0, 0, 0.90) 0%, rgba(0, 0, 0, 0.70) 60%, rgba(0, 0, 0, 0) 100%);z-index: 9;}
.HomeBannerSection .bannerTitle p{margin-bottom: 0px; color:#fff;}

/* Who We Are Section */
.whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:first-child{position: absolute; top: 0px; width: calc(100% - 120px);}
.whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:last-child{    position: absolute; top: 250px; left: 250px; width: calc(100% - 250px); z-index: 9;}
.whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure img{width: 100%; border: 10px solid #fff;}
.whoWeAreSection .whoWeAreContainer .textDashed{position: relative;}
.whoWeAreSection .whoWeAreContainer .textDashed::before{content: ""; position: absolute; width: 60px; height: 1px; background: rgba(0, 0, 0, 0.2); top: 50%; right: -80px; transform: translate(0px, -50%);}

/* Get Involved Section */
.getInvolvedSection .getInvolvedContainer .getInvolvedContent .getInvolvedCard figure{position: absolute; top: -59px;}

/* Empowering Section */
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard::before{content: ""; position: absolute; background: rgba(17, 27, 94, 0.9); background: linear-gradient(20deg, rgba(17, 27, 94, 1) 10%, rgba(17, 27, 94, 0) 65% 65% ); width: 100%; height: 100%; bottom: 0px; left: 0px; z-index: 9;filter: grayscale(1);transition: .3s ease-in-out;}
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard:hover::before{filter: grayscale(0);}
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard figure:first-child{position: relative; z-index: 99;}
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard .socialIcons{position: relative; z-index: 99;}
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard:hover figure:last-child{filter: grayscale(0);} 
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard figure:last-child{position: absolute; width: 100%; height: 100%; top: 0px; left: 0px;filter: grayscale(1);transition: .3s ease-in-out;}
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard figure:last-child img{height: 100%;object-fit: cover;}
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard .socialIcons figure:last-child{position: static; width: auto; height: auto;filter: none;}
.empoweringSection .empoweringContainer .empoweringContent .empoweringCard .arrowBTN::before{content: ""; position: absolute; right: -35px; top: 50%; width: 25px; height: 17px; background: url(../images/arrows.svg) no-repeat center / contain; transform: translate(0px, -50%); font-family: 'Nunito';}

/* Skill Training Section */
.skillTrainingSection{background-image: linear-gradient(129deg, #2338c4 10%, #111b5e 50%, #2338c4 110%);}
.skillTrainingSection figure{position: absolute; top: 0px; right: 0px; width: 50%; height: 100%;}



/* Responsive Screens */
@media screen and (max-width:1024px) {
    /* Who We Are Section */
    .whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:first-child { width: calc(100% - 80px); }
    .whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:last-child { left: 150px; width: calc(100% - 150px);}
    /* Get Involved Section */
    .getInvolvedSection .getInvolvedContainer .getInvolvedContent .getInvolvedCard figure { top: -40px; left: 30px; }
    
}

@media screen and (max-width:767px) {
    /* Home Banner */
    .HomeBannerSection .homeSlideSection .home-banner-slider .homeSlideMain::before{ width: 100%; height: 60%; top: 40%; background: linear-gradient(360deg, rgba(0, 0, 0, 0.90) 0%, rgba(0, 0, 0, 0.70) 60%, rgba(0, 0, 0, 0) 100%); }
    .HomeBannerSection .homeSlideSection figure{position: absolute; bottom: 0px; left: 0px; width: 100%; height: 100%;}
    .HomeBannerSection .homeSlideSection figure img{width: 100%;}
    /* Who We Are Section */
    .whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:first-child{position: relative;}
    .whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:last-child{position: relative;margin-top: -250px; top: 0px;}
    .whoWeAreSection .whoWeAreContainer .textDashed::after{content: ""; position: absolute; width: 38px; height: 1px; background: rgba(0, 0, 0, 0.2); top: 50%; left: -58px; transform: translate(0px, -50%);}
    .whoWeAreSection .whoWeAreContainer .textDashed::before{width: 38px; right: -58px;}    
    /* Get Involved Section */
    .getInvolvedSection .getInvolvedContainer .getInvolvedContent .getInvolvedCard figure { left: 25px; }
    /* Skill Training Section */
    .skillTrainingSection{display: flex ; flex-direction: column-reverse;}
    .skillTrainingSection figure{position: static;width: 100%;}
}

@media screen and (max-width:580px) {
    /* Who We Are Section */
    .whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:last-child { margin-top: -110px; }
}

@media screen and (max-width:480px) {
    /* Who We Are Section */
    .whoWeAreSection .whoWeAreContainer .whoWeAreImgContainer figure:last-child { left: 100px; width: calc(100% - 100px); }
}