.mtq_quiz_area div {
	max-width: none !important;
}
.mtq_css_letter_button {
	width: 40px;
	height: 40px;
	display: block;
	border-radius: 40px;
	font-size: 30px;
	line-height: 40px;
	text-decoration: none;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}
.mtqscrollable {
	position: relative;
	overflow: hidden;
}
.mtqscrollable .items { 
	/* this cannot be too large */
	width: 20000em;
	position: absolute;
	clear: both;
}
.items div {
	float: left;
}

/* active item */
.mtqscrollable .active {
	position: relative;
	cursor: default;
}
.mtq_quiz_area table {
	border: none;
}
.mtq_quiz_area th, .mtq_quiz_area td, .mtq_quiz_area tr td {
	border: none;
	padding: 0;
	vertical-align: middle;
}
.mtq_css_button {
	display: block;
	cursor: pointer;
	font-weight: 600;
	font-size: 125%;
	text-align: center;
	width: 8em;
	margin-left: auto;
	margin-right: auto;
	-o-border-radius: 2em;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	padding: .5em;
}
.mtq_css_button:hover {
	cursor: pointer;
}
.mtq_results_button {
	width: 8em;
}

.mtq_list_item {
    border: 1px solid #ddd;                  /* Unified border color */
    border-radius: 10px;                     /* Kept rounded corners */
    transition: box-shadow 0.3s ease-in-out, all 0.2s ease; /* Combined transitions */
    aspect-ratio: 1;                        /* Maintained square ratio */
    display: flex;                         
    align-items: center;
    justify-content: center;
    font-size: 16px;                        /* Adjusted font size for clarity */
    font-weight: 500;
    background: #fff;
    cursor: pointer;
    padding: 10px;
    text-align: center;
}
.mtq_show_list {
/*width:3.5em;*/
}
.mtq_list_item-wrong, .mtq_list_item.mtq_list_item_complete.mtq_list_item-wrong {
	background:#B5281E!important;
	color: #FFF
}
.mtq_list_item-correct, .mtq_list_item.mtq_list_item_complete.mtq_list_item-correct {
	background: #063!important;
	color: #FFF;
}
.mtq_list_item-partial,.mtq_list_item.mtq_list_item_complete.mtq_list_item-partial {
	background: #09F!important;
	color: #FFF;
}

.mtq_return_list {
	margin-top: 1em;
	margin-bottom: 1em;
}

.mtq_question_list_container {
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* 5 columns for 15 items per page */
    gap: 8px;
    max-width: 600px;
    margin: 0 auto 20px;
    padding: 10px;
    background: #fff;
    border-radius: 4px;
}

.mtq_question_text {
	padding-right: 2em;
	width: 90%;
}

.mtq_shaded_item_msg {
	display: block;
	width: 25em;
	text-align: center;
	font-weight: 600;
	border: thin solid;
	-o-border-radius: 2em;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	margin: .5em auto;
    margin-bottom: 15px;
}
.mtq_quiz_status {
	/*scroll display:none;*/
	text-align: center;
}

.mtq_quiz_area {
    max-width: none !important;
    position: relative;
    text-align: left;
}

.mtq_hint {
	display: none;
	margin-left: 3em;
	margin-top: 1em;
	border: thin solid;
	-o-border-radius: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	padding: .5em;
	width: 70% !important;
	float: right !important;
}
.mtq_hint_label {
	font-size: 125%;
}
.mtq_answer_text {
	float: left;
	display: block;
}
.mtq_instructions {
	display: none;
	margin-bottom: 1em;
}
.mtq_javawarning {
	text-align: center;
	font-weight: 600;
}
.mtq_quiztitle {
	text-align: center;
	display: block;
}
.mtq_results_request {
	display: block;
	text-align: center;
	margin-top: .5em;
}
.mtq_question_heading_table {
	width: 100% !important;
	border-collapse: collapse;
	margin: .5em 0;
	padding: 0 0 .1em !important;
}
.mtq_answer_table {
	width: 85% !important;
	padding-right: 1em;
	margin-top: 1em;
	text-align: left;
	border-collapse: collapse;
	cursor: auto;
}
.mtq_answer_table td {
	padding-top: .5em !important;
	padding-bottom: .5em !important;
}
.mtq_oce_first {
	border-right: 1em solid transparent;
	border-left: 1em solid transparent;
	vertical-align: middle;
	text-align: center;
}
.mtq_answer_td {
	margin-left: .25em;
}
.mtq_letter_button_td {
	width: 30px;
}

