@charset "UTF-8";
/* CSS Stlyes for Learning Space Areas */
#center_column_top {
	height: 111px;
	width: 530px;
	margin-right: 5px;
	margin-left: 10px;
	background-image: url(../assets/images/learningSpace.jpg);
}
#center_column_inner {
	height: auto;
	width: 550px;
	margin-right: 0px;
	margin-left: 10px;
}
/* Learning Space Buttons */
#staffroom {
	width:480px;
	height:128px;
	float:left;
	background-image: url(../assets/images/staffroomOn.jpg);
	margin-left:30px;
	margin-top:30px;
}
#staffroom a{
	width:480px;
	height:128px;
    float:left;
	background-image: url(../assets/images/staffroomOn.jpg);	
}	
#staffroom a:hover {
	width:480px;
	height:128px;
	float:left;
	background-image: url(../assets/images/staffroomOver.jpg);	
}
#assess_outer{
	width:178px;
	padding:6px;
	height:auto;	
	float:left;	
	border:1px solid #dbdbdb;
	background-color:#f1f1f1;
}
#maths_butts{
	width:257px;
	height:auto;	
	float:left;
	margin-left:11px;
}
.grade1DivOn a{
	height:222px;
	width:197px;
	background-image:url(../assets/images/btOneOn.jpg);
	float:left;
}
.grade1DivOff {
	height:222px;
	width:197px;
	background-image:url(../assets/images/btOneOff.jpg);
	background-repeat:no-repeat;
	float:left;
}
.grade1DivOn a:hover {
	height:222px;
	width:197px;
	background-image: url(../assets/images/btOneOver.jpg);	
}
.grade2DivOn a{
	height:223px;
	width:139px;
	background-image:url(../assets/images/btTwoOn.jpg);
	float:left;
}
.grade2DivOff {
	height:223px;
	width:139px;
	background-image:url(../assets/images/btTwoOff.jpg);
	float:left;
}
.grade2DivOn a:hover {
	height:223px;
	width:139px;
	background-image: url(../assets/images/btTwoOver.jpg);	
}
.grade3DivOn a{
	height:223px;
	width:195px;
	background-image:url(../assets/images/btThreeOn.jpg);
	float:left;
}
.grade3DivOff {
	height:223px;
	width:195px;
	background-image:url(../assets/images/btThreeOff.jpg);
	float:left;
}
.grade3DivOn a:hover {
	height:223px;
	width:195px;
	background-image: url(../assets/images/btThreeOver.jpg);	
}
.asiaDivOn a{
	clear: both;
	float: left;
	height:75px;
	width:478px;
	background-image:url(../assets/images/asiaOn.jpg);
	background-repeat: no-repeat;
	float:left;
}
.asiaDivOff {
	clear: both;
	float: left;
	height:75px;
	width:478px;
	background-image:url(../assets/images/asiaOff.jpg);
	background-repeat: no-repeat;
	float:left;
}
.asiaDivOn a:hover {
	clear: both;
	float: left;
	height:75px;
	width:478px;
	background-image:url(../assets/images/asiaOver.jpg);
	background-repeat: no-repeat;
	float:left;
}
/* GRADE ON */
.gBoxOn {
	height:auto;
	width:255px;
	margin-bottom:10px;
	float:left;
	border:1px solid #ffe400;
}
.funDivSchool a:hover{
	background-image: url(../assets/images/funSchoolOver.jpg);
	background-repeat:no-repeat;
	height:75px;
	width:478px;
	margin-top:20px;
	margin-left:30px;	
	float:left;
}
.funDivSchool a{
	background-image: url(../assets/images/funSchool.jpg);
	background-repeat: no-repeat;
	height:75px;
	width:478px;
	margin-top:20px;
	margin-left:30px;
	float:left;
}
.asiaDivOn a:hover{
	background-image: url(../assets/images/asiaOver.jpg);
	background-repeat:no-repeat;
	height:75px;
	width:478px;
	margin-top:20px;
	margin-left:30px;	
	float:left;
}
.asiaDivOn a{
	background-image: url(../assets/images/asiaOn.jpg);
	background-repeat: no-repeat;
	height:75px;
	width:478px;
	margin-top:20px;
	margin-left:30px;
	float:left;
}
.funBoxOn {
	height:auto;
	width:255px;
	margin-bottom:10px;
	float:left;
	
}
.assessBoxOn {
	height:50px;
	width:180px;
	text-align: center;
	float:left;
	border:1px solid #ffe400;
}
.assessBoxOn a{
	display:block;
	background-image: url(../assets/images/gradeBoxOn.jpg);
	background-repeat: repeat-x;
	height:33px;
	padding-top:17px;
	width:180px;
}
.funBoxOn a{
	display:block;
	background-image: url(../assets/images/funBoxOn.jpg);
	background-repeat: repeat-x;
	height:238px;
	width:480px;
	font-size: 15px;
	padding-top:230px;
}
.gBoxOn a{
	display:block;
	background-image: url(../assets/images/gradeBoxOn.jpg);
	background-repeat: repeat-x;
	height:50px;
	width:255px;
	font-size: 15px;
}
.assessBoxOn a:hover, .gBoxOn a:hover{
	text-decoration:none;
	background-image: url(../assets/images/gradeBoxover.jpg);	
	background-color:#fff36a;
}
.tech_notes{
	width:255px;
	height:27px;
	float:left;
}
.gBoxOn .tech_notes a{
	padding-top:7px;
	display:block;
	background-image: url(../assets/images/tech_notes.jpg);
	background-repeat:repeat-x;
	height:20px;
	width:240px;
	font-size: 12px;
	padding-left:15px;
}
.gBoxOn .tech_notes a:hover{
	background-image:url(../assets/images/tech_notes_over.jpg);
	background-repeat:repeat-x;
	background-color:#fed53b;	
}

