/****************************************************************
 ********                      BODY                      ********
 ****************************************************************/

body {
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #111111;
	line-height: 17px;
}

/****************************************************************
 ********                     LINKS                      ********
 ****************************************************************/

a:link, a:active, a:visited {
	text-decoration: none;
	border-bottom: 1px solid #88CDCD;
	color:#008888;
}

a:hover {
	text-decoration: none;
	color: #003333;
	border-bottom-color: #003333;
}

a.plain {
	border-bottom: none;
}

/****************************************************************
 ********                   PAGE LINKS                   ********
 ****************************************************************/

ul.pageLinks {
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.pageLinks li {
	display: block;
	float: left;
	padding: 0 2em 1em 0;
}

ul.pageLinks li.last {
	border-right: none;
}

ul.pageLinks a.icon {
	border: none;
}

ul.pageLinks img.icon {
	margin: 0;
	padding-right: 0.5em;
}

a.button {
	padding: 5px 10px;
	border: 1px solid #BBBBBB;
	border-top-color: #DDDDDD;
	border-left-color: #DDDDDD;
	background-color: #F4F4F4;
}

a.button:hover {
	background-color: #DDDDDD;
	border-color: #888888;
	border-top-color: #BBBBBB;
	border-left-color: #BBBBBB;
}

a.button:active {
	background-color: #BBBBBB;
	border-color: #DDDDDD;
	border-top-color: #888888;
	border-left-color: #888888;
}

a.button img {
	margin-right: 0.5em;
}

/****************************************************************
 ********                     IMAGES                     ********
 ****************************************************************/

img {
	border: none;
}

img.icon {
	vertical-align: bottom;
	margin-right: 0.5em;
}

/****************************************************************
 ********                        HR                      ********
 ****************************************************************/

div.hr {
	margin: 15px 0px;
	border-top: 1px solid #88CDCD;
}

/****************************************************************
 ********                     LISTS                      ********
 ****************************************************************/

ul, ol {
	margin: 17px 0;
	padding-left: 25px;
}


/****************************************************************
 ********                  FONT STYLE                    ********
 ****************************************************************/

h1, h2, h3, h4, h5, h6 {
	font-family: Arial, sans-serif;
	font-weight: bold;
	margin: 17px 0;
	line-height: 1.1em;
}

p {
	margin: 17px 0;
}

h1 { font-size: 22px; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }
h4 { font-size: 12px; }
h5 { font-size: 12px; }
h6 { font-size: 12px; }

h1.displayTitle {
	font-size: 18px;
	margin: 0;
	padding: 0 0 0.667em 0;
}

.big {
	font-size: 1.5em;
}

.quiet, a.quiet {
	color: #888888;
	border-bottom-color: #CCCCCC;
}

.quieter, a.quieter {
	color: #BBBBBB;
	border-bottom-color: #DDDDDD;
}

a.quiet:hover {
	color: #333333;
}

a.quieter:hover {
	color: #666666;
}

.underline {
	border-bottom: 1px solid #88CDCD;
	padding-bottom: 0.15em;
}

/****************************************************************
 ********                  INFO BOX                      ********
 ****************************************************************/

.infoBox {
	margin: 17px 0; 
	padding: 0 17px; 
	border:1px solid #88cdcd; 
	background-color:#ecf9f9	
}

/****************************************************************
 ********                LAYOUT TABLE                    ********
 ****************************************************************/

table.layout {
	width: 100%;
}

table.layout, table.layout td, table.layout th {
	border: none;
	margin: 0;
	padding: 0;
	vertical-align: top;
}


/****************************************************************
 ********                 PAGE LAYOUT                    ********
 ****************************************************************/

.clearfix {
	clear: both;
}

.wrapper {
	margin: auto;
	text-align: left;
	width:763px;
}

#topNavigation {
	background-color: #007070; 
	line-height: 23px;
	background-image: url(../images/layout/navbar.png);
	background-repeat: no-repeat;
	height: 25px;
	color: #B8E0E0;
}

	#topNavigation ul.appNav {
		float: left;
		list-style: none;
		padding: 0;
		margin: 0;
	}
	
		#topNavigation ul.appNav li {
			float: left;
			height: 25px;
			background-image: url(../images/layout/navbar_divider.png);
			background-repeat: no-repeat;
			background-position: right;
		}
	
	#topNavigation ul.userNav {
		float: right;
		list-style: none;
		padding: 0;
		margin: 0;
	}
		#topNavigation ul.userNav li {
			float: left;
			height: 25px;
			background-image: url(../images/layout/navbar_divider.png);
			background-repeat: no-repeat;
			background-position: left;
		}	
	
	#topNavigation a {
		color: #B8E0E0;
		text-decoration: none;
		border: none;
	}
	
	#topNavigation li * {
		padding: 6px 18px; /* 6px top + 12px text height + 6px bottom = 24px total height */
		text-shadow: 0px -1px 0px #004444;
	}
	
	#topNavigation a:hover {
		color: #ffffff;
	}

