/*--------------------------------------------------*/
/* General Setup                                    */

	* {
		padding: 0;
		margin: 0;
	}

	html,
	body {
		background: #EBE9E6;
		color: #484848;
	}

	body {
		font-family: verdana, arial, helvetica, sans-serif;
		font-size: 0.8em;
		text-align: center; /* IE5 WIN: thinks that you should text-align a block level element */
	}

	a img {
		border: 0;
	}

	ul,
	ol {
		margin: 0 0 10px 2em;
	}

	table {
		font-size: 1em; /* IE5 WIN: does not inherit the font size correctly */
	}

	input {
		font-size: 1em; /* FF: keep font size consistent, by default it is increased by 0.1em */
	}

	select option {
		padding-right: 5px; /* FF: The star rule above for removing the padding also effects the select option's  */
	}

/*--------------------------------------------------*/
/* Skip Links                                       */

	#skipLinks,
	#styleSheetSwitcher {
		padding: 0;
		position: absolute;
	 	right: 0px;
	 	top: -500em; /* This needs a width, height and overflow hidden to stop IE5 MAC from doing horizontal scroll */
	}

	#skipLinks a:active,
	#skipLinks a:focus,
	#styleSheetSwitcher a:active,
	#styleSheetSwitcher a:focus {
		position: absolute;
		top: 500.25em;
		right: 0.25em;
		z-index: 5;
		white-space: nowrap;
		color: #000;
		background: #FFF;
		border: 2px solid red;
		padding: 3px;
	}

/*--------------------------------------------------*/
/* Page Wrapper                                     */

	#pageWrapper {
		width: 750px;
		margin: 0 auto;
		text-align: left;
		background: #FFF;
		color: #484848;
	}

/*--------------------------------------------------*/
/* Page Title                                       */

	#pageTitle {
		background: #F5F4F2 url("../../img/global/strapLine.gif") no-repeat 540px 45px; /* 750 - 200 - 10 */
	}

	#pageTitle p {
		position: absolute;
		left: -5000px;
	}

	#pageTitle p img {
		display: block;
	}

/*--------------------------------------------------*/
/* Page Navigation                                  */

	#pageNavigation {
		background: #999081;
		color: #e2ded6;
	}

	#pageNavigation h2 {
		position: absolute;
		left: -5000px;
	}

	#pageNavigation ul {
		list-style: none;
		overflow: auto;
		width: 100%; /* IE5+6 WIN: does not understand the overflow auto to hold floats */
		margin: 0;
		padding: 0 0 0 5px;
	}

	#pageNavigation ul li {
		float: left;
	}

	#pageNavigation ul li a {
		background: #999081;
		color: #e2ded6;
		display: block;
		padding: 10px 8px 10px 7px;
		margin: 1px; /* FF: The select border causes a scroll bar on the overflow div */
		text-decoration: none;
		font-size: 0.9em;
		font-weight: bold;
		font-family: arial, verdana, helvetica, sans-serif;
	}

	#pageNavigation ul li a:hover,
	#pageNavigation ul li a:active
	#pageNavigation ul li a:focus {
		text-decoration: underline;
	}

	#pageNavigation ul li strong a {
		background: inherit;
		color: #FFF;
	}