.mtq_explanation-label {
	display: block;
	padding-bottom: .25em;
	font-weight: 600;
}
.mtq_action_button {
	display: block;
	margin-top: .5em;
	margin-bottom: .5em;
	font-size: 200%;
}

.mtq_quiz_results_bubble {
	display: none;
	-o-border-radius: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	margin-top: 1em;
	margin-bottom: 1em;
	border: none;
	padding: .5em;
}
.mtq_quiz_results_highlight {
	margin-top: 1em;
	font-size: 75%;
	font-weight: 600;
	text-align: center;
}

.mtq_partial_stamp {
	color: #FFF;
	background: #09F;
	border-color: #09F;
	border: thin solid;
}
.mtq_question_label {
	font-weight: 600;
	float: left;
}
.mtq_stamp {
	float: left;
	margin-left: .5em;
	margin-bottom: .25em;
	text-align: center;
	padding-left: .5em;
	padding-right: .5em;
	-o-border-radius: 2em;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	font-weight: 600;
	text-transform: uppercase;
}
.mtq_correct_marker {
	display: block;
	width: 40px;
	height: 40px;
	background: url(images/correct.png) no-repeat 0 0;
}
.mtq_wrong_marker {
	display: block;
	width: 40px;
	height: 40px;
	background: url(images/wrong.png) no-repeat 0 0;
}

#content .mtq, #content .mtq_auto, #content .mtq_quiz_name, #content .mtq_score, #content .mtq_total, #content .mtq_percentage, #content .mtq_wrong_answers, #content .mtq_time_allowed, #content .mtq_time_used, #container .mtq, #container .mtq_auto, #container .mtq_quiz_name, #container .mtq_score, #container .mtq_total, #container .mtq_percentage, #container .mtq_wrong_answers, #container .mtq_time_allowed, #container .mtq_time_used, .mtq_auto {
	display: none;
}
.mtq_thanks {
	display: block;
	width: 80px;
	height: 80px;
	float: left;
	background: url(images/thanks.png) no-repeat 0 0px;
}
.mtq_cone {
	display: block;
	width: 64px;
	height: 64px;
	float: left;
	background: url(images/cone.png) no-repeat 0 0px;
}
.mtq_setup {
	display: block;
	width: 64px;
	height: 64px;
	float: left;
	background: url(images/setup.png) no-repeat 0 0px;
}
.mtq_timer_icon {
	display: block;
	width: 32px;
	height: 32px;
	float: left;
	background: url(images/timer.png) no-repeat 0 0px;
}
.mtq_email {
	display: block;
	width: 32px;
	height: 32px;
	float: left;
	background: url(images/email.png) no-repeat 0 0px;
}
.mtq_premium_feature {
	border: thin solid;
	border-color: #03C !important;
}
.mtq_timer {
    text-align: right;
    font-weight: 700;  /* Made slightly bolder than 600 */
    font-size: 140%;   /* Increased from 125% */
    color: #B5281E;    /* Kept the red color as it's good for timers */
    background: #fff8f8; /* Light red tinted background */
    padding: 10px 15px; /* Added padding for better spacing */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 2px 4px rgba(181, 40, 30, 0.1); /* Subtle shadow */
    border: 2px solid #ffeded; /* Light border */
    display: inline-block; /* Makes the background only wrap the content */
    margin: 10px 0; /* Added some vertical spacing */
}

.mtq_failed_button {
	cursor: pointer;
	font-weight: 600;
	font-size: 125%;
	color: #B5281E;
	background: #fff;
	border: thin solid;
	border-color: #B5281E;
	text-align: center;
	width: 75%;
	margin-left: auto;
	margin-right: auto;
	border: thin solid;
	-o-border-radius: 2em;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	border-color: #B5281E;
	padding: .5em;
}
.mtq_clickable {
	cursor: pointer;
}
/* Non themed, but colored Items */
.mtq_explanation {
	display: none;
	margin-left: 3em;
	width: 80%;
	margin-top: 1em;
	margin-bottom: 3em;
	border: thin solid;
	-o-border-radius: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	padding: .5em;
	background: #ADE0C1;
	color: #030;
	border-color: #030;
}

