/* 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:	[MISC]
	=13:	[FLASH]
	
-----------------------------------------------------------*/

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

* {
	margin: 0;
	padding: 0;
	}
	
body {
	margin: 0;
	padding: 0;
	font-family: Verdana, sans-serif;
	text-align: left;

	background: #36a7dd;
	color: #000000;
	}


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

a {
	color: #CC0000;
	text-decoration: none;
	}

a:hover {
	color: #009900;
	}
	

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


	

	
h1 {
	font-size: 150%;
	color: black;
	margin-bottom: 15px;
	}
	
h2 {
	font-size: 130%;
	color: black;
	}
	
h3 {
	font-size: 120%;
	}

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;
	}

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

#container {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 760px;
	min-height: 550px;
	font-size: 95%;
	border: 1px solid black;
	background-color: #bce7fa;
	}
	
* html #container {height: 550px;}
	
#header {
	
	margin: 0 auto;
	width: 760px;
	height: 105px;
	background: url(_images/header-bg.gif) no-repeat top left;
	}

#header h1 {
	display: none;
	}





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

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

#nav {
	position: absolute;
	top: 140px;
	left: 5px;
	}
#navhome {
	position: absolute;
	top: 90px;
	left: 5px;
	}	
#nav li {
	list-style: none;
	margin-bottom: 2px;
	}
	
#nav li a:hover, #nav li a.active {background-position: 0 -34px;}

#navhome li {
	list-style: none;
	margin-bottom: 2px;
	}
	
#navhome li a:hover, #nav li a.active {background-position: 0 -34px;}
	
#home-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/home-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#welcome-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/welcome-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
	#preschool-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/preschool-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#aboutus-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/aboutus-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#tour-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/tour-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#newsletters-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/newsletters-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#lettershome-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/lettershome-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#calendar-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/calendar-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#gallery-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/gallery-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#classpages-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/classpages-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
#kidszone-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/kidszone-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}

#guestbook-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/guestbook-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}
	
	#parents-btn a {
	display: block;
	width: 150px;
	height: 34px;
	background: url(_images/parents-btn.gif) top left no-repeat;
	text-indent:-3000px;
	}




	


/*	=6:	[MAIN COLUMN] -------------------------------------*/	



#main {
	margin: 0 auto;
	width: 760px;
	height: 456px;
	background: url(_images/body-bg.png);
	}
	
#content {
	margin: 0 auto;
	width: 760px;
	min-height: 456px;
	background: url(_images/content-bg.png) no-repeat;
	}
	
#content-header {
	margin: 0 auto;
	width: 760px;
	height: 95px;
	background: url(_images/content-header.png) no-repeat top left; 
	}
	
#content-header h1 {display:none;}

#contentArea {
	margin-left: 160px;
	padding-top: 100px;
	width: 600px;
	min-height: 500px;
	_height: 500px;
	padding-bottom: 20px;
	}
	
p.medium {text-align: left;}
	
#content-footer {
	position: absolute;
	bottom: 0;
	left: 0;
	margin: 0 auto;
	width: 760px;
	height: 27px;
	background: url(_images/content-footer.png) no-repeat;
	}

/*
#link {
	margin-top: 135px;
	font-size: 80%;
	}
	
#login {
	float: left;
	border: none;
	margin: 5px;
	}
	

/*	=7:	[SIDEBAR COLUMN] -------------------------------------*/	


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



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




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




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



#owl {
	position: absolute;
	top: 50px;
	right: 0;
	background: url(_images/owl.png) no-repeat;
	width: 294px;
	height: 148px;
	}

#owlContainer {
	position: relative;
	float: left;
	margin: 50px 0 0 0px;
	width: 180px;
	}
		
#owl h1 {
	margin: 0 auto;
	text-align: center;
	}

#classpages-teaser a {
	position: absolute;
	bottom: 119px;
	left: 172px;
	width: 114px;
	height: 91px;
	background: url(_images/classpages-teaser.png) no-repeat;
	text-indent: -3000px;
	}
	
#classpages-teaser a:hover {background-position: 0 -91px;}

#tour-teaser a {
	position: absolute;
	bottom: 119px;
	right: 193px;
	width: 99px;
	height: 64px;
	background: url(_images/tour-teaser.png) no-repeat;
	text-indent: -3000px;
	}
	
#tour-teaser a:hover {background-position: 0 -64px;}

#kidszone-teaser a {
	position: absolute;
	bottom: 150px;
	right: 25px;
	width: 69px;
	height: 122px;
	background: url(_images/kidszone-teaser.png) no-repeat;
	text-indent: -3000px;
	}
	
#kidszone-teaser a:hover {background-position: 0 -122px;}

/* kidszone */

#games-btn a {
	position: absolute;
	bottom: 190px;
	right: 100px;
	margin: 0;
	padding: 0;
	width: 100px;
	height: 320px;
	background: url(_images/games-btn.png) no-repeat;
	}
	
#games-btn a:hover {background-position: -100px 0;}

#english-btn a {
	position: absolute;
	bottom: 80px;
	right: 0px;
	margin: 0;
	padding: 0;
	width: 100px;
	height: 320px;
	background: url(_images/english-btn.png) no-repeat;
	}
	
