/*	Strange Lite - Site-specific CSS Stylesheet	(screen) - Client: BPE Signs	*/

/*	Author: Jim Rixon - 16/04/06 - (c)2006 Strange Corporation	*/

/*	EDIT THIS DOCUMENT - All CSS changes (screen) should be made to this site-specific CSS file	*/

/* ----------------------------------- */

/* Set default site-wide tags */

html {
	height: 100%;
	}
	
body {
	height: 100%;
	background:  url('/images/background_pattern.jpg') repeat-x top;
	background-color: #003E67;
	margin: 0px;
	padding: 0px;
	font-size: 62.5%;
	font-family: Arial, Helvetica, sans-serif;
	color: #AEE9EB;
	}

h1 {
	font-size: 1.8em;
	line-height: 1.2em;
	margin: 0 0 10px 0;
	}
	
h2 {
	font-size: 1.2em;
	line-height: 1.4em;
	}
	
h3 {
	font-size: 1.1em;
	line-height: 1.2em;
	}
	
p {
	font-size: 1.2em;
	line-height: 1.4em;
	}
	
a {
	color: #61DCE8;
	font-weight: bold;
	text-decoration: none;
	}
	
	a:hover {
		text-decoration: underline;
		color: #fff;
		}

	a img {
		border: 1px solid #0A2866;
		}

ul, ol {
	padding: 0 0 0 30px;
	margin: 0px;
	}
	
form {
	padding: 0px;
	margin: 0px;
	}

hr {
	clear: both;
	float: none;
	height: 0px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	border-top: 1px solid #00B1FF;
	}	
	
/* Site-wide custom classes */

table.imagebrowser {
	float: left;
	width: 102px;
	border-collapse:collapse;
	border: 0px;
}

ul.menu {
	list-style-type: none;
	}

	ul.menu li {		
		display: inline;
		}
		
		ul.menu li a {		
			display: inline;
			}

/* Site-wide custom divs */

#pagewrapper {
	width: 750px;
	margin: 0px auto;
	height: auto;
	background: url('/images/body_bg.gif') no-repeat top;
	background-color: #00365E;
	}

#header {
	width: 710px;
	height: 1.4em;
	padding: 10px 20px 4px 20px;
	background-color: #003264;
	}
	
	#header p {
		float: left;
		font-size: 1.1em;
		line-height: 1.4em;
		}
	
	#header ul.menu {
		float: right;
		}
	
		#header ul.menu li {		
			padding-right: 10px;
			border-right: 1px solid #00A3D6;
			margin-right: 10px;
			}
	
			#header ul.menu li.last {		
				padding: 0px;
				border: 0px;
				margin: 0px;
				}
	
	#header a {
		font-size: 1.1em;
		line-height: 1.4em;
		color: #B4E8FF;
		padding: 0px;
		}
	
		#header a:hover {
			color: #fff;
			}
	
#pagebanner {
	width: 100%;
	padding: 0px;
	margin: 0 0 -3px 0;
	}
	
	html>body #pagebanner {
		margin: 0px;
		}
	
	#pagebanner img {
		padding: 0px;
		margin: 0px;
		}
	
	#pagebanner #flashbanner {
		padding: 0px;
		margin: 0px;
		}
	
#navigation {
	background-color: #00203F;
	padding: 0 20px 10px 20px;
	width: 710px;
	border-bottom: 1px solid #006AA4;
	}

	#navigation ul.menu {
		margin: 0px;
		padding: 0px;
		}

	#navigation ul.menu li {
		margin: 0px;
		padding: 0px;
		}
	
	#navigation ul.menu a {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1.4em;
		line-height: 1.4em;
		color: #AEE9EB;
		padding-right: 10px;
		border-right: 1px solid #00A3D6;
		margin-right: 10px;
		}

	#navigation ul.menu a.last {
		border-right: none;
		}

		#navigation ul.menu a:hover {
			color: #fff;
			}