#topContent {
	clear: both;
	padding: 5px 0;
	border-bottom: 1px solid #88cdcd;
}	
	#topContent h1 {
		float: left;
		margin: 0;
	}
	
	#topContent h1 span {
		display: none;
	}
	
	#topContent div.schoolName {
		text-align: center;
		font-size: 16px;
		font-weight: bold;
	}

#flashNotice {
	padding: 5px 20px;
	background-color: #FFFBE2;
	border: 1px solid #FFE222;
	text-align: center;
	display: block;
	margin: 17px auto;
}

#middle {
	clear: both;
}

#headBlock, #footBlock {
	background-color: #ECF9F9;
	padding: 1em 1.5em 0 1.5em;
}

#headBlock {
	margin-bottom: 0;
}

#footBlock {
	border-top: 1px solid #88CDCD;
	margin-top: 1.5em;
}

#footer {
	clear: both;
	color: #999;
	font-size: 11px;
	border-top: 1px dashed #CCCCCC;
	margin: 17px 0;
	padding-top: 17px;
}

	#footer a {
		color: #999999;
		border-bottom: 1px solid #DDDDDD;
	}
	
	#footer a:hover {
		color: #666666;
	}
	
	#footer div.block {
		float: left;
		width: 150px;
		margin-right: 50px;
	}
	
	#footer div.first {
		margin-left: 130px;
	}
	
	#footer div.last {
		margin-right: 0;
	}
	
	#footer h3 {
		color: #666;
		font-size: 11px;
		font-weight: bold;
		line-height: inherit;
		margin: 0;
	}
	
	#footer ul {
		margin: 0;
		padding: 0;
	}
	
	#footer ul li {
		list-style: none;
	}

.hidden {
	display: none;
	visibility: hidden;
}

.visible {
	display: block;
	visibility: visible;
}

/****************************************************************
 ********                    SEARCH FORM                 ********
 ****************************************************************/

div.topSearch { 
	float: right;
}

div.topSearch form {
	float: left;
	display: inline;
}

div.topSearch form .text {
	width: 120px;
	height: 14px;
	padding:3px 5px;
	float: left;
}

div.topSearch form .disabled {
	color: #999;
}

div.topSearch form .image {
	display: block;
	margin: 0px;
	padding: 0px;
	float: left;
}


/****************************************************************
 ********                   COLUMN SPLITS                ********
 ****************************************************************/

div.bigSmallSplit div.leftColumn {
	clear: both;
	float:left;
	width: 470px;
}

div.bigSmallSplit div.rightColumn {
	float:left;
	width: 230px;
	padding-left: 20px;
}


div.evenSplit div.leftColumn {
	float:left;
	width: 340px;
}

div.evenSplit div.rightColumn {
	float:left;
	width: 340px;
	padding-left: 20px;
}

div.smallBigSplit div.leftColumn {
	float:left;
	width: 230px;
}

div.smallBigSplit div.rightColumn {
	float:left;
	width: 470px;
	padding-left: 20px;
}

div.bigSmallSplit h3 {
	margin-top: 0;
}

/****************************************************************
 ********                     HELP                       ********
 ****************************************************************/

