.therapistBox {
    margin-top: max(max(4vh, 40px), min(4vw, 40px));
    margin-left: max(max(3vh, 30px), min(3vw, 30px));
    border: 1px solid #c5c5c5;
    border-radius: 10px;
    box-shadow: 0 0 2px var(--taupe-color);
    padding: max(max(2vh, 20px), max(2vw, 20px));
    width: 85%;
}

.providerTitleLine {
    display: grid;
    grid-template-columns: min-content 1fr 1fr 1fr;
    margin-bottom: max(max(4vh, 40px), min(4vw, 40px));
}

.providerName {
    font-family: Fraunces, ui-sans-serif;
    font-size: max(max(2.5vh, 25px), min(2.5vw, 25px));
    padding-bottom: max(max(2.5vh, 25px), min(2.5vw, 25px));
    border-bottom: 1px solid var(--oldLogoTeal-color);
    white-space: nowrap;
}

@media (width < 500px) {
    .providerName {
        font-size: 1.1em;
    }
}

.speaksBox, .flagBox, .laptopIconBox, .telehealthOnlyBox {
    display: grid
}

.flagIcon, .telehealthIcon {
    justify-self: center;
    align-self: center;
}

.iconLabel {
    font-family: Fraunces, ui-sans-serif;
    font-size: max(max(1.3vh, 13px), min(1.3vw, 13px));
    font-style: italic;
    text-align: center;
    justify-self: center;
    align-content: center;
    margin-top: max(max(1vh, 10px), min(1vw, 10px));
}

.openingLabel {
    font-style: italic;
    text-align: center;
    margin-top: max(max(0.8vh, 8px), min(0.8vw, 8px));
    color: var(--taupe-color);
}

@media (width < 750px) {
    .speaksBox, .flagBox, .laptopIconBox, .telehealthOnlyBox {
        visibility: hidden;
    }
}

@media (width < 500px) {
    .openingsBox {
        visibility: hidden;
    }
}

.therapistHeadshot {
    float: left;
    margin-right: max(max(3vh, 30px), min(3vw, 30px));
    margin-bottom: max(max(3vh, 30px), min(3vw, 30px));
    box-shadow: 0 0 2px var(--taupe-color);
}

@media (width < 450px) {
    .providerMainBox {
        display: grid;
    }
    .therapistHeadshot {
        float: unset;
        justify-self: center;
    }
}

.statement  {
    font-family: Fraunces, ui-sans-serif;
    line-height: max(max(3.5vh, 35px), max(3.5vh, 35px));
    font-size: max(max(1.8vh, 18px), min(1.8vw, 18px));
    width: 90%;
    text-align: justify;
    margin-bottom: max(max(2vh, 20px), min(2vw, 20px));
}

@media (width < 800px) {
    .statement {
        text-align: left;
    }
    .therapistBox {
        width: unset;
    }
}

.specBox {
    margin-top: max(-2vh, min(-2vw, -20px));
    display: flex;
    flex-wrap: wrap;
}

.specGroup {
    font-family: Baloo2-Bold, ui-sans-serif;
    font-size: max(max(2vh, 20px), min(2vw, 20px));
    cursor: pointer;
    width: max(max(24vh, 240px), min(24vw, 240px));
    white-space: nowrap;
}

.specRow {
    font-family: Baloo2, ui-sans-serif;
    font-size: max(max(2vh, 20px), min(2vw, 20px));
}

.spec0 {
    color: var(--magenta-color);
}

.spec1 {
    color: var(--ocean-color);
}

.spec2 {
    color: var(--forest-color);
}

.specList {
    color: black;
}

.insBox {
    display: flex;
    flex-wrap: wrap;
    margin-top: max(max(2vh, 20px), min(2vw, 20px));
    border: 1px solid var(--taupe-color);
    border-radius: max(max(1vh, 10px), min(1vw, 10px));
    justify-content: center;
    width: 90%;
}

.insIcon {
    align-self: center;
    width: max(max(9.5vh, 95px), min(9.5vw, 95px));
    padding-left: max(max(2vh, 20px), min(2vw, 20px));
    padding-right: max(max(2vh, 20px), min(2vw, 20px));
}

@media (width < 450px) {
    .insIcon {
        padding-left: max(max(0.5vh, 5px), min(0.5vw, 5px));
        padding-right: max(max(0.5vh, 5px), min(0.5vw, 5px));
    }
}