#pagecontent {
	width:710px;
	height: auto;
	padding: 20px;
	}
	
	#pagecontent a img {
		float: left;
		margin: 0 20px 20px 0;	
		}
	
	#pagecontent #column2wrapper {
		height: auto;
		}
	
	#pagecontent #column1wrapper {
		height: auto;
		}
		
		html>body #pagecontent #column1wrapper {
			margin-bottom: 20px;
			}
		
		#pagecontent #column1wrapper .color1 {
			clear: left;
			border-top: 1px solid #006AA4;
			}
			
		#pagecontent #column1wrapper .color2 {
			clear: left;
			border-top: 1px solid #006AA4;
			}
				
		#pagecontent #column1wrapper .categoryintro h1 {
			line-height: 1.2em;
			margin: 0 0 10px 0;
			}
	
			#pagecontent #column1wrapper .categoryintro p {
				margin: 0px 0px 15px 0px;
				}
	
			#pagecontent #column1wrapper .categoryintro img {
				border: 0px;
				}
				
			#pagecontent #column1wrapper .categoryintro ul, #pagecontent #column1wrapper .categoryintro ol {
				font-size: 1.2em;
				margin: 0 0 10px 0;
				}
		
		#pagecontent #column1wrapper .articleintro {
			margin: 0px 0px 1px 0px;
			}
		
			#pagecontent #column1wrapper .article p {
				margin: 10px 0px 5px 0px;
				font-size: 1.1em;
				}
				
			#pagecontent #column1wrapper .article p.articledetails {
				clear: both;
				}
					
			#pagecontent #column1wrapper .article h1 {
				float: left;
				line-height: 1.2em;
				}
	
			#pagecontent #column1wrapper .article img {
				border: 1px solid #00C8E0;
				float: left;
				margin: 10px 20px 10px 0px;
				}
				
			#pagecontent #column1wrapper .article hr {
				clear: both;
				float: none;
				height: 0px;
				margin: 0px;
				padding: 0px;
				border: 0px;
				border-top: 1px solid #00B1FF;
				}	
		
			#pagecontent #column1wrapper .article a.back {
				float: right;
				margin-left: 20px;
				}
				
			#pagecontent #column1wrapper .article h2 {
				font-size: 1.2em;
				margin: 5px 0px 10px 0px;
				}
		
		#pagecontent #column1wrapper .articlebrief {
			margin: 20px 0 0 0;
			padding: 20px 0 0 0;
			color: #00C8E0;
			height: 114px;
			}
			
			html>body #pagecontent #column1wrapper .articlebrief {
				height: auto;
				padding: 0;
				}
			
			#pagecontent #column1wrapper .articlebrief h2 {
				margin: 5px 0px 10px 0px;
				color: #00C8E0;
				}
			
			#pagecontent #column1wrapper .articlebrief p {
				font-size: 1.1em;
				line-height: 1.6em;
				margin: 0px 0px 10px 0px;
				color: #A0D6D8;
				}
				
				html>body #pagecontent #column1wrapper .articlebrief p {
					/* This code ignored by IE */
					margin-bottom: 15px;
					/*------------------------ */
					}
			
			#pagecontent #column1wrapper .articlebrief a {
				color: #AEE9EB;
				}
				
				#pagecontent #column1wrapper .articlebrief a:hover {
					color: #fff;
					}
			
			#pagecontent #column1wrapper .articlebrief img {
					border: 1px solid #00C8E0;
					}
					
					#pagecontent #column1wrapper .articlebrief a:hover img {
						border: 1px solid #fff;
						}
					
			#pagecontent #column1wrapper .articlebrief p span.readmore {
				margin: 0px;
				padding: 0px;
				}
			
			#pagecontent #column1wrapper .articlebrief p a.more {
				font-family: Verdana, Arial, Helvetica, sans-serif;
				background-color: #00203F;
				font-size: 0.9em;
				letter-spacing: -0.1em;
				padding: 1px;
				border: 1px solid #006AA4;
				text-transform: uppercase;
				color: #AEE9EB;
				margin: 0px;
				}
	
				#pagecontent #column1wrapper .articlebrief p a.more:hover {
					background-color: #00203F;
					color: #fff;
					border: 1px solid #AEE9EB;
					}	
				
	#pagecontent #column1wrapper form  {
		text-align: right;
		}

		#pagecontent #column1wrapper form h2 {
			display: block;
			text-align: left;
			font-size: 1.2em;
			font-weight: bold;
			}

		#pagecontent #column1wrapper form p {
			text-align: left;
			}

		#pagecontent #column1wrapper form select {
			color: #0A2866;
			font-size: 1.1em;
			padding: 2px;
			}
			
			html>body #pagecontent #column1wrapper form select {
				/* This code ignored by IE */
				padding: 0px;
				margin-bottom: 3px;
				/*------------------------ */
				}
		
		#pagecontent #column1wrapper form input.button {
			display: block;
			margin: 0 auto 10px auto;
			width: 100px;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 1.1em;
			font-weight: bold;
			color: #0A2866;	
			}
			
		#pagecontent #column1wrapper form input.textfield {
			color: #0A2866;
			border: 1px solid #6B83B3;
			font-size: 1.1em;
			padding: 2px;
			}
	
			html>body #pagecontent #column1wrapper form input.textfield {
				/* This code ignored by IE */
				margin-bottom: 2px;
				/*------------------------ */
				}
	
		#pagecontent #column1wrapper form textarea {
			font-family: Verdana, Arial, Helvetica, sans-serif;
			font-size: 1.1em;
			color: #0A2866;
			border: 1px solid #B4E8FF;
			width: 325px;
			padding: 5px;
			}
	
		#pagecontent #column1wrapper form label {
			font-size: 1.1em;
			font-weight: bold;
			margin: 0px 5px 0px 0px;
			}
	
			#pagecontent #column1wrapper form label.enquiry {
				display: block;
				text-align: left;
				margin: 0px;
				}
	
		#pagecontent #column1wrapper form hr {
			clear: both;
			float: none;
			height: 0px;
			margin: 0px;
			padding: 0px;
			border: 0px;
			border-top: 1px solid #B4E8FF;
			}
			
			html>body #pagecontent #column1wrapper form hr {
				margin: 10px 0px;
				}	

