.calibration-quizzes-holder {
	padding: 1em;
	margin-bottom: 3em;
	border: solid 1em #dfdfdf;
	border-radius: 1em;
}

.calibration-quizzes-holder .titlebar {
	margin-bottom: 0.7em;
	display: flex;
	justify-content: space-between;
}

.calibration-quizzes-holder .titlebar .title {
	font-size: 1.2em;
	font-weight: 700;
}

.calibration-quizzes-holder .titlebar .quiz-history-button {
	background-color: #334455;
	color: #ffffff;
	border-radius: 0.3em;
	padding: 0.3em;
	transition: background 0.2s;
}

.calibration-quizzes-holder .titlebar .quiz-history-button:hover {
	text-decoration: none;
	background-color: #556677;
}

.calibration-quizzes-holder .list {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-content: flex-start;
}

.calibration-quizzes-holder .list .calibration-quiz-button {
	display: block;
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: 32%;
	padding: 1em;
	box-sizing: border-box;
	text-align: center;
	background-color: #4e2d77;
	color: #ffffff;
	text-decoration: none;
	margin-bottom: 0.5em;
	border-radius: 0.5em;
	transition: background 0.2s;
}

.calibration-quizzes-holder .list .calibration-quiz-button.disabled {
	background-color: #999999;
	cursor: no-drop;
}

.calibration-quizzes-holder .list .calibration-quiz-button.completed {
	background-color: #008B36;
}

.calibration-quizzes-holder .list .calibration-quiz-button:not(.disabled):hover {
	background-color: #734aa6;
}

.calibration-quizzes-holder .list .calibration-quiz-button .title {
	display: block;
}

.calibration-quizzes-holder .list .calibration-quiz-button .expiration {
	display: block;
	margin-top: 0.3em;
	font-size: 0.8em;
	font-style: italic;
}

.calibration-quizzes-holder .list .calibration-quiz-spacer {
	display: block;
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: 32%;
	padding: 1em;
	box-sizing: border-box;
}

.quiz-shade {
	position: fixed;
	z-index: 999;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #000000;
	opacity: 0.9;
	display: none;
}

.quiz-inner-shade {
	position: absolute;
	z-index: 999;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #000000;
	opacity: 0.9;
	display: none;
}

.quiz-holder {
	position: fixed;
	z-index: 1000;
	background-color: #ffffff;
	border-radius: 1em;
	top: 49vh;
	left: 49vw;
	right: 49vw;
	bottom: 49vh;
	display: none;
}

.quiz-holder .quiz-close-button {
	position: absolute;
	display: block;
	width: 1.4em;
	height: 1.4em;
	background-color: #000000;
	border-radius: 50%;
	border: solid 0.2em #ffffff;
	top: -0.7em;
	right: -0.7em;
	z-index: 1001;
	transition: transform 0.2s;
}

.quiz-holder .quiz-close-button:before {
	content: '';
	position: absolute;
	height: 60%;
	width: 0.2em;
	background-color: #ffffff;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-45deg);
}

.quiz-holder .quiz-close-button:after {
	content: '';
	position: absolute;
	height: 60%;
	width: 0.2em;
	background-color: #ffffff;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
}

.quiz-holder .quiz-close-button.dormant {
	transform: scale(0);
}

.quiz-holder .quiz-close-button:not(.dormant):hover {
	transform: scale(1.4);
}

.quiz-holder .quiz-loading-holder {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ffffff;
	opacity: 0.5;
	z-index: 1000;
	border-radius: 1em;
	display: none;
}

