/* layout */
#side-column {
width:19em;
float:right;
margin-left:2em;
}


/* main sections */
#spotlight,
#school-info,
#media-centre,
#whats-happening,
#downtime,
#join-us {
border-top:2px solid black;
padding-top:1em;
padding-bottom:2em;
}


/* sub sections */


#microsites,
#edu-links,
#stat-boards,
#highlights,
.module {
border-top:1px solid #999;
padding-top:1em;
padding-bottom:2em;
}

#school-info ul,
#downtime ul,
#join-us ul,
#microsites ul,
#edu-links ul,
#stat-boards ul,
#highlights ul,
ul#govt-links {
list-style:square;
color:#A8C2CF;
margin:1em 0 .5em 1em;
}

#school-info ul span,
#downtime ul span,
#join-us ul span,
#microsites ul span,
#edu-links ul span,
#stat-boards ul span {
color:#333;
}


#whats-happening li,
#join-us li,
#schoolbag-articles li {
margin:.5em 0;
}


#spotlight {
width:28em;
float:left;
margin-left:2em;
}

.note {
background:#FFFAB0;
}

#home #content .note h3,
#home #content .note p {
padding:0 .5em;
}

/* typography */

#home #content h2 {
margin:0 0 1em;
padding:0;
font-size:140%;
	}

#home #content h3 {
margin:0 0 1em;
padding:0;
}

ul li:hover em {
color:#369;
}


/* Navigation */

#navigation {
	width:9em;
	float:left;
	border-top:2px solid black;
	border-bottom:2px solid #ccc;
	padding:1em 0 2em;
	margin-bottom:2em;
	}
		


#content ul#navigation li ul li {
font-size:90%;
font-weight:normal;
	}


#content ul#navigation li {
font-weight:bold;
width:100%; /* needed to keep IE from misbehaving */
margin:0;
font-family:helvetica, verdana, arial, sans-serif;
}

#content ul#navigation li a {
display:block;
padding:.5em 0;
line-height:1.2;
color:#333;
border-bottom:1px solid #999;
}


#content ul#navigation li a:hover {
background:#d5e1ed;
}

/* Spotlight */

#my-glider {
background:#f4f1ea;
	}


#spotlight .section img {
	width:28em;
	padding:0;
	border-style:none;
	}

#home #content #spotlight .spotlight-img a,
#home #content #spotlight a img,
#home #content #spotlight a:hover img,
#home #content #spotlight #scroller-controls a	{
	border-style:none;
	}

/* not sure why I need this, but without it, the drop shadow won't sit at the bottom of the image */
.spotlight-img {
	margin-bottom:-.5em;
	}

	div.scroller { 
	/* modify width and height of scrolling section if necessary	*/		
	width: 28em; 
	height: 37em;
	overflow: hidden;
	}
	div.scroller div.section {
		/* modify width and height of each section as needed (should match the size of the scroller window)	*/		
		width:28em;
		height:37em;
		overflow:hidden;
		float:left;
		}
	div.scroller div#scroll-content {
		width:120em;
		}


#home #content #spotlight .spotlight-text {
background:url(/global/images/homepage/spotlight-text-top.gif) repeat-x top;
padding-top:.5em;
}

#home #content #spotlight h3 {
margin:.5em .3em;
font-size:140%;
color:#4c4637;
}

#spotlight .spotlight-text h3 a {
color:#4c4637;
border-style:none;
}

#spotlight .spotlight-text h3 a:hover {
border-bottom:1px solid #4c4637;
}

#home #content #spotlight p {
color:#4c4637;
margin:0 .5em;
}

#home #content #spotlight p a {
color:#847a63;
border-bottom:1px solid #b9ab8b;
}

#home #content #spotlight p a:hover {
color:#4c4637;
border-color:#847a63;
}

#content #spotlight #spotlight1 {
background:url(/global/images/homepage/section1.gif) no-repeat center bottom;
}

#content #spotlight #spotlight2 {
background:url(/global/images/homepage/section2.gif) no-repeat center bottom;
}

#content #spotlight #spotlight3 {
background:url(/global/images/homepage/section3.gif) no-repeat center bottom;
}

#content #spotlight #spotlight4 {
background:url(/global/images/homepage/section4.gif) no-repeat center bottom;
}

#spotlight #scroller-controls img {
background:transparent;
}

#spotlight #scroller-controls {
position:relative;
background:#f4f1ea;
height:25px;
padding-bottom:.3em;
}

