/* ================================
CF — H5P Question Set Styling
(scoped to .cf-h5p)
================================ */
/* Make the Question Set area breathe */
.cf-h5p .h5p-question-set {
background: transparent;
}
/* Question text bigger + friendlier */
.cf-h5p .h5p-question-set .h5p-question-title,
.cf-h5p .h5p-question-set .h5p-question {
font-size: clamp(20px, 2.2vw, 28px);
font-weight: 800;
line-height: 1.25;
margin-bottom: 12px;
}
/* Answer list spacing */
.cf-h5p .h5p-question-set .h5p-answers {
margin-top: 10px;
}
/* Multiple Choice answer “cards” */
.cf-h5p .h5p-question-set .h5p-answer,
.cf-h5p .h5p-question-set .h5p-alternative {
background: #fff;
border: 1px solid var(--cf-lines);
border-radius: 16px;
padding: 14px 14px;
margin: 10px 0;
box-shadow: 0 8px 22px rgba(0,0,0,.06);
transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
/* Hover */
.cf-h5p .h5p-question-set .h5p-answer:hover,
.cf-h5p .h5p-question-set .h5p-alternative:hover {
transform: translateY(-1px);
border-color: rgba(30,144,255,.35);
box-shadow: 0 12px 28px rgba(0,0,0,.08);
}
/* Selected state (common pattern) */
.cf-h5p .h5p-question-set .h5p-selected,
.cf-h5p .h5p-question-set .h5p-answer.h5p-selected,
.cf-h5p .h5p-question-set .h5p-alternative.h5p-selected {
border-color: rgba(30,144,255,.55) !important;
box-shadow: 0 0 0 3px rgba(30,144,255,.18) !important;
}
/* Improve readability inside answers */
.cf-h5p .h5p-question-set .h5p-answer *,
.cf-h5p .h5p-question-set .h5p-alternative * {
font-size: 18px;
}
/* Navigation row (Prev/Next/Check) spacing */
.cf-h5p .h5p-question-set .h5p-nav {
margin-top: 14px;
padding-top: 10px;
border-top: 1px solid var(--cf-lines);
}
/* Progress bar on-brand */
.cf-h5p .h5p-question-set .h5p-progressbar {
height: 10px;
border-radius: 999px;
overflow: hidden;
background: rgba(229,231,235,.9);
margin: 10px 0 14px;
}
.cf-h5p .h5p-question-set .h5p-progressbar .h5p-progressbar-progress {
background: linear-gradient(90deg, var(--cf-primary), var(--cf-secondary)) !important;
}
/* Score / results screen “card” */
.cf-h5p .h5p-question-set .h5p-results {
background: #fff;
border: 1px solid var(--cf-lines);
border-radius: 18px;
padding: 16px;
box-shadow: 0 10px 30px rgba(0,0,0,.06);
}
/* Make “Your score” big */
.cf-h5p .h5p-question-set .h5p-results .h5p-score,
.cf-h5p .h5p-question-set .h5p-results .h5p-summary {
font-size: 20px;
font-weight: 800;
}
/* Optional: hide “Retry” if you don’t want it (uncomment) */
/*
.cf-h5p .h5p-question-set .h5p-button.h5p-try-again {
display: none !important;
}
*/
Skip to content
