/*
	screen.css: SCREEN stylesheet
	------------
	Job:					UU Welm
	Template Version:		1.0
	Produced by:			Heidi Seymour
	Start date:				19/05/2009
	------------
	NOTES:
	Do all stucture and module sizes in ems.
	
	TOC:
	1.	general styles
			body styles
			reset
			links
			headings
			other elements, tags
	2.	helper styles
			forms
			notifications and errors
			consistant items with normally just one class
	3.	page structure
			skeleton including page furniture
	4.	page components / modules
			most of your styles will be in here
	5.	content/FCK
			these are styles that the client could put in via the FCKeditor. They will also need to be added to the FCK stylesheet.
	6.	overrides
*/

/* =1. general styles */
* {margin: 0;padding: 0;text-decoration: none;font-weight: normal;}
body {background:#7AC142; font-family: Arial, Helvetica, sans-serif;font-size: 100%;}
a:link, a:visited{}
a:hover, a:focus{}
a img {border:0;}
/* =2. helper styles */
input, textarea, select {font-family: Arial, Helvetica, sans-serif;font-size: 80%;}
.formReg {width:31.2em;		/* 440px */;}
.formReg li {list-style:none;padding:0.2em 0;margin:0;}
.formReg ul {margin:1em 0 1.5em 0;}
.formReg label	{color:#3a3a3a;float:left; font-size:.9em; font-weight:bold; margin-right:.5em;padding-right:30px;position:relative;width:14em;}
.formReg label em {background: url('/_common/img/icons/icon-required.gif') no-repeat right center;display:block;height:16px;	position:absolute;	right:0;top:.2em;	width:16px;	}
.formReg label em span, .formReg p.required span {position:absolute; left:-1000px}
.formReg .text, .formReg .textarea {width:20em;border:1px solid #969696;}
.formReg .text:focus, .formReg .textS:focus {background:#fff url(/_common/img/bg-feature.gif) repeat-x bottom;}
.formReg .textS {width:10em;border:1px solid #969696;}
.formReg p.required {color:#669933; font-size:.8em;}
.formReg p.required em {background: url('/_common/img/icons/icon-required.gif') no-repeat right center;display:inline-block;height:16px;vertical-align:top;width:16px;	}
.formReg .button {float:right;}	

.formMsg  {background:#fff url(/_common/img/bg-feature.gif) repeat-x bottom;border:1px solid #d1dbc9; font-size:.8em;padding:1em;margin:1em 0;overflow:hidden;/* CSS3 */-moz-border-radius: 10px;-webkit-border-radius: 10px; }
.formMsg  h3  {color:#3066b7; font-weight:bold;margin-bottom:.5em; }
.formMsg li {color:#669933; margin-left:1.3em; padding-left:.4em;list-style:disc;}
.formMsg ul {margin:0;}
/* =3. page structure */
.container {width: 60.00em;	/* 960px */margin: 0 auto;overflow:hidden;}
.main {background:#fff url(/_common/img/bg-main.gif) no-repeat 0 bottom;padding:2em 0 7em 0;}
.cont1 {float:left; width:17.50em;		/* 280px */min-height:10em} /*min height stops div collapsing if the div is empty*/
.cont2 {float:left; padding:0 1.8em; width:19.38em;		/* 310px */}
.cont3 {float:left; width:19.38em;		/* 310px */}
.cont4 {float:left; width:36.88em;		/* 590px */}
.cont5 {float:right; width:17.50em;		/* 280px */}

.brand {background:#3066b7; border-bottom:1px solid #688fca;padding:1.2em 0;}
.brand .logo {float:left;margin-right:2em;}
.brand .logo a {background:url(/_common/img/unitedutilities-logo.gif) no-repeat 0 0; display:block;width:140px;height:47px;}
.brand .logo span {position:absolute;left:-5000px;}
.brand .printlogo {display:none;}
.brand .heading {color:#fff200;float:left;font-size:2em;font-weight:bold;margin-top:.2em;width:15em;}
.brand .tagline {color:#fff;float:right;margin-top:.5em;width:12.19em;		/* 195px */}
.brand .tagline p {font-size:.9em; font-weight:bold;}

.title {background:#fff url(/_common/img/bg-title.gif) repeat-x bottom;border-bottom:1px solid #d1dbc9;padding:.8em 0;}
.title h1 {color:#3066b7; font-size:1.6em; font-weight:bold;margin-top:.2em;}
.title ul {list-style:none; text-align:right;}
.title ul a {color:#244181; font-size:.7em;}
.title ul a:hover {text-decoration:underline;}
.title ul li.print {padding-bottom:.2em;}
.title ul li a {background:url(/_common/img/icons/icon-print.gif) no-repeat 0 center; padding:.2em 0 .2em 24px;}
.title ul li.email a {background:url(/_common/img/icons/icon-email.gif) no-repeat 0 center; padding-left:28px;}

.siteInfo {background:#7ac142 url(/_common/img/bg-siteinfo.gif) repeat-x 0 0;clear: both;}
.siteInfo li {color:#fff;float:left; font-size:.7em;list-style:none;padding:2em 0;}
.siteInfo li.invest {background:url(/_common/img/investors.gif) no-repeat; float:right; width:65px; height:43px; padding:0;margin:1.5em 0;}
.siteInfo li.invest span {position:absolute; left:-1000px;}
.siteInfo li.copyright {margin-right:14em;}

/* =4. page components / modules */
/*		nav */
.nav {background:#3066b7;padding-top:.2em;}
.nav li {list-style:none;float:left;padding:0 0 .7em .65em;}
.nav li.selected {background:#fff url(/_common/img/cornerLeft.gif) no-repeat 0 0; /* CSS3 */-moz-border-radius-topleft: 5px;-moz-border-radius-topright: 5px;-webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;}	
.nav li a {display: block; color:#fff;font-size:.8em;font-weight:bold; padding-right: .8em; padding-top: .5em;}
.nav li.selected a, .nav li.selected a:hover  {color:#3066b7; background: url(/_common/img/cornerRight.gif) no-repeat right 0;}
.nav li a:hover, .nav li a:focus{color:#fff200;}
	
.contFeature {background:#03aae5 url(/_common/img/bg-contFeat.gif) repeat-x 0 0;color:#fff;font-size:.8em;padding:1em;margin-bottom:2em;/* CSS3 */-moz-border-radius: 10px;-webkit-border-radius: 10px; }
.contFeature a {background:url(/_common/img/arrow.gif) no-repeat 0 center;color:#fff200;display:inline-block;font-weight:bold;padding-left:12px; margin-bottom:.5em;}
.contFeature a:hover {text-decoration:underline;}
.contFeature p {padding-left:12px;}

/*		home */
.featureWrap{background:#fff url(/_common/img/bg-feature.gif) repeat-x bottom;border-bottom:1px solid #d1dbc9;}

.feature {background: url(/_common/img/circles.png) no-repeat center -10.5em; min-height:14.56em;		/* 233px */}
.feature .intro {padding-top:2em;width:17.50em;		/* 280px */}
.feature .intro h1 {color:#3066b7; font-size:1.7em; font-weight:bold; margin-bottom:.5em; width: 12em;}
.feature .intro p {color:#3a3a3a;line-height:1.5;font-size:.9em;}

#flashReplace object:active, #flashReplace object:focus {outline-style: none;}

#flashReplace {

}
#flashReplace .pink {
	background: #fe007a;
	color: white;
	padding: 1em;
	/* CSS3 */
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
}
#flashReplace .pink h2 {
	font-size: 1.50em;		/* 24px */;
	margin-bottom: .3em;
	font-weight: bold;
}
#flashReplace .pink p {
	font-size: 0.75em;		/* 12px */;
	margin-bottom: 1em;
}
#flashReplace .pink a, #flashReplace .pink a:visited {
	font-size: 0.75em;		/* 12px */;
	margin-bottom: 1em;
	color: yellow;
	padding-left: 1em;
	background: url(/_common/img/arrow.gif) no-repeat 0 .2em;
}
#flashReplace .pink a:hover {
	color: white;
}

.flashMsg {background:#fff url(/_common/img/bg-feature.gif) repeat-x bottom;border:1px solid #d1dbc9; font-size:.7em;padding:1em;margin:1em 0;overflow:hidden;/* CSS3 */-moz-border-radius: 10px;-webkit-border-radius: 10px; }
.flashMsg h2, .videoMsg h2  {color:#3066b7; font-weight:bold; }
.flashMsg img {float:right;}

.videoMsg {background:#fff url(/_common/img/bg-feature.gif) repeat-x bottom;border:1px solid #d1dbc9;padding:1em;margin-bottom:1.5em;overflow:hidden;/* CSS3 */-moz-border-radius: 10px;-webkit-border-radius: 10px;width: 24.5em; }
.contFCK .videoMsg p {font-size:.8em;margin:0}
#video, .video {
	width: 26.4em;
	margin-bottom: 1em;
}

#video object:active, #video object:focus {outline-style: none;}
/*		articles */
.articles {color:#3a3a3a; font-size:.9em;}
.articles li {border-bottom:1px solid #d1dbc9;margin-bottom:1.5em;padding-bottom:1.5em}
.articles p {line-height:1.5;}
.articles a {color:#669933;border-bottom:1px solid #d1dbc9;font-weight:bold;}
.articles a:hover {color:#336600;border-bottom:1px solid #669933;}
.articles small {color:#3066b7;}

/* =5. content/FCK */
.contFCK {color:#3a3a3a; font-size:.9em;}
.contFCK strong {font-weight:bold;}
.contFCK h2 {color:#05a7e3;font-size:1.4em;font-weight:bold;}
.contFCK h3 {color:#05a7e3;font-size:1.2em;font-weight:bold;}
.contFCK h4 {color:#05a7e3;font-size:1em;font-weight:bold;}
.contFCK h5 {color:#000;font-size:1em;font-weight:bold;}
.contFCK h6 {color:#000;font-size:.9em;font-weight:bold;}
.contFCK li {margin-left:1.3em; padding-left:.4em;}
.contFCK ol li {margin-left:1.7em; padding:0;}
.contFCK p, .contFCK ul, .contFCK ol, .contFCK dl {line-height:1.5; margin-bottom:1.5em;}
.contFCK a {color:#669933;border-bottom:1px solid #d1dbc9;}
.contFCK a:hover {color:#336600;border-bottom:1px solid #669933;}
.contFCK img {margin:1.5em 1em 1.5em 0;}
.contFCK hr {border-top:1px solid #fff;border-bottom:1px solid #d1dbc9; margin-bottom:1.5em;}
.contFCK table {border:1px solid #d1dbc9;margin-bottom:1.5em;width:100%;}
.contFCK caption {color:#05a7e3;font-size:1em;font-weight:bold;padding-bottom:.5em;text-align:left;}
.contFCK td {border:1px solid #d1dbc9;font-size:.8em;vertical-align:top;padding: .5em 1em;}
.contFCK th {background:#fff url(/_common/img/bg-title.gif) repeat-x bottom; border:1px solid #d1dbc9; color:#3066b7; font-weight:bold; text-align:left; padding: .5em 1em;}


/* =6. overrides */
/* flash text */
span.flashText {
	margin-left: -1000em;
	display: block;
	position: absolute;
	visibility: hidden;
}
body.flashText .feature .intro h1 {
	margin-bottom: .3em;
}