@media (max-width: 980px) {
    .hero-section {
        padding-left: 2rem;
        padding-right: 2rem;
        gap: 5%;
    }
}

@media (max-width: 840px) {
    .page-header {
        font-size: 35px;
    }
}

@media (max-width: 790px) {
    .hero-section {
        flex-direction: column;
        gap: 2rem;
        padding-bottom: 5rem;
    }
    .hero-img-wrapper {
        display: flex;
    }
    .hero-img-box {
        height: 390px;
        width: 300px;
    }
}

@media (max-width: 500px)  {
    .hero-img-wrapper {
        justify-content: center;
    }
}

@media (max-width: 430px)  {
    #bio-line-break {
        display: block;
    }
    .hero-section {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (max-width: 380px)  {
    .bio-info-select-info {
        padding-left: 20px;
        padding-right: 20px;
    }
}