/* - screen.css: SCREEN stylesheet ----------------------

Job: Template -------------------------------------------
Template Version: 1.1 -----------------------------------
Produced by: James Nash ---------------------------------
Start date: 17/05/2010 ----------------------------------

NOTES: --------------------------------------------------
Do all stucture and module sizes in ems. ----------------
References for type sizing: -----------------------------
9px = 0.9em ---------------------------------------------
10px = 1em ----------------------------------------------
11px = 1.1em --------------------------------------------

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  ---------------------------------------
        FCKeditor styles. Need to be added to the FCK CSS
6. OVERRIDES --------------------------------------------
7. SIFR -----------------------------------------------*/

/* 1. GENERAL STYLES ------------------------------------
------------------------------------------------------ */

/* MASTER RESET ---------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0}
html, body { height: 100%; }
body { font: normal 62.5% Arial, Helvetica, sans-serif; background-color: #012258;}


/* 2. HELPER STYLES -------------------------------------
------------------------------------------------------ */
/* SKIP LINKS */
.accessmenu { width: auto; height: auto; }
.accessmenu li a { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; color: #001E50; font-weight: bold; font-size: 20px;}
.accessmenu li a:focus { position: static; width: auto; height: auto; } 


/* FORM ERROR STYLING */
.err p { margin-top: 5px; padding: 5px 10px; }
.err p strong { font-weight: bold; }
p abbr { font-weight: bold; color: #FFF; }
p.error { margin: 0 0 3px 0; padding: 0 3px; color: #FFF; background-color: #900; font-weight: bold; width: 222px;}


/* 3. PAGE STRUCTURE ------------------------------------
------------------------------------------------------ */
div.wrapper { width: 100%; margin: 0 auto; background: #FFF; float: left; }
div.footer-wrapper {  position: relative; clear: both; margin-top: 30px; padding: 20px 0 30px; background: #001E50 url(/_common/img/footer_bg.jpg) top left repeat-x; }
div.header { border-bottom: 4px solid #8DC73D; background-color: #0C2B5A; float: left; width: 100%;}
div.branding { background-color: #FFF; width: 100%; margin: 0 auto; float: left; }
div.logo { width: 94.5em; margin: 0 auto; }
div#content-wrapper { clear: both; width: 94.5em; margin: 0 auto;}
div.banner { margin: 17px 0 15px; float: left; width: 100%; z-index: 100; }

/* 4. PAGE COMPONENTS / MODULES -------------------------
------------------------------------------------------ */

/* LOG0 / HOME LINK */
a#home-link { float: left; height: 75px; padding: 31px 0 11px; }
div.logo a:hover { background-color: transparent;}

/* PRIMARY NAVIGATION */
ul.primary-navigation { clear: both; display: block; width: 94.5em; margin: 0 auto; padding: 2px 0;}
ul.primary-navigation li { display: block; float: left; padding: 8px 0 10px; }
ul.primary-navigation li a { padding: 0; float: left; color: #FFF; padding: 2px 6px 2px 6px; border-left: 1px solid #FFF; font-weight: bold; text-decoration: none; font-size: 1.4em; font-family: Arial, Helvetica, sans-serif;}
ul.primary-navigation li.first a { border: 0 none; padding-left: 5px; }
ul.primary-navigation li.current a { text-decoration: underline; }
ul.primary-navigation li a:hover { text-decoration: none; color: #0C2B5A; background-color: #8DC73D; }
ul.primary-navigation li.current a:hover { text-decoration: underline; color: #FFF; background-color: transparent; }


/* SECONDARY NAVIGATION */
ul.secondary-navigation { clear: both; display: block; float: left; padding: 0; width: 100%;}
ul.secondary-navigation li { display: block; float: left; width: 100%; border-bottom: 1px solid #D3D3D3; 	}
ul.secondary-navigation li a { background: #FFF url(/_common/img/white-green-arrow.gif) 10px 7px no-repeat; text-decoration: none; padding: 5px 35px; display: block; width: auto; }
ul.secondary-navigation li a:hover { background: #0C2B5A url(/_common/img/blue-white-arrow.gif) 10px 7px no-repeat; text-decoration: underline; color: #FFF;}
ul.secondary-navigation li.current a { text-decoration: none; }
ul.secondary-navigation li span { display: block; padding-top: 5px; font-weight: normal; color: #2E2E2E; }
ul.secondary-navigation li a:hover span { color: #FFF; text-decoration: none; }
ul.secondary-navigation li ul { background-color: red; }
ul.secondary-navigation li ul li { border: 0 none; }
ul.secondary-navigation li ul li a { background: #FFF url(/_common/img/secondary-nav-bullet.gif) 28px 7px no-repeat; font-weight: normal; padding: 2px 0 2px 45px;	}
ul.secondary-navigation li ul li a:hover { background: #FFF url(/_common/img/secondary-nav-bullet-hover.gif) 28px 7px no-repeat; color: #0C2B5A; text-decoration: underline; }

ul.secondary-navigation li ul li ul { padding-left: 10px; }

/* SITE MAP NAVIGATION */
div.primary ul.secondary-navigation { width: auto; float: left; padding: 10px 0 30px;}
div.primary ul.secondary-navigation li { width: auto; clear: both;  border: 0 none; font-size:1.4em}
div.primary ul.secondary-navigation li a {font-weight:bold;}
div.primary ul.secondary-navigation li li a {font-weight:normal;}
div.primary ul.secondary-navigation li li {font-size:.9em; margin-left:20px;}

/* FOOTER TEXT */
div.footer-content { width: 94.5em; margin: 0 auto;}
div.footer-content p { display: inline; padding: 0 10px 0 0; color: #FFF; }
div.footer-content p.mando { float: right; }
div.footer-content ul { display: inline; margin-left: 62px;}
div.footer-content ul li { display: inline; font-size: 1.2em; padding: 0 10px 0 0; }
div.footer-content a { font-size: 1em; color: #FFF; font-weight: normal; }
div.footer-content a:hover { color: #8DC73B; } 

/* HEADER SEARCH FORM */
div.search-form { float: right; background-color: #0C2B57; padding: 10px 0 10px 10px; width: 245px;}
div.search-form fieldset { float: left;width: auto; margin: 0 0 0 6px; clear: left;}
div.search-form ol { margin: 0; }
div.search-form li { display: inline; float: left; width: 130px; margin: 0; padding-right: 10px; }
div.search-form li input { width: auto; margin: 0; display: inline; }
div.search-form li label { margin: 0; display: block; color: #FFF; width: 100%; padding-bottom: 3px;}
div.search-form label { width: 20%; margin-right: 2%; float: left; display: block; font-size: 1.2em; }
div.search-form li input { padding: 2px 3px; border: 1px solid #8DC73B; }
div.search-form li input#search { margin: 18px 0 0 15px; padding: 3px 5px; background-color: #8DC73B; border: 0 none; font: bold 1.1em Arial, Helvetica, sans-serif; text-transform: uppercase; cursor: pointer;}
div.search-form li.frmAction { width: auto; }

ul.quicklinks { float: left; display: block; width: 100%; padding: 5px 0 5px 6px; }
ul.quicklinks li { display: inline; float: left; width: auto; }
ul.quicklinks li a { color: #FFF; }

/* HOME PAGE */
body.home div.banner { width: 100%; clear: both; }
body.home div#flashReplace { width: 100%; overflow: hidden; }
body.home div#flashReplace img { width: 100%; }
body.home div.content { float: left; width: 320px; margin-left: 2%; }
/*body.home div#content-wrapper div:first-child { margin-left: 0;}*/

body.home div.primary { float: left; width: 380px; margin: 0 0 0 280px; }
body.home div.secondary { float: left; width: 240px; margin-left: -660px; }
body.home div.tertiary { float: left; width: 240px; position: static; margin-left: 38px}

div.bigleft div.primary { margin-left: 0; width: 67.1em;}
div.bigleft div.secondary { margin-left: 0; width: 24em; float: right;}

body.twocol div.primary { float: left; width: 67.1em; margin: 0 0 0 27.4em; }
body.twocol div.secondary { float: left; width: 24em; margin-left: -94.5em; }
body.twocol div.tertiary { float: left; width: 100%; }

p.back { clear: both; }

/* RESOURCES LIST */
ul.resources { width: 100%; }
ul.resources li { float: left; display: block; padding: 10px 0 0; clear: both; width: 96%;}
ul.resources li h3 { margin: 0; padding: 0; }
ul.resources li p { padding-left: 22px; }
ul.resources li p a { float: none; width: auto; height: auto; background-color: transparent; margin: 0; display: block; }
ul.resources li a:hover { text-decoration: underline; color: #0C2B57; background-color: #FFF;}
ul.resources li a { text-decoration: none; padding-left: 22px; float: left; width: 100%; margin: 0; background: transparent url(/_common/img/pdf.gif) top left no-repeat; }
ul.resources li a.docx { background-image: url(/_common/img/doc.gif); }
ul.resources li a span { font-weight: normal; color: #2E2E2E; }
ul.resources li a.pdf { background-image: url(/_common/img/pdf.gif); }
ul.resources li a.xls { background-image: url(/_common/img/xls.gif); }
ul.resources li a.doc { background-image: url(/_common/img/doc.gif); }
ul.resources li a.ppt { background-image: url(/_common/img/ppt.gif); }

div.primary ul.resources { padding: 15px 0; float: left;  }
div.primary ul.resources li { font-size: 1em; padding: 5px 0;}
div.primary ul.newsList li { list-style: none; font-size: 1em; }

/* CONTENT LIST */
div.primary ul li { list-style: inside disc; color:#2E2E2E; font-size:1.2em; line-height:1.8em; padding:5px 0 0 0; }

/* CAREERS LIST */
ul.full-width-list { width: 100%; float: left; margin-top: 20px; }
ul.full-width-list li { width: 100%; float: left; padding-bottom: 20px; }
ul.full-width-list li a { font-size: 1.4em; }
ul.full-width-list li strong { display: block; font-size: 1.2em; padding-top: 10px; }
ul.full-width-list li p { padding-top: 10px; }

/* STANDARD CONTENT BLOCK */
div.content { padding-bottom: 10px; position: relative; background: #FFF;  }

/* PRODUCT LISTINGS */
ul.products { margin-top: 10px; padding-left: 10px; float: left; clear: both; }
ul.products li { float: left; width: 25%; margin-bottom: 15px; }
ul.products li img { width: 95%; margin-right: 5%; }
ul.products li dl { margin: 10px 5% 15px 0; }
ul.products li dl dt { padding-bottom: 5px; }
ul.products li dl dd { font-size: 1.2em; }
ul.products li dl dd.price { font-weight: bold; padding: 5px 0; }
ul.products li dl dd.note { padding: 5px; font-weight: bold; }

/* PAGINATION CONTROL */
ol.pagination { display: block; float: left; width: 100%; border-top: 1px solid #D3D3D3; padding-top: 15px; }
ol.pagination li { float: left; font-size: 1.2em; padding-right: 6px; font-weight: normal; }
ol.pagination li a { font-size: 1em; font-weight: normal; }
ol.pagination li.selected, ol.pagination li.selected a { font-weight: bold; }

/* BANNER BOX */
div.banner { background-color: #707070; position: relative; }
div.banner img { float: right; }
div.banner-box { float: left; background-color: #707070; width: 23.4em; padding: 18px 20px 60px 20px; }
div.banner-box h1, div.banner-box h2, div.banner-box h3  { color: #FFF; font-size: 2.1em; font-weight: bold; padding: 0 0 15px 0; border: 0 none; }
div.banner-box p { color: #FFF; font-size: 1.2em; padding: 0; font-weight: bold; }
div.banner-box p.button { position: absolute; bottom: 22px; margin: 0; left: 22px; }
div.banner-box p.button a { border: 0 none;  border-bottom: 4px solid #8CC540;   }
/*
div.banner-box p.button a { background: #FFF url(/_common/img/white-green-arrow.gif) 10px 7px no-repeat; color: #8CC540; }
div.banner-box p.button a:hover { padding: 5px 10px 5px 30px; border: 0 none; color: #FFF; background: #8CC540 url(/_common/img/green-white-arrow.gif) 10px 7px no-repeat; }
*/
/* PROMO BOX */
div.promo-box { padding-bottom: 15px; clear: both; }
p.button { margin: 15px 0 30px; padding: 0; line-height: 1.3em; float: left; }
p.button a:link, p.button a:visited, p.button a:active { border: 0 none;  text-transform: uppercase; font-weight: bold; padding: 5px 10px 5px 30px; float: left; text-decoration: none; font-size: 1.2em; color: #FFF; background: #0C2B57 url(/_common/img/blue-white-arrow.gif) 10px 7px no-repeat; border-bottom: 4px solid #8CC540; }
p.button a:hover { /*border: 1px solid #0C2B57; */ border: 0 none; color: #0C2B57; float: left; text-decoration: none; background: #FFF url(/_common/img/white-blue-arrow.gif) 10px 7px no-repeat; border-bottom: 4px solid #8CC540; }
 { color: #0C2B57; font-weight: bold; text-decoration: underline; }
/*
p.blue a { background: #0C2B57 url(/_common/img/blue-white-arrow.gif) 10px 7px no-repeat; }
*/
div.address p { line-height: 1.4em; padding: 5px 0 0 0; }

/* NEWS ARTICLE PAGE */
ol.breadcrumbs { display: block; float: left;  width: 100%; margin: 0 0 15px -7px; }
ol.breadcrumbs li { font-size: 1.2em;float: left; display: block; padding-left: 6px; }
ol.breadcrumbs a { font-size: 1em; text-decoration: none; font-weight: normal; background: transparent url(/_common/img/breadcrumb-divide.gif) center right no-repeat; padding: 0 12px 0 0;}
ol.breadcrumbs a:hover { background-color: #FFF; text-decoration: underline; color: #0C2B57;  }

/* ARTICLE LIST */
ul.newsList { width: 60%; float: left; padding-top: 15px; }
ul.newsList li { width: 100%; float: left; clear: both; padding-bottom: 20px; }
ul.newsList a { float: left; }
ul.newsList a:hover { background-color: #FFF; }
ul.newsList img { float: left; border: 2px solid #8DC73B; margin-right: 15px; }
ul.newsList a:hover img { border-color: #0C2B57; }
ul.newsList dl { display: block; }
ul.newsList dt { display: block; }
ul.newsList dd { font-size: 1.2em; line-height: 1.8em; color: #2E2E2E; padding-left: 119px; }
ul.newsList li dd p { padding: 0 0 0 118px; font-size: 1em; clear:none}
ul.newsList dt a { display: block; float: none; }
ul.newsList dt a:hover { color: #8DC73B; background-color: #FFF; text-decoration: underline;}
ul.newsList dd.date { font-weight: bold; padding-top: 4px; }
ul.newsList li p { clear: both }

p.paging { position: absolute; top: 30px; right: 0; }

/* registration FORM */
.form { padding-bottom: 15px; clear: both; overflow:hidden;  }
.form legend span {position:absolute; left:-10000px;}
.form em {font-weight:bold; color:#0C2B57; }
.form fieldset {border:0;font-size:1.4em; margin-top:.5em;}
.form ul {}
.form fieldset li:first-child {padding-top:25px;}
.forgotpass fieldset li:first-child {padding:25px 10px 25px 15px;}
.newpass {font-size:1.8em; color:#0C2B57; font-weight:bold; padding:0;}
.changepass li.confirm {padding:0 10px 25px 15px;}
.form fieldset li {background: #8dc73f; clear:both; list-style:none; padding:0 10px 10px 15px; overflow:hidden}
.form label {color:#292c31; float:left; margin-right:5px; padding:4px 45px 4px 0; width:120px; position:relative; }
.form label em img {position:absolute; right:0; top:4px;font-size:.7em}
.form input {background:#fff; border:0; padding:4px; width:175px;}
.form textarea {background:#fff; border:0; padding:4px; width:175px; margin-bottom:25px}
.form li.forgot {text-align:right; font-size:.8em;}
.form li.frmAction {background:#fff;padding: 10px 0 ;}
.form li.frmAction label {position:absolute; left:-10000px;}
.form li.frmAction input  { 
	border: 0;  text-transform: uppercase; font-weight: bold; padding: 5px 10px 5px 30px; 
	cursor:pointer;
	float: right; color: #FFF; background: #0C2B57 url(/_common/img/blue-white-arrow.gif) 10px 7px no-repeat;width:auto
}
.form li.frmAction input:hover {  color: #0C2B57;  background: #FFF url(/_common/img/white-blue-arrow.gif) 10px 7px no-repeat; }
 { color: #0C2B57; font-weight: bold; text-decoration: underline; }}
.form .errors {  color: #900; font-weight: bold; width: 97%; margin-bottom: 10px; }
.form .errors h2 {color:#8CC540}
.form .errors ul {margin:1.5em 0;}
.form .errors ul li {color:#990000;  margin:0 0 .5em 0; }

/* 5. CONTENT / FCK -------------------------------------
------------------------------------------------------ */

/* TEXT STYLES ----------------------------------------*/
/* HEADINGS */
h1, h2, h3, h4, h5, h6 { padding: 10px 10px 5px 0; font-weight: bold; color: #0C2B57; border-bottom: 1px solid #D3D3D3;}
h1 { font-size: 3em; padding-top: 0; }
h2 { font-size: 2.1em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.2em; }

/* LISTS */
ol {  }
ul {  }
li {  }

dl {  }
dt {  }
dd {  }

/* LINK STATES */
li a { font-size: 1.2em; }
p a { font-size: 1em; }

a:link { color: #0C2B57; font-weight: bold; text-decoration: underline; }
a:visited { color: #0C2B57; }
a:hover { text-decoration: none; color: #FFF; background-color: #0C2B57; }
a:active { color: #0C2B57; }


/* PARAGRAPH AND BREAKS */
p { padding: 15px 10px 0 0; font-size: 1.2em; line-height: 1.8em; color: #2E2E2E; }
p.intro { font-weight: bold; font-size: 1.4em; line-height: 1.6em; }
br {  }
hr {  }

/* TEXT */
em { font-style: italic; }
strong { font-weight: bold; }
u {  }
sub {  }
sup {  }
blockquote {  }
cite {  }

/* TABLES */
table {  }
caption {  }
tr {  }
th {  }
td {  }

/* IMAGES */
img {  }

/* FORM ELEMENTS */
form { width: 100%; }
fieldset.contact { width: 100%; margin: 15px 0 30px 0; padding: 0; }
fieldset.contact legend {  }
fieldset.contact legend span { font-weight: bold; font-size: 1.8em; position: relative; left: -4px;  color: #0C2B57; margin-bottom: 10px; }
fieldset.contact ul { float: left; width: 100%; margin-top: 20px; }
fieldset.contact ul li { margin-bottom: 10px; float: left; width: 100%; margin-left: 0; list-style: none;}
fieldset.contact label { padding-top: 3px; font-weight: bold; width: 30%; margin-right: 2%; float: left; display: block; font-size: 1.2em; }
fieldset.contact label em { color: #FFF; font-weight: bold; font-size: 1.2em; }
fieldset.contact select { border: 1px solid #D3D3D3; }
fieldset.contact option {  }
fieldset.contact textarea { border: 1px solid #D3D3D3; font-family: Arial, Helvetica, sans-serif; width: 65%; float: left; display: block; padding: 3px;font-size: 1.2em }
fieldset.contact input {border: 1px solid #D3D3D3;  width: 65%; float: left; display: block; padding: 3px; }
fieldset.contact input[type="submit"] { font-size: 1.2em; font-weight: bold; text-transform: uppercase;  width: auto; margin-left: 32%; padding: 5px 10px 5px 30px; border: 0 none; color: #FFF; background: #8CC540 url(/_common/img/green-white-arrow.gif) 10px 7px no-repeat;  }
fieldset.contact p.error { padding: 7px 0 7px 7px; color: #900; font-weight: bold; width: 97%; margin-bottom: 10px; background-color: #FCC; }

ul.list li a { font-size: 1em; }


/* 6. OVERRIDES -----------------------------------------
------------------------------------------------------ */
.hidden, .extended { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.ofgem { background: transparent url(/_common/img/ofgem.gif) center right no-repeat; }
	
/* 7. SIFR ----------------------------------------------
------------------------------------------------------ */
h1.green { color: #8CC540!important }