.bios {
  width: 98%;
  margin: 0px auto 0 auto;
}

.single-bio {
}
.single-bio > * {
  margin: 0;
}

.bio-image img {
  display: block;
  border-radius: 50%;
  width: 250px;
  height: auto;
}

div:is(.entry-content, .editor-styles-wrapper) h4.bio-name {
  color: #0282C6;
  margin-bottom: 0;
  font-size: 24px;
  margin-top: 12px;
}

.bio-gender {
  font-size: 12px;
}

.bio-title {
  font-weight: 600;
}


.bio-bio {
  display: none;
  margin-top: 12px;
  font-weight: 300;
  font-size: 16px;
  color: #0282C6;
}



@media only screen and (min-width: 600px) {
  .bios {
    display: grid;
    grid-template-columns: 47% 47%;
    column-gap: 6%;
    row-gap: 48px;
  }
}
@media only screen and (min-width: 768px) {
  .bios {
    display: grid;
    grid-template-columns: 30% 30% 30%;
    column-gap: 5%;
    row-gap: 48px;
  }
}