html, body {
	background: #00224f;
	color: #fff;
	}
body 	{
	font-family: Verdana,Arial,Tahoma,Helvetica,sans-serif;
	font-size: 75%;
	}

/***** Text and headings *****/
/* 
 * body font-size set for <p>. hence
 * all heading font-sizes are w.r.t. 
 * <p>.
 */

p { margin-bottom: 1em; }

h1, h2 {
	font-family: 'Arial black', sans;
	font-weight: normal;
	margin-bottom: 1em;
	}
h1 { font-size: 167%; }

div#pageheading p {
	font-size: 133%;
	font-family: 'Arial Black', sans-serif;
	}

/***** Floating classes  *****/
.toleft { float: left; }
img.toleft { padding: 0 15px 10px 0; }

.toright { float: right; }
img.toright { padding: 0 0 10px 15px; }

/***** Main page layout, 990px wide, centred	*****/
/***** #top, #maincontainer, #bottom 		*****/
/*
 * These elements hold the expanding background image
 */
#top, #maincontainer, #bottom {
  width: 990px;
  margin: 0 auto;
}
#top 	{
	height: 47px;
  	background: transparent url('../images/bg_top.png') bottom no-repeat;
	}
#maincontainer {
	position: relative; /*** Define Containing Block ***/
	background: transparent url('../images/bg.png');
	}

#footer { clear: both; }

#bottom {
	clear: both;
  	height: 47px;
  	background: transparent url('../images/bg_bottom.png') no-repeat;
	}

/***** Navigation and contact details *****/

#navbar {
	float: left;
	margin-left: 50px;
  	width: 140px;
  	color: #5e9bb0;
	}

#logo { margin-top: 18px; }

#mainnav { margin-top: 40px; }

#mainnav ul li a {
  display: block;
  padding: 0.42em 0;
  color: #5e9bb0;
  font-family: 'Arial Black';
  font-size: 120%;
  text-decoration: none;
}
#mainnav ul li.active a, #mainnav ul li a:hover, #mainnav ul li a:focus {
	color: #00a9eb;
}
#mainnav ul li a:hover, #mainnav ul li a:focus {
  	text-decoration: underline;
}
#mainnav ul ul { margin-bottom: 20px; }

#mainnav ul li li a,
#mainnav ul li.active li a  {
  font-family: Arial;
  font-size: 126%;
  border-bottom: 1px dotted #5e9bb0;
}

#foot {
	position: absolute; /* with respect to #maincontainer */
	bottom: 50px; /* match #maincontent padding */
	font-size: 90%;
	line-height: 1.1;
}

/***** Main page content *****/

#maincontent {
  	margin: 0 50px 0 190px;  /* 750px width */
  	padding: 65px 0 50px 0;
	}

/* Internal div to sit inside overhanging top/bottom borders of parent element
 */ 
.internalbg {
/* IE7 ignores the following line:
 	margin: 0 17px;
 * The following is the 'fix' for IE7 that also remains 
 * standards compliant and works in other browsers
 */
 	width: 696px;
	position: relative;
	left: 17px;
/* end of 'fix' */
  	padding: 5px 10px;
  	background: #5e9bb0;
}

/* News (bar at top of page) 
 */
#news { /* Date and strapline */
 	border-bottom: 3px solid #5e9bb0;
  	border-top: 3px solid #5e9bb0;
	font-family: 'Arial Black', sans;
	min-height: 44px;
}
#news div.date {
	float: left;
	width: 150px;
}
#news div#newstext {
	margin-left: 160px; /* allow space for floating .date */
	font-size: 170%;
        line-height: 115%;
	text-align: center;
	vertical-align: middle;
}

/* Content block
 */
#main {
  margin-top: 30px;
  border-top: 3px solid #5e9bb0;
  border-bottom: 3px solid #5e9bb0;
}

#content { /* Sets up top and bottom white lines */
  padding: 3px 0 0;
  border-bottom: 2px solid #fff;
  border-top: 2px solid #fff;
}

#contentinner { /* white content area */
  margin: 1px 0;
  padding: 10px;
  color: #5e9bb0;
  background: white;
}

#subcontent { /* region below white content area */
  float: left;
  width: 420px;
  margin-top: 10px;
  font-size: 90%;
  line-height: 1.3;
}

/***** List pages *****/

#maincontent #contentinner ul.sectionlist {
	list-style-type: none;
	padding-left: 0;
	}

#maincontent .listitem {
	float: left;
	padding-bottom: 10px;
	}

#maincontent .listitem img { width: 100px; }

#maincontent .listitem img, #maincontent .listitem h2 {
	padding-top: 0; 
	}

#maincontent .listitem h2, #maincontent .listitem p {
	margin: 0 0 1em 115px;
	width: 550px;
	}
	
