@import url('quiz.css');
/* Waar of niet waar?: the quizzes' look (quiz.css) with the two choices as two big
   buttons side by side, no letters; the statement reads as a sentence. */
.sp-board--waar-of-niet-waar .qz { --qz-q: 23px; --qz-q-phone: 20px; }
.sp-board--waar-of-niet-waar .qz-question { line-height: 1.45; }
.sp-board--waar-of-niet-waar .qz-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sp-board--waar-of-niet-waar .qz-choice { justify-content: center; gap: 10px; min-height: 76px; padding: 12px; font-size: calc(22px * var(--qz-scale)); font-weight: 700; text-align: center; }
.sp-board--waar-of-niet-waar .qz-choice__letter { display: none; }
.sp-board--waar-of-niet-waar .qz-choice { position: relative; }
.sp-board--waar-of-niet-waar .qz-choice__text { flex: 0 1 auto; white-space: nowrap; }
/* The mark sits in the corner, so "Niet waar" stays on one line on a narrow phone. */
.sp-board--waar-of-niet-waar .qz-choice__mark { position: absolute; top: 4px; right: 8px; font-size: 20px; }
.sp-board--waar-of-niet-waar .qz-choice[data-choice="0"]:not([aria-disabled]) { border-color: #9cc7ad; }
.sp-board--waar-of-niet-waar .qz-choice[data-choice="1"]:not([aria-disabled]) { border-color: #e2b4b2; }
@media (max-width: 760px) {
  .sp-board--waar-of-niet-waar .qz-choice { min-height: 68px; font-size: calc(20px * var(--qz-scale)); }
}