/* CSS Document */

/* DOCUMENT INFORMATION -----------------------------------

TITLE:			Default screen display styles
LAST UPDATED:	7th November 2005
AUTHOR:			Nick Toye

-- CONTENTS -----------------------------------------------

	=1:		[HTML & BODY]
	=2:		[LINKS]
	=3:		[COMMON ELEMENTS]
	=4:		[TOP ELEMENTS]
	=5:		[NAVIGATION]
	=6:		[MAIN COLUMN]
	=7:		[SIDEBAR COLUMN]
	=8:		[FOOTER]
	=9:		[LISTS]
	=10:	[FORMS]
	=11:	[IMAGES]
	=12:	[TEASERS]
	=13:	[MISC]
	=14:	[FLASH]
	
-----------------------------------------------------------*/

/*	=1:	[HTML & BODY] -------------------------------------*/	

* {
	margin: 0;
	padding: 0;
	}
	
body {
	margin: 0;
	padding: 0;
	font-family: Trebuchet MS, Verdana, sans-serif;
	text-align: left;
	line-height: 1.5em;
	color: #fff;
	background: #18be1f;
	}


	
/*	=2:	[LINKS] -------------------------------------*/	
	
/* NOTES: 
remember LoVe HAte, also I have added a current class for current elements 
*/

a:link {
	color: #fff;
	text-decoration: none;
	}
a:visited {
	color: #fff;
	text-decoration: none;
	}
a:hover {
	color: #000;
	}
	
a.current {
	color: #000;
	}

/*	=3:	[COMMON ELEMENTS] -------------------------------------*/	

p {
	line-height: 160%;
	padding: 0 0 5px 0;
	color: black;
	}
	
table {color: black; border: none;}
	
h1 {
	font-size: 190%;
	}
	


code {
	color: #000000;
	font-size: 110%;
	line-height: 1.2em;
	text-align: left;
	}
		
abbr, acronym {
	font-style: normal;
	border-bottom: 1px dotted #bbb;
	cursor: help;
	}
	
a abbr {
	border: none;
	}
	
em {
	font-style: italic;
	}
	
strong {
	font-weight: bold;
	}
	
del {
	text-decoration: line-through;
	}
	
ins {
	text-decoration: none;
	font-style: italic;
	}
	
address {
	margin: 0;
	padding: 0;
	font-style: normal;
	}
	
ul {list-style: none;}

/*	=4:	[TOP ELEMENTS] -------------------------------------*/	

#wrap {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 760px;
	min-height: 550px;
	_height: 550px;
	background: url(_images/faux.gif) repeat-y;
	}
		
#header {
	width: 760px;
	height: 137px;
	background: url(_images/header.gif) no-repeat;
	}

#header h1 {
	position: relative;
	float: left;
	top: 33%;
	left: 20%;
	color: #19a249;
	line-height: 2em;
	}





/*	=5:	[NAVIGATION] -------------------------------------*/	

/* NOTES: 
obviously the image references need to be altered to customise design
*/

ul#nav{
	position: relative;
	top: 5px;
	left: 9px;
}

ul#nav li a { 
display: block;
height: 22px;
width: 142px;
line-height: 22px;
}
 
ul#nav li {
text-indent: -3000px;
margin-bottom: 3px;
}
 
ul#nav li a:hover, ul#nav li a.current {background-position: 0 -22px;}
 
#homeBtn a {
background: url(_images/homeBtn.gif) no-repeat top left;
} 
#welcomeBtn a {
background: url(_images/welcomeBtn.gif) no-repeat top left;
} 
 
#aboutusBtn a {
background: url(_images/aboutusBtn.gif) no-repeat top left;
} 
 
#tourBtn a {
background: url(_images/tourBtn.gif) no-repeat top left;
} 

#policiesBtn a {
background: url(_images/policiesBtn.gif) no-repeat top left;
}

#newsBtn a {
background: url(_images/newsBtn.gif) no-repeat top left;
} 
 
#lettershomeBtn a {
background: url(_images/lettershomeBtn.gif) no-repeat top left;
} 

#calendarBtn a {
background: url(_images/calendarBtn.gif) no-repeat top left;
} 

#galleryBtn a {
background: url(_images/galleryBtn.gif) no-repeat top left;
} 

#classpagesBtn a {
background: url(_images/classpagesBtn.gif) no-repeat top left;
}

#kidszoneBtn a {
background: url(_images/kidszoneBtn.gif) no-repeat top left;
} 

#clubsBtn a {
background: url(_images/clubsBtn.gif) no-repeat top left;
} 

#governorsBtn a {
background: url(_images/governorsBtn.gif) no-repeat top left;
} 

#ptaBtn a {
background: url(_images/ptaBtn.gif) no-repeat top left;
} 

#teachersBtn a {
background: url(_images/teachersBtn.gif) no-repeat top left;
} 
	

/* nav bottom */
#navBottom {
	text-align: center;
	}

#navBottom li {
	display: inline;
	font-size: 80%;
	}
	
#navBottom a {text-decoration: underline; color: #fff;}
#navBottom a:hover {color: #000;}


	


/*	=6:	[MAIN COLUMN] -------------------------------------*/	
#main {
	float: right;
	position: relative;
	width: 600px;
	min-height: 400px;
	_height: 400px;
	background: url(_images/shield.gif) no-repeat 30px 5px;
	}

