<style type="text/css">


body {	/* This applies the following styles, size and information to the all the text, boxes, and layout of the body section to all pages of the website. */
	width:750px; /* This ensures that the width of the body section is only 750px wide. */
	margin:auto;
	margin-top:30px;
	font-family:"Trebuchet MS", "Times New Roman", "Arial"; /* This shows what fonts should be used in the body section in order eg. Trebuchet MS first, if the browser cannot display this then to use Times New Roman and if that cannot be displayed then to use Arial, this ensures that the site is available for all, no matter what type of internet browser they are accessing the site through. */
	color: #FFFFFF; 
	}



/* ----- HEADER ----- */



#header { 	/* This indicates that the following section applies to all the styles and formatting affecting the header section of the website. */
	width:730px; /* This states that the width of the header should be 730px,normally this is 750 but due to the padding added later (10px on each side) this still totals 750px. */
	height:100px;/* This states that the height of the header section is 100px, an appropriate size for the header section. */
	background-color:#002482;/*This colour was taken from the colours selected for the house style */
	font-family:"MS Mincho", "Trebuchet MS", "Times New Roman"; /*Again this states which fonts should be used and the priority order for them. */
	font-size: 45px; /* This is the size of the font in the header section, I chose this to be quite larger so that it is eye-catching and stands out from the rest of the website. */ 
	padding: 10px; /* This creates a small space between the edges of the text and the edges of the text. */
	padding-top: 20px; /* This ensures that there is some space between the top of the letters and the top of the box where the text is. */
	padding-bottom: 30px; /*Again this ensures that there is space between the bottom of the lettering the in the header and the bottom of the box. */
	}

#container {/* This acts as the border that surrounds the whole site and makes the site feel complete and sophisticated.  */ 
	width:750px;	
	margin:0 auto;
	margin-top:32px;
	text-align:justify;
	border:2px solid #000000;
	padding: 5px;
	background-color:#EDE275;
	}

#wrapper{
	width:750px;
	background:url(background_3.jpg) repeat-y; 
	overflow:auto; /* USE FIREFOX GUYS! WE ONLY NEED THIS LINE BECAUSE INTERNET EXPLODER ISN'T READING CODE PROPERLY */
	margin-top:5px;
	background-color:#EDE275;
	}


/* ----- NAVIGATION ----- */



#navigation {
	width:180px;
	min-height:500px; /* for modern browsers */
	height:auto !important; /* for modern browsers */
	height:500px; /* for IE5.x and IE6 */
	background-color:#003BCF;
	float:left;
	font-family:"Trebuchet MS", "Times New Roman", "Arial";
	padding: 10px;
	padding-top: 10px;
			}
	
	a:link {
		color: #FFFFFF;
		font-weight: bold;
		text-decoration: none;
			}
	a:visited {
			text-decoration: none;
			color:#FFFFFF
			   }
	a:hover {
			text-decoration: underline;
			color: #5376CF;
			}
	a:active {
		text-decoration: none;
		color: #FFFFFF;
			 }
	body,td,th {
		color: #FFFFFF;
			   }
	a {
		font-weight: bold;
	  }

a.intextlink{
	text-decoration:underline;
	color:#FFFFFF;
	}
a.intextlink:hover {
			text-decoration: underline;
			color: #002482;
			}
a.banner{
	color:#5376CF;
		}
a.banner:hover{
	text-decoration: underline;
	color:#5376CF;
		}

/* ----- MAIN CONTENT ----- */



#content { 
	margin-left:205px;
	width:525px;
	min-height:600px; /* for modern browsers */
	height:auto !important; /* for modern browsers */
	height:500px; /* for IE5.x and IE6 */
	background-color:#5376CF;
	font-family:"Trebuchet MS", "Times New Roman", "Arial";
	color: #FFFFFF;
	padding: 10px;
	padding-top: 10px;
	}



/* ----- FOOTER ----- */



#footer { 
	width:730px;	
	height:100px;	
	background-color:#002482;
	font-family:"Trebuchet MS", "Times New Roman", "Arial";
	color:#FFFFFF;
	padding: 10px;
	padding-top: 10px;	
	margin-top:5px;
	
	}

</style>
