﻿﻿@media only print {
body{ display:none !important; }
}


body {
	background-color: #fafafa;
	text-align: left;
	margin: 0px;
	padding: 0px;
	font-size: 16px;
	font-family: Arial;
	background:
		url('/online-courses/resources/images/bg.jpg');
}

a {
	text-decoration: none;
}

video {
	width: 100%;
}
p{
	color: #000;
}
::placeholder{
	color: #d1d5db;
}

.ui-widget{
	font-family: Arial, sans-serif;
	/*box-shadow: none;*/
}

.ui-menu .ui-menu-list .ui-menuitem {
	border-right: 1px solid black;
}

.assessment-custom-input {
	color: #000;
}
.course-content-tab .ui-panel .ui-panel-content, .answerArea .ui-panel .ui-panel-content, .ui-panel-content.ui-widget-content {
	padding: 0px;
}


.ui-datagrid-column {
	vertical-align: top;
}

.ui-widget-content {
	border: 1px solid #aaa;
	background: #eeeeee;
	color: #333333;
}

.container {
	padding: 0px;
	margin: auto;
}

.login-form {
	width: 340px;
	height: 463px;
	box-shadow: 0 0 5px rgba(85, 85, 85, .9);
	display: inline-block;
}

.login-form .title {
	background-color: #d60000;
	color: #fff;
	padding: 15px;
	font-size: 20px;
	margin-top: 0px;
}

.login-form .label {
	margin-left: 0px;
	font-size: 18px;
	margin-bottom: 5px;
	margin-top: 33px;
}

.login-form input[type="text"], .login-form input[type="password"] {
	background: #eee !important;
	border: 0px;
	font-size: 18px;
	height: 40px;
	width: 300px;
	margin-left: 0px;
}
/* Change the white to any color */
.login-form input:-webkit-autofill, .login-form input:-webkit-autofill:hover,
	.login-form input:-webkit-autofill:focus, .login-form input:-webkit-autofill:active
	{
	-webkit-box-shadow: 0 0 0 30px #eee inset !important;
}

.login-form .btn-submit {
	text-align: center;
	width: 300px;
	margin-top: 20px;
	margin-left: 0px;
	background: #f60;
	font-size: 18px;
}

.login-form .btn-submit input[type=submit] {
	text-align: center;
	background: #f60;
	font-size: 18px;
	padding: 5px;
	margin-bottom: 30px;
	border: 0px;
	color: #fff;
}

.floating {
	width: 50px;
	height: 50px;
	background-color: red;
	position: fixed;
}

#dlgNotice a {
	color: red;
}

.ui-dialog .ui-dialog-content {
	background-color: yellow;
}

li {
	text-align: left;
}

#pageContentOp .section {
	margin-top: 20px;
	font-family: "Times New Roman";
	width: 1070px;
}

#pageContentOp .section ul {
	line-height: 1.9;
	margin-top: 5px;
}

#pageContentOp .section .title {
	color: purple;
	font-size: 16pt;
	font-weight: bold;
	margin-bottom: 8px;
}

#pageContentOp .section p {
	margin-top: 0px;
	line-height: 1.9;
	padding-left: 31px;
}

.tab-sty1 {
	border-spacing: 0px;
	border-collapse: collapse;
	margin-left: 31px;
	border-color: red;
	background-color: lightyellow;
}

.tab-sty1 th {
	font-weight: bold;
	font-size: 16pt;
	text-align: center;
}

.tab-sty1 th:nth-child(2), .tab-sty1 td:nth-child(2), .tab-sty1 th:nth-child(4),
	.tab-sty1 td:nth-child(4) {
	width: 450px;
	font-size: 13pt;
}

.tab-sty1 th:nth-child(3), .tab-sty1 td:nth-child(3) {
	border-left: 2px solid red;
	text-align: center;
	width: 60px;
}

.tab-sty1 th:nth-child(1), .tab-sty1 td:nth-child(1) {
	text-align: center;
	width: 60px;
	height: 40px;
}

.tab-sty1 td {
	padding: 5px;
}

.tab-sty2 {
	border-spacing: 0px;
	border-collapse: collapse;
	margin-left: 31px;
	border-color: red;
	background-color: lightyellow;
}

.tab-sty2 th {
	font-weight: bold;
	font-size: 16pt;
	text-align: center;
}

.tab-sty2 th:nth-child(2), .tab-sty2 td:nth-child(2), .tab-sty2 th:nth-child(4),
	.tab-sty2 td:nth-child(4) {
	width: 350px;
	font-size: 13pt;
	padding-left: 10px;
}