#english-btn a:hover {background-position: -100px -0px;}

	
#science-btn a {
	position: absolute;
	top: 75px;
	right: 300px;
	margin: 0;
	padding: 0;
	width: 100px;
	height: 320px;
	background: url(_images/science-btn.png) no-repeat;
	}
	
#science-btn a:hover {background-position: -100px 0px;}

	
#history-btn a {
	position: absolute;
	top: 270px;
	right: 400px;
	margin: 0;
	padding: 0;
	width: 100px;
	height: 320px;
	background: url(_images/history-btn.png) no-repeat;
	}
	
#history-btn a:hover {background-position: -100px 0px;}

#maths-btn a {
	position: absolute;
	bottom: 30px;
	right: 200px;
	margin: 0;
	padding: 0;
	width: 100px;
	height: 320px;
	background: url(_images/maths-btn.png) no-repeat;
	}
	
#maths-btn a:hover {background-position: -100px 0;}
	
#weblinks1-btn a {
	position: absolute;
	bottom: 0px;
	right: 300px;
	margin: 0;
	padding: 0;
	width: 100px;
	height: 200px;
	background: url(_images/weblinks1-btn.png) no-repeat;
	}
	
#weblinks1-btn a:hover {background-position: -100px 0px;}

	
#weblinks2-btn a {
	position: absolute;
	top: 180px;
	right: 500px;
	margin: 0;
	padding: 0;
	width: 100px;
	height: 320px;
	background: url(_images/weblinks2-btn.png) no-repeat;
	}
	
#weblinks2-btn a:hover {background-position: -100px 0px;}


/* classpage buttons */
#preschoolclass a {
	position: absolute;
	top: 150px;
	left: 190px;
	background: url(_images/preschool-btn.png) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#preschoolclass a:hover {background-position: 0 -121px;}

#yearone a {
	position: absolute;
	top: 180px;
	left: 350px;
	background: url(_images/yearone-btn.png) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#yearone a:hover {background-position: 0 -121px;}

#yeartwo a {
	position: absolute;
	top: 210px;
	left: 550px;
	background: url(_images/yeartwo-btn.png) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#yeartwo a:hover {background-position: 0 -121px;}

#yearthree a {
	position: absolute;
	top: 310px;
	left: 170px;
	background: url(_images/yearthree-btn.png) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#yearthree a:hover {background-position: 0 -120px;}

#yearfour a {
	position: absolute;
	top: 350px;
	left: 470px;
	background: url(_images/yearfour-btn.png) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#yearfour a:hover {background-position: 0 -120px;}

#yearfive a {
	position: absolute;
	top: 400px;
	left: 600px;
	background: url(_images/yearfive-btn.png) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#yearfive a:hover {background-position: 0 -120px;}

#yearsix a {
	position: absolute;
	top: 400px;
	left: 300px;
	background: url(_images/yearsix-btn.png) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#yearsix a:hover {background-position: 0 -120px;}

#yearseven a {
	position: absolute;
	top: 530px;
	left: 420px;
	background: url(_images/yearsix-btn.gif) no-repeat;
	width: 100px;
	height: 120px;
	text-indent: -3000px;
}

#yearseven a:hover {background-position: 0px -121px;}
		
		
/*	=12: [MISC] -------------------------------------*/	
img {margin-top: 15px;}

/* skip navigation rule*/ 
.skiplink {
	display:none;
}

#counter {
	position: absolute;
	bottom: 60px;
	right: 65px;
	color: black;
	width: 100px;
height: 35px;
	font-weight: bold;
text-align: center;
	}
	
#counter img {margin: 0 auto; text-align: center;}

#visitors {position: absolute;
bottom: 0px;
right: 5px;
text-align: right;
width: 100px;
}
	
#link a {
	position: absolute;
	bottom: 10px;
	left: 175px;
	color: white;
	font-size: 85%;
	}

#link a:hover {color: black;}


iframe {margin: 5px 0 0 0px; display:inline;}

#login {
	border: none;
	margin: 10px;
	text-align:center;
	}
	
/*	=13: [FLASH] -------------------------------------*/	



.hiddenclass {
display:none;
}

#fader {
position: absolute;
width: 346px;
height: 282px;
overflow: hidden;
top: 69px;
left: 163px;
}


#ticker {
position: absolute; 	/*  I find the ticker works best absolutely positioned		*/
top: 520px;
left: 370px;			/*  Position this as you wish, top: x, left: x etc...		*/
width: 220px; 			/*  set this to the width you would like the ticker to be	*/
height: 1em; 			/*  Set this to how high you would like the ticker to be	*/
font-weight: bold;
font-size: small; 
color: #fff;}
	
/* Do not edit #ticker_edit */
#ticker_edit {
position: absolute; 
z-index: 100;} 			/* This is needed to ensure the ticker edit button does not cause layout problems with the ticker.*/


#governors a {
background:url("../images/governors.gif") no-repeat scroll 0 0 transparent;
display:block;
height:92px;
left:306px;
position:absolute;
text-indent:-9999px;
top:439px;
width:105px;
}

#governors a:hover {
background-position: -107px 0px;
}