/* Setting up the page to resemble the portal theme. */
body {
	font-family: verdana;
}

div#left_sidebar {
	width: 22%;
	border-radius: 10px;
	background-color: #eee;
	padding: 10px;
	min-height: 100%;
	float: left;
	margin-right: 10px;
}

div#main_content {
	min-width: 70%;
	float: left;
	border: 1px solid #888;
	border-radius: 10px;
	padding: 10px;
	text-align: center;
}

div#main_content h1 {
	font-weight: normal;
	padding: 0;
	margin: 0;
}

/* Layout out the elements and setting the dimensions for the collapsed course train box. */
.courseTrainBox {
	margin: 10px 0;
	border: 5px solid #ccc;
	border-radius: 12px;
	min-height: 100px;
	padding: 5px;
	display: block;
	width: auto;
	min-width: 700px;
	background: #ffffff;
	clear: both;
	box-shadow: 0px 0px 3px #cccccc;
}

.courseTrainBox:hover {
	box-shadow: 0px 0px 6px #666666;
	cursor: hand;
}

#courseTrainBox_totals {
	border: 5px solid #888;
	box-shadow: none;
}

#courseTrainBox_totals:hover {
	box-shadow: none;
	cursor: default;
}

.trainImg {
	float: left;
	height: 100px;
	width: 100px;
	margin-right: 10px;
	border-radius: 4px;
	display: block;
}

.courseInfo {
	float: left;
	text-align: left;
	display: block;
	min-width: 220px;
	cursor: pointer;
	cursor: hand;
}

.courseInfo .courseTrainName {
	font-size: 20px;
	line-height: 25px;
	font-weight: normal;
	padding: 0;
	margin: 0;
	max-height: 75px;
	vertical-align: center;
	text-wrap: normal;
	display: inline;
}

span.numPartsInTrain {
	background-image: url('./images/coursepart_icon.png');
	background-position: center left;
	background-repeat: no-repeat;
	padding-left: 20px;
	margin-left: 25px;
	text-transform: uppercase;
	color: #aaa;
	font-weight: normal;
	font-size: 12px;
	display: block;
	height: 15px;
	margin-top: 10px;
}

span.numEnrollmentsInTrain {
	background-image: url('./images/student-icon-filled.png');
	background-position: center left;
	background-repeat: no-repeat;
	padding-left: 20px;
	margin-left: 25px;
	text-transform: uppercase;
	color: #aaa;
	font-weight: normal;
	font-size: 12px;
	display: block;
	margin-top: 10px;
}

/* All CSS for the expanded course train should be contained from here down. */
/* Expanded Train CSS */
.courseTrainBox .coursePartDrawer {
	display: none;
}

.courseTrainBox.trainExpanded .coursePartDrawer {
	background: rgb(205, 223, 233);
	display: block;
	clear: both;
	text-align: left;
	border-top: 5px solid #ccc;
	margin: -5px;
	padding: 5px;
	box-shadow: inset 0 0 5px #82a8bb;
}

.courseTrainBox .coursePartDrawer .coursePart {
	background-color: #fff;
	border: 1px solid #aaa;
	padding: 5px;
	/*	height: 20px;*/
	height: auto !important;
	border-radius: 3px;
	margin: 5px;
	position: relative;
}

.courseTrainBox .coursePartDrawer .coursePart.not_enrolled {
	background-color: #ccc;
	color: #fff;
	background-image: url('./images/lock_round.png');
	background-repeat: no-repeat;
	background-position: center;
	opacity: .6;
	border-bottom: none;
	border: 1px solid #aaa;
}

.courseTrainBox .coursePartDrawer .coursePart.final {
	opacity: .6;
}

/* Hover States for coursePart types */
.courseTrainBox .coursePartDrawer .coursePart:hover {
	box-shadow: 0px 0px 5px #82a8bb;
}

.courseTrainBox .coursePartDrawer .coursePart.final:hover {
	opacity: 1;
}

.courseTrainBox .coursePartDrawer .coursePart.not_enrolled:hover {
	box-shadow: none;
	opacity: .8;
}

