/* The Layout style sheet contains layout/positione related settings */

/* The container that surrounds the whole control,
The left padding is used to align the control. The
container surrounds even the drop down list and the
Filter button.*/
   
div#MainCourseContainer{
	width: 700px; /* Width of the whole control */
	padding-left:15px; /* Left padding being used make the control look centered on the page */
}
 
/* Surrounds the div table that displays the course
names and codes. */
div#SecCourseContainer{
	text-align:left; /* Alignment of the text inside the div table */
	width:700px; /* Width */
	margin:0 auto;
	float:right;
}

/* Div surrounding the note before the start of the course
code table. */
div#TopNote{
	padding-bottom: 10px;
}

/* A div surrounding the program area title for every
section of course codes. This div contains the
ProgramArea div and HeadingGrade divs*/
div#ProgramAreaContainer{
	width:700px; /* Width of the container or program area heading */
	height: 22px; /* Height of the container or program area heading */
}

/* Div surrounding the name of the program area name.*/
div#ProgramArea{
	float:left; /* The div is positioned to the left side */
	width:300px; /* Width of the div */
}

/* The grade corresponding to one of the four columns */
.HeadingGrade{
	width:68px; /* Width of each individual grade 9 to 12 */
	float:right; /* Allignment of the four grade divs */
	text-align: center; /* Text alignment inside the divs */
	height:20px; /* Height of the divs */
}

/* Div surrounding the name of the course */
div#ProgramName{
	float:left;
	width:400px;	
}

/* Div surrounding the four boxes containing course
codes for individual grades. */
div#CourseCode{
	width:280;
	float:right;
	text-align:center;
}

/* The class used by the boxes containing the course codes
for individual course codes */
.grades{
	float:right;
	width:68px;
}

/* Div used before the start of a new row. */
div#clr{
	clear:both;
	border-top:solid 1px #CCCCCC;
	border-bottom:solid 1px #CCCCCC;
	height: 2px;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}

div#clr_blank{
	clear:both;
	height: 1px;
	padding: 0 0 0 0;
	width:700px;
}

/* the drop-down list of schools */
div#School_List{
	width: 300px;
	float:left;
	padding-top:6px;
}

/* The button used to filter schools */
div#Filter_Button{
	width: 100px;
	float:left;
}

/* Links to all the Program Areas*/
div#SectionLinks{
	margin-bottom: 15px;	
}

/* Links to the course categories */
div#SectionLinksA{
	width: 320px;
	float:left;
	padding-bottom: 10px;
}

/* The text that instructs people to click on Program Area links */
div#SectionLinksInstructions{
	padding-bottom:10px;
}

/* class for the goback a href */
.goBack{
	padding: 2px 2px 2px 2px;
	z-index:4
}

/* div surrounding the goBack link */
div#goBackButton{
	width: 80px;
}

/* the drop-down list of years */
div#SchoolYear_Dropdown{
	width: 105px;
	float:left;
	padding-top:6px;
}

/* The button used to filter the years */
div#SchoolYear_Button{
	width: 100px;
	float:left;
}

/****************************************************************/
/*			These styles apply to the detail page   	        */
/****************************************************************/
div#DetCourseDescription A{
	font-size: 12px;
}

div#DetCourseValue{
	float:left;
	padding-left:50px;
}

div#DetCourseType{
 float:left;
}

.btnfilter{
	left:0px;
}

.btnfilter_around{
	text-align:left;
}