@charset "utf-8";
/* CSS Document */
body, html { height: 100%; }

body {
	background: url(../images/bg-corner.png) right top no-repeat #ececec;
	color: #1e1e1e;
	font-size: 12px;
	font-family: 'Arial', Helvetica, sans-serif;
	padding: 0px 0px 0px 0px;
	min-width: 925px;
	margin: 0px 0px 0px 0px;
}

a { 
	border: none;
	color: #09F;
}

a:hover { color: #C33; text-decoration: none; }

strong {
	color: #930; 
}

div {
	margin: 2px 2px 2px 10px;
}

/* Float and Alignment Setups */
.fixed { width: 600px; margin: 0px 0px 0px 325px; }
.liquid { min-width: 500px; margin: 0px 10px 0px 325px; }
.center { margin: 0px auto 0px auto; }

/* Simple Container */
.container, .tcontainer {
	padding: 1px; border-radius: 5px; overflow:hidden;
	background: url(../images/white-fade.png) left top repeat;
	box-shadow: #2e2e2e 0px 0px 15px 0px;
	margin: 15px 10px 15px 10px;
}
	.container h1, .tcontainer h1 { 
		margin: 0px 0px 0px 0px; border-top-left-radius: 5px; border-top-right-radius: 5px;
		padding: 7px 7px 4px 7px;
		font-size: 22px; overflow: hidden;
		background: url(../images/black-fade.png) left top repeat; color: #FFFFFF;
	}
		.question h1 {
			font-size: 16px;	
		}
			.question h1 strong {
				color: #39F;	
			}
	.container p, .tcontainer p, .tcontainer .details {
		padding: 0px 0px 0px 0px;
		margin: 5px 10px 5px 10px;
		line-height: 17px;
	}
	.container .confoot, .tcontainer .confoot {
		background: url(../images/black-fade.png) left top repeat; padding: 0px; margin: 0px; overflow: hidden;	
		border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;
	}
		.container .confoot a, .tcontainer .confoot a {
			display:block; float: right; padding: 10px; border: none;
		}
				.container .confoot a:hover, .tcontainer .confoot a:hover {	
					background: url(../images/black-fade.png) left top repeat; border: none;
				}
	.container ul { list-style: none; padding: 0px 0px 1px 0px; margin: 0px 0px 0px 0px; }
	.container ul li { 
		padding: 10px 5px 5px 10px; border-bottom: 1px solid #ececec; font-size: 15px;
		font-weight: bold; border-top: 1px solid #FFFFFF;
	}
		.container ul li:hover { color: #930; background: url(../images/container-fade.png) left 90% repeat-x; }
.msg { background: #C33; padding: 8px 5px 5px 5px; font-size: 13px; color: #FFFFFF; }

/* Mailbox */
.mail a, .mailbox a { padding: 3px 7px 0px 7px; text-decoration: none;}

.compose {  margin: 0px 20px 0px 0px; font-size: 10px; background: url(../images/btn_dark.jpg) top center repeat-x #999; border: 1px solid #e2e2e2; box-shadow: #333333 0px 0px 10px;  }
	.compose a { display:block; padding: 4px 10px 6px 10px; text-decoration: none; color: #e8e8e8; }
	.compose a:hover { background: url(../images/container-fade.png) center left repeat-x; }

.mail {}
	.mail a { border-top: 1px solid #aeaeae; }
		.mail a:hover { border-top: 1px solid #09F; text-decoration: none; }
	.mail .options { font-size: 12px; padding-top:10px; }
.mailbox {
	padding: 5px 0px 0px 0px;
}
	.mailbox th {
		padding: 5px 5px 5px 5px; margin: 0px 0px 0px 0px;
		border-bottom: 1px solid #FFFFFF;
	}
		.mailbox .blank { background: none; cursor: default;}
	.mailbox tr, .question form .q {
		background: url(../images/container-fade.png) left 75% repeat-x;
		cursor: copy;
	}
		.mailbox tr:hover, .question form .q:hover { background-position: left 100%; }
	.mailbox td, .question form .q {
		padding: 5px 10px 5px 10px;
		border-top: 1px solid #cacaca;
		border-bottom: 1px solid #FFFFFF;
	}

/* Layout */
.sider { 
	width: 300px; border-right: 2px solid #FFFFFF;
	box-shadow: #4e4e4e 0px 0px 10px; height: 100%;
	padding: 15px 0px 0px 0px; position: fixed;
	background: url(../images/bg-sider.png) left top repeat; margin: 0px 0px 0px 0px;
}
	.sider p a img { box-shadow:  #9e9e9e 0px 0px 10px -2px; }
	.sider p a:hover img { box-shadow:  #7e7e7e 0px 0px 10px -2px; }
	
	.sider .container:hover { box-shadow: #7e7e7e 0px 0px 20px; }
	.sider .container h1 { font-size: 18px; }
	.sider .user img { float:left; margin: 0px 5px 5px 5px; min-width: 95px; min-height: 95px; max-width: 125px; max-height: 125px; }
	.sider .user p { padding: 15px 0px 0px 0px; font-size: 14px;}
	.sider .user ul {
		list-style: none; padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
	}
		.sider .user ul li a { color: #FFFFFF; text-decoration: none; padding: 5px 5px 5px 5px; font-size: 15px; display: block; }
		.sider .user ul li {
			list-style: none; display: block;
			color: #FFFFFF; background: #3e3e3e;
			margin: 5px 7px 5px 0px;
		}
		.sider .user ul li:hover { background: #09F; }
.winmain { margin: 0px 0px 0px 0px; }
	.winmain .overflow { overflow: hidden; padding: 10px 0px 10px 0px; }
	.winmain .col2 {
		width: 49%; margin: 5px 0px 5px 0px;	
	}
	.winmain .col3 {
		width: 32%;	
	}
		.winmain .overflow .left, .winmain .overflow .right { margin-top: 0px; }

.progress {
	border: 1px solid #FFFFFF;
	background: #BEBEBE;
	margin-right: 10px;
	box-shadow: #9e9e9e 0px 0px 10px;
	font-size: 15px;
	height: 31px;
	overflow: hidden;
	color: #FEFEFE;
	font-weight: bold;
}
	.progress .name { float:left; padding: 5px 5px 5px 5px; }
	.progress .percent { float: right; padding: 5px 5px 5px 5px; }
	.progress .pbar { background: #3C0; height: 29px; width: 500px; margin: 1px 0px 1px 1px; border-right: 1px solid #FFFFFF; }

.complete {
	width: 500px;
	border: 1px solid #FFFFFF;
	box-shadow: #9e9e9e 0px 0px 10px;
	margin: 0px auto 0px auto;
	font-size: 15px;
	font-weight: bold;
	padding: 5px 5px 5px 5px;
	color: #FFFFFF;
	background: #3C0;
}

.sbar { background: #cecece; height: 3px; margin: 5px 5px 0px 15px; }
	.sbar div { background: #090; height: 3px; margin: 0px 0px 0px 0px; }
	
.stats {
	width: 510px;
	border: 1px solid #FFFFFF;
	margin: 10px auto 10px auto;
	box-shadow: #8e8e8e 0px 0px 10px;
	background: #FFFFFF;	
}
	.stats p {
		padding: 2px 5px 2px 5px;
		margin: 3px 0px 3px 0px;
		font-weight: bold;
		font-size: 14px;
		overflow:hidden;	
	}

.questions {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
	.questions .q { margin: 0px 0px 0px 0px; }
	.questions .button {
		padding: 5px 5px 5px 5px; margin: 0px 0px 0px 0px;
		border-top: 1px solid #cacaca;
		background: #f5f5f5;
	}
	.questions input[type='submit'] {
		margin: 5px 5px 5px 75px;
		padding: 5px 5px 5px 5px;
		background: #09C;
		color: #ececec; cursor: pointer;
		border: 1px solid #FFFFFF;
		box-shadow: #9e9e9e 0px 0px 10px;
	}
		.questions input[type='submit']:hover {
			background: #069;	
		}

.topbar {
	margin: 0px 0px 20px 0px;
	padding: 0px 5px 5px 5px;
	border-bottom: 2px solid #FFFFFF;
	box-shadow: #9e9e9e 0px 5px 10px;
	background: #3f3f3f;
	color: #DCDCDC;
	text-align: right;
	min-width: 500px;
}
	.topbar form { padding-top: 5px; }
	.topbar a { color: #FFFFFF; border-bottom: 1px solid #FFFFFF; text-decoration: none;}
	.topbar a:hover { border: none; }
	.topbar label { padding-right: 10px; padding-left: 5px;}
	.topbar ul { list-style: none; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; }
	.topbar ul li { list-style: none; padding: 5px 10px 5px 10px; margin: 0px 0px 0px 0px; float: left; }
		.topbar .quizs { display:block; background: url(../images/quiz-icon.png) center center no-repeat; width: 25px; height: 25px; border: none; }
	.topbar ul li:hover { padding: 5px 9px 3px 9px; border-left: 1px solid #2f2f2f; border-right: 1px solid #2f2f2f; background: url(../images/fade-white.png) left bottom repeat-x; }
		.topbar ul li ul { display: none; font-size: 13px; border: 1px solid #FFFFFF; border-top: none; box-shadow: #9e9e9e 0px 5px 10px; }
		.topbar ul li:hover ul { font-weight: bold; display:block; float:left; background: #3f3f3f; position: absolute; margin: 3px 0px 0px -12px; }
		.topbar ul li ul li { display: block; float: none; padding: 10px 10px 5px 10px; margin: 0px 1px 2px 1px; min-height: 18px; }
			.topbar ul li ul li:hover { border: none; padding: 10px 10px 5px 10px; background: #2e2e2e; }
			.topbar ul li ul li a { border: none; }
	
/* Float and Clears */
.left { float: left; }
.right { float: right; }
.clear { clear:both; }
.blank { background: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; border: none; }

/*/ Popup Div Setup /*/
.visible { 
	display: block;
	position: fixed;
	top: 35px;
	right: auto;
	z-index: 11;
	width: 500px;
}
.hidden { 
	display: none;
	position: fixed;
	top: 35px;
	right: auto;
	z-index: 11;
	width: 500px;
}
	.ppTop {
		width: 500px;
		height: 31px;
		background: url(../images/popup-top.png) top left no-repeat;
	}
	.ppBottom {
		width: 500px;
		height: 31px;
		background: url(../images/popup-bottom.png) bottom left no-repeat;
	}
	.ppBody {
		width: 500px;
		padding: 10px;
		background: url(../images/popup-bg.png) top left repeat-y;
	}
	.ppInfo {
		padding: 5px 0px 5px 0px;
		margin: 0px auto 0px auto;
		width: 460px;
		max-height: 350px;
		overflow: auto;
		color: #212121;
	}
		.ppInfo img {
			padding: 7px 5px 5px 7px;
		}
	
/* Tutorials */
.tutIcon {
	float: left;
	width: 198px;
	border: 1px solid #9f9f9f;
	margin: 5px 10px 5px 10px;
}

	/*/ Page Next/Previous /*/
	.page {
		text-align: right;
		clear:both;
	}
		.page ul {
			list-style-type: none;
			padding: 0px 0px 0px;
			margin: 0px 0px 0px 0px;
			float:right;
			width: 250px;
		}
			.page ul li a { text-decoration: none; }
			
			.page ul li {
				float: left;
				background: url(../images/container-fade.png) left -35px repeat-x #FFFFFF;
				list-style-type: none;
				box-shadow: #8e8e8e 0px 0px 15px;
				padding: 6px 6px 6px 6px;
				margin: 0px 2px 0px 2px;
				border: 1px solid #FFFFFF;
			}
			.page ul li:hover, .page ul li.active {
				background: url(../images/container-fade.png) left -50px repeat-x #FFFFFF;	
			}