/* GRADE OFF */
.gBoxOff {
	border:1px solid #dbdbdb;
	background-color:#f1f1f1;
	height:50px;
	width:255px;
	margin-bottom:10px;
	float:left;
}
.gBoxOff a{
	display:block;
	background-color:#f1f1f1;
	height:50px;
	width:255px;
	padding-top:0px;
	padding-bottom:0px;
	padding-left:0px;
	padding-right:0px;
	font-size: 15px;
	color:#CCCCCC;
}
.funBoxOff {
	display:block;
	background-image: url(../assets/images/funBoxOff.jpg);
	background-repeat: repeat-x;
	height:238px;
	width:480px;
}
.funBoxOff a{
	display:block;
	background-image: url(../assets/images/funBoxOff.jpg);
	background-repeat: repeat-x;
	height:238px;
	width:480px;
}
.gBoxOff a:hover{
	text-decoration:none;	
}
.funBoxOff a:hover{
	display:block;
	background-image: url(../assets/images/funBoxOver.jpg);
	background-repeat: repeat-x;
	height:238px;
	width:480px;	
}
.gradeBoxOff .gradeDate p {
	color:#CCCCCC;
}
.gName{
	width:125px;
	padding-top:17px;
	padding-left:15px;
	height:30px;
	float:left;
}
.funName{
	width:125px;
	padding-top:100px;
	padding-left:15px;
	height:30px;
	float:left;
}
.funName{
	width:780px;
	padding-top:17px;
	padding-left:15px;
	height:238px;
	float:left;
}
.gTandN{
	width:125px;
	padding-top:10px;
	padding-left:15px;
	height:30px;
	float:left;
}
.gType{
	width:125px;
	height:auto;
	margin-top:2px;
	font-size:12px;
	float:left;
}	
.funType{
	width:125px;
	height:auto;
	margin-top:100px;
	font-size:12px;
	float:left;
}
.gDate {
	float:right;
	width:100px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 11px;
	text-align:right;
	line-height: 16px;
	color: #FF0000;
	word-spacing: 1px;
	margin-top: 3px;
	margin-right: 5px;
}