.tab-sty2 th:nth-child(3), .tab-sty2 td:nth-child(3) {
	border-left: 2px solid red;
	text-align: center;
	width: 80px;
}

.tab-sty2 th:nth-child(1), .tab-sty2 td:nth-child(1) {
	text-align: center;
	width: 80px;
	height: 30px;
}

.tab-sty2 td {
	padding: 5px;
}

.tab-sty3 {
	border: 2px solid #ccc;
	border-collapse: collapse;
	border-spacing: 0;
	background-color: lightyellow;
	margin: 10px 30px;
}

.tab-sty3 td {
	border: 1px solid #ccc;
	padding: 10px 5px;
}

.page_bottom_block {
	background-color: lightblue;
	color: blue;
	border: 1px blue solid;
	line-height: 2;
	font-size: 14pt;
	width: 300px;
	padding: 10px;
	text-align: center;
	border-radius: 5px;
	cursor: pointer;
}

.page_bottom_block a:visited {
	color: blue !important;
}

.btn-hand {
	border: 1px solid #000;
	padding: 10px;
	width: 300px;
	background: yellow;
	border-radius: 5px;
	border-color: red;
	color: red;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.btn-hand a {
	color: red;
}

.btn1, .btn2 {
	cursor: pointer;
}

.content {
	padding-left: 10px;
}

.top-title1 {
	font-family: "Lato Bold";
	color: #fff;
	font-size: 40px;
}

.top-title2 {
	font-family: "Lato Regular";
	font-size: 18px;
	color: #fff;
}

.top-title3 {
	font-family: "Noto Sans TC";
	font-size: 18px;
	color: #fff;
}

.right-btn {
	font-size: 20px;
	color: #fff;
	background: #f26522;
	margin-bottom: 10px;
	width: 100%;
	padding: 15px 0px;
}

.right-btn:hover, .course-btn:hover {
	cursor: pointer;
}

.right-btn span {
	display: block;
}

.loginForm1 {
	margin-bottom: 15px;
	width: 300px;
	border: 1px solid lightblue;
}

.loginForm1 input {
	margin-bottom: 5px;
	font-size: 18px;
	color: #666666;
	padding: 2px;
	width: 98%;
	height: 60px;
	margin-top: 12px;
}

.loginFormTrial {
	border: 1px solid #eeeeee;
	background: #eee;
	margin-bottom: 15px;
	width: 300px;
	padding: 20px 0px;
	font-size: 15px;
	color: #666 !important;
	text-align: left !important;
	border: 1px solid darkgray;
}

.loginFormTrial input {
	margin-bottom: 20px;
	font-size: 18px;
	color: #666666;
	padding: 5px;
	width: 280px;
	height: 25px;
}

.mid-btn {
	margin-top: 20px;
	vertical-align: top;
}

.mid-btn div.btn {
	display: inline-block;
	background: #ff6600;
	color: #fff;
	font-size: 20px;
	width: 150px;
	height: 140px;
	vertical-align: middle;
	text-align: middle;
	padding-top: 10px;
}

.mid-btn div.btn div:first-child {
	font-size: 30px;
}

.main-content {
	margin-top: 3px;
	text-align: center;
}

 
.main-buttons a {
	color: #fff;
}

#courseTree {
	width: 330px !important;
}

#courseTree .ui-tree-container {
	background-color: #fdffdf;
	border-left: 1px solid red;
}

.course-tree .ui-tree {
	overflow: hidden;
	border: 0px;
}

.course-tree .ui-treenode-parent .ui-treenode-label .ui-treenode {
	font-size: 11.5pt;
}

.course-tree .ui-treenode-parent {
	color: red;
	font-size: 11.5pt;
}

.course-tree .ui-state-highlight {
	background: none;
	color: #bbb;
	text-shadow: none;
}
.course-tree .ui-tree .ui-treenode{
	cursor: pointer;
}
.course-tree .ui-treenode-children {
	padding: 6px !important;
	color: #bbb;
	cursor: pointer;
}

.course-tree .courseNode .ui-treenode-label {
	font-size: 11pt;
	margin-left: 8px;
	overflow: hidden;
}

.course-tree .courseNode-sel .ui-treenode-label {
	font-size: 11pt;
	color: blue;
	margin-left: 8px;
	cursor: pointer;
}

#right-content, #right-content-tpl {
	width: 963px;
}

.course-content {
	margin-bottom: 10px;
	margin-left: 3px;
	position: relative;
	top: -4px;
}
.course-content .ui-widget-content{
	border: 0px;
}
.course-content a {
	color: #bdbdbd;
}