#spotlight #scroller-controls #previous-arrow {
float:left;
}

#spotlight #scroller-controls #next-arrow {
float:right;
}

#school-info h2 {
background:url(/global/images/highlighter.png) no-repeat right;
padding-right:28px;
}


/* whats-happening */

#whats-happening li {
margin-bottom:1.5em;
}

#schoolbag-articles li {
margin-bottom:1.3em;
}

#whats-happening .date {
color:#999;
font-size:90%;
}

#schoolbag-articles .date {
margin-right: 15.5em;
color:#999;
font-size:100%;
}

#schoolbag-articles {
font-size:85%;
}

/* schoolbag and ayg images */

a#schoolbag {
display:block;
background:transparent url(/global/images/homepage/schoolbag.gif) no-repeat left;
width:162px;
height:64px;
margin:1em 0;
}

a#schoolbag:hover {
background:transparent url(/global/images/homepage/schoolbag.gif) no-repeat right;
}

a#schoolbag span {
display:none;
}

a#yog {
display:block;
background:transparent url(/global/images/homepage/yog.gif) no-repeat left;
width:162px;
height:64px;
margin:1em 0;
}

a#yog:hover {
background:transparent url(/global/images/homepage/yog.gif) no-repeat right;
}

a#yog span {
display:none;
}

a#teachersday {
display:block;
background:transparent url(/global/images/homepage/teachersday.gif) no-repeat left;
width:162px;
height:64px;
margin:1em 0;
}

a#teachersday:hover {
background:transparent url(/global/images/homepage/teachersday.gif) no-repeat right;
}

a#teachersday span {
display:none;
}


a#ndr {
display:block;
background:transparent url(/global/images/homepage/ndr-banner.jpg) no-repeat left;
width:162px;
height:64px;
margin:1em 0;
}

a#ndr:hover {
background:transparent url(/global/images/homepage/ndr-banner.jpg) no-repeat right;
}

a#ndr span {
display:none;
}



a#excelfest {
display:block;
background:transparent url(/global/images/homepage/excelfest.jpg) no-repeat left;
width:162px;
height:73px;
margin:1em 0;
}

a#excelfest:hover {
background:transparent url(/global/images/homepage/excelfest.jpg) no-repeat right;
}

a#excelfest span {
display:none;
}

a#moe-seminar-for-parents {
display:block;
background:transparent url(/global/images/homepage/moe-seminar-for-parents.jpg) no-repeat left;
width:162px;
height:70px;
margin-top:1em;
}

a#moe-seminar-for-parents:hover {
background:transparent url(/global/images/homepage/moe-seminar-for-parents.jpg) no-repeat right;
}

a#moe-seminar-for-parents span {
display:none;
}


/* media centre
------------------------ */

#media-centre {
width:39em;
float:left;
}

#media-centre ul li {
padding:1em;
}

#media-centre .date {
color:#666;
font-size:90%;
line-height:1.2em;
margin-bottom:1em;
}

#media-centre ul li p {
line-height:1.5em;
}

#media-centre p.media-more {
text-align:right;
font-size:90%;
margin-top:1em;
}

#media-centre li#latest-press a,
#media-centre li#latest-speech a,
#media-centre li#latest-forum a,
#media-centre li#latest-key-speech a,
#home #media-centre h2 a {
color:#333;
border-style:none;
}

#media-centre li#latest-press a:hover,
#media-centre li#latest-speech a:hover,
#media-centre li#latest-forum a:hover,
#media-centre li#latest-key-speech a:hover,
#home #media-centre h2 a:hover  {
border-bottom:1px solid;
}

#media-centre li#latest-speech,
#media-centre li#latest-key-speech {
background:#fff;
}

#media-centre li#latest-forum,
#media-centre li#latest-press {
background:#eee;
}

#media-centre h2 img {
margin:0 0 -1px 1px;
}


#main-column {
width:39em;
float:left;
}

#whats-happening {
width:18.5em;
float:left;
clear:left;
}

#join-us {
width:18.5em;
float:right;
}

/* downtime note for important messages */

#downtime.note {
padding:1em;
}

#downtime ul {
margin-bottom:1.5em;
}

#downtime li {
margin-bottom:.75em;
}

#downtime .date {
color:#999;
font-size:90%;
}

#microsites ul.ads {
margin:1em 0;
list-style:none;
}