/*--------------------------------------------------*/
/* Page Content (standard)                          */

	/*--------------------------------------------------*/
	/* Wrapper                                          */

		#pageContent {
			padding: 30px 15px 0 15px;
		}

	/*--------------------------------------------------*/
	/* Side Bar                                         */

		#pageContent #sideBar {
			float: left;
			width: 190px;
			color: #191D58;
			overflow: hidden; /* Allowing this text to flow onto the main body is more damaging */
		}

		#pageContent #sideBar h2 {
			font-size: 1em;
			padding: 0 10px 0 0;
		}

		#pageContent #sideBar h2.sideNotesTitle {
			position: absolute;
			left: -5000px;
		}

		#pageContent #sideBar p {
			font-size: 1.05em;
			margin: 0 0 1em 0;
		}

		#pageContent #sideBar img {
			display: block;
			margin: 40px auto 1em auto;
		}

		#pageContent #sideBar ul {
			list-style: none;
			padding: 0 10px 1em 0;
			margin: 0;
		}

		#pageContent #sideBar a {
			background: #FFF;
			color: #191D58;
			text-decoration: none;
			padding-right: 12px;
			background: url("../../img/global/linkArrow.gif") no-repeat 100% 3px;
			font-size: 0.9em;
		}

		#pageContent #sideBar a:hover,
		#pageContent #sideBar a:active,
		#pageContent #sideBar a:focus {
			text-decoration: underline;
		}

		#pageContent #sideBar .sectionNav {
			border-top: 1px solid #DFDFDF;
			padding: 0;
			margin: 0 0 2em 0;
		}

		#pageContent #sideBar .sectionNav li {
			border-bottom: 1px solid #DFDFDF;
		}

		#pageContent #sideBar .sectionNav li a {
			color: #868686;
			background: none;
			display: block;
			padding: 3px 0;
		}

		#pageContent #sideBar .sectionNav li strong a {
			font-weight: normal;
			color: #191D58;
		}

	/*--------------------------------------------------*/
	/* Main Body                                        */

		/*--------------------------------------------------*/
		/* General                                          */

			#pageContent #mainBody {
				float: left;
				margin-left: 40px;
				width: 490px; /* 720 - 190 - 40 */
			}

			#pageContent #mainBody h1 {
				font-size: 1.2em;
				font-weight: normal;
				background: #FFF url("../../img/global/greyBorder.gif") repeat-x 100% 100%;
				color: #191D58;
				padding: 0 0 10px 0;
				margin: 0 0 10px 0;
			}

			#pageContent #mainBody h2 {
				font-size: 1em;
				color: #191D58;
				margin: 0 0 10px 0;
			}

			#pageContent #mainBody p {
				margin: 0 0 1em 0;
				color: #484848;
				background: #FFF;
			}

			#pageContent #mainBody ul li a,
			#pageContent #mainBody p a {
				font-weight: normal;
				color: #191D58;
				background: #FFF;
				text-decoration: none;
			}

			#pageContent #mainBody p a {
				text-decoration: underline;
			}

			#pageContent #mainBody p a:hover,
			#pageContent #mainBody p a:active,
			#pageContent #mainBody p a:focus {
				text-decoration: underline;
			}

		/*--------------------------------------------------*/
		/* Banner                                           */

			#pageContent #mainBody #banner {
				background: #999081;
				color: #FFF;
				overflow: auto;
				width: 100%; /* IE5+6 WIN: does not contain the floats with the overflow auto, but this triggers a bug that has the same effect */
				margin-right: -3px; /* IE6 WIN: a form of the 3px jog bug, so give it a bit more space by leaving a gap under the right hand side  */
				margin-bottom: 10px;
			}

			#pageContent #mainBody #banner img {
				float: left;
			}

			#pageContent #mainBody #banner h3 {
				background: #999081;
				color: #FFF;
				font-weight: normal;
				padding: 10px 5px 5px 360px;
			}

			#pageContent #mainBody #banner h3 a {
				background: #999081;
				color: #FFF;
				text-decoration: none;
			}

			#pageContent #mainBody #banner h3 a:hover,
			#pageContent #mainBody #banner h3 a:focus,
			#pageContent #mainBody #banner h3 a:active {
				text-decoration: underline;
			}

			#pageContent #mainBody #banner p {
				font-size: 0.8em;
				padding: 0 5px 5px 360px;
				margin: 0;
				color: #FFF;
				background: #999081;
			}

		/*--------------------------------------------------*/
		/* Next Link                                        */

			#pageContent #mainBody p.nextLink {
				margin: 2em 0;
				text-align: right;
				overflow: auto;
				width: 100%; /* IE5+6 WIN: does not contain the floats with the overflow auto, but this triggers a bug that has the same effect */
				padding: 1px; /* FF: When the link is selected, the selected border causes scroll bars */
			}

			#pageContent #mainBody p.secondaryNextLink {
				margin-top: -1em;
			}

			#pageContent #mainBody p.nextLink a {
				font-size: 1.3em;
				color: #7D7D7D;
				background: #FFF url("../../img/global/nextLinkArrow.gif") no-repeat 100% 70%;
				text-decoration: none;
				float: right; /* Display block will make the hit area too large */
				padding: 0 75px 0 0;
			}

			#pageContent #mainBody p.nextLink a:hover,
			#pageContent #mainBody p.nextLink a:active,
			#pageContent #mainBody p.nextLink a:focus {
				text-decoration: underline;
			}

		/*--------------------------------------------------*/
		/* Big and small link                               */

			#pageContent #mainBody p.smallLink a,
			#pageContent #mainBody p.bigLink a {
				text-decoration: none;
			}

			#pageContent #mainBody p.bigLink a {
				font-size: 1.1em;
				font-weight: bold;
			}

			#pageContent #mainBody p.smallLink a:hover,
			#pageContent #mainBody p.smallLink a:active,
			#pageContent #mainBody p.smallLink a:focus,
			#pageContent #mainBody p.bigLink a:hover,
			#pageContent #mainBody p.bigLink a:active,
			#pageContent #mainBody p.bigLink a:focus {
				text-decoration: underline;
			}

		/*--------------------------------------------------*/
		/* Date List                                        */

			#pageContent #mainBody ul.dateList {
				margin: 0;
				list-style: none;
				color: #7D7D7D;
				background: #FFF;
			}

			#pageContent #mainBody ul.dateList li {
				margin-bottom: 1em;
			}

			#pageContent #mainBody ul.dateList strong,
			#pageContent #mainBody ul.dateList a {
				font-weight: normal;
				color: #191D58;
				background: #FFF;
				text-decoration: none;
			}

			#pageContent #mainBody ul.dateList a:hover,
			#pageContent #mainBody ul.dateList a:active,
			#pageContent #mainBody ul.dateList a:focus {
				text-decoration: underline;
			}

		/*--------------------------------------------------*/
		/* Image Holder                                     */

			#pageContent #mainBody div.imageHolder {
				text-align: center; /* IE5 WIN: thinks that you should text-align a block level element */
				margin: 2em -3px 2em 0; /* IE5+6 WIN: Form of the 3px jog which causes wide images to wrap under sideBar */
			}

			#pageContent #mainBody div.imageHolder img {
				margin: 0 auto;
				display: block;
			}