.course-btn {
	margin-bottom: 10px;
	text-align: left;
}

.notes_green_btn {
	color: #fff;
	background-color: #00a650;
	padding: 10px;
	width: 60px;
	border-radius: 8px;
	border: red solid 1px;
}

.course-btn>div {
	display: inline-block;
	vertical-align: middle;
	background-color: #ff6600;
	height: 50px;
	padding: 10px 15px;
	color: #fff;
	font-size: 18px;
	text-align: center;
	border-radius: 5px;
}

.course-btn a {
	color: #fff !important;
	font-size: 22px;
}

.course-btn .ui-state-disabled {
	color: yellow;
	opacity: 1;
}

.course-btn div.ui-panel {
	background-color: transparent;
	border: 0px;
	display: inline-block;
	padding: 0px;
	margin-right: 10px;
	border-radius: 10px;
	padding: 5px 8px !important
}

.course-btn div.ui-panel>div.ui-panel-content {
	background-color: #ff6600;
	color: #fff;
	font-size: 18px;
	text-align: center;
	padding: 5px 8px !important
}

.course-btn-v2 .ui-tabmenu {
	text-align: center;
	background: none;
	border: 0px;
}

.course-btn-v2 ul {
	background: none;
}

.course-btn-v2 .ui-tabmenuitem {
	margin: 3px;
	background: #ff6600;
	margin: 1px;
	border-radius: 0px;
}

.course-btn-v2 .ui-tabmenu-nav {
	padding: 3px;
}

.course-btn-v2 .ui-tabmenu .ui-tabmenu-nav, .course-btn-v2 .finger-panel {
	padding: 0px;
	 
    width: 965px;
    height: 57px;
}

.course-btn-v2 .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem {
	margin: 0px 1px;
	border-color: #fff;
}

.course-btn-v2 .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem:first-child {
	margin-right: 2px;
}
.course-btn-v2 .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem:last-child {
	margin-right: 0px;
}
.course-btn-v2 .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem a {
	text-align: center;
	width: 100%;
	padding: 5px 0px;
}

.course-btn-v2 .ui-menuitem-text {
	text-align: center;
	color: #fff;
	font-size: 16px;
	font-weight: normal;
}
.course-btn-v2 .finger-panel{
	 height: 23px;
	 border-bottom: 1px lightblue solid;
	 background: lightgoldenrodyellow;
	 
}
.course-btn-v2 .finger-panel span{
	display:inline-block;
	position: relative;
    top: -7px;
}

.course-btn-v2 .finger-panel img{
	height: 22px;
    padding-left: 60%;	
}
.course-content div.rendered-panel img {
	width: 687px;
	height: 34px;
}

.not-enrolled {
	opacity: 0.4;
}

.course-content-tab .ui-column-title {
	color: blue;
	font-size: 13pt;
}

.course-content-tab th {
	background: #eee;
}

.course-content-tab th:nth-child(1) {
	border-right: 0px;
	background-color: #c3e9f9;
	color: #2e3192;
}

.course-content-tab th:nth-child(2) {
	border: 0px;
	overflow: visible;
	background-color: #c3e9f9;
	color: #2e3192;
}

.course-content-tab th:nth-child(2)>span {
	left: -105px;
	position: relative;
	top: 1px;
}

.course-content-tab th:nth-child(3) {
	width: 110px;
	text-align: center;
	white-space: nowrap;
	border-left: 1px solid blue;
	background-color: #c3e9f9;
}

.course-content-tab th:nth-child(3)>span {
	color: blue;
}
.header-table{
	margin-bottom: 1px;
	background-color: #c3e9f9;
	 
}
.header-table td:nth-child(1) {
	border-right: 1px;
	background-color: #c3e9f9;
	color: #4147C0;
	text-align: left;
	font-size: 16px;
	padding: 4px 5px;
	font-weight: bold;
	width: 810px;
	vertical-align: middle;
}

.header-table td:nth-child(2) {
	width: 127px;
	text-align: center;
	white-space: nowrap;
	border-left: 1px solid blue;
	background-color: #c3e9f9;
	color: blue;
	vertical-align: middle;
}

.past-paper .group-btn {
	padding: 10px 0px;
	margin: 5px 0px;
	line-height: 1.6;
}

.past-paper .btn1 {
	padding: 10px 0px;
	background-color: lightblue;
	color: blue;
	margin: 5px 0px;
	line-height: 1.6;
	color: blue;
}

