.boardmember { width: 100%; margin-bottom: 60px; display: flex; }
.boardmember-image { width: 50%; background-size: cover; background-position: center center; }
.boardmember-image img { width: 100%; height: auto; border-top-left-radius: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }
.boardmember-content { background-color: #CCF5FF; border-top-right-radius: 4px; border-bottom-right-radius: 4px; padding: 16px; width: 50%; box-sizing: border-box;
    height: min-content; }
.boardmember-content span { font-size: 12px; font-style: italic; display: block; margin-bottom: 0; line-height: 14px; }
.boardmember-content p:last-of-type { margin: 0; }
.boardmember-content h2 { font-size: 22px !important; margin-bottom: 4px !important; line-height: 20px !important; }


@media screen and (max-width: 880px) {
    .boardmember-content { border-bottom-left-radius: 4px; }
    .boardmember-content h2 { font-size: 17px !important; line-height: 16px !important; }
    .boardmember-image { width: 40%; }
    .boardmember-content { width: 60%; }
}

@media screen and (max-width: 767px) {
    .boardmember-content { min-height: 100px; }
    .boardmember-content h2 { font-size: 1.5em !important; line-height: 16px !important; }
    .boardmember-content span { font-size: 1.2em; line-height: 25px; }
}

@media screen and (max-width: 350px) {
    .boardmember-content h2 { font-size: 1.2em !important; line-height: 16px !important; }
    .boardmember-content span { font-size: 1em; line-height: 16px; }
}