.navbar-wrapper {
    height             : 50vh;
    position           : relative;
    background-size    : cover;
    background-position: top center;
}

/* 
.imageGradiant {
    height     : 100%;
    background : linear-gradient(0deg, rgba(17, 43, 109, 0.25), rgba(17, 43, 109, 0.25));
    padding-top: 3.5rem;
} */

.welcomeNote {
    padding-top   : 4.5rem;
    padding-bottom: 11.7rem;
    max-width     : 1015px;
}

.welcomeNote h1 {
    font-weight   : bold;
    font-size     : 5.2rem;
    line-height   : 6.2rem;
    letter-spacing: -0.03em;
    color         : #E6EAF5;
    margin-bottom : 4rem;
}

.welcomeNote p {
    font-weight: normal;
    font-size  : 1.7rem;
    line-height: 3rem;
    color      : #E6EAF5;
}


.bsaa {
    background-image   : url('../images/bsaaHistory.svg');
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center center;
    padding-top        : 9.6rem;
    padding-bottom     : 22rem;
}


.bsaaTitle {
    max-width: 68.1rem;
    margin   : auto;
}

.bsaaTitle h1 {
    font-weight   : bold;
    font-size     : 4.8rem;
    line-height   : 5.6rem;
    text-align    : center;
    letter-spacing: -0.03em;
    color         : #E6EAF5;
    margin-bottom : 2rem;
}


.bsaaTitle p {
    font-weight  : normal;
    font-size    : 1.7rem;
    line-height  : 3rem;
    text-align   : center;
    color        : #E6EAF5;
    margin-bottom: 15.4rem;
}

.historyContainer {
    max-width    : 556px;
    margin       : auto;
    padding-left : 2.8rem;
    padding-right: 2.8rem;
}

.hisoryDetails {
    margin-bottom: 11.3rem;
}

.hisoryDetails img {
    width        : 100%;
    margin-bottom: 4rem;
}


.hisoryDetails h1 {
    font-weight   : bold;
    font-size     : 3.6rem;
    line-height   : 5.6rem;
    letter-spacing: -0.03em;
    color         : #BBC9ED;
    position      : relative;
}

.hisoryDetails p {
    font-weight: normal;
    font-size  : 1.7rem;
    line-height: 3rem;
    color      : #E6EAF5;
}

.hisoryDetails h1::before {
    content         : '';
    position        : absolute;
    top             : 0;
    right           : 110%;
    bottom          : 0;
    margin          : auto;
    width           : 500%;
    height          : 2px;
    background-color: #BBC9ED;
}




/* Vision Mission */
.visionMission {
    background         : url('../images/visionMissionBg.png'), #061425;
    background-position: center center;
    background-size    : cover;
    padding-top        : 24.8rem;
    padding-bottom     : 24.8rem;
}

.visionMs h1 {
    font-weight   : bold;
    font-size     : 4.8rem;
    line-height   : 5.6rem;
    letter-spacing: -0.03em;
    color         : #E6EAF5;
    margin-bottom : 1.6rem;
}

.visionMs p {
    font-weight: normal;
    font-size  : 1.7rem;
    line-height: 3rem;
    color      : #E6EAF5;
    max-width  : 43.4rem;
}



/* Board Member */
.boardMember {
    padding-top     : 15.3rem;
    padding-bottom  : 15.3rem;
    background-color: #061425;
}

.boardMember h1 {
    font-weight   : bold;
    font-size     : 5.2rem;
    line-height   : 6.2rem;
    letter-spacing: -0.03em;
    color         : #E6EAF5;
    max-width     : 48.8rem;
    margin-bottom : 7rem;
}

.chairmen {
    max-width: 611px;
}


.chairmen img {
    width        : 100%;
    margin-bottom: 4rem;
}

.chairmen h2 {
    font-weight   : bold;
    font-size     : 3.2rem;
    line-height   : 3.9rem;
    letter-spacing: -0.03em;
    margin-bottom : .4rem;
    color         : #E6EAF5;
}

.chairmen h6 {
    font-weight: normal;
    font-size  : 2.4rem;
    line-height: 3rem;
    color      : #E6EAF5;
}


.membersPro {
    max-width    : 320px;
    margin       : auto;
    margin-bottom: 7.2rem;
}

.membersPro img {
    width        : 100%;
    margin-bottom: 4rem;
}

.membersPro h3 {
    font-weight   : bold;
    font-size     : 2.4rem;
    line-height   : 2.9rem;
    letter-spacing: -0.03em;
    color         : #E6EAF5;
    margin-bottom : .4rem;
}


.membersPro h6 {
    font-weight: normal;
    font-size  : 1.8rem;
    line-height: 3rem;
    color      : #E6EAF5;
}



/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    .navbar-wrapper {
        height: 358px;
    }


    .welcomeNote h1 {
        font-size     : 30px;
        line-height   : 36px;
        letter-spacing: -0.03em;
    }

    .welcomeNote p {
        font-size  : 14px;
        line-height: 25px;
    }

    .welcomeNote {
        padding-top   : 21px;
        padding-bottom: 55px;
    }

    .bsaa {
        padding-top   : 28px;
        padding-bottom: 86px;
    }

    .bsaaTitle h1 {
        font-size    : 30px;
        line-height  : 62px;
        margin-bottom: 25px;
    }

    .bsaaTitle p {
        font-size    : 14px;
        line-height  : 25px;
        margin-bottom: 59px;
    }

    .historyContainer {
        overflow: hidden;
    }

    .hisoryDetails {
        margin-bottom: 50px;
    }

    .hisoryDetails img {
        margin-bottom: 26px;
    }

    .hisoryDetails h1 {
        font-size     : 22px;
        line-height   : 25px;
        letter-spacing: -0.03em;
        margin-bottom : 21px;
    }

    .hisoryDetails p {
        font-weight: normal;
        font-size  : 14px;
        line-height: 25px;
    }

    .visionMission {
        padding-top   : 70px;
        padding-bottom: 70px;
    }

    .visionMs h1 {
        font-size     : 25px;
        line-height   : 56px;
        letter-spacing: -0.03em;
        margin-bottom : 0;
    }

    .visionMs p {
        font-size  : 14px;
        line-height: 25px;
    }


    .boardMember {
        padding-top   : 51px;
        padding-bottom: 51px;
    }

    .boardMember h1 {
        font-size     : 22px;
        line-height   : 25px;
        letter-spacing: -0.03em;
        max-width     : 100%;
        text-align    : center;
        margin-bottom : 45px;
    }

    .chairmen {
        max-width    : 214px;
        margin       : auto;
        margin-bottom: 55px;
    }

    .chairmen img {
        margin-bottom: 9px;
    }

    .chairmen h2 {
        font-size     : 16px;
        line-height   : 19px;
        letter-spacing: -0.03em;
        margin-bottom : 0;
    }

    .chairmen h6 {
        font-size  : 14px;
        line-height: 30px;
    }


    .membersPro {
        max-width    : 145px;
        margin-bottom: 30px;
    }

    .membersPro h3 {
        font-size     : 14px;
        line-height   : 17px;
        letter-spacing: -0.03em;
        margin-bottom : 0;
    }

    .membersPro h6 {
        font-size  : 12px;
        line-height: 30px;
    }

}