/*--------------------------------------------------*/
/* Page Footer                                      */

	#pageFooter {
		clear: both;
		overflow: auto;
		width: 100%; /* IE5+6 WIN: does not understand the overflow auto to hold floats */
		border-top: 1px dotted #737373;
	}

	#pageFooter h2 {
		position: absolute;
		left: -5000px;
	}

	#pageFooter p {
		float: left;
		padding: 10px 5px 10px 15px;
	}

	#pageFooter ul {
		float: right;
		margin: 0;
		padding: 10px 10px;
	}

	#pageFooter ul li {
		list-style: none;
		padding: 0 5px;
		float: left;
		border-right: 1px solid #737373;
	}

	#pageFooter ul li.lastChild {
		border-right: 0;
	}

	#pageFooter span,
	#pageFooter a {
		background: #FFF;
		color: #484848;
		text-decoration: none;
		font-size: 0.8em;
	}

	#pageFooter span a {
		font-size: 1em;
	}

	#pageFooter a:hover,
	#pageFooter a:active,
	#pageFooter a:focus {
		text-decoration: underline;
	}

/*--------------------------------------------------*/
/* Basic Form                                       */

	.basicForm fieldset {
		padding-bottom: 1em;
		border: 0;
	}

	.basicForm .error {
		color: #F00;
		background: inherit;
		font-weight: bold;
		padding: 1em 1em 1em 2em;
	}

	.basicForm .row {
		padding: 5px 0 0 11.5em;
		clear: both;
	}

	.basicForm .row .label { /* NS7: Cannot apply styles to label object */
		float: left;
		width: 11em;
		margin: 3px 0 0 -11.5em;
		text-align: right;
	}

/*--------------------------------------------------*/
/* Link List                                        */

	ul.linkList {
		list-style: none;
		padding: 0 0 1em 0;
	}

	ul.linkList li a {
		background: #FFF url("../../img/global/linkArrow.gif") no-repeat 100% 3px;
		padding-right: 12px;
		color: #191E58;
		text-decoration: none;
	}

	ul.linkList li a:hover,
	ul.linkList li a:active,
	ul.linkList li a:focus {
		text-decoration: underline;
	}

/*--------------------------------------------------*/
/* Gallery                                          */

	#pageContent #gallery ul {
		padding-top: 1em;
		margin: 0;
	}

	#pageContent #gallery ul.incSubGallery {
		margin: 0 0 30px 0;
	}

	#pageContent #gallery ul li {
		list-style: none;
		float: left;
		padding: 0 5px;
		border-left: 1px solid #484848;
		font-size: 0.8em;
	}

	#pageContent #gallery ul li.firstChild {
		padding-left: 0;
		border-left: 0;
	}

	#pageContent #gallery ul li a {
		color: #AAA;
	}

	#pageContent #gallery ul li a:hover,
	#pageContent #gallery ul li a:focus,
	#pageContent #gallery ul li a:active {
		text-decoration: underline;
	}

	#pageContent #gallery ul li.ui-state-active a {
		color: #484848;
	}

	#pageContent #gallery div {
		padding-top: 1.2em; /* Same height as the ul, cannot clear (as it clears the nav) */
	}

	#pageContent #gallery div.ui-tabs-hide {
		position: absolute;
		left: -5000px;
		height: 1px;
		overflow: hidden;
	}

	#pageContent #gallery div.subGallery {
		margin-top: -25px;
		padding-top: 0;
	}

	#pageContent #gallery div.subGallery ul.subGalleryNav {
		margin: 0 0 20px 0;
		padding-top: 1px;
	}

	#pageContent #gallery div.subGallery ul.subGalleryNav.framed {
		margin-left: 7.8em;
	}

	#pageContent #gallery div.subGallery ul.subGalleryNav li a {
		color: #191D58;
		font-weight: bold;
	}

	#pageContent #gallery div ul.more {
		position: absolute;
		left: -5000px;
	}

	#pageContent #gallery div p.image {
		text-align: center;
		padding: 2em 0;
		margin: 0;
	}

	#pageContent #gallery div p.more a {
		background: #FFF url("../../img/global/gallery.gif") no-repeat 0 3px;
		display: block;
		line-height: 25px;
		padding-left: 45px;
		text-decoration: none;
	}

	#pageContent #gallery div p.more a span {
		background: #FFF url("../../img/global/linkArrow.gif") no-repeat 100% 3px;
		padding-right: 12px;
	}

	#pageContent #gallery div p.more a:hover span,
	#pageContent #gallery div p.more a:active span,
	#pageContent #gallery div p.more a:focus span {
		text-decoration: underline;
	}