#main h2 {
	font-size: 90%;
	width: 360px;
	text-align: center;
	position: relative;
	left: 230px;
	}
	
#content {
	float: right;
	position: relative;
	width: 600px;
	min-height: 400px;
	_height: 400px;
	}
	
#content h2 {color: #990000;}
	
.gutter {padding: 0px 20px 20px;}

#newsArea {
	position: relative;
	top: 10px;
	left: 285px;
	width: 259px;
	height: 124px;
	background: url(_images/news_bg.gif) no-repeat;
	padding: 40px 10px 10px 0;
	}
	
#newsArea div a {
	padding-left: 17px;
	background: url(_images/green_bullet.gif) no-repeat 0 50%;
	font-weight: bold;
	font-size: 80%;
	color: #3f9d47;
	}
	
#newsArea div a:hover {color: #000;}
	
#newsArea h3 {display:none;}

#newsArea .link a {
	position: absolute;
	bottom: 10px;
	left: 20px;
	color: #000;
	font-size: 70%;
	}
	
#newsArea .link a:hover {color: #3f9d47;}

#awards {
	position: absolute;
	top: 350px;
	left: 70px;
	width: 460px;
	height: 54px;
	background: url(_images/awards.gif) no-repeat;
	}
	


/*	=7:	[SIDEBAR COLUMN] -------------------------------------*/	
#sidebar {
	float: left;
	width: 160px;
	}

	
/*	=8:	[FOOTER] -------------------------------------*/	



/*	=9:	[LISTS] -------------------------------------*/	




/*	=10: [FORMS] -------------------------------------*/	




/*	=11: [IMAGES] -------------------------------------*/	



/*	=12: [TEASERS] ------------------------------------*/
#kidszoneTeaser a {
	width: 189px;
	height: 55px;
	position: absolute;
	top: 235px;
	right: 120px;
	background: url(_images/kidszoneTeaser.gif) no-repeat;
	text-indent: -3000px;
	}
	
#kidszoneTeaser a:hover {background-position: 0 -55px;}

#calendarTeaser a {
	width: 218px;
	height: 69px;
	position: absolute;
	top: 257px;
	left: 30px;
	background: url(_images/calendarTeaser.gif) no-repeat;
	text-indent: -3000px;
	}
	
#calendarTeaser a:hover {background-position: 0 -69px;}

#classpagesTeaser a {
	width: 252px;
	height: 69px;
	position: absolute;
	top: 270px;
	right: 13px;
	background: url(_images/classpagesTeaser.gif) no-repeat;
	text-indent: -3000px;
	}
	
#classpagesTeaser a:hover {background-position: 0 -69px;}


/* kidszone */
#englishBtn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 50px;
	background: url(_images/englishBtn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#englishBtn a:hover {background-position: 0 -80px;}

#mathsBtn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 180px;
	background: url(_images/mathsBtn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#mathsBtn a:hover {background-position: 0 -80px;}

#scienceBtn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 320px;
	background: url(_images/scienceBtn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#scienceBtn a:hover {background-position: 0 -80px;}

#historyBtn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 460px;
	background: url(_images/historyBtn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#historyBtn a:hover {background-position: 0 -80px;}

#weblinks1Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 180px;
	left: 130px;
	background: url(_images/weblinks1Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#weblinks1Btn a:hover {background-position: 0 -80px;}

#weblinks2Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 180px;
	left: 270px;
	background: url(_images/weblinks2Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#weblinks2Btn a:hover {background-position: 0 -80px;}

#gamesBtn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 180px;
	left: 410px;
	background: url(_images/gamesBtn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#gamesBtn a:hover {background-position: 0 -80px;}



/* classpage buttons */
#classRBtn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 50px;
	background: url(_images/classRBtn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#classRBtn a:hover {background-position: 0 -80px;}

#class1Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 180px;
	background: url(_images/class1Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#class1Btn a:hover {background-position: 0 -80px;}

#class2Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 320px;
	background: url(_images/class2Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#class2Btn a:hover {background-position: 0 -80px;}

#class3Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 80px;
	left: 460px;
	background: url(_images/class3Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#class3Btn a:hover {background-position: 0 -80px;}

#class4Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 180px;
	left: 130px;
	background: url(_images/class4Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#class4Btn a:hover {background-position: 0 -80px;}

#class5Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 180px;
	left: 270px;
	background: url(_images/class5Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#class5Btn a:hover {background-position: 0 -80px;}

#class6Btn a {
	width: 100px;
	height: 80px;
	position: absolute;
	top: 180px;
	left: 410px;
	background: url(_images/class6Btn.gif) no-repeat;
	text-indent: -3000px;
	}
	
#class6Btn a:hover {background-position: 0 -80px;}
		
		
/*	=13: [MISC] -------------------------------------*/	


/* skip navigation rule*/ 


#counter {
	float: left;
	margin: 10px 0 0 5px;
	}
	
#counter td {
color: #fff;
font-weight: bold;
height: 20px;
vertical-align:middle;
}
	
#counter td img {float: left;}
	



.clearer {
	clear: both;
	}



#login {
	position: absolute; 
	top: 520px;
	left: 61px;
	}
	
/*	=14: [FLASH] -------------------------------------*/