table.help {
	width: 100%;
	border-bottom: 1px solid #88CDCD;
	border-top: 1px solid #88CDCD;
	margin: 0px;
	clear: both;
}
table.help.spaced h2 {
	padding-bottom: 5px;
	margin-bottom: 12px;
	border-bottom: 1px solid #88CDCD;
}
table.help.spaced p {
	margin-bottom: 17px;
}

table.help.spaced p.last {
	margin-bottom: 0px;
}

table.help td {
	vertical-align: top;
	padding: 10px 20px;
}

table.help td.first {
}

table.help td.last {
	
}

table.help h1,
table.help h2,
table.help p {
	margin-top: 0px;
	margin-bottom: 0px;
}

table.help h3 {
	margin-top: 0px;
	margin-bottom: 3px;
}

p.helpLink {
	float: right;
}

/****************************************************************
 ********                     DATA GRID                  ********
 ****************************************************************/
 
table.grid {
	border-collapse: collapse;
	border: 1px solid #88CDCD;
	width: 100%;
	background-color: #FFFFFF;
}
	table.grid tr th {
		vertical-align: bottom;
		font-weight: bold;
	}

	table.grid tr td {
		vertical-align: top;
	}
	
	table.grid tr th,
	table.grid tr td {
		padding: 3px 10px;
	}

	table.grid thead {
		background-color: #ECF9F9;
	}
	
	table.grid tbody {
		border-bottom: 1px solid #88CDCD;
		border-top: 1px solid #88CDCD;
	}
	
	table.grid tbody tr.even {
		background-color: #ECF9F9;
	}
	
	table.grid tbody tr.odd {
		background-color: #FFFFFF;
	}
	
	table.grid th.text
	{
		text-align: left;
	}
	
	table.grid th.boolean,
	table.grid td.boolean {
		text-align: center;
	}
	
	table.grid td.link a.spaced {
		margin-left: 10px;
	}
	
	table.grid td.spaced a {
		margin-left: 10px;
	}
	
	table.grid td.link a.plain {
		text-decoration: none;
	}
	
	table.grid th.number,
	table.grid td.number,
	table.grid th.date,
	table.grid td.date,
	table.grid td.action,
	table.grid th.action,
	table.grid th.link,
	table.grid td.link {
		text-align: right;
	}
	
	table.grid tfoot {
		background-color: #ECF9F9;
	}
		
		table.grid tfoot tr td {
			padding: 3px 10px;
		}
		
		table.grid tfoot tr td.pagination {
			text-align: center;
		}
	
	table.grid tbody tr td form {
		display: inline;
	}
	
	table.grid tbody tr td input[type="submit"],
	table.grid tbody tr td button {
		padding: 1px 7px;
	}
	
	table.grid tbody tr td.action form div {
		display: inline;
	}
	
	table.grid tbody tr td.emptyMessage {
		padding: 5px 10px;
		color: #888;
	}
		
/****************************************************************
 ********                   COURSE VIEW                  ********
 ****************************************************************/

h1.courseName {
	float: left;
}

ul.courseLinks {
	padding: 0;
	float: right;
	margin-top: 15px;
}

ul.courseLinks li {
	margin-left: 10px;
	list-style: none;
	float: left;
}

/****************************************************************
 ********                   COURSE TASKS                 ********
 ****************************************************************/

table.courseTasks {
	clear: both; 
	border-collapse: collapse;
	width: 100%;
}

table.courseTasks,
table.courseTasks tbody tr td {
	border: 1px solid #88CDCD;
}

table.courseTasks tbody tr td.emptyMessage {
	padding: 10px 20px;
	color: #888888;
}


td.taskPreview {
	padding: 4px 10px;
	cursor: pointer;
}

td.taskPreview span.taskDueDate {
	display: block;
	float: left;
	width: 100px;
}

span.taskDueDate.past {
	text-decoration: line-through;
}

td.taskPreview div.taskPreviewLine {
	float: left;
	width: 290px;
	white-space: nowrap;
	overflow: hidden;
}

