body {
	font-family: Arial, helvetica, sans-serif;
	padding: 0px;
	margin: 0px;
}

body, html {height: 100%;}

img {
	display: block; /*** Stops the bottom border in IE ***/
	padding: 0px;
	margin: 0px;
}

/********************************************************/
/*** FOR THE MORE ON THE FOLLOWING SEE: ***/
/********************************************************/
/*** http://www.jakpsatweb.cz/css/css-vertical-center-solution.html ***/
/*** http://www.w3.org/Style/Examples/007/center.html ***/
/********************************************************/

#outer {
	display: table;					/*** For STANDARD browsers ***/
	height: 100%;				    /*** For every browser ***/
	width: 100%;				    /*** For every browser ***/
	#position: relative;			/*** For INTERNET EXPLORER ONLY (with # hack) ***/
	overflow: hidden;				/*** For every browser ***/
}

#outer2 {
	#position: absolute;			/*** For INTERNET EXPLORER ONLY (with # hack) ***/
	#top: 50%;						/*** For INTERNET EXPLORER ONLY (with # hack) ***/
	display: table-cell;			/*** For STANDARD browsers ***/
	vertical-align: middle;			/*** For STANDARD browsers ***/
	width: 100%;
}

#outer3 {
	background: transparent url(../images/spacers_etc/gradient_both.gif) no-repeat center top;
	height: 360px;					/*** Increased by 25px to keep in centre with footer added***/
	width: 100%;
	#position: relative;			/*** For INTERNET EXPLORER ONLY (with # hack) ***/
	#top: -50%;						/*** For INTERNET EXPLORER ONLY (with # hack) ***/
}

/*** END ***/

/****************************************************************************************************************/
/*** FOOTER *****************************************************************************************************/
/****************************************************************************************************************/

#footer {
	position:absolute;
   	bottom:0;
   	width:100%;
	height:25px;   /* Height of the footer */
	background: #ffffff;
	border-top: 1px solid #939598;
}

#footerInside {
	padding: 5px 0px 0px 0px;
	margin: 0px;
	width: 930px;
	margin-left: auto; 		/*** USED TO CENTRE CONTENT ***/
	margin-right: auto; 	/*** USED TO CENTRE CONTENT ***/
}

div.footerInsideleft {
	float: left;
}

div.footerInsideright {
	float: right;
}

/****************************************************************************************************************/
/*** FONT SIZES *************************************************************************************************/
/****************************************************************************************************************/

body, td, th, p, ul, ol, input, textarea, select, div
{
	font-size: 11px;
}

h1 {font-size: 16px;}
h2 {font-size: 12px;}

p.navigation, p.navigationActive {font-size: 13px;}

/****************************************************************************************************************/
/*** FONT STYLES ************************************************************************************************/
/****************************************************************************************************************/

p {
	color: #4D4D4F;
	line-height:120%;
	margin-top: 0px;
	margin-bottom: 10px
}

ul
{
   margin-left: 2em;
   padding-left: 0em;
   list-style-type: square;
   color: #4D4D4F;
   line-height:120%;
   margin-top: 0px;
   margin-bottom: 10px;
}