#pagecontent #column1wrapper .contactus {
	margin: 0px;
	padding: 0px;
	}

	html>body #column1wrapper .contactus {
		margin-right: 0px;
		padding: 20px;
		}

	#pagecontent #column1wrapper .contactus a {
		color: #AEE9EB;
		}
		
	#pagecontent #column1wrapper .contactus p {
		margin: 0px 0px 15px 0px;
		}

	#pagecontent #column1wrapper .contactus img {
		border: 0px;
		}

	#pagecontent #column1wrapper .contactus form  {
		text-align: right;
		}

		#pagecontent #column1wrapper .contactus form h2 {
			display: block;
			text-align: left;
			font-size: 1.2em;
			font-weight: bold;
			}

		#pagecontent #column1wrapper .contactus form select {
			background-color: #E2FAFA;
			color: #0A2866;
			width: 174px;
			font-size: 1.1em;
			padding: 2px;
			}
			
			html>body #pagecontent #column1wrapper .contactus form select {
				/* This code ignored by IE */
				padding: 0px;
				margin-bottom: 3px;
				/*------------------------ */
				}
		
		#pagecontent #column1wrapper .contactus form input.button {
			display: block;
			margin: 0 auto;
			width: 100px;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 1.1em;
			font-weight: bold;
			color: #0A2866;	
			}
			
		#pagecontent #column1wrapper .contactus form input.textfield {
			background-color: #E2FAFA;
			color: #0A2866;
			width: 168px;
			border: 1px solid #00659D;
			font-size: 1.1em;
			padding: 2px;
			}
	
			html>body #pagecontent #column1wrapper .contactus form input.textfield {
				/* This code ignored by IE */
				margin-bottom: 2px;
				/*------------------------ */
				}
	
		#pagecontent #column1wrapper .contactus form textarea {
			font-family: Verdana, Arial, Helvetica, sans-serif;
			font-size: 1.1em;
			background-color: #E2FAFA;
			color: #0A2866;
			border: 1px solid #00659D;
			width: 306px;
			padding: 2px;
			}
	
		#pagecontent #column1wrapper .contactus form label {
			font-size: 1.1em;
			font-weight: bold;
			margin: 0px 5px 0px 0px;
			}
	
			#pagecontent #column1wrapper .contactus form label.enquiry {
				display: block;
				text-align: left;
				margin: 0px;
				}
	
		#pagecontent #column1wrapper .contactus form hr {
			clear: both;
			float: none;
			height: 0px;
			margin: 0px;
			padding: 0px;
			border: 0px;
			border-top: 1px solid #006AA4;
			}
			
			html>body #pagecontent #column1wrapper .contactus form hr {
				margin: 10px 0px;
				}		

				
	#pagecontent .featurepanel {
		font-family: Arial, Helvetica, sans-serif;
		background-color: #00203F;
		margin-bottom: 20px;
		padding-bottom: 0px;
		border-bottom: 5px solid #00AACB;
		color: #00C8E0;
		display: block;
		height: 100px;
		}
		
		html>body #pagecontent .featurepanel {
			/* This code ignored by IE */
			padding-bottom: 24px;
			height: auto;
			/*------------------------ */
			}
		
		#pagecontent .featurepanel h1 {
			clear: both;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			background: url('/images/panel_h1_bg.gif') no-repeat left;
			background-color: #00AACB;
			color: #E2FAFA;
			font-size: 1.4em;
			line-height: 1.4em;
			font-weight: bold;
			padding: 5px 10px 4px 10px;
			margin: 0px;
			}	

			#pagecontent .featurepanel h1 a {
				color: #fff;
				}
		
		#pagecontent .featurepanel h2 {
			clear: both;
			padding: 5px 10px 0px 10px;
			margin: 0 0 5px 0;
			font-size: 1.1em;
			}
		
			html>body #pagecontent .featurepanel h2 {
				/* This code ignored by IE */
				padding: 10px 10px 0px 10px;
				/*------------------------ */
				}
		
		#pagecontent .featurepanel ul {
			list-style-type: none;
			font-size: 1.1em;
			margin: 10px 0 0 0;
			padding: 0 10px;
			}
			
			#pagecontent .featurepanel ul li {
				margin: 0 0 5px 0;
				padding: 0px;
				}
		
		#pagecontent .featurepanel a {
			margin: 0 0 20px 0;
			padding: 0px;
			color: #AEE9EB;
			}
		
			#pagecontent .featurepanel a:hover {
				color: #fff;
				}
		
		#pagecontent .featurepanel p {
			padding: 0px 10px 0px 10px;
			margin: 0 0 5px 0;
			font-size: 1.1em;
			line-height: 1.3em;
			}
		
			#pagecontent .featurepanel p span.readmore {
				margin: 5px 10px 5px 0px;
				}
			
				html>body #pagecontent .featurepanel p span.readmore {
					/* This code ignored by IE */
					margin: 5px 0px 10px 0px;
					/*------------------------ */
					}
			#pagecontent .featurepanel p a.more {
				font-family: Verdana, Arial, Helvetica, sans-serif;
				background-color: #00203F;
				font-size: 0.9em;
				letter-spacing: -0.1em;
				padding: 1px;
				border: 1px solid #006AA4;
				text-transform: uppercase;
				color: #AEE9EB;
				}
	
				#pagecontent .featurepanel p a.more:hover {
					background-color: #00203F;
					color: #fff;
					border: 1px solid #AEE9EB;
					}	
					
		#pagecontent .featurepanel a img {
			border: 1px solid #00659D;
			margin: 0px 10px 10px 0px;
			float: left;
			}

			#pagecontent .featurepanel a:hover img {
				border: 1px solid #fff;
				}

		#pagecontent .featurepanel hr {
			clear: both;
			float: none;
			height: 0px;
			margin: 0px;
			padding: 0px;
			border: 0px;
			border-top: 1px solid #00B1FF;
			}

			html>body #pagecontent .featurepanel hr{
				/* This code ignored by IE */
				margin: 0px 0px 10px 0px;
				/*------------------------ */
				}

		#pagecontent .featurepanel form {
			padding: 10px;
			margin-bottom: 0px;
			text-align: right;
			}

			html>body #pagecontent .featurepanel form {
				padding-bottom: 0px;
				margin-bottom: -16px;
				}

			#pagecontent .featurepanel form p {
				font-size: 1.1em;
				margin: 0px;
				padding: 0px 0px 5px 0px;
				text-align: left;
				}
						
			#pagecontent .featurepanel form label {
				font-family: Verdana, Arial, Helvetica, sans-serif;
				font-size: 1em;
				font-weight: bold;
				}
			
			#pagecontent .featurepanel form input.textfield {
				font-size: 1em;
				background-color: #E2FAFA;
				width: 105px;
				padding: 2px;
				border: 1px solid #00659D;
				margin-bottom: 2px;
				}
			
			#pagecontent .featurepanel form input.button {
				display: block;
				margin: 0 auto;
				width: 60px;
				font-family: Arial, Helvetica, sans-serif;
				font-size: 1.1em;
				font-weight: bold;
				color: #0A2866;
				}
			
			#pagecontent .featurepanel form hr {
				clear: both;
				float: none;
				height: 0px;
				padding: 5px 0px 0px 0px;
				margin: 0px;
				border: 0px;
				border-bottom: 1px solid #006AA4;
				}
				
			#pagecontent .featurepanel .articlebrief {
				padding: 0 10px;
				color: #00C8E0;
				height: 82px;
				}
					
				html>body #pagecontent .featurepanel .articlebrief {
					padding: 0 10px 10px 10px;
					height: auto;
					}
