@charset "UTF-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td{
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:1em;
	vertical-align:baseline;
	background:transparent;
	}
body{
	line-height:1;
	}
ol, ul{
	list-style:none;
	}
blockquote,
q{
	quotes:none;
	}
blockquote:before,
blockquote:after,
q:before,
q:after{
	content:'';
	content:none;
	}			
:focus{
	outline:0;
	}			
ins{
	text-decoration:none;
	}
del{
	text-decoration:line-through;
	}
table{
	border-collapse:collapse;
	border-spacing:0;
	}
input[type=hidden]{
	visibility:hidden;
	}
	
/* slightly enhanced, universal clearfix hack */
.clearfix:after{
	visibility:hidden;
	display:block;
	font-size:0;
	content:" ";
	clear:both;
	height:0;
	}
.clearfix{
	display:inline-block;
	}

/* start commented backslash hack \*/
* html .clearfix{
	height:1%;
	}
.clearfix{
	display:block;
	}
/* stop commented backslash hack */	
	

/* Body
*********************************************************/
body{
	font:100% Arial,'Helvetica Neue',Helvetica,'Lucida Grande',Verdana,sans-serif;
	background-color:#fff;
	background-image:url('/template/nctj/image/background.jpg');
	background-position:50% 0;
	background-repeat:repeat-x;
	color:#333;
	}
	
body .showwhenloading{
	display:none;
	}	
body.loading .hidewhenloading{
	display:none;
	}	
body.loading .showwhenloading{
	display:block;
	}
.hidden{
	display:none;
	}
	
/* Header
*********************************************************/
#header{
	}
	#header .container{
		background:#fff;
		width:1140px;
		padding:0 10px 10px 10px;
		margin:0 auto;
		}
	#header .status{
		float:right;
		padding:20px;
		background-color:#f3f3f3;
		border:1px solid #d9d9d9;
		border-width:0 0 1px 0;
		-webkit-border-bottom-right-radius:10px;
		-webkit-border-bottom-left-radius:10px;
		-moz-border-radius-bottomright:10px;
		-moz-border-radius-bottomleft:10px;
		border-bottom-right-radius:10px;
		border-bottom-left-radius:10px;	
		}
		#header .status ul{
			float:right;
			}
			#header .status ul li{
				float:left;
				margin-left:10px;
				font-size:0.75em;
				}
	#header .logo{
		display:block;
		padding-top:10px;
		padding-bottom:5px;
		float:left;
		}
		#header .logo img{
			display:block;
			}	
/*
Ajax Status
*********************************************************/
#ajax-status {
	float:right;
	width:55px;
	height:55px;
	background-position:50% 50%;
	background-repeat:no-repeat;
	background-image:url('/template/nctj/image/loading.gif');
	display:none;
	}			
		
/* Navigation
*********************************************************/
#navigation{
	}
	#navigation .container{
		background:#fff;
		width:1140px;
		padding:0 10px;
		margin:0 auto;
		}
	#navigation div.main{
		background-color:#666;
		height:36px;
		padding:0 0 0 13px;
		}
	#navigation div.main ul{
		background-color:#666;
		color:#fff;
		height:36px;
		float:left;
		}
		#navigation div.main ul.secondary{
			float:right;
			}
		#navigation div.main ul li{
			float:left;
			height:36px;
			}
			#navigation div.main ul li a{
				line-height:36px;
				display:block;
				padding:0 12px;
				color:#fff;
				background-color:#666;
				text-decoration:none;
				font-weight:bold;
				font-size:0.875em;
				}
				#navigation div.main ul li.active a,
				#navigation div.main ul li a:hover{
					background-color:#ccc;
					color:#333;
					}
	#navigation div.main ul.external{
		float:right;
		background-color:#000;
		padding:0 13px;
		}
		#navigation div.main ul.external li{
			
			}
			#navigation div.main ul.external li a{
				background-color:#000;
				color:#eee;
				font-weight:normal;
				font-size:0.75em;
				}
				#navigation div.main ul.external li a:hover{
					background-color:#ccc;
					color:#333;
					}
		
div.breadcrumbs{
	background-color:#e5e5e5;
	height:26px;
	padding:0 22px;
	margin-bottom:10px;
	}
	div.breadcrumbs ul{
		float:left;
		}
		div.breadcrumbs ul li{
			float:left;
			display:block;
			height:26px;
			line-height:26px;
			font-size:0.75em;
			padding:0 5px 0 2px;
			}
			div.breadcrumbs ul li a{
				display:block;
				line-height:26px;
				text-decoration:none;
				padding:0;
				}
	