.mtq_wrong_stamp {
	color: #FFF;
	background: #B5281E;
	border-color: #B5281E;
    border: thin solid;

}
.mtq_correct_stamp {
	color: #FFF;
	background: #063;
	border-color: #063;
	border: thin solid;

}

.mtq_selected_row {
	background: #CCC;
	color: #000;
	font-weight: 600;

}
.mtq_css_letter_selected {
	color: #fff !important;
	background: #333 !important;
}
.mtq_css_letter_selected:hover {
	background: #666 !important;
}

/* Initially hide navigation and shaded items message */
.mtq_navigator {
    display: none;  /* Changed from position: relative */
}

.mtq_shaded_item_msg {
    display: none;
}

.mtq_navigator {
    position: relative;
    margin-bottom: 20px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 15px;
}

/* Make the return buttons unnecessary since we keep both panels visible */
#mtq_return_list_t-1, #mtq_return_list_b-1 {
    display: none;
}



/* Add these styles */

.mtq_question_container {
    clear: both;
    position: relative;
    z-index: 1;
}


.mtq_correct_marker, .mtq_wrong_marker {
    display: none;  /* Hidden by default */
}

/* Only show markers when question is answered or quiz is finished */
.mtq_question.answered .mtq_correct_marker,
.mtq_question.answered .mtq_wrong_marker,
.mtq_quiz_finished .mtq_correct_marker,
.mtq_quiz_finished .mtq_wrong_marker {
    display: block;
}

.mtq_pagination_info {
    text-align: center;
    margin: 10px 0;
    font-size: 14px;
    color: #666;
    min-width: 100px;
}

.mtq_page_button {
    padding: 8px 16px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    font-size: 14px;
    color: #333;
    cursor: pointer;
    transition: all 0.2s ease;
}

.mtq_page_button:not(.mtq_page_button_disabled):hover {
    background: #f5f5f5;
    border-color: #666;
}

.mtq_page_button_disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.mtq_current_page {
    background: #e6e6e6;
    border-color: #999;
}

.mtq_list_item:hover {
    background: #f5f5f5;
    border-color: #666;
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
}

.mtq_pagination_controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin: 16px 0;
}

.mtq_page_button:not(.mtq_page_button_disabled):hover {
    background: #f5f5f5;
    border-color: #666;
}


/* Status indicators */
.mtq_list_item_complete {
    color: #fff;
    font-weight: 500;
}

.mtq_list_item-correct {
    background: #059669;
    border-color: #047857;
}

.mtq_list_item-wrong {
    background: #dc2626;
    border-color: #b91c1c;
}

.mtq_list_item-partial {
    background: #2563eb;
    border-color: #1d4ed8;
}

.mtq_question_nav_container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 16px 0;
    flex-wrap: wrap;
}

.mtq_nav_button {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    font-size: 14px;
    color: #333;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 40px;
    text-align: center;
}

.mtq_nav_button:hover:not(.mtq_nav_button_active) {
    background: #f5f5f5;
    border-color: #666;
}

.mtq_nav_button_active {
    background: #2563eb;
    color: #fff;
    border-color: #1d4ed8;
}

/* Remove the old pagination styles */
.mtq_pagination_controls,
.mtq_pagination_info,
.mtq_page_button {
    display: none;
}

.mtq_nav_button.mtq_end_button {
    background: #2563eb;
    color: #fff;
    border-color: #1d4ed8;
    margin-left: 8px;
}

.mtq_nav_button.mtq_end_button:hover {
    background: #1d4ed8;
}

.mtq_nav_button_correct {
    background: #059669 !important;
    border-color: #047857 !important;
    color: #fff !important;
}

.mtq_nav_button_wrong {
    background: #dc2626 !important;
    border-color: #b91c1c !important;
    color: #fff !important;
}

.mtq_nav_button_partial {
    background: #2563eb !important;
    border-color: #1d4ed8 !important;
    color: #fff !important;
}

.mtq_nav_button_correct:hover,
.mtq_nav_button_wrong:hover,
.mtq_nav_button_partial:hover {
    opacity: 0.9;
}