/* Quiz Making: basisregels voor het quizscherm, onafhankelijk van het thema.
   Vroeger kwamen deze uit het oude thema (oefentheorieexamens/style.css); zonder die regels
   tekende een ander thema (zoals GeneratePress) bijvoorbeeld de radioknoppen als grote cirkels.
   Wordt na het thema geladen. :where() houdt de specificiteit laag, zodat style.css en
   quiz-thema.css van de plugin altijd winnen. */

/* ---------- Reset van themaregels (marges op lijsten, alinea's en koppen; grijze knoppen) ---------- */
:where(#home_quiz_section) ul,
:where(#home_quiz_section) ol { margin: 0; padding: 0; }
:where(#home_quiz_section) p,
:where(#home_quiz_section) li,
:where(#home_quiz_section) figure { margin: 0; }
:where(#home_quiz_section) h1, :where(#home_quiz_section) h2, :where(#home_quiz_section) h3,
:where(#home_quiz_section) h4, :where(#home_quiz_section) h5, :where(#home_quiz_section) h6 { margin: 0; text-transform: none; }
:where(#home_quiz_section) img { max-width: 100%; height: auto; vertical-align: middle; border-style: none; }
:where(#home_quiz_section) a { text-decoration: none; cursor: pointer; }
:where(#home_quiz_section) button,
:where(#home_quiz_section) input[type="button"],
:where(#home_quiz_section) input[type="submit"] {
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	border: 1px solid transparent;
	cursor: pointer;
}
/* Basisgrootte van het oude thema (20px); de plugin rekent met em en inherit vanaf dit getal. */
:where(#home_quiz_section) { font-size: 20px; }
:where(#home_quiz_section) .container {
	width: 100%;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 15px;
}

/* ---------- Keuzerondjes: geen browserrondje, de knop zelf is het antwoord ---------- */
:where(#home_quiz_section) input[type="radio"],
:where(#home_quiz_section) input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	position: relative;
	box-sizing: border-box;
	padding: 0;
	width: 25px;
	height: 25px;
	margin: 0;
	border: 2px solid #c8cfe0;
	background: #fff;
}
:where(#home_quiz_section) input[type="radio"] { border-radius: 50%; }
:where(#home_quiz_section) input[type="radio"]::after { display: none; }
/* Antwoorden in een lijst: het rondje valt onzichtbaar over de hele knop (klikvlak). */
:where(#home_quiz_section) .list_box_menu input[type="radio"] { display: none; }

/* ---------- Opbouw van de vraagschermen ---------- */
:where(#home_quiz_section) .timmer_header { display: none; }
:where(#home_quiz_section) .timmer_content { color: #fff; }
:where(#home_quiz_section) .timmer_content .inner_one_page_bt ul li span { background-color: #fff; opacity: 1; }
:where(#home_quiz_section) .timmer_footer { clear: both; padding-top: 6px; }
:where(#home_quiz_section) .question_content { margin-top: 0; }
:where(#home_quiz_section) div.counter_cat { padding-top: 13px; text-align: right; }
:where(#home_quiz_section) .left_q_box { color: #fff; }
:where(#home_quiz_section) .left_q_box img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	margin-top: 15px;
}
:where(#home_quiz_section) .left_q_box.image_option_box .question-images img { margin-top: 0; }
:where(#home_quiz_section) .button_section {
	display: block;
	position: relative;
	top: 15px;
	min-height: 80px;
}
:where(#home_quiz_section) .button_section button.next { position: absolute; top: 0; right: 0; }
:where(#home_quiz_section) .button_section button.prev { position: absolute; top: 0; left: 0; }

@media (max-width: 989px) {
	:where(#home_quiz_section) .left_q_box.imageAnswerContainer { width: 100%; }
	:where(#home_quiz_section) .left_q_box.imageAnswerContainer + .right_q_box {
		width: 100%;
		min-height: 100px;
		padding-left: 0;
		padding-top: 30px;
	}
}
@media (max-width: 767px) {
	:where(#home_quiz_section) .list_box_menu { padding-left: 0; }
	:where(#home_quiz_section) .left_q_box { font-size: 15px; }
	:where(#home_quiz_section) button.next_slide { margin-top: 10px; }
}
@media (max-width: 575px) {
	:where(#home_quiz_section) .left_q_box { text-align: center; font-weight: 600; font-size: 20px; }
	:where(#home_quiz_section) .left_q_box img { max-width: 100%; height: auto; }
	:where(#home_quiz_section) .right_q_box { padding-top: 25px; }
}
