.css-toggle-block {
  width: 100%;
  position: relative;
  margin-bottom: 1px;
  overflow: hidden;
}

.css-toggle-block input {
  position: absolute;
  opacity: 0;
}

.css-toggle-block .css-toggle-question {
  position: relative;
  display: block;
  padding-left: 25px;
  cursor: pointer;
}

.css-toggle-block .css-tab-answer {
  max-height: 0;
  overflow: hidden;
}

.css-toggle-block input:checked ~ .css-tab-answer {
  max-height: inherit;
}

.css-toggle-block label::after {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  transition: all .35s;
}

.css-toggle-block input[type=checkbox] + label::after {
  content: "\25BC";
  transform: rotate(-90deg);
}

.css-toggle-block input[type=checkbox]:checked + label::after {
  transform: rotate(0deg);
}

.css-toggle-block .css-toggle-question {
  background: rgb(24, 22, 18);
  padding: 0.5em 1em;
  color: #fff;
}

.css-toggle-block .css-tab-answer {
  background: white;
  color: #5e5e5e;
}

.css-toggle-block .css-tab-answer .css-tab-content {
  padding: 1em;
}

.css-toggle-block input[type=checkbox] + label::after {
  content: "+";
}

.css-toggle-block input[type=checkbox]:checked + label::after {
  transform: rotate(315deg);
}

.css-toggle-block label::after {
  padding: 0.5em 1em;
  right: 0;
  left: inherit;
}