.past-paper .btn1 a, .past-paper .btn1 .ui-widget-content {
	color: blue;
}

.past-paper .btn2 {
	padding: 10px 0px;
	background: #ff6600;
	margin: 5px 0px;
	line-height: 1.6;
}

.past-paper .btn2 a {
	color: #fff;
}

.past-paper .btn2 .ui-widget-content {
	color: #fff;
}

#right-content-tpl #datalist.table {
	width: 963px;
	table-layout: auto;
}

#right-content-tpl #datalist.table, .header-table {
	table-layout: auto;
}

.intensive {
	position: relative;
}

.intensive .header-table {
	border-bottom: 1px solid blue;
}

.intensive .header-table td:nth-child(1) {
	border-right: 1px;
	background-color: #c3e9f9;
	color: #4147C0;
	text-align: left;
	font-size: 16px;
	padding: 4px 5px;
	font-weight: bold;
	width: 803px;
}

.intensive .header-table td:nth-child(2) {
	width: 143px;
	text-align: center;
	white-space: nowrap;
	border-left: 1px solid blue;
	background-color: #c3e9f9;
	color: blue;
}

.intensive .course-content-tab table thead tr {
	display: none;
}

.intensive .ui-datatable-data td:nth-child(2), .intensive .ui-datatable-data td:nth-child(3)
	{
	width: 119px;
}

.intensive .course-content-tab td:nth-child(1) {
	width: 170px;
}

.intensive .course-content-tab thead tr:nth-child(1) th {
	background-color: #fdffe1;
	border: 1px solid #cccccc;
	border-top: 1px solid blue;
}

.intensive .course-content-tab thead tr:nth-child(1) th:nth-child(2)>span,
	.intensive .course-content-tab thead tr:nth-child(1) th:nth-child(3)>span
	{
	left: 0px;
	font-size: 24px;
	text-align: center;
	color: red;
}

.intensive .green_btn {
	color: #fff;
	background-color: #00a650;
	padding: 15px;
	border-radius: 8px;
	border: red solid 1px;
	width: 160px;
}

.intensive .btn1 {
	padding: 10px 0px;
	background-color: lightblue;
	color: blue;
	margin: 5px 0px;
	line-height: 1.6;
	color: blue;
}

.intensive .btn1 a, .intensive .btn1 .ui-widget-content {
	color: blue;
}

.intensive .btn2 {
	padding: 10px 0px;
	background: #ff6600;
	margin: 5px 0px;
	line-height: 1.6;
}

.intensive .btn2 a {
	color: #fff;
}

.intensive .btn2 .ui-widget-content {
	color: #fff;
}

/*end of intensive*/
.past-paper {
	position: relative;
}

.past-paper .header-table, .revision .header-table{
	border-bottom: 1px solid blue;
}
.course-btn-v2, .course-content-tab, .header-table{
	width:965px;
}
.course-content-tab .ui-datatable-tablewrapper > table {
	table-layout: fixed;
    width: 965px;
}

.past-paper .header-table td:nth-child(1) {
	border-right: 1px;
	background-color: #c3e9f9;
	color: #4147C0;
	text-align: left;
	font-size: 16px;
	padding: 4px 5px;
	font-weight: bold;
	width: 803px;
}

.past-paper .header-table td:nth-child(2) {
	width: 143px;
	text-align: center;
	white-space: nowrap;
	border-left: 1px solid blue;
	background-color: #c3e9f9;
	color: blue;
	vertical-align: middle;
}

.course-content-tab table thead tr {
	display: none;
}

/*.past-paper .ui-datatable-data td:nth-child(2), .past-paper .ui-datatable-data td:nth-child(3)
	{
	width: 400px;
}*/


.past-paper .course-content-tab td:nth-child(1) {
	width: 170px;
}

.past-paper .course-content-tab thead tr:nth-child(1) th {
	background-color: #fdffe1;
	border: 1px solid #cccccc;
	border-top: 1px solid blue;
}

.past-paper .course-content-tab thead tr:nth-child(1) th:nth-child(2)>span,
	.past-paper .course-content-tab thead tr:nth-child(1) th:nth-child(3)>span
	{
	left: 0px;
	font-size: 24px;
	text-align: center;
	color: red;
}

.past-paper .green_btn {
	color: #fff;
	background-color: #00a650;
	padding: 15px;
	border-radius: 8px;
	border: red solid 1px;
	width: 142px;
}
/*mock exam*/
.mock-exam .header-table {
	border-bottom: 1px solid blue;
}

.arrow {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
}
.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
 