/* Styles for the coursePart number and section code based on the part type */
.courseTrainBox .coursePartDrawer .coursePart .coursePart_num {
	font-size: 10px;
	text-transform: uppercase;
	font-weight: bold;
	display: inline-block;
	width: 50px;
	line-height: 20px;
	text-align: right;
	float: left;
	border-right: 1px solid #878787;
}

.coursePart_sectioncode {
	text-transform: uppercase;
	font-size: 10px;
	display: inline-block;
	color: #757575;
	line-height: 20px;
	font-weight: normal;
	float: left;
}

.coursePart_numEnrollments {
	background-image: url('./images/student-icon-filled.png');
	background-position: center left;
	background-repeat: no-repeat;
	padding-left: 20px;
	text-transform: uppercase;
	font-size: 10px;
	color: #757575;
	line-height: 20px;
	font-weight: normal;
	float: right;
	position: absolute;
	right: 270px;
}

.courseTrainBox .coursePartDrawer .coursePart.not_enrolled .coursePart_sectioncode
	{
	color: #fff;
	font-weight: normal;
}

/* Course part details (section and teachers) */
.coursePartDetails {
	height: 20px;
	display: block;
	position: relative;
}

.coursePartDetails p {
	margin: 0;
	padding: 0;
	font-size: 11px;
	line-height: 14px;
}

.coursePartDetails p.teachers {
	text-align: left;
	float: none;
	padding-top: 3px;
	margin-top: 7px;
}

.coursePartDetails p.teachers a {
	background-image: url('./images/messageicon.png');
	background-repeat: no-repeat;
	background-position: 35px center;
	height: 16px;
	display: inline-block;
	text-decoration: none;
	padding: 2px 0;
	margin: -2px 0;
	clear: right;
	text-transform: uppercase;
	width: 49px;
	margin-right: 7px;
	padding-right: 8px;
	border-right: 1px dotted #ccc;
	opacity: .7;
}

.coursePartDetails p.teachers a:hover {
	opacity: 1;
}

/* Display the student's progress in the course part. */
.coursePartProgress {
	width: 400px;
	height: 50px;
	float: right;
	display: block;
	text-align: right;
	margin-top: -50px;
}

.coursePartProgress p {
	margin: 0;
	font-size: 10px;
	line-height: 10px;
	padding: 0;
	float: right;
	text-align: right;
	width: 370px;
	margin-top: 1px;
	margin-bottom: 7px;
}

.coursePartProgress p span {
	width: 165px;
	font-size: 10px;
	line-height: 20px;
	display: inline-block;
}

.coursePartProgress p span.progress_7day {
	text-align: right;
	padding-right: 15px;
}

.coursePartProgress p span.progress_overall {
	text-align: left;
	padding-left: 14px;
	border-left: 1px solid #878787;
}

.coursePart .progressBarWrapper {
	width: 360px;
	background-color: #ddd;
	padding: 2px 0;
	border: 0 1px;
	border-radius: 3px;
	margin-bottom: 0;
	float: right;
	overflow: hidden;
}

.coursePart .progressBarInner {
	height: 14px;
	background: #75b476;
	font-size: 10px;
	line-height: 14px;
	text-align: right;
	color: #000;
	padding: 2px 0;
}

.coursePartProgress .progressBarInner span {
	display: inline-block;
	margin: 0 10px;
}

/* Collapsed Train Box */
.courseTrainBox .coursePartDrawer {
	display: none;
}

/* 
	Alerts and teacher-specific structures begin here.

	Alert icons are displayed with a CSS sprite, and all alert images are contained within the 
	teacherPortalSpriteVersion5.png image. The position of each specific alert icon is defined in the relevant 
	CSS classes.

	It may be necessary to modify the path of teacherPortalSpriteVersion5.png depending on the location of the image.
*/
.trainAlerts {
	list-style: none;
	padding: 0;
	margin: 0;
	float: right;
	margin-right: 20px;
	margin-top: 20px;
}

.trainAlerts li {
	display: inline;
	padding: 10px;
	margin: 0;
	position: relative;
}

