.content{
    padding-left: 2rem;
    padding-right: 2rem;
    justify-items: center;
    margin-bottom: 2rem;
}

/* ==============================
    TITLES
    ============================== */


.sub-title{
    text-align: center;
    border-bottom: solid var(--color-primary-dark);
    font-size: 1.35rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 0.4rem;
    /* width: 7rem; */

}

/* ==============================
    ABOUT ME SECTION
    ============================== */
#about-me{
    justify-items: center;
}

#about-me-text{
    text-align: center;
    width:35rem;
}

/* ==============================
    SKILLS SECTION
    ============================== */
.skills{
    justify-items: center;
    align-content: center;
}

#skills-section-wrapper{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 30rem;
}

/* Wraps the icon and text of skills and technologies listed. */
/* .skills-icon-wrapper{
    display: flex;
    flex-direction: row;
    background-color: var(--color-black);
    border-radius: 0.5rem;
    color: var(--color-white);
    padding-left: 0.5rem;
    gap: 0.5rem;
    width: 10rem;
    height: 3rem;
    align-items: center;
} */

.skills-techs-img{
    width: 2rem;
    height: 2rem;
}
/* ==============================
    LANGUAGES AND TECHNOLOGIES
    ============================== */
#languages, #technologies {
    justify-items: center;
}

#technologies::after {
    content: "";
    display: block;
    height: 3rem; /* same height as one skills-icon-wrapper */
}


.icon-group-wrapper{ /* Used to group icons in languages and technologies.*/
    display: grid;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    row-gap: 1rem;
    column-gap: 1rem;
}