.quiz-holder .quiz-loading-holder .quiz-loading {
	display: block;
	position: relative;
	width: 50vmin;
	height: 50vmin;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.quiz-holder .quiz-loading-holder .quiz-loading div {
	box-sizing: border-box;
	display: block;
	position: absolute;
	width: 50vmin;
	height: 50vmin;
	/*margin: 5vmin;*/
	border: 5vmin solid #212121;
	border-radius: 50%;
	animation: quiz-lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
	border-color: #212121 transparent transparent transparent;
}

.quiz-holder .quiz .image-answers .image-holder .image .quiz-image-loading-holder {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ffffff;
	opacity: 0.5;
	z-index: 50;
}

.quiz-holder .quiz .image-answers .image-holder .image .quiz-image-loading-holder .quiz-image-loading {
	display: block;
	position: absolute;
	width: 10em;
	height: 10em;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.quiz-holder .quiz .image-answers .image-holder .image .quiz-image-loading-holder .quiz-image-loading div {
	box-sizing: border-box;
	display: block;
	position: absolute;
	width: 10em;
	height: 10em;
	/*margin: 5vmin;*/
	border: 1em solid #212121;
	border-radius: 50%;
	animation: quiz-lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
	border-color: #212121 transparent transparent transparent;
}

.quiz-holder .quiz-loading-holder .quiz-loading div:nth-child(1),
.quiz-holder .quiz .image-answers .image-holder .image .quiz-image-loading-holder .quiz-image-loading div:nth-child(1) {
	animation-delay: -0.45s;
}

.quiz-holder .quiz-loading-holder .quiz-loading div:nth-child(2),
.quiz-holder .quiz .image-answers .image-holder .image .quiz-image-loading-holder .quiz-image-loading div:nth-child(2) {
	animation-delay: -0.3s;
}

.quiz-holder .quiz-loading-holder .quiz-loading div:nth-child(3),
.quiz-holder .quiz .image-answers .image-holder .image .quiz-image-loading-holder .quiz-image-loading div:nth-child(3) {
	animation-delay: -0.15s;
}

@keyframes quiz-lds-ring {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

.quiz-holder .quiz .image-answers .image-holder .image .quiz-image-loading-holder .quiz-image-loading-text {
	position: absolute;
	color: #212121;
	width: 5em;
	text-align: center;
	text-transform: uppercase;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.quiz-holder .quiz-force-refresh-holder {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 10000;
	display: none;
	transform: translate(-50%, -50%);
}

.quiz-holder .quiz-force-refresh-holder .quiz-force-refresh-button {
	display: inline-block;
	color: #2861E5;
	font-weight: 700;
	font-size: 2em;
	transition: transform 0.2s;
}

.quiz-holder .quiz-force-refresh-holder .quiz-force-refresh-button:hover {
	transform: scale(1.3);
	text-decoration: none;
}

.quiz-holder .quiz-progress-holder {
	position: absolute;
	bottom: 2em;
	right: 2em;
	z-index: 10;
	width: 16em;
	height: 1em;
	border-radius: 0.3em;
	border: solid 2px #2861E5;
	background-color: #ffffff;
	overflow: hidden;
	display: none;
}

.quiz-holder .quiz-progress-holder .quiz-progress {
	background-color: #2861E5;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0;
}

.quiz-holder .quiz {
	position: absolute;
	top: 2em;
	left: 2em;
	right: 2em;
	bottom: 2em;
	overflow: auto;
}

.quiz-holder .quiz .quiz-intro-image {
	margin-bottom: 1em;
	margin-left: auto;
	margin-right: auto;
	height: 6em;
	width: 22em;
	background-image: url('https://thehub.cdcaexams.org/images/logo-cdca-wreb-cita.png');
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.quiz-holder .quiz .quiz-intro-title {
	color: #4e2d77;
}

.quiz-holder .quiz .history-title {
	font-size: 2em;
	font-weight: 700;
	margin-bottom: 0.5em;
}

.quiz-holder .quiz .history-table {
	width: 100%;
	font-size: 1.2em;
	border-collapse: collapse;
}

.quiz-holder .quiz .history-table td {
	padding: 1em;
}

.quiz-holder .quiz .history-table td:not(.role) {
	text-align: center;
}

.quiz-holder .quiz .history-table .head td {
	color: #ffffff;
	background-color: #212121;
}

.quiz-holder .quiz .history-table tr:not(.head) {
	transition: background 0.2s;
}

.quiz-holder .quiz .history-table tr:not(.head):hover {
	background-color: #dfdfdf;
}

.quiz-holder .quiz .history-table tr:not(.head) .result {
	text-transform: uppercase;
	font-weight: 700;
}

.quiz-holder .quiz .history-table tr:not(.head) .result.pass {
	color: #00552E;
}

.quiz-holder .quiz .history-table tr:not(.head) .result.fail {
	color: #740001;
}

.quiz-holder .quiz .verbiage-holder {
	display: flex;
	width: 50%;
	justify-content: center;
	margin: 0 auto 2em;
}

.quiz-holder .quiz .verbiage-holder .verbiage {
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: auto;
}

.quiz-holder .quiz .quiz-start-button,
.quiz-holder .quiz .quiz-finish-close-button,
.quiz-holder .quiz .quiz-feedback-button {
	font-size: 2em;
	padding: 0.5em;
}

.quiz-holder .quiz .quiz-title {
	font-weight: bold;
	font-size: 0.9em;
	margin-bottom: 2em;
	color: #4e2d77;
}

.quiz-holder .quiz .quiz-title .branding {
	display: inline-block;
	margin-right: 1em;
	width: 12em;
	vertical-align: top;
}

.quiz-holder .quiz .quiz-title .branding:before {
	content: '';
	display: block;
	height: 2em;
	width: 12em;
	vertical-align: middle;
	background-image: url('https://thehub.cdcaexams.org/images/logo-cdca-wreb.png');
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	margin-bottom: 1em;
}

.quiz-holder .quiz .quiz-title .branding:after {
	content: '';
	display: block;
	height: 2em;
	width: 12em;
	vertical-align: middle;
	background-image: url('https://thehub.cdcaexams.org/images/logo-adex.png');
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}

.quiz-holder .quiz .question {
	font-size: 1.4em;
	text-align: left;
	margin-bottom: 1em;
	width: 60%;
	background-color: #dfdfdf;
	padding: 0.8em;
	border-radius: 0.5em;
	margin-left: auto;
	margin-right: auto;
}

.quiz-holder .quiz .image-question {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.quiz-holder .quiz .image-question .quiz-title {
	flex: 0;
}

.quiz-holder .quiz .image-question .image-answers {
	display: flex;
	justify-content: space-between;
	align-items: top;
	min-height: 30em;
	flex-grow: 1;
}

.quiz-holder .quiz .image-answers .image-holder {
	flex-basis: 48%;
	flex-grow: 0;
	flex-shrink: 0;
	position: relative;
	text-align: center;
}

.quiz-holder .quiz .image-answers .image-holder .hover-instruction {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	transform: translateY(-120%);
}

.quiz-holder .quiz .image-answers .image-holder .quiz-image-wrapper {
	display: inline-block;
	position: relative;
}

.quiz-holder .quiz .image-answers .image-holder .image {
	width: 100%;
	height: 100%;
}

.quiz-holder .quiz .image-answers .image-holder .image img {
	max-height: 100%;
	max-width: 100%;
	cursor: zoom-in;
	opacity: 0;
	transition: opacity 0.2s;
}

.quiz-holder .quiz .image-answers .image-holder .image img.loaded {
	opacity: 1;
}

.quiz-holder .quiz .image-answers .question-answers-holder {
	flex-basis: 48%;
	flex-shrink: 0;
	flex-grow: 0;
}

.quiz-holder .quiz .image-answers .question-answers-holder .question {
	width: auto !important;
}

.quiz-holder .quiz .image-answers .question-answers-holder .answers {
	display: flex;
	flex-direction: column;
	text-align: left;
	width: auto !important;
	max-width: none;
}

.quiz-holder .quiz .answers {
	text-align: center;
}

.quiz-holder .quiz .image-answers .question-answers-holder .answers .answer {
	flex-grow: 0;
	flex-shrink: 0;
	margin-bottom: 1em;
	font-size: 1.4em;
}

.quiz-holder .quiz .answers .answer {
	margin-bottom: 1em;
	font-size: 1.4em;
}

.quiz-holder .quiz .non-image-answers-holder {
	display: flex;
	justify-content: center;
	align-items: flex-start;
}

.quiz-holder .quiz .non-image-answers-holder .answers {
	max-width: 60%;
	flex-shrink: 1;
	flex-grow: 0;
}

.quiz-holder .quiz .answers {
	max-width: 40%;
	margin-left: auto;
	margin-right: auto;
}

.quiz-holder .quiz .answers.non-image .answer {
	text-align: left;
}

.quiz-holder .quiz .answers .answer .quiz-answer-button {
	text-decoration: none;
	color: #000000;
	transition: text-shadow 0.2s, font-size 0.2s;
}

.quiz-holder .quiz .answers .answer .quiz-answer-button:hover {
	text-shadow: 0 0 1em;
}

.quiz-holder .quiz .answers .answer .quiz-answer-button.selected {
	text-shadow: 0 0 3px;
	color: #00552E;
}

.quiz-holder .quiz .answer-submit-button-holder {
	text-align: center;
}

.quiz-holder .quiz .image-answers .question-answers-holder .answer-submit-button-holder {
	text-align: left;
}

.quiz-holder .quiz .answer-submit-button-holder .quiz-answer-submit-button,
.quiz-holder .quiz .quiz-advance-button,
.quiz-holder .quiz .quiz-finish-button {
	font-size: 2em;
	padding: 0.5em;
}

.quiz-holder .quiz .image-answers .correct,
.quiz-holder .quiz .image-answers .incorrect,
.quiz-holder .quiz .image-answers .correct-answer,
.quiz-holder .quiz .image-answers .explanation {
	text-align: left;
}

.quiz-holder .quiz .correct,
.quiz-holder .quiz .incorrect {
	text-align: center;
	font-weight: 700;
	font-size: 1.5em;
	margin-bottom: 1em;
}

.quiz-holder .quiz .correct {
	color: #00552E;
}

.quiz-holder .quiz .incorrect {
	color: #740001;
}

.quiz-holder .quiz .correct-answer,
.quiz-holder .quiz .explanation {
	margin-bottom: 1.5em;
	text-align: center;
}

.quiz-holder .quiz .explanation {
	padding: 1em;
	border-radius: 1em;
	background-color: #dfdfdf;
}

.quiz-holder .quiz .final-score {
	text-align: center;
	font-size: 2em;
	font-weight: 700;
	margin-bottom: 0.6em;
}

.quiz-holder .quiz .final-result {
	text-align: center;
	font-size: 2em;
	font-weight: 700;
	margin-bottom: 0.6em;
}

.quiz-holder .quiz .final-result.failure {
	color: #740001;
}

.quiz-holder .quiz .final-result.pass {
	color: #00552E;
}

.quiz-close-stopgap {
	background-color: #FF9193;
	padding: 1em;
	border-radius: 1em;
	position: absolute;
	z-index: 1000;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	display: none;
}

.quiz-close-stopgap .text {
	margin-bottom: 1em;
}

.quiz-feedback-holder {
	background-color: #ffffff;
	padding: 1em;
	border-radius: 1em;
	position: absolute;
	z-index: 1000;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: none;
	width: 30vw;
}

.quiz-feedback-holder .question {
	font-weight: 700;
}

.quiz-feedback-holder .quiz-question-feedback-input {
	width: 100%;
}

.quiz-feedback-holder .buttons {
	text-align: center;
}

.quiz-holder .quiz .feedback-row {
	display: flex;
	padding-bottom: 1em;
	margin-bottom: 1em;
	border-bottom: solid 1px #dfdfdf;
	justify-content: space-between;
}

.quiz-holder .quiz .feedback-row:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: 0;
}

.quiz-holder .quiz .feedback-row .image {
	flex-basis: 20em;
	flex-grow: 0;
	flex-shrink: 0;
	margin-left: 1em;
}

.quiz-holder .quiz .feedback-row .image img {
	max-width: 100%;
}

.quiz-holder .quiz-image-enlarge {
	display: none;
	position: absolute;
	width: 40vw;
	height: 40vw;
	top: 50%;
	right: 1em;
	transform: translateY(-50%);
	overflow: hidden;
	z-index: 20;
	box-shadow: 0 0 1em #212121;
	border-radius: 0.2em;
}

.quiz-image-viewport {
	position: absolute;
	background-color: #dfdfdf;
	opacity: 0.5;
	z-index: 1000000;
	cursor: zoom-in;
}

.quiz-holder .quiz .feedback-row .question-feedback {
	flex-basis: 50%;
	flex-shrink: 0;
}

.quiz-holder .quiz .feedback-row .question-feedback .question {
	font-weight: 700;
	font-size: 1em;
	text-align: left;
	margin: 0 !important;
	width: auto !important;
}

.quiz-holder .quiz .feedback-row .feedback {
	margin-top: 1em;
}

.quiz-holder .quiz .feedback-row .feedback-input {
	display: none;
}

.quiz-holder .quiz .feedback-row .feedback-buttons {
	flex-basis: 10em;
}