.trainAlerts .teacherAlert {
	background-image: url('./images/teacherPortalSpriteVersion5.png');
	background-repeat: no-repeat;
	width: 40px;
	height: 40px;
	display: inline-block;
	cursor: default;
	text-decoration: none;
	position: relative;
}

.trainAlerts .teacherAlert span.badge {
	font-weight: bold;
	font-family: arial;
	color: #fff;
	background-color: #598527;
	text-align: center;
	font-size: 10px;
	line-height: 16px;
	height: 16px;
	padding: 0 5px;
	position: absolute;
	top: 25px;
	display: block;
	right: -2px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	behavior: url(/suite/PIE_uncompressed.htc);
}

.trainAlerts .teacherAlert span {
	line-height: 0;
	font-size: 0;
	bottom: 0px;
	right: 0px;
	color: transparent;
	position: absolute;
}

.trainAlerts .teacherAlert:hover span.alertText {
	font-family: arial;
	color: #fff;
	text-align: center;
	font-size: 10px;
	line-height: 10px;
	padding: 3px;
	position: absolute;
	z-index: 5;
	bottom: -20px;
	right: 0px;
	margin: 0 auto;
	white-space: nowrap;
	opacity: .8;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	behavior: url(/suite/PIE_uncompressed.htc);
}

.trainAlerts .teacherAlert.green span {
	background-color: #598527;
}

.trainAlerts .teacherAlert.yellow span {
	background-color: #ffc000;
}

.trainAlerts .teacherAlert.red span {
	background-color: #9e0b0f;
}

.trainAlerts .teacherAlert.inactive span {
	background-color: #eeeeee;
	visibility: hidden;
}

.trainAlerts .teacherAlert.gradebook.inactive {
	background-position: 0px 0px;
}

.trainAlerts .teacherAlert.intervention.inactive {
	background-position: -40px 0px;
}

.trainAlerts .teacherAlert.forum.inactive {
	background-position: -80px 0px;
}

.trainAlerts .teacherAlert.restrictions.inactive {
	background-position: -120px 0px;
}

.trainAlerts .teacherAlert.complete.inactive {
	background-position: -160px 0px;
}

.trainAlerts .teacherAlert.rejected.inactive {
	background-position: -200px 0px;
}

.trainAlerts .teacherAlert.closures.inactive {
	background-position: -240px 0px;
}

.trainAlerts .teacherAlert.gradebook.red {
	background-position: 0px -40px;
}

.trainAlerts .teacherAlert.intervention.red {
	background-position: -40px -40px;
}

.trainAlerts .teacherAlert.forum.red {
	background-position: -80px -40px;
}

.trainAlerts .teacherAlert.restrictions.red {
	background-position: -120px -40px;
}

.trainAlerts .teacherAlert.complete.red {
	background-position: -160px -40px;
}

.trainAlerts .teacherAlert.rejected.red {
	background-position: -200px -40px;
}

.trainAlerts .teacherAlert.closures.red {
	background-position: -240px -40px;
}

.trainAlerts .teacherAlert.gradebook.yellow {
	background-position: 0px -80px;
}

.trainAlerts .teacherAlert.intervention.yellow {
	background-position: -40px -80px;
}

.trainAlerts .teacherAlert.forum.yellow {
	background-position: -80px -80px;
}

.trainAlerts .teacherAlert.restrictions.yellow {
	background-position: -120px -80px;
}

.trainAlerts .teacherAlert.complete.yellow {
	background-position: -160px -80px;
}

.trainAlerts .teacherAlert.rejected.yellow {
	background-position: -200px -80px;
}

.trainAlerts .teacherAlert.closures.yellow {
	background-position: -240px -80px;
}

.trainAlerts .teacherAlert.gradebook.green {
	background-position: 0px -120px;
}

.trainAlerts .teacherAlert.intervention.green {
	background-position: -40px -120px;
}

.trainAlerts .teacherAlert.forum.green {
	background-position: -80px -120px;
}

