.about-me {
    display: flex;
    justify-content: space-around;
}

.about-me-container {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    margin: 28px;
    margin-right: calc(4vw + 28px);
}

.intro-header-wrapper {
    margin: 52px 0px 20px 0px;
}

.intro-header {
    font-size: calc(1.2vw + 25px);
    border-bottom: 2px solid var(--primary-color);
    padding-bottom: 8px;
}

.intro {
    font-size: calc(0.5vw + 15px);
    line-height: 1.5;
    color: var(--secondary-text-color);
}

.about-me img {
    width: auto;
    max-width: 20vw;
    border-radius: 25%;
    margin: auto calc(4vw + 40px);
}

.profile-img-wrapper {
    background-image: radial-gradient(
        var(--secondary-primary-color) 10%, 
        var(--background-color) 70%,
        transparent 50%
    );
}

@media screen and (max-width: 680px) {
    .about-me {
        flex-direction: column-reverse;
        justify-content: center;
    }
    .about-me-container {
        margin: 0px auto;
    }
    .intro {
        text-align: justify;
    }
    .about-me img {
        width: auto;
        max-width: calc(40vw + 50px);
    }
 }