#footer {
	clear: both;
	width: 710px;
	height: 1.4em;
	padding: 15px 20px 10px 20px;
	background: url('/images/horizontal_bar.gif') no-repeat top;
	background-color: #00203F;
	}
	
	#footer p {
		float: left;
		font-size: 1.1em;
		line-height: 1.4em;
		color: #AEE9EB;
		}
	
	#footer ul.menu {
		float: right;
		}
	
		#footer ul.menu li {		
			padding-right: 10px;
			border-right: 1px solid #B4E8FF;
			margin-right: 10px;
			}
	
			#footer ul.menu li.last {		
				padding: 0px;
				border: 0px;
				margin: 0px;
				}

	#footer a {
		font-size: 1.1em;
		line-height: 1.4em;
		color: #AEE9EB;
		padding: 0px;
		margin: 0px;
		}
	
		#footer a:hover {
			color: #fff;
			}

	p.footer {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1em;
		text-align: center;
		padding: 10px 0;
		color: #009BC2;
		}
		
		p.footer span {
			color: #00D0E2;
			}

table.imagebrowser {
	margin: 10px 10px 10px 0;
	padding: 0px;
	}

#mailing_errors ul {
	padding: 0px 20px;
	margin: 10px 0;
	color: #f00;
	}

.mailing_errors {
	color: #f00;
	}