.exam .ui-selectonemenu .ui-selectonemenu-trigger .ui-icon{
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  margin-right: 10px;
  margin-bottom: 20px;
  background: none;
  height: 3px;
  width: 3px;
  
}
 
.revision .course-content-tab table thead tr {
	display: none;
}

.revision .course-content-tab table thead tr {
	display: none;
}
.revision .course-content-tab thead tr:nth-child(1) th {
	background-color: #fdffe1;
	border: 1px solid #cccccc;
	border-top: 1px solid blue;
}

 

.mock-exam .header-table td:nth-child(1) {
	border-right: 1px;
	background-color: #c3e9f9;
	color: #4147C0;
	text-align: left;
	font-size: 16px;
	padding: 4px 5px;
	font-weight: bold;
	width: 813px;
}

.mock-exam .header-table td:nth-child(2) {
	width: 128px;
	text-align: center;
	white-space: nowrap;
	border-left: 1px solid blue;
	background-color: #c3e9f9;
	color: blue;
	vertical-align:middle;
}
.sample .course-content-tab table thead tr {
	display: none;
}

.mock-exam .course-content-tab table thead tr {
	display: none;
}

.mock-exam .ui-datatable-data td:nth-child(2)
	{
	width: 360px;
	text-align: center;
}
.mock-exam .course-content-tab td:nth-child(1) {
	width: 80px;
	text-align: center;
}
.past-paper .ui-datatable-data td:nth-child(3)
	{
	width: 280px;
	text-align: center;
}
.past_paper_v2 .course-content-tab td:nth-child(1) {
	width: 280px;
	text-align: center;
}

.mock-exam .course-content-tab thead tr:nth-child(1) th, .past_paper_v2 .course-content-tab thead tr:nth-child(1) th {
	background-color: #fdffe1;
	border: 1px solid #cccccc;
	border-top: 1px solid blue;
}

.mock-exam .course-content-tab thead tr:nth-child(1) th:nth-child(2)>span,
	.past-paper .course-content-tab thead tr:nth-child(1) th:nth-child(3)>span
	{
	left: 0px;
	font-size: 24px;
	text-align: center;
	color: red;
}

.mock-exam .green_btn, .past_paper_v2 .green_btn{
	background-color: #00a650;
	padding: 3px 5px;
	width: 60px;
	border-radius: 6px;
	border: red solid 1px;
	font-size: 32px;
	text-align: center;
	color: #fff;
}

.mock-exam .btn1{
	background-color: lightblue;
	color: blue;
	padding: 9px;
	line-height: 1.5;
	padding-left: 10px;
}
.past_paper_v2 .btn1 {
	background-color: lightblue;
	color: blue;
	padding: 5px;
	line-height: 1.5;
	padding-left: 10px;
}

.mock-exam .btn1 a, .past_paper_v2 .btn1 .ui-widget-content {
	color: blue;
}

.mock-exam .btn2, .past_paper_v2 .btn2  {
	padding: 5px;
	background: #ff6600;
	margin: 5px 0px;
	line-height: 1.5;
}

.mock-exam .btn2 a, .past_paper_v2 .btn2 a {
	color: #fff;
}

.mock-exam .btn2 .ui-widget-content, .past_paper_v2 .btn2 .ui-widget-content {
	color: #fff;
}

.chapter-content {
	border: 0px;
	background: #ff6600;
	color: #fff;
	padding: 8px !important;
	border-radius: 5px;
	font-size: 12pt;
}

.chapter-content-tab-inner1 {
	width: 710px;
}

.chapter-content-tab-inner1 tr, .chapter-content-tab-inner1 td {
	border: 0px solid transparent;
	background-color: transparent;
}

.ui-state-disabled {
	opacity: 0.4;
}

.chapter-content .ui-panel-content, .chapter-content  a {
	padding: 0px;
	color: #fff;
	font-size: 12pt;
}

.registration-form {
	text-align: left;
}

.arrow-up {
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #2e3192;
	margin-left: 60px;
}

.rendered-panel, .rendered-panel .ui-panel-content {
	margin: 0px !important;
	padding: 0px !important;
	background: transparent !important;
	border: 0px !important;
	color: #fff;
}

.group-btn {
	border: solid 0px red;
	margin: 5px;
	background: #00a650;
	padding: 10px 5px;
}

.group-btn a {
	color: #fff;
}

.p-datepicker input {
	width: 100px;
}

.colLevel {
	width: 100px;
}

.colStatus {
	width: 80px;
}

.colCode {
	width: 60px;
}