a:link, p a:link, ul a:link, ol a:link {COLOR: #034EA2; text-decoration: underline}
a:visited, p a:visited, ul a:visited, ol a:visited {COLOR: #034EA2; text-decoration: underline}
a:active, p a:active, ul a:active, ol a:active {COLOR: #4D4D4F; text-decoration: none}
a:hover, p a:hover, ul a:hover, ol a:hover {COLOR: #4D4D4F; text-decoration: none}

h1 {color: #034EA2; font-weight: bold; margin-top: 0px; margin-bottom: 10px; line-height:110%}
h2 {color: #034EA2; font-weight: bold; margin-top: 0px; margin-bottom: 10px; line-height:110%}

.alt a:link {COLOR: #4D4D4F; text-decoration: underline}
.alt a:visited {COLOR: #4D4D4F; text-decoration: underline}
.alt a:active {COLOR: #4D4D4F; text-decoration: none}
.alt a:hover {COLOR: #4D4D4F; text-decoration: none}

.red {color: #731914;}
.blue {color: #034EA2;}
.lightGrey {color: #}
.darkGrey {color: #4d4d4d}

/****************************************************************************************************************/
/*** NAVIGATION  ************************************************************************************************/
/****************************************************************************************************************/

p.navigation, p.navigationActive {
	padding: 4px 15px 4px 15px;
	line-height: 17px;
	margin: 0px;
	font-weight: bold;
	display: block;
}

p.navigation a {display: block;}
p.navigation a:link {COLOR: #4D4D4F; text-decoration: none}
p.navigation a:visited {COLOR: #4D4D4F; text-decoration: none}
p.navigation a:active {COLOR: #034EA2; text-decoration: none}
p.navigation a:hover {COLOR: #034EA2; text-decoration: none}

p.navigationActive a {display: block;}
p.navigationActive a:link {COLOR: #034EA2; text-decoration: none}
p.navigationActive a:visited {COLOR: #034EA2; text-decoration: none}
p.navigationActive a:active {COLOR: #034EA2; text-decoration: none}
p.navigationActive a:hover {COLOR: #034EA2; text-decoration: none}

.imageBorder {
	margin: 0px;
	padding: 0px;
}

/****************************************************************************************************************/
/*** LAYOUT DIV TAGS ********************************************************************************************/
/****************************************************************************************************************/

#container {
	background: #ffffff;
	padding: 0px;
	margin: 0px;
	width: 930px;
	height: 335px;
	margin-left: auto; 		/*** USED TO CENTRE CONTENT ***/
	margin-right: auto; 	/*** USED TO CENTRE CONTENT ***/
}

/********************************************************/
/*** See: http://www.positioniseverything.net/explorer/threepxtest.html ***/
/********************************************************/

#navigation {
	float: left;
	background: transparent url(../images/spacers_etc/border_right.gif) repeat-y right top;
	margin: 0px;
	padding: 0px;
	text-align: left;
	width: 175px;
	height: 335px;
}

#content {
	margin: 0px 0px 0px 190px;
	padding: 0px;
}

/* Hide from IE5-mac \*/

* html #navigation {
	margin-right: 12px; /* 15px minus the 3px error */
}

* html #content {
	height: 1%;
	margin-left: 0;
}

/* End IE5/mac hide */

/* End IE5/mac hide */

/*** See: http://www.positioniseverything.net/explorer/threepxtest.html ***/

/*** IE5/mac does not have the 3px jog, but does have a version of the float model problem,
so this fix must be hidden from IE5/mac. The comment above with the escape character
just before the closing tag does not close in IE5/mac, hiding the Tan hacks from that browser.
The second comment after the hacks has the effect of "closing" the first comment for IE5/mac. ***/

/*** The right margin on the float in the Tan hack is 3px less than it should be, because of a 
mystery margin added to the float in IE/win when the paragraph has a dimension. ***/

/*** END ***/

#navigationOuter {
	padding: 15px 0px 0px 0px;
	margin: 0px;
}

#navigationInner {
	padding: 0px;
	margin: 15px 0px 0px 0px;
	display: inline; 	/* NEEDED TO MAKE THE NAVIGATION WORK IN IE DUE TO ERROR INTRODUCED */
						/* BY ADDING 'DISPLAY' AND 'ALIGN' TAGS IN OUTER2 STYLE ABOVE */
}

#contentImages {
	padding: 0px;
	margin: 0px;
	background: transparent url(../images/spacers_etc/gradient_fade_up.gif) repeat-x left bottom;
	float: right;
	width: 470px;
	border: 0px;
	border-left: 1px solid #939598;
}

#contentText {
}

/****************************************************************************************************************/
/*** IMAGE GRID *************************************************************************************************/
/****************************************************************************************************************/

#imagesContainerOuter {
	padding: 0px;
	margin: 15px 0px 0px 15px; /*** both margin 0 to stop error in IE ***/
}

#imagesContainerInner {
	padding: 0px;
	margin: 0px;
	width: 455px;
	height: 320px; /*** 335px - 15px to margin ***/
}

/****************************************************************************************************************/
/*** TEXT AREA **************************************************************************************************/
/****************************************************************************************************************/

#textContainerOuter {
	padding-top: 15px;
}

#textContainerScrollFull {
	z-index: 0;
	overflow: auto;
	height: 305px;
	padding-left: 1px;	/*** Padding added to stop 'w' characters being cropped on the left of a row in IE ***/
	width: 254px;		/*** Width reduced by 1px in light of 1px left padding above ***/
	
	/*
	scrollbar-face-color: #EBEBEB;
	scrollbar-shadow-color: #86858B;
	scrollbar-highlight-color:#fff;
	scrollbar-3dlight-color: #ccc;
	scrollbar-darkshadow-color: #ccc;
	scrollbar-track-color: #fff;
	scrollbar-arrow-color: #000;
	scrollbar-base-color: #ccc;
	*/
}

#textContainerInner {
	/* MIGHT WANT PADDING ON RIGHT SO THERE IS SPACE BETWEEN TEXT AND SCROLL BAR BUT */
	/* THIS MEANS THAT THERE WILL ALSO BE SPAVE OF THERE IS NO SCROLL BAR */
}