p.pagination{
	text-align:center;
	padding:20px 0;
}	

/* Content
*********************************************************/
#content{
	clear:both;
	}
	#content .container{
		background:#fff;
		width:1140px;
		min-height:300px;
		margin:0 auto;
		padding:0 10px 10px 10px;
		}

/* Generic Content Styles */

a{
	color:#006699;
	text-decoration:none;
	}
	a:hover{
		text-decoration:underline;
		}
a.logout{
	color:#1b9aaa;
	}

p.cmsloading{
	line-height:300px;
	text-align:center;
	}
	p.cmsloading img{
		vertical-align:middle;
		}

div.box{
	padding:0 25px;
	margin-bottom:25px;
	}

div.introduction{
	padding:15px 25px 10px 25px;
	margin-bottom:25px;
	border-bottom:1px solid #ccc;
	}
	div.introduction h1{
		font-size:1.25em;
		color:#1b9aaa;
		font-weight:bold;
		margin-bottom:0.5em;
		}
	div.introduction p{
		font-size:0.875em;
		margin-bottom:0.5em;
		}
		
p.percentbar{
	height:16px;
	background-color:#a30234;
	border-radius:2px;
	}
	p.percentbar span.complete{
		display:block;
		float:left;
		height:16px;
		width:0;
		background-color:#4c9c00;
		border-radius:2px;
		}
		
/* Buttons */

input.button{
	padding-top:2px;
	padding-bottom:2px;
	}
a.button{
	height:23px;
	display:block;
	text-align:center;
	text-decoration:none;
	line-height:23px;
	}
input.button, a.button{
	font-size:0.875em;
	float:right;
	padding-left:15px;
	padding-right:15px;
	margin:0 0 0 10px;
	background:#eee;
	border-color:#666;
	color:#fff;
	border:1px solid #666;
	border-radius:2px;
	}
	input.button.left, a.button.left{
		float:left;
		margin:0 10px 0 0;
		}	
	input.button.slim, a.button.slim{
		height:14px;
		line-height:14px;
		font-size:0.75em;
		padding:0 4px;
		}	
	input.button.nofloat, a.button.nofloat{
		float:none;
		margin:0 0 0 10px;
		}	
	input.button:hover, a.button:hover{
		cursor:pointer;
		text-decoration:underline;
		}
	input.button.confirm, a.button.confirm{
		background:#75d975;
		border-color:#44ad45;
		}
	input.button.confirm:hover, a.button.confirm:hover{
		border-color:#2c702d;
		}
	input.button.cancel, a.button.cancel{
		background:#aaaaaa;
		border-color:#787878;
		}
	input.button.cancel:hover, a.button.cancel:hover{
		border-color:#4f4f4f;
		}
	input.button.neutral, a.button.neutral{
		background:#75a7d9;
		border-color:#4478ad;
		}
	input.button.neutral:hover, a.button.neutral:hover{
		border-color:#2d4f70;
		}
	input.button.caution, a.button.caution{
		background:#d97a75;
		border-color:#ae4b46;
		}
	input.button.caution:hover, a.button.caution:hover{
		border-color:#70302c;
		}
	body.loading input.button, 
	body.loading a.button{
		background:#eee !important;
		border-color:#999 !important;
		color:#999 !important;
		}


/* Boxed Menu */

ul.menu{
	
	}
	ul.menu li{
		background-color:#f2f2f2;
		float:left;
		width:372px;
		margin-right:11px;
		margin-bottom:11px;
		padding-bottom:10px;
		}
		ul.menu li.endcolumn{
			margin-right:0;
			}
	ul.menu li h2{
		padding:10px 25px;
		line-height:30px;
		margin-bottom:20px;
		background-color:#1b9aaa;
		color:#fff;
		}
	ul.menu li p{
		padding:0 25px;
		font-size:0.875em;
		margin-bottom:1em;
		}
	ul.menu li p.overview{
		min-height:100px;
		}

/* Help Box */

