#about {
    margin-top: 160px;
    padding-top: 3rem;

    h1 {
        width: fit-content;
        font-size: 2.5rem;
        font-weight: 500;
        border-bottom: 2px solid #f8931e;
        padding: 5px 50px;
        margin: 0 auto 30px;
    }

    .story-content {
        img {
            width: 100%;
            height: auto;
        }
    }

    .role-content {
        .part-1 {
            img:first-child {
                width: 58%;
                height: auto;
            }

            img:last-child {
                width: 38%;
                height: auto;
            }
        }

        .part-2 {
            img:first-child {
                width: 73%;
                height: auto;
            }

            img:last-child {
                width: 23%;
                height: auto;
            }
        }
    }

    .roadmap-content {
        img {
            width: 45%;
            height: auto;
        }
    }
}

@media only screen and (max-width: 991px) {
    #about {
        margin-top: 3rem;
        padding-top: 2rem;

        h1 {
            font-size: 2rem;
        }

        .roadmap-content {
            img {
                width: 75%;
                height: auto;
            }
        }
    }
}

@media only screen and (max-width: 768px) {
    #about {
        margin-top: 2rem;
        padding-top: 1rem;

        h1 {
            font-size: 1.6rem;
        }

        .roadmap-content {
            img {
                width: 100%;
                height: auto;
            }
        }
    }
}

@media only screen and (max-width: 480px) {
    #about {
        h1 {
            font-size: 1rem;
        }

            .role-content {
        .part-1 {
            img:first-child {
                width: 100%;
                height: auto;
            }

            img:last-child {
                width: 80%;
                height: auto;
            }
        }

        .part-2 {
            img:first-child {
                width: 100%;
                height: auto;
            }

            img:last-child {
                width: 60%;
                height: auto;
            }
        }
    }
    }
}

