@import 'common/subnav.css';
@import 'common/regular-page.css';
@import 'common/portrait.css';

.person {
  display: flex;
  flex-grow: 1; /* so that the whole space is used up */
  flex-basis: 0; /* to make all items the same size */
  gap: 13px;
  min-width: 320px;
  align-items: flex-start;
}

.person .name {
  font-weight: 700;
  margin: 0 0 .3em;
}

.person li {
  line-height: normal;
  margin-bottom: .3em;
}

.person ul {
  list-style-type: disc;
  margin: 0;
  padding-left: 16px;
}

.presidents {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  gap: 20px 10%;
}

.president {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.president > * {
  margin: 0;
}

@media (max-width: 400px) {
  .person {
    min-width: 250px;
  }
}