#maincontent .listitem h2 a:link, #maincontent .listitem h2 a:visited {
	color: #5E9BB0;
	text-decoration: none;
	}
#maincontent .listitem h2 a:hover, #maincontent .listitem h2 a:active, #maincontent .listitem h2 a:focus {
	color: #5E9BB0;
	text-decoration: underline;
	}

/***** Manage pictures (maxigallery) *****/
/* 
 * Also see default.css
 */
div.shortfields label {
	display: block;
	margin-top: 1em;
	text-align: left;
	}
div.shortfields input {
	display: inline;
	margin: 0;
	margin-top: 0.2em;
	}

/***** Maxigallery thumbs *****/

.thumbscontainer img.thumbnail {
	height: 97px;
	}

/***** Prev/Next on item pages *****/

#subnavigation {
  margin-top: 20px;
  float: right;
  position: relative; /** Define as CB **/
  height: 17px;	/* match height of absolutely positioned child 
		elements so they are enclosed in this area. */
}

span.PJN_Prev, span.PJN_Next {
	position: absolute;
	top: auto;
	}
div.prevbutton a, div.nextbutton a {
	display: block;
	height: 17px; /* Height of image buttons */
}

span.PJN_Prev {
	right: 8em;
	width: 9em;
	border-right: solid 2px #b0dcdc;
	padding-right: 1em;
	}
div.prevbutton a {
	padding-left: 50px; /* button width + 7px margin */
	background: url(../images/prevbutton.gif) no-repeat scroll center left;
	}

span.PJN_Next {
	right: 0;
	width: 7em;
	border-left: solid 2px #b0dcdc;
	padding-left: 1em; /* gap to vertical line */
	}
div.nextbutton a {
	padding-right: 50px; /* button width + 7px margin */
	background: transparent url(../images/nextbutton.gif) no-repeat scroll center right;
	}

div#subnavigation a:link, div#subnavigation a:visited {
	color: white;
	text-decoration: none;
	}
div#subnavigation a:hover, div#subnavigation a:active, div#subnavigation a:focus {
	color: white;
	text-decoration: underline;
	}

/*******************************/
/*   Main content typography   */
/*******************************/

#contentinner {
	/* Apply global styles to here, not to <p>
	 * NOTE: this may be more appropriate applied to #content
	 */
	font-size: 1em;
	line-height: 1.3;
	}
	
#contentinner ul {
	list-style-type: disc;
	padding: 0.5em 0 0.5em 40px;
	}
#contentinner ol {
	list-style-type: decimal;
	padding: 0.5em 0 0.5em 40px;
	}

#contentinner p, #contentinner li {
	margin: 1em 0;
	}

#contentinner h2, #contentinner h3, #contentinner h4, #contentinner h5, #contentinner h6 {
	font-weight: bold;
	margin: 1em 0;
	}
#contentinner h2 { font-size: 1.2em; font-weight: normal; font-family: "Arial Black", sans-serif; }

#contentinner h3 { font-size: 1.15em; }

#contentinner h4 { font-size: 1.1em; }

#contentinner h5 { font-size: 1.05em; }

#contentinner h6 { font-size: 1em; }

#contentinner strong { font-weight: bold; }

#contentinner em { font-style: italic; }

#contentinner sup { vertical-align: top; font-size: 60%; }

#contentinner sub { vertical-align: bottom; font-size: 60%; }


#contentinner a:link, #contentinner a:visited {
	color: #5E9BB0;
	text-decoration: underline;
	}

#contentinner a:hover, #contentinner a:active, #contentinner a:focus {
	color: #503763;
	text-decoration: underline;
	}

#contentinner table th, #contentinner table td { padding: 0.6em; }

/***************/
/* Subcontent */
/***************/

#subcontent a:link, #subcontent a:visited, #subcontent a:hover, #subcontent a:active, #subcontent a:focus {
	color: #fff;
	text-decoration: underline;
	}

/****************/
/* Contact Form */
/****************/

/* !! inline width on sub-content for contact page only 
 */

#contact-form { 
	float: right;
	width: 400px;
	}
		
#contact-form div.errors { font-weight: bold; color: #FFFF00; }

#contact-form label {
  display: block;
  float: left;
  text-align: right;
  width: 180px;
}

#contact-form input, #contact-form textarea, #contact-form select {
  display: block;
  border: 1px solid #5e9bb0; 
  font-size: 126%; 
  margin: 0 0 10px 190px;
  width: 200px;
}

#contact-form input:hover, #contact-form textarea:hover, #contact-form input:focus, #contact-form textarea:focus {
  border-color: #00224f;
}

input[type="hidden"] { display: none; }
