body.claro {
	margin: 0;
	padding: 0;
  }
  
  body,
  td,
  th,
  tf,
  input,
  select,
  textarea {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  }
  
  @media print {
	.no-print,
	.no-print * {
	  display: none !important;
	}
  }
  
  .displayNone {
	display: none;
  }
  .invisible {
	visibility: hidden;
  }
  
  .main_txt {
	font-size: 12px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
  }
  .h1 {
	font-size: 13px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
  }
  
  .white_txt {
	font-size: 12px;
	/*font-weight: bold;*/
	color: #ffffff;
	text-decoration: none;
  }
  .gray_txt {
	font-size: 12px;
	font-weight: normal;
	color: #474747;
	text-decoration: none;
  }
  
  .exam_txt {
	font-size: 14px;
	font-weight: normal;
	color: #474747;
	text-decoration: none;
  }
  
  .exam_q_txt {
	font-size: 16px;
	font-weight: normal;
	color: #474747;
	text-decoration: none;
  }
  
  .blue_txt,
  a.blue_txt {
	font-size: 12px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
  }
  .left_bg {
	background-color: #546aa0;
	vertical-align: top;
	text-align: left;
	height: 100vh;
  }
  .header_row {
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
	height: 30px;
	/* background-image: url(../images/bg39.gif); */
  }
  .textbox {
	font-size: 11px;
	color: #222222;
	text-decoration: none;
	border: 1px solid #a0a0a0;
	background-color: #ffffff;
  }
  
  .buttons {
	font-size: 11px;
	color: #313031;
	text-decoration: none;
	background-color: #f7f7f7;
	border: 1px solid #313031;
  }
  .msg {
	font-size: 11px;
	color: #dc4300;
	text-decoration: none;
  }
  .blue_links {
	font-size: 11px;
	font-weight: normal;
	color: #1e518f;
	text-decoration: underline;
  }
  .admin_heading {
	font: normal normal 18pt Georgia;
	color: #14324b;
	text-decoration: none;
  }
  .redtxt {
	font-size: 11px;
	font-weight: bold;
	color: #b21800;
  }
  .evenRow {
	background-color: #ffffff;
  }
  .oddRow {
	background-color: #eff2fa;
  }
  .sumRow {
	background-color: #ffff99;
  }
  
  .alertRow {
	background-color: #f8bbbb;
  }
  .totalRow {
	background-color: #66ff66;
  }
  .tblBg {
	font-size: 11px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
	background-color: #adb9cf;
  }
  .mainBoxBg {
	background-color: #ffffff;
  }
  .date-container {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
  }
  
  .date-input {
	flex: 1;
  }
  
  .date-and {
	margin-left: 10px;
	margin-right: 10px;
	white-space: nowrap;
  }
  #loading {
	background-color: transparent !important;
	position: absolute;
	left: 0;
	top: 0;
  }
  
  .quizAnswerIcon {
	background-image: url("/images/radial_button.png");
	background-repeat: no-repeat;
	text-decoration: none;
	height: 13px;
	width: 17px;
	display: block;
	float: left;
	cursor: pointer;
  }
  
  .quizAnswerIconCorrect {
	background-position: -34px;
  }
  
  .quizAnswerIconInCorrect {
	background-position: -51px;
  }
  
  .fl {
	display: block;
	float: left;
  }
  .fr {
	display: block;
	float: right;
  }
  .clear,
  .cb {
	clear: both;
  }
  
  .hidden {
	display: none !important;
  }
  
  /* These pair of nested elements will center-align elements, not just text.
  <div class=centering> 
	  <div class=centered> 
		  (some inner blocks) 
	  </div>
  </div>
  */
  
  .centering {
	clear: both;
	float: left;
	left: 50%;
	position: relative;
  }
  
  .centered {
	float: left;
	left: -50%;
	position: relative;
  }
  
  .centering + * {
	clear: both;
  }
  
  .half {
	width: 50%;
  }
  
  .quarter {
	width: 25%;
  }
  
  .three-quarter {
	width: 75%;
  }
  
  .third {
	width: 33.33%;
  }
  
  .two-third {
	width: 66.66%;
  }
  
  /*
  body {overflow-x:hidden; }
  
  <!--[if IE 7]>
	  body {overflow-x:auto; }
  <![endif]-->
  */
  
  /*--- section header -------------------------------------------------------*/
  .section_header_outer {
	width: 100%;
	border: 1px solid #ffffff;
	border-bottom: 0;
	height: 42px;
	line-height: 38px;
	vertical-align: middle;
	background: url("/images/bg3.gif") repeat-x;
	margin-left: 275px;
  }
  .section_header_large {
	padding-left: 10px;
	display: inline-block;
	font-size: 13px;
	font-weight: bold;
  }
  .section_header_small {
	display: inline-block;
	font-size: 11px;
	color: #474747;
  }
  
  /* --- NOTIFIER ------------------------------------------------------------ */
  
  #datalynk_notifier {
	position: fixed;
	top: 0px;
	left: 35%;
	margin: auto;
	width: 30%;
	font-size: 12px;
	z-index: 999999;
  }
  
  .notifier_node {
	padding: 5px 10px 5px 10px;
	border-radius: 10px;
	border-top-radius: 0;
	border-width: 2px;
	border-style: solid;
	border-top: 0;
	opacity: 0.94;
	filter: alpha(opacity=94);
  }
  .notifier_node:hover {
	opacity: 1;
	filter: alpha(opacity=100);
  }
  .notifier_icon,
  .notifier_close {
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	background-size: 16px 16px;
  }
  .notifier_close {
	background-image: url(/images/icon_close_inline_16x16.png);
	float: right;
	cursor: pointer;
  }
  .notifier_icon {
	float: left;
  }
  .notifier_message {
	margin: 0 21px 0 21px;
	line-height: 16px;
	text-align: center;
  }
  .notifier_message .a {
	text-decoration: underline;
	cursor: pointer;
  }
  #navigation_header [icon] {
	margin: 5px 5px 2px 0;
  }
  #navigation_header [icon]:last-child {
	margin-right: 0px;
  }
  
  /* confirm */
  .notifier_type_confirm {
	background-color: #e6fdd3;
	border-color: #88c259;
  }
  .notifier_type_confirm .notifier_icon {
	background-image: url(/images/icon_checkmark_16x16.png);
  }
  .notifier_type_confirm .notifier_message {
	color: #326c03;
  }
  
  /* alert */
  .notifier_type_alert {
	background-color: #fafad2;
	border-color: #b9b60e;
  }
  .notifier_type_alert .notifier_message {
	color: #6f6f6f;
  }
  .notifier_type_alert .notifier_icon {
	background-image: url(/images/icon_general_alert_16x16.png);
  }
  
  /* critical */
  .notifier_type_critical {
	background-color: #fbeded;
	border-color: #9a0000;
  }
  .notifier_type_critical .notifier_message {
	color: #9a0000;
  }
  .notifier_type_critical .notifier_icon {
	background-image: url(/images/icon_warning_16x16.png);
  }
  
  .section_header {
	/* border: 1px solid #cbd5dc; */
	height: 57px;
	width: 100%;
	color: #335a76;
	background-image: url("/images/fixed_header_shadow.png");
	background-position: bottom;
	background-repeat: repeat-x;
  }
  
  .section_header_body {
	height: 41px;
	border-bottom: 1px solid #98acba;
  }
  
  .section_header_button {
	height: 41px;
	display: inline-block;
	cursor: pointer;
	text-decoration: none;
	outline: none;
	float: left;
	margin-right: 1px;
  }
  .unity_toolbar_button {
	background-image: url("/images/unity/background_navigation_button.png");
	background-repeat: repeat-x;
  }
  .section_header_button [icon] {
	margin-left: 10px;
  }
  .unity_toolbar_button:hover,
  .section_header_button_active {
	background-image: url("/images/unity/background_navigation_button_highlighted.png") !important;
  }
  
  .section_divider {
	position: relative;
	width: 1px;
	height: 41px;
	background-color: #cbd5dc;
	float: left;
  }
  
  .section_header_button:visited {
	color: #335a76;
  }
  
  .section_header_my_reports {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -168px 0px;
	width: 24px;
	height: 24px;
	display: inline-block;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
	float: left;
  }
  
  .section_header_courses {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -48px 0px;
	width: 24px;
	height: 24px;
	float: left;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
  }
  
  .section_header_communications {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -24px 0px;
	width: 24px;
	height: 24px;
	display: inline-block;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
	float: left;
  }
  
  .section_header_events {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -72px 0px;
	width: 24px;
	height: 24px;
	display: inline-block;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
	float: left;
  }
  
  .section_header_labels {
	padding-right: 10px;
	line-height: 3;
	font-size: 13px;
	color: #335a76;
  }
  
  .section_header_button_active {
	background-color: #f7e38e;
  }
  
  .course_heading {
	white-space: nowrap;
  }
  
  /* hides FROM/TO columns in messages grid depending on filter choice */
  [data-filter-on="sent"] .dgrid-column-from,
  [data-filter-on="received"] .dgrid-column-to {
	display: none;
  }
  .forDifferentUser .dgrid-column-from,
  .forDifferentUser .dgrid-column-to {
	display: table-cell;
  }
  
  /* ===== Exam page cleanups ===== */
  
  /* Question block + title spacing */
  .exam_q_txt {
	padding: 8px 0 2px;
  }
  .exam_q_txt strong {
	display: block;
	font-weight: 700;
	margin: 8px 0 6px;
  }
  
  /* Question images should scale and have breathing room */
  .exam_q_txt img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 8px 0 10px;
  }
  
  /* Container around each question’s options */
  .at-question {
	margin: 6px 0 14px;
  }
  
  /* Keep the options table full-width and add vertical gap between rows */
  .at-question table {
	width: 100% !important;
	border-collapse: separate;
	border-spacing: 0 8px; /* vertical spacing per option row */
	table-layout: auto;
  }
  
  
  /* Narrow, fixed column for number + radio */
  .at-question td.gray_txt {
	width: 40px !important; /* overrides legacy width="5%" */
	white-space: nowrap;
  }
  
  /* Let the answer cell take remaining width */
  .at-question td.exam_txt {
	width: auto !important; /* overrides legacy width="95%" */
  }
  
  /* Make the whole label look like a tappable block */
  .exam_txt label {
	display: block;
	line-height: 1.35;
	padding: 8px 10px;
	border: 1px solid #ddd;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	word-break: break-word;
  }
  .exam_txt label:hover {
	background: #f7faff;
  }
  
  /* Nudge radios down a hair for better alignment with label text */
  .at-question input[type="radio"] {
	margin-top: 3px;
  }
  /* --- Question title line --- */
  .qtitle {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 8px 0 6px;
	font-weight: 700;
  }
  .qno {
	white-space: nowrap;
  }
  .qtext {
	display: inline;
  }
  
  /* Fallback if you DO keep <p> in DB questions */
  .exam_q_txt p {
	display: inline;
	margin: 0;
  }
  
  /* number + radio column */
  .at-question td.gray_txt {
	width: 56px !important; /* consistent column width */
	text-align: right;
	white-space: nowrap;
	padding-right: 8px;
  }
  .at-question td.gray_txt strong {
	display: inline-block;
	width: 26px; /* space for “10)” too */
	text-align: right;
	font-weight: 600;
	color: #6b7280; /* subtle gray */
	margin-right: 6px;
  }
  
  /* radio appearance + spacing */
  .at-question input[type="radio"] {
	transform: scale(1.1); /* slightly larger radio */
	accent-color: #546aa0; /* match your theme (modern browsers) */
	margin: 0 6px 0 0;
  }
  
  /* answer cell */
  .at-question td.exam_txt {
	width: auto !important;
  }
  
  /* answer label card */
  .exam_txt label {
	display: block;
	line-height: 1.35;
	padding: 10px 12px;
	border: 1px solid #ddd;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	word-break: break-word;
  }
  .exam_txt label:hover {
	background: #f7faff;
  }
  
  /* spacing between option rows */
  .at-question table {
	border-spacing: 0 10px;
  }
  /* Question title line */
  .qtitle {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 8px 0 6px;
	font-weight: 700;
  }
  .qno {
	white-space: nowrap;
  }
  .qtext {
	display: inline;
  }
  
  /* If the question HTML had <p> or elements with default margins */
  .exam_q_txt p {
	display: inline;
	margin: 0;
  }
  .exam_q_txt .qtext > * {
	margin: 0;
  }
  
  /* Question images (from DB or qImage) scale nicely */
  .exam_q_txt img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 8px 0 10px;
  }
  
  body.claro {
	margin: 0;
	padding: 0;
  }
  
  body,
  td,
  th,
  tf,
  input,
  select,
  textarea {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  }
  
  @media print {
	.no-print,
	.no-print * {
	  display: none !important;
	}
  }
  
  .displayNone {
	display: none;
  }
  .invisible {
	visibility: hidden;
  }
  
  .main_txt {
	font-size: 12px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
  }
  .h1 {
	font-size: 13px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
  }
  
  .white_txt {
	font-size: 12px;
	/*font-weight: bold;*/
	color: #ffffff;
	text-decoration: none;
  }
  .gray_txt {
	font-size: 12px;
	font-weight: normal;
	color: #474747;
	text-decoration: none;
  }
  
  .exam_txt {
	font-size: 14px;
	font-weight: normal;
	color: #474747;
	text-decoration: none;
  }
  
  .exam_q_txt {
	font-size: 16px;
	font-weight: normal;
	color: #474747;
	text-decoration: none;
  }
  
  .blue_txt,
  a.blue_txt {
	font-size: 12px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
  }

  .textbox {
	font-size: 11px;
	color: #222222;
	text-decoration: none;
	border: 1px solid #a0a0a0;
	background-color: #ffffff;
  }
  
  .buttons {
	font-size: 11px;
	color: #313031;
	text-decoration: none;
	background-color: #f7f7f7;
	border: 1px solid #313031;
  }
  .msg {
	font-size: 11px;
	color: #dc4300;
	text-decoration: none;
  }
  .blue_links {
	font-size: 11px;
	font-weight: normal;
	color: #1e518f;
	text-decoration: underline;
  }
  .admin_heading {
	font: normal normal 18pt Georgia;
	color: #14324b;
	text-decoration: none;
  }
  .redtxt {
	font-size: 11px;
	font-weight: bold;
	color: #b21800;
  }
  .evenRow {
	background-color: #ffffff;
  }
  .oddRow {
	background-color: #eff2fa;
  }
  .sumRow {
	background-color: #ffff99;
  }
  
  .alertRow {
	background-color: #f8bbbb;
  }
  .totalRow {
	background-color: #66ff66;
  }
  .tblBg {
	font-size: 11px;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
	background-color: #adb9cf;
  }
  .mainBoxBg {
	background-color: #ffffff;
  }
  .date-container {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
  }
  
  .date-input {
	flex: 1;
  }
  
  .date-and {
	margin-left: 10px;
	margin-right: 10px;
	white-space: nowrap;
  }
  #loading {
	background-color: transparent;
	position: absolute;
	left: 0;
	top: 0;
  }
  
  .quizAnswerIcon {
	background-image: url("/images/radial_button.png");
	background-repeat: no-repeat;
	text-decoration: none;
	height: 13px;
	width: 17px;
	display: block;
	float: left;
	cursor: pointer;
  }
  
  .quizAnswerIconCorrect {
	background-position: -34px;
  }
  
  .quizAnswerIconInCorrect {
	background-position: -51px;
  }
  
  .fl {
	display: block;
	float: left;
  }
  .fr {
	display: block;
	float: right;
  }
  .clear,
  .cb {
	clear: both;
  }
  
  .hidden {
	display: none !important;
  }
  
  /* These pair of nested elements will center-align elements, not just text.
  <div class=centering> 
	  <div class=centered> 
		  (some inner blocks) 
	  </div>
  </div>
  */
  
  .centering {
	clear: both;
	float: left;
	left: 50%;
	position: relative;
  }
  
  .centered {
	float: left;
	left: -50%;
	position: relative;
  }
  
  .centering + * {
	clear: both;
  }
  
  .half {
	width: 50%;
  }
  
  .quarter {
	width: 25%;
  }
  
  .three-quarter {
	width: 75%;
  }
  
  .third {
	width: 33.33%;
  }
  
  .two-third {
	width: 66.66%;
  }
  
  /*
  body {overflow-x:hidden; }
  
  <!--[if IE 7]>
	  body {overflow-x:auto; }
  <![endif]-->
  */
  
  /*--- section header -------------------------------------------------------*/
  .section_header_outer {
	width: 100%;
	border: 1px solid #ffffff;
	border-bottom: 0;
	height: 42px;
	line-height: 38px;
	vertical-align: middle;
	background: url("/images/bg3.gif") repeat-x;
	margin-left: 275px;
  }
  .section_header_large {
	padding-left: 10px;
	display: inline-block;
	font-size: 13px;
	font-weight: bold;
  }
  .section_header_small {
	display: inline-block;
	font-size: 11px;
	color: #474747;
  }
  
  /* --- NOTIFIER ------------------------------------------------------------ */
  
  #datalynk_notifier {
	position: fixed;
	top: 0px;
	left: 35%;
	margin: auto;
	width: 30%;
	font-size: 12px;
	z-index: 999999;
  }
  
  .notifier_node {
	padding: 5px 10px 5px 10px;
	border-radius: 10px;
	border-top-radius: 0;
	border-width: 2px;
	border-style: solid;
	border-top: 0;
	opacity: 0.94;
	filter: alpha(opacity=94);
  }
  .notifier_node:hover {
	opacity: 1;
	filter: alpha(opacity=100);
  }
  .notifier_icon,
  .notifier_close {
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	background-size: 16px 16px;
  }
  .notifier_close {
	background-image: url(/images/icon_close_inline_16x16.png);
	float: right;
	cursor: pointer;
  }
  .notifier_icon {
	float: left;
  }
  .notifier_message {
	margin: 0 21px 0 21px;
	line-height: 16px;
	text-align: center;
  }
  .notifier_message .a {
	text-decoration: underline;
	cursor: pointer;
  }
  #navigation_header [icon] {
	margin: 5px 5px 2px 0;
  }
  #navigation_header [icon]:last-child {
	margin-right: 0px;
  }
  
  /* confirm */
  .notifier_type_confirm {
	background-color: #e6fdd3;
	border-color: #88c259;
  }
  .notifier_type_confirm .notifier_icon {
	background-image: url(/images/icon_checkmark_16x16.png);
  }
  .notifier_type_confirm .notifier_message {
	color: #326c03;
  }
  
  /* alert */
  .notifier_type_alert {
	background-color: #fafad2;
	border-color: #b9b60e;
  }
  .notifier_type_alert .notifier_message {
	color: #6f6f6f;
  }
  .notifier_type_alert .notifier_icon {
	background-image: url(/images/icon_general_alert_16x16.png);
  }
  
  /* critical */
  .notifier_type_critical {
	background-color: #fbeded;
	border-color: #9a0000;
  }
  .notifier_type_critical .notifier_message {
	color: #9a0000;
  }
  .notifier_type_critical .notifier_icon {
	background-image: url(/images/icon_warning_16x16.png);
  }
  
  .section_header {
	/* border: 1px solid #cbd5dc; */
	height: 57px;
	width: 100%;
	color: #335a76;
	background-image: url("/images/fixed_header_shadow.png");
	background-position: bottom;
	background-repeat: repeat-x;
  }
  
  .section_header_body {
	height: 41px;
	border-bottom: 1px solid #98acba;
  }
  
  .section_header_button {
	height: 41px;
	display: inline-block;
	cursor: pointer;
	text-decoration: none;
	outline: none;
	float: left;
	margin-right: 1px;
  }
  .unity_toolbar_button {
	background-image: url("/images/unity/background_navigation_button.png");
	background-repeat: repeat-x;
  }
  .section_header_button [icon] {
	margin-left: 10px;
  }
  .unity_toolbar_button:hover,
  .section_header_button_active {
	background-image: url("/images/unity/background_navigation_button_highlighted.png") !important;
  }
  
  .section_divider {
	position: relative;
	width: 1px;
	height: 41px;
	background-color: #cbd5dc;
	float: left;
  }
  
  .section_header_button:visited {
	color: #335a76;
  }
  
  .section_header_my_reports {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -168px 0px;
	width: 24px;
	height: 24px;
	display: inline-block;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
	float: left;
  }
  
  .section_header_courses {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -48px 0px;
	width: 24px;
	height: 24px;
	float: left;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
  }
  
  .section_header_communications {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -24px 0px;
	width: 24px;
	height: 24px;
	display: inline-block;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
	float: left;
  }
  
  .section_header_events {
	background-image: url("/images/icon_lms_master24x24.png");
	background-repeat: no-repeat;
	background-position: -72px 0px;
	width: 24px;
	height: 24px;
	display: inline-block;
	margin-top: 8px;
	margin-left: 10px;
	margin-right: 5px;
	float: left;
  }
  
  .section_header_labels {
	padding-right: 10px;
	line-height: 3;
	font-size: 13px;
	color: #335a76;
  }
  
  .section_header_button_active {
	background-color: #f7e38e;
  }
  
  .course_heading {
	white-space: nowrap;
  }
  
  /* hides FROM/TO columns in messages grid depending on filter choice */
  [data-filter-on="sent"] .dgrid-column-from,
  [data-filter-on="received"] .dgrid-column-to {
	display: none;
  }
  .forDifferentUser .dgrid-column-from,
  .forDifferentUser .dgrid-column-to {
	display: table-cell;
  }
  
  /* ===== Exam page cleanups ===== */
  
  /* --- Question block / title --- */
  .exam_q_txt {
	padding: 8px 0 2px;
  }
  .qtitle {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 8px 0 6px;
	font-weight: 700;
  }
  .qno {
	white-space: nowrap;
  }
  .qtext {
	display: inline;
  }
  
  /* If the question HTML from the editor adds <p> or default margins, normalize */
  .exam_q_txt p {
	display: inline;
	margin: 0;
  }
  .exam_q_txt .qtext > * {
	margin: 0;
  }
  
  /* Question images (from HTML editor or qImage column) */
  .exam_q_txt img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 8px 0 10px;
  }
  
  /* --- Options table block --- */
  .at-question {
	margin: 6px 0 14px;
  }
  .at-question table {
	width: 100% !important;
	border-collapse: separate;
	border-spacing: 0 10px; /* vertical gap between option rows */
	table-layout: auto;
  }

  /* Number column (stable width for 1)…(10) */
  .at-question td.gray_txt {
	width: 56px !important;
	text-align: right;
	white-space: nowrap;
	padding-right: 8px;
  }
  .at-question td.gray_txt strong {
	display: inline-block;
	width: 26px; /* accommodates “10)” neatly */
	text-align: right;
	font-weight: 600;
	color: #6b7280; /* subtle gray */
  }
  
  /* Answer cell grows to fill */
  .at-question td.exam_txt {
	width: auto !important;
  }
  
  /* Clickable answer “card” */
  .exam_txt label.answer {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	line-height: 1.35;
	padding: 12px 14px;
	border: 1px solid #ddd;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	word-break: break-word;
  }
  .exam_txt label.answer:hover {
	background: #f9fbff;
  }
  
  /* Radio appearance + alignment (modern browsers) */
  .exam_txt label.answer input[type="radio"] {
	transform: scale(1.1); /* slightly larger radio */
	accent-color: #546aa0; /* match left menu theme */
	margin-top: 2px; /* aligns with first text line */
  }
  
  /* Selected visual state (no JS needed; safe in modern browsers) */
  .exam_txt label.answer:has(input[type="radio"]:checked) {
	border-color: #546aa0;
	box-shadow: 0 0 0 3px rgba(68, 108, 192, 0.12);
	background: #f7faff;
  }
  
  /* Any images inside answers scale too */
  .exam_txt .answer-text img {
	max-width: 100%;
	height: auto;
  }
  
  /* Tighten up editor HTML inside questions/answers */
  .exam_q_txt .qtext p:empty,
  .exam_q_txt .qtext p:empty::before {
	display: none;
  }
  
  .exam_txt .answer-text p:empty,
  .exam_txt .answer-text p:empty::before {
	display: none;
  }
  
  /* Kill default margins from common editor tags inside the answer text */
  .exam_txt .answer-text p,
  .exam_txt .answer-text div,
  .exam_txt .answer-text ul,
  .exam_txt .answer-text ol,
  .exam_txt .answer-text li,
  .exam_txt .answer-text h1,
  .exam_txt .answer-text h2,
  .exam_txt .answer-text h3,
  .exam_txt .answer-text h4,
  .exam_txt .answer-text h5,
  .exam_txt .answer-text h6,
  .exam_txt .answer-text blockquote,
  .exam_txt .answer-text figure {
	margin: 0;
	padding: 0;
  }
  
  /* Ensure any inline images in answers behave */
  .exam_txt .answer-text img {
	max-width: 100%;
	height: auto;
	display: inline-block; /* avoid block-level extra gaps if editor wrapped them */
  }
  