.trainAlerts .teacherAlert.restrictions.green {
	background-position: -120px -120px;
}

.trainAlerts .teacherAlert.complete.green {
	background-position: -160px -120px;
}

.trainAlerts .teacherAlert.rejected.green {
	background-position: -200px -120px;
}

.trainAlerts .teacherAlert.closures.green {
	background-position: -240px -120px;
}

/* Section Level Alerts */
.sectionAlerts {
	list-style: none;
	padding: 0;
	margin: 0;
	float: right;
	position: absolute;
	right: 5px;
	top: 5px;
}

.sectionAlerts li {
	display: inline;
	margin: 0;
	padding: 2px;
}

.sectionAlerts .teacherAlert {
	width: 40px;
	height: 20px;
	display: inline-block;
	cursor: default;
	text-decoration: none;
	position: relative;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	behavior: url(/suite/PIE_uncompressed.htc);
}

.sectionAlerts .teacherAlert span.badge {
	font-weight: bold;
	font-family: arial;
	color: #fff;
	text-align: right;
	font-size: 10px;
	line-height: 16px;
	padding: 0 2px;
	display: inline-block;
	position: absolute;
	right: 2px;
	top: 2px;
}

.sectionAlerts .teacherAlert.green {
	background-color: #598527;
}

.sectionAlerts .teacherAlert.yellow {
	background-color: #ffc000;
}

.sectionAlerts .teacherAlert.red {
	background-color: #9e0b0f;
}

.sectionAlerts .teacherAlert.inactive {
	background-color: #eaeaea;
	opacity: .5;
}

.sectionAlerts .teacherAlert.inactive span.badge {
	visibility: hidden;
}

.sectionAlerts .teacherAlert span.alertText {
	background-image: url('./images/teacherPortalSpriteVersion5.png');
	background-repeat: no-repeat;
	line-height: 0;
	font-size: 0;
	color: transparent;
	position: absolute;
	width: 16px;
	height: 16px;
	left: 2px;
	top: 2px;
}

.sectionAlerts .teacherAlert.gradebook span.alertText {
	background-position: -245px 0px;
}

.sectionAlerts .teacherAlert.intervention span.alertText {
	background-position: -245px -16px;
}

.sectionAlerts .teacherAlert.forum span.alertText {
	background-position: -245px -32px;
}

.sectionAlerts .teacherAlert.restrictions span.alertText {
	background-position: -245px -48px;
}

.sectionAlerts .teacherAlert.complete span.alertText {
	background-position: -245px -64px;
}

.sectionAlerts .teacherAlert.rejected span.alertText {
	background-position: -245px -83px;
}

.sectionAlerts .teacherAlert.closures span.alertText {
	background-position: -270px -47px;
}

.sectionTools {
	list-style: none;
	padding: 0;
	margin: 0;
	display: inline-block;
	padding: 0 5px;
	margin: 0 5px;
	border-right: 1px solid #878787;
	float: left;
}

.sectionTools li {
	display: inline-block;
	float: left;
	margin: 0;
	padding: 0;
}

.teacherCourseTools {
	width: 16px;
	height: 16px;
	margin: 2px;
	font-size: 0px;
	line-height: 0px;
	color: transparent;
	display: inline-block;
	float: left;
	background-image: url('./images/teacherPortalSpriteVersion5.png');
	background-repeat: no-repeat;
	opacity: .6;
}

.teacherCourseTools:hover {
	opacity: 1;
}

.teacherCourseTools.sectionGradebook {
	background-position: -270px 0px;
}

.teacherCourseTools.coursePreview {
	background-position: -270px -16px;
}

.teacherCourseTools.courseControlPanel {
	background-position: -270px -32px;
}

p.courseTrainType {
	font-size: 12px;
	text-transform: uppercase;
	padding: 0;
	margin: 0;
}

.studentHeaderXL {
	background-color: #8C8E8C;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: bold;
	color: #000000;
	padding: 0px 4px 0px 4px;
	height: 60px;
	background-image: URL(images/gradeXL_headerBg.gif);
	background-repeat: no-repeat;
	background-position: right;
}