ย@charset "UTF-8";

div.exam.container-center {
	line-height: 1.5em;
}


div.exam div.head {
	text-align: left;
}
div.exam div.head > div {
	padding: 15px 0px 15px 0px;
	width: 320px;
	max-width: 90%;
	display: inline-block;
}


div.exam div.menus {
	text-align: left; 
	padding: 2%; 
	width:96%; 
	border:1px solid #cccccc; 
	background-color: #eeeeee;
}	

div.exam div.questions {
	text-align: left;
}
div.exam div.question-content {
	text-align: left; 
	padding: 2%; 
	width:96%; 
	border:1px solid #cccccc; 
	background-color: white;
}

div.exam div.question-no {
	font-size: 1.3rem;
	font-weight: bold;
}

.pair-no {
	font-size: 1.5rem;
	font-weight: bold;
}

div.exam img.question-image {
	max-width: 90%; 
}

div.question img {
	max-width: 90%; 
}
div.solution img {
	max-width:90%;
}
 div.container-center.sticky {
	position: -webkit-sticky;  
	position: sticky;
	top: 0;
	
}

div.exam form input[type='radio']+label  {
	background-color: #f9f9f9;
}
div.exam form input[type='radio']:checked+label  {
	background-color: #ccffcc;
}

/*************************************************************************************
 * Form and Fields
 * Button is defined in max-height: .css;
 */
div.question div.question form { 
	padding: 0px;
	margin: 0px;
	text-align: center;
	font-family: 'Sarabun', sans-serif, Tahoma;
}
div.question form div.container-full {
	padding: 20px 0px 0px 0px;
	margin: 0px;
	text-align: left;
}
div.question form div.title {
	font-weight: 500;
	font-size: 1.2rem;
}
div.question form div.field {
	padding-bottom: 20px;
}

div.question form div.field-label.c-2 {
	width: 200px !important;
	max-width: 200px;
	min-width: 200px;
	padding: 0px;
	color: #004371;
	text-align:left;
	float: left;
	margin: 0px;

}

div.question form div.field-content.c-2  {
	width: 600px;
	max-width: 70%;
	padding: 0px;
	margin: 0px;
	text-align: left;
	float:left;
}

div.question form div.field div.label {
	width: 150px !important;
	min-width: 150px !important;
	font-weight: 500;
}

div.question form div.field div.info {
	font-size: smaller;
}
div.question form div.field div.error {
	font-size: smaller;
}


div.question form input[type='text'] {
	margin: 0px;
	padding: 8px;
	font-size: 1rem;
	font-weight: 300; 
	line-height: 150%; 
	overflow: visible;	
	font-family: 'Sarabun', sans-serif, Tahoma;
	border: 1px solid #073B91;
	width: 45%;
	min-width: 300px;
}

div.question form input[type='file'] {
	display: inline-block;
	margin: 0px;
	padding: 0px;
	width: 200px;
	opacity: 1;
	overflow: hidden;
}


div.question form select {
	margin: 0px;
	padding: 8px;
	font-size: 0.9rem;
	font-weight: 300; 
	line-height: 150%; 
	overflow: visible;
	font-family: 'Sarabun', sans-serif, Tahoma;
	border: 1px solid #073B91; 
	width: 45%;
	min-width: 300px;
}
div.question form textarea {
	margin: 0px;
	padding: 8px;
	font-size: 0.9rem;
	font-weight: 300; 
	line-height: 120%; 
	overflow: visible;
	font-family: 'Sarabun', sans-serif, Tahoma;
	border: 1px solid #073B91;
	width: 550px;
	max-width: 100%;	
	min-width: 300px;
	height: 600px;
}


div.question form input.button {
}


div.question form fieldset {
	padding: 5px;
	margin: 20px 0px 0px 0px;
}

div.question form fieldset legend {
	font-weight: bold;
	text-align: center;
}

div.question form input.inline {
	display : inline;
}



div.question form input[type='checkbox'] {
	display : inline;
	width : auto;
	  /* Double-sized Checkboxes 
	  -ms-transdiv.question form: scale(1.3); /* IE */
	   /* Double-sized Checkboxes -moz-transdiv.question form: scale(1.3); /* FF */
	  /* Double-sized Checkboxes  -webkit-transdiv.question form: scale(1.3); /* Safari and Chrome */
	  /* Double-sized Checkboxes  -o-transdiv.question form: scale(1.3); /* Opera */
	  padding: 10px;	
	
}

div.question form.random select option[value='-1'] {
	font-weight : bold !important;
	font-size : 20px !important;
}

@media only screen and (max-width : 819px) {
	div.question form div.field-label  {
		padding-bottom: 0px !important;
	}

	div.question form div.field-content  {
		padding-top: 0px !important;
	}
}


/**
 * Question table
 */

table.question-list {
	border: none;
	border-top : 1px solid black;
	border-bottom : 1px solid black;
	width: 100%;
}

table.question-list > tbody > tr {
	border: none;
	border-top : 2px solid black;
	border-bottom : 2px solid black;
}

table.question-list  > tbody > tr > td {
	padding: 5px 20px 5px 20px;
	border: none;
	border-top : 2px solid black;
	border-bottom : 2px solid black;
}

table.choices div.choice p:first-of-type {
	display : inline;
}



/**************************************************************************************
 * Latex
 */

.latex {
	margin-top: auto;
	margin-bottom: auto;
	vertical-align: middle;
}