body {
  font-family: 'Times New Roman', Times;
  text-align: center;
}

div {
  text-align: center;
}

h1 {
  text-align: center;
}

h2 {
  margin-top: 2em;
  margin-bottom: 1em;
}

.active,
.collapsible {
  background-color: white;
  color: darkblue;
  cursor: pointer;
  padding: 0;
  width: 100%;
  border: none;
  text-align: center;
  outline: none;
  font-size: 1.5rem;
}

.collapsible:hover {
  background-color: white;
  text-decoration: underline;
}

.content {
  padding: 0;
  display: none;
  overflow: hidden;
  background-color: white;
}

button {
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  text-align: center;
  align-items: center;
  margin: .1em;
  padding: 0;
  width: 3em;
  height: 3em;
  font-size: 3.5em;
  border-width: .025em;
  border-style: solid;
  border-color: silver;
  font-weight: bold;
  background-color: white;
}

.pastWord {
  color: gray;
}

.letterName {
  font-size: .3em;
}

button.cons:hover {
  background-color: orange;
  color: white;
}


button.vols {
  color: red;
}

button.vols:hover {
  background-color:lightgoldenrodyellow;
}