#allMemberDiv{
    display: grid;
    grid-template-columns: 33% 33% 33%;
    justify-items: center;
    margin-left: 5%;
    margin-right: 5%;
}

.memberDiv{
    padding-bottom: 4vh;
    display: grid;
    grid-template-columns: 15vw 15vw;
    grid-template-rows: 8vh 26vh;
    justify-items: center;
    max-width: 30vw;
}

.memberPicDiv{
    display: grid;
    border: 4px solid white;
    border-radius: 25px;
    align-items: center;
    /*width: 100%;*/
    /* height: 74%; */
    width: 14vw;
    max-height: 25vh;
    aspect-ratio: 16/18;
    overflow: hidden;
}

.memberPic{
    /*max-height: 109%;*/
    width: 100%;
    overflow: hidden;
    /* margin-bottom: auto; */
    /*display: flex;*/
}

.memberName{
    color:white;
    font-size:2em;
    /*text-transform:uppercase;*/
    margin-top:0.5em;
    margin-bottom:0.5em;

    grid-column-start: 1;
    grid-column-end: 3;
}

.memberInstrument{
    color:var(--secondaryColor);
    font-size:1.5em;
    text-transform:uppercase;
    margin-top:0.5em;
    margin-bottom:0.5em;
}
.memberEntriesDiv{
    width: 80%;
}

.memberEntry{
    text-transform:uppercase;
}



@media screen and (max-width: 1600px) {
    #allMemberDiv{
        grid-template-columns: 33% 33% 33%;
    }
}

@media screen and (max-width: 1100px) {
    #allMemberDiv{
        grid-template-columns: 100%;
        margin-left:0;
        margin-right: 0;
    }

    .memberDiv{
        grid-template-columns: 100%;
        max-width: 70vw;
        grid-template-rows: 5vh 17vh;
        padding-bottom: 2vh;
    }

    .memberPicDiv{
        width: 34vw;
    }

}

@media screen and (max-width: 700px) {
    #allMemberDiv{
        grid-template-columns: 100%;
    }
    .memberDiv{
        grid-template-columns: 40% 60%;
    }
}