.ourLeaders {
    height: auto;
    width: 100%;
    /* background: url(imagemain/halfnewC.png) center center;
    background-size: 150vh; */

    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
}

.ourLeaders .banner {
    width: 90%;
    height: 40vw;

    margin-top: 130px;
    border-radius: 2vh;

    background: url(leaders.png) center -11vh;

    background-size: 100vw;

    animation: banani 1s 1 alternate ease-in-out forwards;
}


.ourLeaders .tital {
    margin-top: 3vh;
    color: rgb(255, 255, 255);
    font-size: 10vh;
    font-weight: bolder;
    text-align: center;
    transform: translateY(50px);

    animation: bantextani 1s 1 alternate ease-in-out forwards;
}

@keyframes banani {
    to {
        background-position: center center;
        background-size: 100vw;
    }
}

@keyframes bantextani {
    to {
        /* text-shadow: 0px 10px 0px black, -0px -0px 50px black; */
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 800px) {

    .ourLeaders .tital {
        font-size: 8vh;
    }
}


.leader {
    margin: 10vh 0;
    width: 100%;
    height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;

    opacity: 1;
    overflow: hidden;

    /* background-color: #fff; */
}

@media (max-width: 1000px) {
    .leader {
    margin: 0vh 0;
    width: 100%;
    height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;

    opacity: 1;
    overflow: hidden;

    /* background-color: #fff; */
}
}

.leader .first {
    width: 55vh;
    height: 60vh;

    /* background-color: #333333; */
    background: url(jj.jpg) center center;
    background-size: cover;

    border-radius: 5vh;

    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

/* .leader .first div {
    color: white;
    padding-bottom: 2.5vh;
    padding-left: 3.5vh;
    font-size: 3.5vh;
    font-weight: 600;
    width: 50vh;
} */

/* .leader .first div::before {
    content: "";
    width: 1vh;
    height: 2.7vh;
    border-radius: 20px;
    background-color: var(--ThemeColor-);
    display: inline-block;
} */

.leader .second {
    width: 60vh;
    height: 60vh;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    flex-direction: column;
    padding-left: 3vh;

    /* color: white; */
}

.leader .second .one {
    color: var(--ThemeColor-);
    font-size: 10vh;
    font-weight: bolder;
}

.leader .second .two {
    color: white;
    font-size: 4vh;
    font-weight: bolder;
    margin-bottom: 1vh;
    text-shadow: 0px 0vh 0px rgb(136, 136, 136);
}

.leader .second .two::before {
    content: "";
    width: 1vh;
    height: 2.7vh;
    border-radius: 20px;
    background-color: var(--ThemeColor-);
    display: inline-block;
}

.leader .second .three {
    color: rgb(206, 206, 206);
    font-size: 2vh;
    margin-bottom: 2.5vh;

    text-align: justify;
}



.aj .first {
    background: url(ceo2-Picsart-AiImageEnhancer.jpeg) center top;
    background-size: 53vh;
    background-position: center top;
}


.st .first {
    background: url(Banners/Leaders/Screenshot\ 2026-01-20\ 100708.png) center top;
    background-size: cover;
}

.tj .first {
    background: url(Banners/Leaders/Screenshot\ 2026-01-20\ 100546.png) center top;
    background-size: cover;
}

.ajj .first {
    background: url(Banners/Leaders/Screenshot\ 2026-01-20\ 100643.png) center top;
    background-size: cover;
}

@media (max-width: 900px) {
    .leader {
        transform: scale(0.75);
        align-items: center;
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .leader {
        transform: scale(0.9);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        height: auto;
        gap: 3vh;
/* 
        background-color: #fff; */
    }

    .leader .first {
        width: 90%;
        height: 90vw;

        background-color: #dadada;
        /* background: url(jj.jpg) center center; */
        background-size: cover;

        border-radius: 5vh;

        display: flex;
        align-items: flex-end;
        justify-content: flex-start;
    }

    .leader .second {
        width: 90%;
        height: auto;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
        padding-left: 0vh;
    }

    .leader .second .one {
    color: var(--ThemeColor-);
    font-size: 7vh;
    font-weight: bolder;
}
    .leader .second .two {
    font-size: 3vh;
    font-weight: bolder;
}
    .leader .second .three {
    font-size: 2.2vh;
}
}