/* Reconstructed quiz styles (original quizstyle.css was never archived by the Wayback Machine). */
#quiz-wrapper { max-width: 1000px; margin: 0 auto; padding: 30px 20px 40px; color: #fff; font-family: 'Open Sans', sans-serif; }
#quiz-wrapper #header-wrapper h1 { font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 34px; line-height: 1.2; color: #fff; text-align: center; margin: 0 0 24px; }
#quiz-content { position: relative; background: rgba(0, 0, 0, 0.55); border-top: 6px solid #009ed2; padding: 24px 28px 28px; }
#quiz-content:after { content: ""; display: block; clear: both; }

#questionNumberTopBar { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
#questionNumberCircle { width: 46px; height: 46px; border-radius: 50%; background: #009ed2; display: flex; align-items: center; justify-content: center; }
#questionNumberCircle span { font-family: 'Oswald', sans-serif; font-size: 22px; color: #fff; }
#questionNumberTopBar h3 { font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 24px; color: #fff; margin: 0; }

#scoreBox { position: absolute; top: 20px; right: 28px; width: 190px; display: grid; grid-template-columns: 1fr auto; row-gap: 2px; column-gap: 10px; background: rgba(255,255,255,0.08); padding: 10px 14px; font-size: 13px; }
#scoreBox h5 { grid-column: 1 / 2; grid-row: 1; margin: 0; font-size: 13px; font-weight: 600; color: #fff; text-transform: uppercase; }
#scorePercentage { grid-column: 2; grid-row: 1; font-family: 'Oswald', sans-serif; font-size: 20px; color: #fde21c; }
#labelCorrect { grid-column: 1; grid-row: 2; color: #8fd16f; }
#scoreCorrect { grid-column: 2; grid-row: 2; text-align: right; }
#labelIncorrect { grid-column: 1; grid-row: 3; color: #ff8a80; }
#scoreIncorrect { grid-column: 2; grid-row: 3; text-align: right; }

#predictionWrapper { position: relative; margin: 10px 230px 22px 0; padding: 18px 40px; background: rgba(255,255,255,0.95); color: #333; min-height: 90px; }
#predictionWrapper #quoteLeft, #predictionWrapper #quoteRight { position: absolute; font-family: Georgia, serif; font-size: 60px; line-height: 1; color: #009ed2; }
#predictionWrapper #quoteLeft { left: 10px; top: 6px; }
#predictionWrapper #quoteLeft:before { content: "\201C"; }
#predictionWrapper #quoteRight { right: 12px; bottom: -14px; }
#predictionWrapper #quoteRight:before { content: "\201D"; }
#predictionTitle_text { font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 22px; color: #0375bb; margin: 0 0 8px; }
#prediction_text { font-size: 15px; line-height: 1.6; margin: 0; }

#alertWrapper { margin-bottom: 18px; min-height: 52px; }
.alertBox { display: none; padding: 12px 16px; font-size: 15px; background: #353535; }
.alertBox strong { font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 20px; margin-right: 14px; }
#alertBoxStart { display: block; }
#alertBoxStart strong { color: #fde21c; }
#alertBoxCorrect { border-left: 6px solid #51ae31; }
#alertBoxCorrect strong { color: #8fd16f; }
#alertBoxIncorrect { border-left: 6px solid #d9443a; }
#alertBoxIncorrect strong { color: #ff8a80; }
.alertHear, .alertNext { display: inline-block; margin-left: 10px; padding: 4px 12px; background: #009ed2; color: #fff; cursor: pointer; font-size: 13px; text-transform: uppercase; }
.alertHear:hover, .alertNext:hover { background: #0375bb; }

#thoughtLeadersWrapper { display: flex; justify-content: center; gap: 40px; flex-wrap: wrap; }
.thoughtLeaderDetails { width: 224px; background: #f6f6f6; color: #333; cursor: pointer; border: 4px solid transparent; transition: border-color .2s, transform .2s; }
.thoughtLeaderDetails:hover { border-color: #009ed2; transform: translateY(-2px); }
.thoughtLeaderDetails img { display: block; width: 224px; height: 185px; object-fit: cover; background: #ddd; }
.thoughtLeaderDetailsBottom { padding: 10px 12px 12px; font-size: 12px; line-height: 1.5; }
.thoughtLeaderDetailsBottom span, .thoughtLeaderDetailsBottom a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.thoughtLeaderDetailsBottom span:first-child { font-size: 17px; color: #000; }
.thoughtLeaderDetailsBottom a { color: #0375bb; }
.thoughtLeaderDetailsBottom a { visibility: hidden; }
#quiz-content.answered .thoughtLeaderDetailsBottom a { visibility: visible; }
#quiz-content.answered .thoughtLeaderDetails { cursor: default; transform: none; }
#quiz-content.answered .isCorrect { border-color: #51ae31; }
#quiz-content.answered .isIncorrect.chosen { border-color: #d9443a; }
#quiz-content.answered .isIncorrect:not(.chosen) { opacity: .6; }

#nextQuestion { display: none; width: 220px; margin: 24px auto 0; padding: 10px 0; text-align: center; background: #fde21c; color: #333; font-family: 'Oswald', sans-serif; font-size: 22px; text-transform: uppercase; text-decoration: none; }
#nextQuestion:hover { background: #ffe94d; }
#likeTheQuiz { text-align: center; color: #fff; margin-top: 18px; }
#likeTheQuiz a { color: #00b7f3; }

@media (max-width: 760px) {
  #scoreBox { position: static; margin-bottom: 14px; }
  #predictionWrapper { margin-right: 0; }
}