*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    background-color: rgb(248, 249, 251);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.links_container li:nth-of-type(2) a {
    color: white;
    border-bottom: 1px solid white;
}
.container{
    width:90%;
    /* margin: 0 auto; */
}
.about_header{
    width: 100%;
    height: 40vh;
    text-align: center;
    padding: 2rem 0;
    background-color: rgb(13, 110, 253);
    mask-border-slice: 1px solid black;
    position: relative;
}
/* Triangle */
.about_header::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    bottom: -30px; /* Adjust as needed */
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-top: 30px solid rgb(13, 110, 253); /* Same as header background */
}
.about_header h1{
    font-size: 3.5rem;
    color: white;
    margin-bottom: 1rem;
    padding: 1rem;
}
.about_header p{
    font-size: 1.2rem;
    color: white;
    max-width: 600px;
    margin: 0 auto;
    padding: 1rem;
}
.about_wrapper{
    width: 100%;
    display: flex;
    gap: 5%;
    padding: 3rem 0;
}
.about_wrapper .about_text{
    width: 50%;
    /* padding: 1rem; */
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.about_wrapper  h2:nth-of-type(1){
    font-size: 2.5rem;
    color: rgb(13, 110, 253);
    padding: 0.5rem 0;
}
.about_wrapper .about_text p{
    font-size: 1.2rem;
    color: rgb(97, 121, 157);
    padding: 0.5rem 0;
}

.about_img {
    width: 50%;
    max-height: 400px;
    object-fit: cover;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}
.about_img img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
}
.amount_wrapper{
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    /* gap: 10%; */
}
.aitem{
    width: 30%; 
    text-align: center;
    padding: 1rem;
}
.aitem:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    transition: 0.5s ease;
}
.amount_wrapper .aitem h2 {
    padding: 0;
    font-size: 1.5rem;
}
.amount_wrapper .aitem p {
    color: black;
    padding: 0;
    font-size: 1rem;
}
.about_goal_wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2rem 0;
    gap: 2rem;
}
.about_goal_card {
    width: 40%;
    color: white;
    padding: 2rem;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.about_goal_card .goal_wrapper {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 2rem;
}
.goal_wrapper i {
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
.blue {
    background-color: rgb(13, 110, 253);
}
.green {
    background-color: rgb(40, 167, 69);
}
.about_goal_card h3 {
    font-size: 1.5rem;
    color: rgb(0, 0, 0);
    padding: 0.5rem 0;
}
.about_goal_card p {
    font-size: 1rem;
    color: rgb(97, 121, 157);
    margin-top: 1rem;
}
/* staff */
.about_staff_wrapper {
    width: 100%;
    padding: 2rem 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.about_staff_wrapper h2 {
    font-size: 2.5rem;
    color: rgb(0, 0, 0);
    padding: 1rem;
}
.about_staff_wrapper p {
    font-size: 1.2rem;
    color: rgb(13, 110, 253);
    padding: 1rem;
}
.about_staff_wrapper i {
    font-size: 1.2rem;
    color: rgb(97, 121, 157);
    padding: 1rem;
}
.about_staff {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
    align-items: center;
    gap: 1rem;
    padding: 2rem 0;
}
.about_staff .staff_card {
    max-width: 350px;
    max-height: 350px;
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}
 .staff_img {
    width: 7rem;
    height: 7rem;
    border-radius: 50%;
    object-fit: cover;
}
.staff_img img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}