.true {cursor: pointer; margin-left: 30px;}

.trueactive {color: #6aa84f; font-weight: bold;}

.trueactive::after {content: url("/assets/images/true.png");}

.false {cursor: pointer; margin-left: 30px;}

.falseactive {font-weight: bold;}

.falseactive::after {content: url("/assets/images/false.png");}

.twinkle {}

.twinkle::after {content: url("/assets/images/close-eye.png");}

.twinkleactive {}

.twinkleactive::after {content: url("/assets/images/open-eye.png");}

summary {
  font-weight: bold;
  cursor: pointer;
  list-style-type: none; /* Firefox */
}

summary::-webkit-details-marker {
  font-weight: bold;
  cursor: pointer;
  display: none; /* Chrome */
}

.collapsible {
  cursor: pointer;
  padding: 5px;
  width: 100%;
  text-align: center;
}

.collapsible:hover {
  font-weight: bold;
}

.active {
  font-weight: bold;
  text-decoration: underline;
}

.content {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  padding: 5px;
}

.Answer {visibility: hidden;}

.Answer:before {visibility: visible; cursor: pointer; font-weight: bold; content: " Answer ";}

.ShowAnswer {visibility: visible;}