.colCourseCode {
	width: 70px;
}

.colGender {
	width: 60px;
}

.colPhone {
	width: 80px;
}

.colFee {
	width: 80px;
}

.colDispOrder {
	width: 40px;
}

.colLastLogin {
	width: 110px;
}

.colCreated {
	width: 90px;
}

.colModified {
	width: 100px;
}

.colContent {
	width: 100px;
}

.reg-table {
	width: 900px;
	border: 1px solid;
}

.reg-table>tbody>tr td {
	border-bottom: 1px solid black;
}

.reg-table td {
	vertical-align: middle;
	padding: 5px;
}

.reg-table .gender-td table.ui-selectoneradio {
	display: inline-block;
	height: 30px;
	margin-top: 10px;
}

.reg-table td.disability-td table.ui-selectoneradio td {
	display: flex !important;
	margin-left: 50px;
	width: 150px;
}

.reg-table label.ui-outputlabel {
	margin: 10px 20px;
}

.reg-table .exam-table .ui-datatable-footer {
	text-align: right;
	color: #000;
	background: none;
	border: none;
	font-weight: normal;
	padding: 0px;
}

.reg-final .reg-final-title {
	font-size: 18px;
	text-decoration: underline;
}

.attention li {
	line-height: 2.4;
	font-size: 14pt;
}

.main-buttons .btn {
	display: inline-block;
	margin: 2px 0px;
	padding: 6px 6px;
	border: 1px solid red;
	color: #fff;
	background-color: red;
	border-radius: 5px;
	width: 125px;
	height: 63px;
	text-align: center;
}

.main-buttons .btn:nth-child(3), .main-buttons .btn:nth-child(4),
	.main-buttons .btn:nth-child(5), .main-buttons .btn:nth-child(6),
	.main-buttons .btn:nth-child(7), .main-buttons .btn:nth-child(8),
	.main-buttons .btn:nth-child(9) {
	padding-top: 10px;
	padding-bottom: 2px;
}

.page-content {
	color: #000;
	text-align: left;
}

#dlgNotice {
	font-size: 16pt;
}

.selected-btn {
	background-color: yellow !important;
	border-color: red !important;
}

.selected-btn a {
	color: red !important;
}

.border {
	border: 2px solid purple;
	border-collapse: collapse;
	border-spacing: 0;
}

.border td {
	border: 1px solid purple;
}

.actived-node .ui-treenode-label {
	color: blue;
}

#courseTitle {
	text-align: left;
	font-size: 16px;
	background-color: #c3e9f9;
	color: #4147C0;
	width: 725px;
}

.title-bar {
	padding: 12px;
	display: inline-block;
	width: 808px;
	background-color: #c3e9f9;
	color: #4147C0;
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 0.5px;
	top: -4px;
	position: relative;
}

#formQuestion .ui-inputfield {
	width: 95%;
}

.ui-panel.question {
	margin-bottom: 20px;
	padding: 28px 20px;
  	background-color: white;
  	border-radius: 8px;
  	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2)
}

.question .description td {
	padding: 10px 20px;
	white-space: nowrap;
}

.opt_desc_col {
	width: 600px;
}

.opt_desc_col textarea {
	width: 100%;
}

.disp_order {
	width: 100px;
}

.disp_order input {
	width: 30px;
}

.exam {
	text-align: left;
	padding-top: 10px;
	width: 1280px;
	margin: auto;
	position: relative;
	top: -40px;
}

.exam .que {
	padding: 20px;
	margin-bottom: 10px;
	border: 2px solid blue;
	line-height: 1.5;
	font-size: 18px;
	overflow: auto;
}

.subtitle {
	margin-top: 10px;
	margin-bottom: 20px;
}
.ui-panel.subtitle .ui-panel-content{
	padding-left: 0px;
}
.exam .ui-radiobutton .ui-radiobutton-box {
	margin-right: 10px;
  cursor: pointer;
  width: 20px;
  height: 20px;
}
.exam .ui-radiobutton .ui-state-active{
	margin-right: 10px;
  cursor: pointer;
  width: 20px;
  height: 20px;
  background: #0060df;
  width: 16px;
  border-radius: 16px;
  height: 16px;
  margin-top: 1px;
}

.exam .ui-radiobutton .ui-state-active .ui-icon{
	background-image: none;
}
.exam .ui-selectoneradio .ui-g .ui-g-12{
	padding:0px;
}
.exam .ui-radiobutton{
	display: table-cell;
	vertical-align: top;
}
.exam .ui-selectoneradio.ui-grid-responsive label {
	margin: 0px 16px 0 12px;
	font-size: 16px;
	display: table-cell;
	padding-left: 0px;
	color:#000;
	font-weight: normal;
}

