ul.faq,
ul.faq li {
  margin: 0;
  padding: 0;
  list-style: none;
  color: #000;
  background-color: #fff;
}

ul.faq button {
  margin: 0;
  margin-top: 16px;
  padding: 4px 8px;
  font-weight: bold;
  font-size: 110%;
  border: none;
  background-color: transparent;
  border-radius: 5px;
  color: #000;
}

ul.faq div.desc {
  margin: 0;
  margin-top: 0.25em;
  margin-left: 1em;
  padding: 0.5em;
  font-size: 110%;
  display: none;
  background-color: #fed;
}

ul.faq button:hover,
ul.faq button:focus {
  padding: 2px 6px;
  background-color: #def;
  border: 2px solid #005a9c;
  cursor: pointer;
}

ul.faq button[aria-expanded="false"]::before {
  content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' style='forced-color-adjust: auto;'%3E%3Cpolygon points='1 1, 1 11, 8 6' fill='currentcolor' stroke= 'currentcolor' /%3E%3C/svg%3E%0A");
  position: relative;
  left: -2px;
}

ul.faq button[aria-expanded="true"]::before {
  content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' style='forced-color-adjust: auto;'%3E%3Cpolygon points='1 1, 11 1, 6 8' fill='currentcolor' stroke= 'currentcolor' /%3E%3C/svg%3E ");
  position: relative;
  left: -4px;
  top: 2px;
}