div.helpbox{
	background-color:#f2f2f2;
	padding-bottom:15px;
	}
	div.helpbox h3{
		color:#fff;
		background-color:#4d4d4d;
		padding:0 25px;
		line-height:36px;
		margin-bottom:20px;
		}
		div.helpbox h3 a{
			float:right;
			color:#fff;
			font-weight:normal;
			font-size:0.75em;
			}
	div.helpbox ul{
		margin:10px 0;
		}
		div.helpbox ul li{
			width:337px;
			padding-left:35px;
			margin-right:12px;
			margin-bottom:10px;
			float:left;
			min-height:2.8em;
			line-height:1.4em;
			font-size:0.75em;
			background-image:url('/template/nctj/image/bullet.png');
			background-repeat:no-repeat;
			background-position:20px 2px;
			}
		div.helpbox ul li.endcolumn{
			margin-right:0;
			}
			
/* Course Box */

div.coursebox{
	background-color:#f2f2f2;
	padding-bottom:15px;
	margin-bottom:11px;
	}
	div.coursebox h3{ 
		color:#fff;
		background-color:#1b9aaa;
		padding:0 25px;
		line-height:36px;
		margin-bottom:20px;
		text-decoration:none;
		}
	div.coursebox p{
		padding:0 25px 10px 25px;
		}
	div.coursebox.countdownbox p{
		margin-bottom:0;
		padding:15px 25px 0 25px;
		font-size:1.5em;
		text-align:center;
		}
	div.coursebox.countdownbox.endingsoon p{
		color:#ff0000;
		}

/* Notes */

form.standard .notedate img{
	vertical-align:middle;
	}
		
ul.notes{
	clear:both;
	padding:0;
	}
	ul.notes li{
		min-height:80px;
		background:#fcfcfc;
		border:1px solid #ddd;
		padding:1em;
		margin-top:10px;
		list-style-type:none;
		}
		ul.notes li.self{
			background:#ececec;
			border:1px solid #ccc;
			}
		ul.notes li p.info{
			float:right;
			clear:right;
			line-height:1.5em;
			}
			ul.notes li p.info img{
				vertical-align:middle;
				}
		ul.notes li p.body{
			padding:0;
			width:600px;
			line-height:1.5em;
			}
		ul.notes li p.editlink{
			margin-top:20px;
			}
		ul.notes li a{
			text-decoration:none;
			}
			
/* Login Form */

form.login{
	}
	form.login fieldset{ 
		}
	form.login p{
		margin-bottom:1em; 
		}
	form.login p label{
		display:block;
		float:left;
		width:130px;
		padding:5px 0;
		font-size:0.875em;
		}
	form.login p.text input{
		font-family:Arial,'Helvetica Neue',Helvetica,'Lucida Grande',Verdana,sans-serif;
		font-size:1em;
		width:220px;
		border:1px solid #ccc;
		padding:4px;
		}
	form.login p.checkbox{
		height:30px;
		}
	form.login p.checkbox input{
		font-family:Arial,'Helvetica Neue',Helvetica,'Lucida Grande',Verdana,sans-serif;
		font-size:1em;
		vertical-align:bottom;
		}
	form.login p.submit input{
		display:block;
		margin-left:130px;
		padding:3px 8px;
		border:1px solid #ccc;
		background:#eee;
		cursor:pointer;
		}	
	form.login p input:hover{
		border-color:#999;
		}
	form.login p input:focus{
		border-color:#333;
		}

/* Generic Form Styles */

form p.error{
	color:#1b9aaa;
	border:1px solid #1b9aaa;
	padding:10px 20px;
	}

/* Two Columns */
div.columns.twocolumn{
	
	}
	div.columns.twocolumn div.column1,
	div.columns.twocolumn div.column2{
		float:left;
		width:50%;		
		}
		
ul.threecolumn{
	float:left;
	}
	ul.threecolumn li{
		float:left;
		width:33%;
		}	
	
/* Standard Form */
div.box h2{
	line-height:40px;
	}

form.standard{
	
	}
form.standard label{
	font-size:0.875em;
	display:block;
	margin-bottom:2px;
	user-select:none;
	}
form.standard p{
	clear:left;
	margin-bottom:12px;
	}
p.information{
	margin-bottom:0.5em;
	}
form.standard p input,
form.standard p select,
form.standard p textarea{
	font-family:Arial,'Helvetica Neue',Helvetica,'Lucida Grande',Verdana,sans-serif;
	font-size:1em;
	width:360px;
	padding:4px;
	color:#444;
	border:1px solid #ccc;
	box-shadow:inset 1px 1px 2px #eee;
	}