.exam .ui-inputfield.assessment-custom-input{
	background: #f0f4fb;
    -moz-box-shadow: unset;
    -webkit-box-shadow: unset;
    box-shadow: unset;
    color: #000;
}

.exam .ui-panel.ui-panel-content{
	padding-left:0px;
}
 
.assessment-options-container .ui-g{
	display: flex;
  align-items: center;
  background-color: #f0f4fb;
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s;
}
.assessment-options-container .ui-g:hover {
    background-color: #e6effe;
}
.assessment-options-container .ui-g label p{
	margin: 0;
	color: black;
}
.assessment-options-container .ui-g:has(input[type="radio"]:checked), .assessment-options-container .ui-g:has(input[type="checkbox"]:checked) {
  background-color: var(--primary-blue-color);
  padding: 10px;
  border: 2px solid #3b82f6;
  border-radius: 8px;
}
.assessment-options-container .ui-g:has(input[type="radio"]:checked) label p, .assessment-options-container .ui-g input[type="checkbox"]:checked +  label p {
    color: white!important;
    margin: 0;
    color: #000;
}

.ui-selectonemenu.form-control, .ui-selectonemenu .ui-selectonemenu-trigger{
	border: 0px;
	background: none;
	padding: 3px;
}
.ui-selectonemenu-list{
	background: #fff;
}
.ui-selectonemenu:hover{
	color: black;
  background-color: #fff;
  border-color: black;
  outline: 0;
  box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
}
.form-control .ui-selectonemenu-label.ui-inputfield{
	box-shadow: unset;
	margin-right: 30px;
	border-radius: 10px;
	width: 90%;
}

select.multiple01_select {
    box-shadow: rgba(0, 0, 0, 0.22) 0px 5px 15px;
    border-radius: 33px;
    min-width: 200px;
    min-height: 37px;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url(http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png) no-repeat right #fff;
    -webkit-appearance: none;
    background-repeat: no-repeat;
    background-position-x: 96%;
    background-position-y: 8px;
    border: 1px solid #dfdfdf;
    padding: 5px 15px 5px 5px;
    margin: 5px;
    display: inline-block;
    width: auto;
}
.MULTIPLE01 select:focus{
	background-color: #fff;
}

.ui-selectonemenu.form-control {
	width: unset;
}
assessment-question-text p{
	margin-top: 5px;
	margin-bottom: 5px;
}
.assessment-question-text tr{
	height: 35px;
}
.assessment-question-text .first-opt {
	margin-left: 30px;
	border: 0px;
}

.assessment-question-text .first-opt th:nth-child(1){
	width: 230px;
}
.assessment-question-text .first-opt th, .assessment-question-text .first-opt td {
	border: 0px;
	padding-left: 7px;

}
.assessment-question-text .first-opt th{
	text-decoration: underline;
}
.assessment-options-container:has(table[class="first-opt"]) table, .assessment-options-container:has(table[class="first-opt"]) table td, .assessment-options-container:has(table[class="first-opt"]) th{
	border: 0px;
	background-color: transparent;
	padding:0px;
}
.assessment-options-container:has(table[class="first-opt"]) table td, .assessment-options-container:has(table[class="first-opt"]) th{
	white-space: nowrap;
	min-width: 250px;
	font-weight: normal;
	vertical-align: top;
}

.assessment-options-container .ui-g:has(input[type="radio"]:checked) label td{
    color: white !important;
    margin: 0;
}

.exam .answer-left {
	vertical-align: top;
	display: inline-block;
}

.exam .paper-btn-panel {
	display: inline-block;
	width: 1050px;
}

.exam .paper-btn {
	margin-bottom: 10px;
}

.exam .paper-btn .ui-button {
	margin: 0px 10px;
}

.exam .countdown {
	display: inline-block;
	width: 70px;
	font-size: 26px;
}

.exam .ui-widget-content {
	border: 0px;
	
}

.exam .mark-img {
	width: 0px;
	height: 0px;
	position: relative;
	top: 5px;
	left: 600px;
}

.exam .mark-img img {
	width: 100px;
}

.exam .total-mark {
	font-size: 30px;
	color: red;
}

.mc01 table, .mc01 th, .mc01 td, .mc03 table{
	border: 0px;
}

.mc01 .ui-g{
	display: table;
	padding-left: 0px;
}

.mc01 .ui-g>div{
	display: table-row;
}
 