/*Position of the text under 123*/
.gDate1{
	float:right;
	height: 25px;
	padding-right:15px;
	padding-top: 210px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.gDate2{
	float:right;
	height: 25px;
	padding-right:15px;
	padding-top: 210px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.gDate3{
	float:right;
	height: 25px;
	padding-right:55px;
	padding-top: 210px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.gDateFun{
	
	float:left;
	height: 25px;
	padding-right:15px;
	padding-top: 76px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.gDateAsia{
	float:left;
	height: 25px;
	padding-right:15px;
	padding-top: 76px;
	padding-bottom: 0px;
	padding-left: 0px;
}

/*styling for expiry text under 123*/
.gDate1 p{
	font-size: 10px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	width:120px;
	line-height: 16px;
	color: #5c5c5c;
	word-spacing: 1px;
	padding-left: 0px;
	text-align:center;
}
.gDate2 p{
	font-size: 10px;
	width:120px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 16px;
	color: #5c5c5c;
	word-spacing: 1px;
	padding-left: 0px;
	text-align:center;
}
.gDate3 p{
	font-size: 10px;
	width:120px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 16px;
	color: #5c5c5c;
	word-spacing: 1px;
	padding-left: 0px;
	text-align:center;
}
.gDateAsia p{
	font-size: 10px;
	width:120px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 16px;
	color: #5c5c5c;
	word-spacing: 1px;
	padding-left: 0px;
	text-align:center;
}
.gBoxOff .gDate p{
	color:#CCCCCC;
}
.funBoxOff .gDate p{
	display:block;
	background-image: url(../assets/images/funBoxOff.jpg);
	background-repeat: repeat-x;
	height:238px;
	width:480px;
	font-size: 15px;
}

/* LS Menus for Levels 1,2,3 */
#center_column_levels {
	float: left;
	height: auto;
	width: 563px;
	margin-right: 0px;
	margin-left: 10px;
}
.menuHeading {
	position:relative;
	display:block;
	width:548px;
	height:38px;
}	
#imageLeftHolder1 {
	display:block;
	position:relative;
	width:239px;
	height:auto;
	float:left;
}
#imageRightHolder1 {
	display:block;
	position:relative;
	width:309px;
	height:auto;
	float:right;
}
#imageLeftHolder2 {
	display:block;
	position:relative;
	width:240px;
	height:auto;
	float:left;
}
#imageRightHolder2 {
	display:block;
	position:relative;
	width:308px;
	height:auto;
	float:right;
}
#imageLeftHolder3 {
	display:block;
	position:relative;
	width:240px;
	height:auto;
	float:left;
}
#imageRightHolder3 {
	display:block;
	position:relative;
	width:308px;
	height:auto;
	float:right;
}	
.bookshelf {
	display:block;
	position:relative;
	float:left;
	width:548px;
	height:110px;
}
#ls_menu1 {
	width:548px;
	height:auto;	
}
#ls_menu2 {
	width:548px;
	height:auto;
}
#ls_menu3 {
	width:548px;
	height:auto;
}
.ls_pic {
	float: left;
}
.ls_btn {
	position:relative;
	width:309px;
	float: right;
}

/*Learning Space Menus */
#center_column_levels {
	float: left;
	height: auto;
	width: 563px;
	margin-right: 0px;
	margin-left: 10px;
}

.menuHeading {
	position:relative;
	display:block;
	width:548px;
	height:38px;
	
	}
	
#imageLeftHolder1 {
	display:block;
	position:relative;
	width:239px;
	height:auto;
	float:left;
	}
	
#imageRightHolder1 {
	display:block;
	position:relative;
	width:309px;
	height:auto;
	float:right;
	
	}

#imageLeftHolder2 {
	display:block;
	position:relative;
	width:240px;
	height:auto;
	float:left;
	}
	
#imageRightHolder2 {
	display:block;
	position:relative;
	width:308px;
	height:auto;
	float:right;
	
	}
#imageLeftHolder3 {
	display:block;
	position:relative;
	width:240px;
	height:auto;
	float:left;
	}
	
#imageRightHolder3 {
	display:block;
	position:relative;
	width:308px;
	height:auto;
	float:right;
	
	}
	
	
.bookshelf {
	display:block;
	position:relative;
	float:left;
	width:548px;
	height:110px;
}

#ls_menu1 {

	width:548px;
	height:auto;
	
	
}

#ls_menu2 {
	width:548px;
	height:auto;

}

#ls_menu3 {
	width:548px;
	height:auto;

}



.ls_pic {
	float: left;
}

.ls_btn {
	position:relative;
	width:309px;
	float: right;
	
}