td.taskDetail {
	padding: 0;
}

td.taskDetail div.head {
	padding: 4px 10px;
	height: 14px;
	background-color: #ECF9F9;
	cursor: pointer;
}

td.taskDetail div.body {
	padding: 0 20px;
}

td.taskDetail div.body div.askLink {
	float: right;
}

td.taskDetail div.body div.inquiryForm {
}

td.taskDetail div.body div.inquiryForm textarea {
	margin: 17px 0 10px 0;
	width: 425px;
	height: 100px;
}

td.taskDetail span.taskDueDate {
	display: block;
	float: left;
	width: 100px;
}

td.taskDetail div.taskText {
	margin: 10px 20px;
}

td.taskPreview span.taskType,
td.taskDetail span.taskType {
	margin-right: 5px;
	font-weight: bold;
}

td.taskPreview span.taskText {
	color: #888888;
}

div.revealArrow {
	float: right;
	font-size: 8px;
	line-height: 14px;
	margin-left: 10px;
}

div.taskNavigator {
	margin: 5px 10px;
	text-align: center;
}

div.taskNavigator div.tasksBefore {
	float: left;
}

div.taskNavigator div.tasksAfter {
	float: right;
}


div.courseTask {
	border: 1px solid #88CDCD;
	padding: 0 17px;
	margin-bottom: 10px;
}

/****************************************************************
 ********                 COURSE BULLETINS               ********
 ****************************************************************/

.courseBulletins span.bulletinDate {
	margin-right: 20px;
}

/****************************************************************
 ********                   COURSE LIST                  ********
 ****************************************************************/

table.courseList {
	width: 100%;
}

table.courseList td {
	padding: 17px 0;
}

div.courseTeacher {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 2px;
}

/****************************************************************
 ********                  RAILS ERRORS                  ********
 ****************************************************************/

div.errorExplanation {
	border: 2px solid #FF8000;
	margin: 11px 0px;
}

div.errorExplanation h2 {
	background-color: #FF8000;
	font-size: 11px;
	color: #fff;
	margin: 0px;
	padding: 3px 10px;
	font-family: inherit;
}

div.errorExplanation p {
	margin: 10px 20px;
}

div.fieldWithErrors {
	display: inline;
}

/****************************************************************
 ********                   PRINT PAGE                   ********
 ****************************************************************/

table.printGrid {
	border: none;
	border-collapse:collapse; 
	font-size: 8pt;
	width: 100%;
}

table.printGrid tr {
	border-top: 1px solid black;
	border-bottom: 1px solid black;
}

table.printGrid tr th {
	background-color: #cccccc;
	padding: 1em 2em;
	font-size: 1.25em;
}

table.printGrid tr td {
	padding: 0 4em;
}

table.printGrid tr th,
table.printGrid tr td {
	border: none;
	text-align: left; 
}

div.printDisclaimer {
	text-align: center;
	font-style: italic;
	margin: 13px;
}

/****************************************************************
 ********                     STATS                      ********
 ****************************************************************/

table.stats th, table.stats td {
	padding: 5px;
}

table.stats th {
	font-size: 2em;
	font-weight: normal;
	text-align: right;
}

/****************************************************************
 ********                     PLANS                      ********
 ****************************************************************/

div.plans div.plan {
	border: 1px solid #88CDCD;
	padding: 3px 10px;
	margin-bottom: 15px;
}

/****************************************************************
 ********              TEACHER CONTROL PANEL             ********
 ****************************************************************/

div.courseBlock {
	background-color: #ECF9F9;
	border: 1px solid #AADDDD;
	padding: 10px;
	margin: 10px 0;
	line-height: 17px;
}

div.courseBlock div.courseName {
	font-weight: bold;
}

div.courseBlock div.courseInfo,
div.courseBlock div.courseLinks {
	float: left;
	width: 160px;
	margin-right: 10px;
}

div.courseBlock ul {
	margin: 0;
	padding: 0;
}

div.courseBlock ul li {
	list-style: none;
}

div.replyForm textarea {
	height: 100px;
	width: 400px;
}