.mc03 .ui-g .ui-g-12 {
	display: table-row;
	padding-left: 0px;
} 
.mc03 label p{
	margin: 0px;
	color: #000;
}
.mc03 .ui-chkbox, .mc03 label{
	display: table-cell;
	vertical-align: top;
}
.mc03 label{
	padding-left: 10px;
	color: #000;
	font-weight: normal;
}
.match01 .answer-left {
	display: inline-block;
}

.match01 .ui-orderlist .ui-orderlist-list {
	width: unset;
	height: auto;
}

.match01 .ui-datatable table, .match02 .ui-datatable table  {
	width: unset;
}
.match01 table, .match01 table td{
	border: 0px;
	width: fit-content;
}

.match01 .answer-left table {
	border-collapse: separate;
}

.match01 .answer-left th {
	background: unset !important;
	text-align: center;
	padding: 5px 5px;
	color: #1c94c4 !important;
}

.match01 .answer-left td:nth-child(1) {
	padding: 5px 15px;
	height: 28px;
	min-width: 120px;
	text-align: left;
	 
	border: 1px solid;
}

.match01 .answer-left td:nth-child(3) {
	padding: 5px 15px;
	height: 28px;
	min-width: 150px;
}

.match01 .answer-left td:nth-child(2) {
	border: 0px;
	text-align: center;
	width: 28px;
}
.match01 select{
	display: none;
}

.match01 .ui-widget-header {
	padding: 6px 5px;
	border: 1px solid #cccccc;
	background: unset;
	font-weight: bold;
	color: #1c94c4;
	text-align: center;
	margin-bottom: 1px;
}

.match01 .answer-right .ui-orderlist .ui-orderlist-list li {
	padding: 8px 15px;
	border: 1px solid #000;
	 
	margin-bottom: 2px;
}

.match01 .match01_tab, .match01 .match01_tab td{
	border: 0px;
	width: fit-content;
}

.match01 div{
	padding: 0px;
}

.match02 th.ui-state-default {
	text-align: center;
}

.match02 .choices {
	margin-top: 20px;
	min-height: 30px;
	min-width: 200px;
	width: fit-content;
	background: #44d8e3;
	padding: 5px;
}

.match02 .dragAnswerPnl {
	margin: 5px;
	background: #f0f4fb;
	min-width: 170px;
}
.MATCH02  .ui-draggable, .MATCH03  .ui-draggable{
		 		background: #f0f4fb;
		 		margin: 3px;
		 		min-width: 150px;
		 		width: fit-content;
		 		max-width: 600px;
		 		display: table;
		 	}

.MATCH03 .ui-panel-content.ui-widget-content{
	padding: 0px;
} 
.MATCH03 .available_choices{
	min-width: 168px;
	min-height: 52px;
}

.MATCH03 p{
	color: #000;
}

.MATCH03 table tr {
	height: 40px;
}

.file_in_opt {
	line-height: 1.9;
	display: block;
}

.file_in_opt_desc {
	display: inline-block;
}

.fill_in_input {
	margin: 0px 4px;
	min-width: 120px;
	field-sizing: content;
	resize: none; 
	color: #000;
	border: 1px solid;
}

.CHOOSE01 .questionOption_desc, .CHOOSE01 .questionOption_choice {
	display: inline-block;
}
.CHOOSE01 .ui-datatable table{
	 
}

.CHOOSE01 table td, .CHOOSE01 table th, .CHOOSE01 .ui-datatable tbody td{
	padding: 10px 20px;
}

.form .ui-g .ui-panelgrid-cell:first-child {
	width: 180px;
}
.assessment-question-container table td{
	padding: 8px;
	font-size: 18px;
}
/*.question p {font-size: 16px; color: #333;}*/
.question .description p, .file_in_opt p{font-size: 18px; color: #000; line-height: 20pt;}
.question td p {margin:0px; color: #000;}
 
.question .answerArea .ui-widget-content, .answerArea .ui-panel-content.ui-widget-content {border:0px;background: none;}
.question .answerArea .assessment-label-container {display: flex;
  align-items: center;
  background-color: #f0f4fb;
  border-radius: 8px;
  padding: 0;
  max-width: 600px; margin: 10px 5px; padding:3px;}
table {
	border-collapse: collapse;
}
.file_in_opt table, .file_in_opt table td, .file_in_opt table th, .assessment-question-text table,.assessment-question-text table td, .assessment-question-text table th{
	border: 1px solid #000;
}
.bg-warning {background-color: #f0ad4e !important;}
