@charset "utf-8";

.staff_member_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0 20px;
}
.staff_member {
    padding: 100% 0 0 0;
    position: relative;
    background-color: #444;
    margin: 0 0 20px 0;
}
.staff_member:hover {
    cursor: pointer;
}
.bio_body {
    height: 0;
    overflow: hidden;
    transition: ease all 400ms;
}
.staff_member:after {
    content: "";
    display: block;
    height: 30px;
    width: 30px;
    position: absolute;
    top: 80%;
    opacity: 0;
    left: 50%;
    background: #4b758f;
    transition: var(--cubic-bezier) all 500ms;
    transform: translate(-50%, -50%) rotate(45deg);
}
.concierge .staff_member:after {
    background: var(--red);
}
.staff_member.active:after {
    top: 100%;
    opacity: 1;
}
.staff_member_meta {
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: left;
    width: 100%;
    z-index: 2;
    background: linear-gradient(to bottom, #4b758f00 0%, #4b758f 100%);
    padding: 50px 25px 25px 25px;
}

.concierge .staff_member_meta {
    background: linear-gradient(to bottom, #a22a2a00 0%, #a22a2a 100%);
}

.concierge .thepage .staff_member_meta h3,
.thepage .staff_member_meta h3 {
    color: #fff;
    margin: 0;
}
.thepage .staff_member_meta h4 {
    margin: 10px 0 0 0;
    font-size: 15px;
    font-family: var(--poppins);
    color: #fff;
}

.team_member_bio {
    display: none;
    text-align: left;
    grid-column: span 3;
}
.bio_body_blue {
    background: #f4fbff;
    padding: 25px;
}
.concierge .bio_body_blue {
    background: #fff5f6;
}
.team_member_bio.active {
    display: block;
}
.bio_body_inner {
}
.thepage .team_member_bio h5 {
    font-size: 16px;
    color: var(--blue-ada);
}
.concierge .thepage .team_member_bio h5 {
    color: var(--red);
}
.biospacer {
    height: 40px;
}

.like_cloud {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}
.like_cloud span {
    font-size: 16px;
    color: #626262;
    pointer-events: none;
    user-select: none;
}
.like_cloud span:after {
    content: ",";
}
.like_cloud span:last-child:after {
    display: none;
}

.staff_member_image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    overflow: hidden;
}
.staff_member .staff_member_image:after {
    content: "";
    height: 0px;
    width: 0px;
    display: block;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    position: absolute;
    z-index: 1;
    top: 15px;
    right: 15px;
    transition: var(--cubic-bezier) all 800ms;
    opacity: 0;
}
.staff_member:focus .staff_member_image:after,
.staff_member:hover .staff_member_image:after {
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    opacity: 1;
}

.staff_member .photo_holder {
    transition: transform 0.4s ease, opacity 0.4s ease;
    opacity: 0;
    transform: scale(0.5);
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}
.staff_member .photo_holder:hover {
    cursor: default;
}
.staff_member figure.lazy-bg--loaded .photo_holder {
    opacity: 1;
    transform: scale(1);
}
.staff_member:focus figure.lazy-bg--loaded .photo_holder,
.staff_member:hover figure.lazy-bg--loaded .photo_holder {
    transform: scale(1.1);
}

.team_member_bio[data-rowcount-3="2"] {
    grid-row: 2;
}
.team_member_bio[data-rowcount-3="3"] {
    grid-row: 3;
}
.team_member_bio[data-rowcount-3="4"] {
    grid-row: 4;
}
.team_member_bio[data-rowcount-3="5"] {
    grid-row: 5;
}
.team_member_bio[data-rowcount-3="6"] {
    grid-row: 6;
}
.team_member_bio[data-rowcount-3="7"] {
    grid-row: 7;
}
.team_member_bio[data-rowcount-3="8"] {
    grid-row: 8;
}
.team_member_bio[data-rowcount-3="9"] {
    grid-row: 9;
}
.team_member_bio[data-rowcount-3="10"] {
    grid-row: 10;
}
.team_member_bio[data-rowcount-3="11"] {
    grid-row: 11;
}
.team_member_bio[data-rowcount-3="12"] {
    grid-row: 12;
}
.team_member_bio[data-rowcount-3="13"] {
    grid-row: 13;
}
.team_member_bio[data-rowcount-3="14"] {
    grid-row: 14;
}
.team_member_bio[data-rowcount-3="15"] {
    grid-row: 15;
}
.team_member_bio[data-rowcount-3="16"] {
    grid-row: 16;
}
.team_member_bio[data-rowcount-3="17"] {
    grid-row: 17;
}
.team_member_bio[data-rowcount-3="18"] {
    grid-row: 18;
}
.team_member_bio[data-rowcount-3="19"] {
    grid-row: 19;
}
.team_member_bio[data-rowcount-3="20"] {
    grid-row: 20;
}
.team_member_bio[data-rowcount-3="21"] {
    grid-row: 21;
}
.team_member_bio[data-rowcount-3="22"] {
    grid-row: 22;
}
.team_member_bio[data-rowcount-3="23"] {
    grid-row: 23;
}
.team_member_bio[data-rowcount-3="24"] {
    grid-row: 24;
}
.team_member_bio[data-rowcount-3="25"] {
    grid-row: 25;
}
.team_member_bio[data-rowcount-3="26"] {
    grid-row: 26;
}
.team_member_bio[data-rowcount-3="27"] {
    grid-row: 27;
}

@media (max-width: 900px) {
    .team_member_bio.active {
        grid-column: span 2;
    }
    .staff_member_grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .team_member_bio[data-rowcount-2="2"] {
        grid-row: 2;
    }
    .team_member_bio[data-rowcount-2="3"] {
        grid-row: 3;
    }
    .team_member_bio[data-rowcount-2="4"] {
        grid-row: 4;
    }
    .team_member_bio[data-rowcount-2="5"] {
        grid-row: 5;
    }
    .team_member_bio[data-rowcount-2="6"] {
        grid-row: 6;
    }
    .team_member_bio[data-rowcount-2="7"] {
        grid-row: 7;
    }
    .team_member_bio[data-rowcount-2="8"] {
        grid-row: 8;
    }
    .team_member_bio[data-rowcount-2="9"] {
        grid-row: 9;
    }
    .team_member_bio[data-rowcount-2="10"] {
        grid-row: 10;
    }
    .team_member_bio[data-rowcount-2="11"] {
        grid-row: 11;
    }
    .team_member_bio[data-rowcount-2="12"] {
        grid-row: 12;
    }
    .team_member_bio[data-rowcount-2="13"] {
        grid-row: 13;
    }
    .team_member_bio[data-rowcount-2="14"] {
        grid-row: 14;
    }
    .team_member_bio[data-rowcount-2="15"] {
        grid-row: 15;
    }
    .team_member_bio[data-rowcount-2="16"] {
        grid-row: 16;
    }
    .team_member_bio[data-rowcount-2="17"] {
        grid-row: 17;
    }
    .team_member_bio[data-rowcount-2="18"] {
        grid-row: 18;
    }
    .team_member_bio[data-rowcount-2="19"] {
        grid-row: 19;
    }
    .team_member_bio[data-rowcount-2="20"] {
        grid-row: 20;
    }
    .team_member_bio[data-rowcount-2="21"] {
        grid-row: 21;
    }
    .team_member_bio[data-rowcount-2="22"] {
        grid-row: 22;
    }
    .team_member_bio[data-rowcount-2="23"] {
        grid-row: 23;
    }
    .team_member_bio[data-rowcount-2="24"] {
        grid-row: 24;
    }
    .team_member_bio[data-rowcount-2="25"] {
        grid-row: 25;
    }
    .team_member_bio[data-rowcount-2="26"] {
        grid-row: 26;
    }
    .team_member_bio[data-rowcount-2="27"] {
        grid-row: 27;
    }
    .team_member_bio[data-rowcount-2="28"] {
        grid-row: 28;
    }
    .team_member_bio[data-rowcount-2="29"] {
        grid-row: 29;
    }
    .team_member_bio[data-rowcount-2="30"] {
        grid-row: 30;
    }
    .team_member_bio[data-rowcount-2="31"] {
        grid-row: 31;
    }
    .team_member_bio[data-rowcount-2="32"] {
        grid-row: 32;
    }
    .team_member_bio[data-rowcount-2="33"] {
        grid-row: 33;
    }
    .team_member_bio[data-rowcount-2="34"] {
        grid-row: 34;
    }
    .team_member_bio[data-rowcount-2="35"] {
        grid-row: 35;
    }
    .team_member_bio[data-rowcount-2="36"] {
        grid-row: 36;
    }
}
@media (max-width: 600px) {
    .staff_member_grid {
        grid-template-columns: repeat(1, 1fr);
    }
    .team_member_bio.active {
        grid-column: span 1;
    }
    .team_member_bio {
        grid-row: initial !important;
    }
}
