/* Give the main header an underline. */

h1 {
  padding-bottom: 21px;
  margin-bottom: 21px;
  border-bottom: 1px solid #ddd;
}

/* Add small subtitles. */

.subtitle {
  margin-top: -10.5px;
  color: #bbb;
}

/* Lay out definition lists list tables. */

dl {
  display: flex;
  flex-flow: row wrap;
}

dt {
  flex-basis: 20%;
  font-weight: normal;
  text-align: right;
  padding: 2px 4px;
}

dd {
  flex-basis: 70%;
  flex-grow: 1;
  margin: 0;
  padding: 2px 4px;
}

/* Give the main header an underline. */

h1 {
  padding-bottom: 21px;
  margin-bottom: 21px;
  border-bottom: 1px solid #ddd;
}

/* Add small subtitles. */

.subtitle {
  margin-top: -10.5px;
  color: #bbb;
}

/* Display definition lists in grid form. */

dl {
  display: grid;
  grid-template-columns: fit-content(25%) auto
}

dt {
  font-weight: normal;
  text-align: right;
  padding: 2px 4px;
}

dd {
  margin: 0;
  padding: 2px 4px;
}

Improve CSS for definition list grids
Improve CSS for definition list grids
