#team {
    overflow: hidden;
}
.team-grid{
    --team-grid-gap: 50px;

    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: var(--team-grid-gap);
    row-gap: 50px;
    position: relative;
    padding: 50px 0;
}
@media (max-width: 1400px) and (min-width: 1000px) {
    .team-grid {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto;
    }
}

.team-grid.team-doctors {
    grid-template-columns: 1fr 1fr;
    align-items: start;
}

@media (max-width: 1000px) {
    .team-grid{
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
    }
}

.team-grid .team-member-card {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    justify-items: center;
    align-items: start;
    row-gap: 20px;
    position: relative;
    z-index: 1;
    cursor: pointer;
    transition: transform .5s;
}

.team-grid .team-member-card:hover {
    transform: scale(1.1);
}

.team-member-description {
    text-align: center;
}

.team-member-description .team-member-name {
    font-size: 1.2rem;
    font-weight: 400;
    margin-bottom: 5px;
}
.team-member-description .team-member-properties {
    font-size: 1rem;
}
.team-member-description .team-member-properties ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.team-grid .team-member-card-container {
    position: relative;
    width: 100%;
    --left-padding: var(--gallery-side-padding);
    --extra-padding: calc(100% + var(--team-grid-gap));
}

.team-grid .team-member-card .team-member-photo, .team-member-photo{
    border-radius: 500px;
    overflow: hidden;
    position: relative;
    width: 100%;
    aspect-ratio: 1/1;
    max-height: 300px;
    max-width: 300px;
}

.team-member-photo img{
    position: relative;
    width: 100%;
    height: auto;
    object-fit: fill;
    vertical-align: middle;
}

.team-container {
    padding: 10px 0;
    overflow: visible;
}
.team-container:last-of-type {
    padding-bottom: 100px;
}
.team-container-background {
    background-color: var(--color-light-gold);
    position: absolute;
    height: 0px;
    width: 100%;
    margin-top: 0px;
}

@media (max-width: 1400px) and (min-width: 1000px) {
    .team-member-card-container .team-container-background {
        width: calc(100% + var(--team-grid-gap));
    }
    .team-member-card-container:nth-child(3n-2) .team-container-background {
        width: calc(100% + var(--team-grid-gap) + var(--gallery-side-padding));
        left: calc(-1 * var(--gallery-side-padding));
    }
    .team-member-card-container:nth-child(3n) .team-container-background {
        width: calc(100% + var(--gallery-side-padding));
    }
    .team-member-card-container:last-of-type .team-container-background {
        width: 100vw!important;
    }
}
@media (max-width: 1000px){
    .team-member-card-container:nth-child(odd) .team-container-background {
        width: calc(100% + var(--team-grid-gap) + var(--gallery-side-padding));
        left: calc(-1 * var(--gallery-side-padding));
    }
    .team-member-card-container:nth-child(even) .team-container-background {
        width: calc(100% + var(--gallery-side-padding));
    }
}
@media (min-width: 1000px) {
    .team-member-card-container .team-container-background {
        width: calc(100% + var(--team-grid-gap));
    }
    .team-member-card-container:first-of-type .team-container-background {
        width: calc(100% + var(--team-grid-gap) + var(--gallery-side-padding));
        left: calc(-1 * var(--gallery-side-padding));
    }
    .team-member-card-container:last-of-type .team-container-background {
        width: calc(100% + var(--gallery-side-padding));
    }
}


.team-member-detailed-description {
    display: grid;
    grid-template-columns: auto 1fr;
    justify-content: start;
    align-items: start;
    column-gap: 50px;
}

.team-member-detailed-description .team-member-photo {
    max-width: 250px;
    position: relative;
    z-index: 1;
}