form.standard p textarea{
	height:120px;
	min-height:120px;
	max-height:120px;
	min-width:360px;
	max-width:360px;
	}
form.standard p.checkbox{
	padding-top:22px;
	height:27px;
	}
form.standard p.checkbox input{
	float:left;
	width:auto;
	min-width:auto;
	max-width:auto;
	margin-right:8px;
	}
form.standard p.radio{
	padding-top:2px;
	}
form.standard p.radio input{
	float:left;
	width:auto;
	min-width:none;
	max-width:none;
	margin-right:8px;
	box-shadow:none;
	}
form.standard p input:hover,
form.standard p select:hover,
form.standard p textarea:hover{
	border-color:#aaa;
	}	
form.standard p input:focus,
form.standard p select:focus,
form.standard p textarea:focus{
	border-color:orange;
	box-shadow:inset 1px 1px 2px #ddd;
	}
form.standard p.radio input:focus{
	box-shadow:none;
	}
form.standard p select{
	width:370px;
	}
form.standard p input.datepicker,
form.standard p input.datepickerfriendly{
	background-image:url('/template/nctj/image/icon-datepicker.png');
	background-position:100% 50%;
	background-repeat:no-repeat;
	background-color:#fff;
	cursor:pointer;
	}
form.standard p.readonly input,
form.standard p.readonly select,
form.standard p.readonly textarea,
form.standard p.readonly input:hover,
form.standard p.readonly select:hover,
form.standard p.readonly textarea:hover,
form.standard p.readonly input:focus,
form.standard p.readonly select:focus,
form.standard p.readonly textarea:focus{
	color:#999;
	border-color:#ccc;
	box-shadow:inset 0 0 0 #fff;
	}	

form.standard p.readonly label{
	color:#999;
	}
form.standard p.readonly input,
form.standard p.readonly select,
form.standard p.readonly textarea{
	cursor:default;
	}
form.standard p.wide input,
form.standard p.wide select,
form.standard p.wide textarea,
form.standard p.wide label{
	width:792px;
	}
form.standard p.wide textarea{
	min-width:792px;
	max-width:792px;
}
form.standard p.tall textarea{
	height:200px;
	}

/* Generic Table Styles */
table{
	width:100%;
	margin-bottom:1em;
	}
	table th,
	table td{
		text-align:left;
		padding:3px 6px 3px 0; 
		}
	table th.textright,
	table td.textright{
		text-align:right;
		}
	table td{
		font-size:0.875em;
		}
	table tr.highlight{
		}
	table tr.highlight:hover{
		color:#903;
		}
	table a.icon{
		display:block;
		float:left;
		margin-bottom:-3px;
		}
	table img.icon{
		display:block;
		float:left;
		margin-right:2px;
		}
	table span.markcounter{
		display:block;
		float:left;
		width:44px;
		margin-bottom:-3px;
		margin-right:6px;
		}
		table span.markcounter small{
			font-size:0.8em;
			}
	table tfoot{
		}
	table tfoot td{
		padding-top:10px;
		}

table.files{
	margin-bottom:1em;
	width:50%:
	}
		
span.minipercentbar{
	display:block;
	float:left;
	height:16px;
	width:50px;
	background-color:#a30234;
	margin-right:3px;
	border-radius:2px;
	}
	span.minipercentbar span{
		background-color:#4c9c00;
		width:0;
		height:16px;
		float:left;
		border-radius:2px;
		}

/* Footer
*********************************************************/
#footer{
	clear:both;
	}
	#footer .container{
		background:#fff;
		width:1140px;
		margin:0 auto;
		padding:0 10px;
		}
		#footer div.bar{
			height:10px;
			background-color:#e0e0df;
			}
		#footer p{
			float:left;
			height:70px;
			line-height:70px;
			font-size:0.75em;
			padding:0 10px;
			}				
		#footer p.secondary{
			float:right;
			}	
			
.markdown p{
	margin-bottom:1em;
	}
	
.markdown ul li{
	list-style-type:disc;
	margin-left:1em;
	margin-bottom:0.5em;	
	}	
.markdown ol li{
	list-style-type:decimal;
	margin-left:1em;
	margin-bottom:0.5em;	
	}