/* 

Title: 		Master Styles for Electricity Sector Council

Author:		Shane Smith @ MediaBox Communications

Contact:	shane@mediabox.com

Updated:	June 20, 2007

*/





/* This document should contain all pure and valid css rules. 

All hacks required to compensate for IE bugs are maintained in ie.css */





/* =General Rules ***********************************/

#browserWarning {display: none;} /* web standards message will be hidden from modern browsers */





/* The default size for "medium" text in all modern browsers is 16px. 

We will reduce the size for the entire document to small using relative keywords:

This takes 16px down to roughly 12px, which is a bit more elegant for a relative base 

IE5/Win has a size decrepency so we will provide hack in order to get it inline.

All navigation items will continue to be specified in pixels.  */



body {

	font-size:small; /* for standards browsers */

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	color: #666;

	background-color: #FFFFFF;

	margin: 0;

	padding: 0; 

/*	text-align:center; This line removed and is now inlined because of interferance with the CMS */

}



/* @group General Classes */



p {

	white-space: normal;

	margin-top: 0;

	margin-right: 0;

	margin-bottom: 15;

	margin-left: 0;

}	

strong {

	color: #666;

	font-size: 95%;

}

blockquote {}



/* @end */







/* @group Links */



a {text-decoration:none; cursor:pointer; color:#900;

	background-color: transparent;

}

a:hover {

	color: #c30;

	border:none;

	text-decoration: underline;

	background-color: transparent;

	font-weight: bold;

}

a.noHover, a.noHover:hover {background-color: transparent; border:none;}

a img {border:none;} /* remove border for all linking graphics */



.linkPDF {white-space:nowrap; font-size:90%; background: url("http://www.brightfutures.ca/img/iconPDF.gif") center left no-repeat; padding-left:14px;}

.linkEmail {white-space:nowrap; background: url("http://www.brightfutures.ca/img/template/iconMail.gif") center left no-repeat; padding-left:18px;}

.linkExternal {white-space:nowrap; background: url("http://www.brightfutures.ca/img/linkExternal.gif") center right no-repeat; padding-right:16px;}

.linkExternal:hover {background: #960 url("http://www.brightfutures.ca/img/linkExternalHover.gif") center right no-repeat;}



/* @end */

.textblue {white-space:nowrap; font-size:90%; background: url("http://www.brightfutures.ca/img/iconPDF.gif") center left no-repeat; padding-left:14px;}



/* @group Lists */



li {margin: 0; padding: 0px;}

ul {padding-left:15px; margin:0 0 12px 0;} /* standardize list indents for IE and Mozilla */

ul li {list-style: square outside;}



ol {padding-left:24px; margin:0 0 12px 0;}

ol li {margin: 0 0 12px 0;}



dl {margin: 0 0 12px 0; padding-top: 4px;}

dt {margin: 12px 0 0 0; font-weight:bold; color: #333;}

dd {margin: 0;}



/* @end */





/* @group Headings */



h1 {} /* electricity sector cousil image replacement in headerWrap */



h2 {} /* building bright futures tag line */

		

h3 { 

	font-size: 130%;

	color: #339;

	margin: 0 0 8px 0;

	background-color: transparent;

}

h3 a {color: #000;}

	

h4 {

	font-size: 115%;

	margin: 18px 0 8px 0;

	color: #600; /*#900 might change color*/

	}

h5 {

	font-weight: bold;

	font-size: 105%;

	margin: 12px 0 2px 0;

	color: #c30;

	}

h6 {

	font-size: 100%;

	margin: 10px 0 0 0;

	color: #333;

	}



/* @end */





/* @group Page Structure */



#wrapper {

	width: 822px;  /*restrict the width*/ 

	margin: 0 auto 10px auto;  /*centre the page*/ 

/*	overflow: hidden;  ensure the div stretches to contain its floats 

	height: 1%;  holly hack - width or height is required by IE for the above rule to work */

	background: transparent url("../images/site/wrapperback.jpg") repeat-y top left;

	text-align: left;

}

#engSplash{ /*english container on splash page*/

	position: absolute;

	top: 25px;

	left: 245px;

	width: 230px;

	display: block;

	text-align: right;

}

#freSplash{ /*french container on splash page*/

	position: absolute;

	top: 82px;

	left: 505px;

	width: 265px;

	display: block;

}



#headerWrap {

	overflow: visible; /* ensure the div stretches to contain its floats */

	/*height: 1%;  holly hack - width or height is required by IE for the above rule to work */

	background: #fff url("../images/site/header1.jpg") top left no-repeat;

	height: 260px;

	width: 760px;  /* restrict the width */

	margin: 0 auto;

	position: relative;

}



#contentWrap {

	width: 100%;

	overflow: visible; /* ensure the div stretches to contain its floats */

	height: 1%;  /*holly hack - width or height is required by IE for the above rule to work */

	background: #fff url("../images/site/bottomcontent.jpg") repeat-x left bottom;

	width: 760px;  /* restrict the width */

	margin: 0 auto;

}



#navPrimary {

	margin: 0 23px 0 20px;	/*removes indent IE and Opera*/

    padding: 0;

	width: 145px;

	float: left;

	display: inline;

}

#content, #content_wide {

	width:375px;

	margin: 0;

	padding: 0;

	font-size: 95%;

	line-height: 140%;

	float: left;

	text-align: left;

}



#content_wide {

	width:540px;

}



#facts {

	margin: 0 18px 0 0;

	padding: 0; 

	width: 140px;

	float: right;

	display: inline;

}



#footer {

	font: 80% Arial, Helvetica, Geneva, sans-serif;

	overflow: hidden; /* ensure the div stretches to contain its floats */

	/*height: 1%;  holly hack - width or height is required by IE for the above rule to work*/ 

	width: 760px;  /* restrict the width */

	height: 100px; /*padding: 5px 0;*/

	margin: 0 auto; /* centre the page */

	clear: both;

	position: relative;

}





/* @end */



/* @group Splash */



#engSplash h1 { 

	height: 41px;

	width: 151px;

	padding: 0;

	margin: 0 0 16px 79px;

	overflow: hidden;

	text-indent: -66666px;

	display: block;

	text-align: left;

}

#engSplash h1 a, #engSplash h1 a:hover {

	display: block;

	height: 41px;

	width: 151px;

	background: transparent url("../images/site/esc_splash_e.gif") no-repeat right top;

	text-decoration: none;

}

#freSplash h1 { 

	height: 37px;

	width: 153px;

	padding: 0;

	margin: 0 0 16px 0;

	overflow: hidden;

	text-indent: -6666px;

	display: block;

}

#freSplash h1 a, #freSplash h1 a:hover {

	display: block;

	height: 37px;

	width: 153px;

	background: transparent url("../images/site/esc_splash_f.gif") no-repeat left top;

	text-decoration: none;

}

#engSplash h2, #freSplash h2 { /* bright future */

	background: transparent;

	font-size: 140%;

	font-weight: bold;

	color: #f0ab00;

	margin-bottom: 6px;

}

#engSplash p, #freSplash p {

	margin-bottom: 6px;

	font-size: 90%;

	line-height: 110%;

	color: #f0ab00;

}

#engSplash a, #freSplash a {text-decoration:none; color: #339; font-size: 120%; font-weight: bold;}



#engSplash a:hover, #freSplash a:hover {color: #669; text-decoration: none;}



/* @end */





/* @group Header Area */



h1#logoEng, h1#logoFre { 

	height: 40px;

	width: 152px;

	padding: 0;

	margin: 0;

	position: absolute;

	left: 410px;

	top: 160px;

	overflow: hidden;

	text-indent: -6666px;

}

h1#logoEng a, h1#logoEng a:hover, h1#logoFre a, h1#logoFre a:hover {

	display: block;

	height: 40px;

	width: 152px;

	background: transparent url("../images/site/esc_e.gif") no-repeat left top;

	text-decoration: none;

}



/*redefine for french logo*/

h1#logoFre { width: 152px;} 

h1#logoFre a, h1#logoFre a:hover {

	width: 152px; background: transparent url("../images/site/esc_f.gif") no-repeat left top;}



img#logoImgEng, img#logoImgFre { display: none;} /*hide image for print*/



#headerWrap h2 { /* bright future */

	background: transparent;

	width: 525px;

	padding: 0;

	margin: 0;

	position: absolute;

	left: 187px;

	top: 222px;

	font-size: 180%;

	font-weight: bold;

	color: #f0ab00;

}





/* @end */





/* @group Primary Navigation */



#navPrimary ul {

	font-size: 95%;

	margin: 0;	/*removes indent IE and Opera*/

    padding: 0;

}



#navPrimary li {

    list-style: none;	/*turns off display of bullet*/

	margin:0;

}

#navPrimary li a {

	width: 145px;

	display: block;

	color: #900;

	background-color: transparent;

	text-decoration:none;

	font-weight:bold;

	padding: 5px 0;

	margin: 0;

}

#navPrimary li a:hover {color:#339; text-decoration:none;}

#navPrimary li a.selected {color:#339;}



/* @group Sub Navigation */



#navPrimary li ul {

	margin:0;

	padding:0;

	font-size: 100%;

}

#navPrimary li ul li {

	/*font-size:95%;*/

    list-style: none;	/*turns off display of bullet*/

	margin:0; /* compensate for general li rule */

}

#navPrimary li ul li a {

	width: 137px;

	margin: 0 0 0 8px;

	padding:2px 0;

	color: #669;

	list-style: none;

}

#navPrimary li ul li a:hover {color: #339; text-decoration:none;}

#navPrimary li ul li a.selected {color: #339;}



/* @end */

/* @end */





/* @group Secondary Navigatoin */



ul#navSecondary {

	/*width: 704px;*/

	/*overflow: hidden;  ensure the div stretches to contain its floats*/ 

	position: absolute; /* absolutely position within the parent */

	top: 15px;

	right: 195px;

	/*width:160px;*/

}

ul#navSecondary li{

	display: inline; /* make the list horizontal */

	list-style: none; /* hide the bullets */

	float: left;

	padding: 0;

	margin:0;

	font-weight: bold;

	/*font-size: 95%;*/

}

ul#navSecondary li a{

	padding: 0 6px;

	text-decoration: none;

	border:none;

	color: #339;

	border-left: 1px solid #339;

}

ul#navSecondary li:first-child a {padding-left:0;border-left:none;

}



ul#navSecondary li a:hover {color:#669;

}



/* @end */



/* @group Search Bar */



#navSearch {

	margin: 0;

	padding:0;

	position: absolute; /* absolutely position within the parent */

	top: 14px;

	right: 2px;

	left: 595px;

}

#navSearch * {vertical-align: middle; margin: 0 1px;}



#navSearch fieldset {

		margin: 0px;

		padding: 0px;

		border: none;

}



#navSearch input#searchField {

	font: 11px "Trebuchet MS", Arial, Helvetica, sans-serif;

	color: #999;

	width:110px;

	margin:0;

	padding: 1px 5px;

	border: 1px solid #f0ab00;

	float: left;

}

#navSearch input#searchField.fieldFocus {

	background-color:#ffc; 

	width:120px;

	color:#000;

}



#navSearch button#searchButton {

	width:18px; 

	height:18px; 

	margin: 0 7px;

  	border:none;

	text-indent: -6666px; /* hide the text */

	background: transparent url("../images/site/search.gif") no-repeat left top ;

	cursor: pointer; /* hand-shaped cursor */

	/*float: left;*/

	/*margin-left: -130px;*/

	}



/* @end */



/* @group Facts Area */



#facts img {

	display: block;

	margin:0 auto;

	padding:0 0 10px 0;

}

#facts p, #facts h4  {

	font-size: 105%;

	color:#669;

	line-height: 180%;

	font-weight: bold;

	margin: 0;

	padding: 0;

}

#facts h4 {

	color: #339;

}



/* @end */



/* @group Footer Area */



p#copywrite {

	width: 235px;

	display: block;

	position: absolute;

	left: 20px;

	bottom: 0;

}

p#funded {

	text-align: right;

	width: 390px;

	display: block;

	position: absolute;

	right: 100px;

	bottom: 0;

}

p#canada {

	width: 67px;

	height: 16px;

	overflow: hidden;

	text-indent: -6666px;

	display: block;

	position: absolute;

	right: 18px;

	bottom: 2px;

}

p#canada a {

	display: block;

	width: 67px;

	height: 16px;

	background: transparent url("../images/site/canada.gif") no-repeat;

	text-decoration: none;

}



/* @end */





/* @group Forms */



fieldset {

	margin: 2em 0;

	border: 1px solid #fae2a7;

}

legend {

	font-size: 115%;

	color: #600;

	padding: 4px;

}

label {

	display: block;

	font-size: 90%;

}

textarea, input {

	width: auto;

	margin-bottom: 8px;

	border-top: 2px solid #999;

	border-left: 2px solid #999;

	border-bottom: 1px solid #ccc;

	border-right: 1px solid #ccc;

	font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;

	font-size: 9px;

	font-style: normal;

}

input {

	width: auto;

}

input.submit {

	width: auto;

	background-color: #fae2a7;

	border: 1px solid #f4c44c;

	font: 105% "Trebuchet MS", Arial, Helvetica, sans-serif;

	color: #900;

}

textarea {

	height: auto;

}

.required {

	font-size: 10px;

	color: #600;

}



/* @end */



/* @group Tables */



table {

	border-collapse: collapse;

	width: 100%;

	text-align: center;

	font-size: 90%;

	margin: 6px 0;

	line-height: 130%;

}



caption {

	font-size: 115%;

	font-weight: bold;

	text-align: left;

	padding: 4px 0;

	color: #c30;

	line-height: 120%;

}



thead {

	background-color: #fae2a7;

	color: #339;

	font-weight: bold;

}



tbody {	background-color: #fdf1d6;}

tfoot { text-align: left; border-bottom: 1px solid #f4c44c; color: #999;}

tfoot p { margin:0; }

th, td {vertical-align: top; padding: 4px;}

th { border-top: 1px solid #f4c44c; border-bottom: 1px solid #f4c44c;}

tr { border-bottom: 1px solid white; }



table .left { text-align: left;}

table .odd { background-color: white; border-bottom: 1px solid #f4c44c; }



/* @end */





/* @group Extra's */

#content .small {

	font-size: 90%;

	margin-top: 32px;

	width: 100%;

	border: 1px solid #ccc;

	padding: 5px 5px 0 5px ;

}

#content .small h5 {

	margin-top: 0;

}



ul.bfc {

	margin: 8px 0 24px 24px;

	padding: 0;

}



ul.bfc li {

	list-style-type: none;

	/*margin: 0 auto;*/

	padding: 0;

	width: 200px;

}

ul.bfc li a {

	margin: 4px 0;

	padding: 1px 0 1px 8px;

	font-weight: bold;

	background-color: #fdf1d6;

	border: 1px solid #fae2a7;

	width: 200px;

	display: block;

	text-decoration: none;

}

ul.bfc li a:hover {

	background-color: #fae2a7;

	text-decoration: none;

	color:#900;

}







.reusableBox { /*this is used in the 2004 report on the side*/

	width: 140px;

	float: right;

	margin: 2px 0 20px 35px;

}

.reusableBoxCon { /*this is used in the 2004 report in the body*/

	width: 100%;

	margin-bottom: 12px;

	border-bottom: 1px solid #339;

}

.reusableBox p, .reusableBox strong, .reusableBoxCon p, .reusableBoxCon strong {color:#669;}



.reusableBox h5, .reusableBoxCon h5 {

	font-size: 105%;

	background-color: #339;

	color: #fff;

	text-align: center;

	margin: 12px auto;

}

.reusableBox h6, .reusableBoxCon h6 {

	font-size: 105%;

	color: #339;

	padding-bottom: 5px;

}

.reusableBox img, .reusableBox h5, .reusableBoxCon h5 {

	border: 2px solid #f0ab00;

	border-bottom-width: 1px;

	border-right-style: none;

	border-left-style: none;

}



#content .source { font-size: 90%; padding-bottom: 10px; color: #999;}



#content .listContents {

	background-color: #fdf1d6;

	width: 100%;

	margin: 20px 0;

	font-size: 90%;

	text-align: center;

	color: #000;

}

#content .listContents p {margin: 0 auto;}

#content .listContents a {padding: 6px;}

#content .listContents a:hover {text-decoration: none;}







/* @end */









/* @group Page IDs */



/* @group splash */



body#splash #wrapper { /*change wrapper container for splash page*/

	height: 466px;

	background: transparent url("../images/site/splash.jpg") no-repeat left top;

	position: relative;

}



body#splash #footer { /*change footer container for splash page*/

	background:none;

	width: 720px;

	margin: 0;

	top: 260px;

	left: 0;

}

body#splash p#funded {width: 610px; margin-top: 0;}



/* @end */



body#train #content dl {

	margin: 0 0 12px 24px;

}

body#train #content dt {

	margin: 0;

}



/* @group about */

body#about #headerWrap{

	background: #fff url("../images/site/header2.jpg") top left no-repeat;

}

/* @end */







/* @group board */



body#board #headerWrap{

	background: #fff url("../images/site/header3.jpg") top left no-repeat;

}



body#board #content ul {margin: 0 0 12px 0; padding: 0;}



body#board #content li {

	list-style-type: none;

	margin: 0;

	padding: 0;

	font-weight: normal;

	color: #333;

}

body#board #content li ul li {

	list-style-type: none;

	margin: 0;

	padding: 0;

	font-weight: normal;

}

body#board #content h5 {

	margin: 18px 0 12px 0;

	padding-top:2px;

	border-top: 1px solid #ccc;

}

body#board #content h6 {

	margin:0;

	padding-left: 20px;

	float: right;

	font-style: italic;

	color: #666;

}

/* @end */





/* @group resource */

body#resource #headerWrap{

	background: #fff url("../images/site/header4.jpg") top left no-repeat;

}

/* @end */





/* @group careers */

body#careers #headerWrap, body#training #headerWrap{

	background: #fff url("../images/site/header5.jpg") top left no-repeat;

}

/* @group training */



body#training #content ul {margin: 0 0 12px 0; padding: 0;}



body#training #content li {

	list-style-type: none;

	margin: 0;

	padding: 0;

}

body#training #content li a {

	margin: 4px 0;

	padding: 1px 8px;

	font-weight: bold;

	background-color: #fdf1d6;

	border: 1px solid #fae2a7;

	width: 250px;

	display: block;

	text-decoration: none;

}

body#training #content li a:hover {

	background-color: #fae2a7;

	text-decoration: none;

	color:#900;

}



body#training #content li ul li {

	list-style-type: square;

	margin: 0 0 0 22px;

	padding: 0;

	font-weight: normal;

	width: auto;

}

body#training #content li ul li a {

	margin: 0;

	padding: 0;

	background-color: transparent;

	border-style: none;

	font-weight: normal;

	display: inline;

}

body#training #content li ul li a:hover {

	background-color: transparent;

	text-decoration: underline;

}

/* @end */

/* @end */







/* @group projects */

body#projects #headerWrap{

	background: #fff url("../images/site/header6.jpg") top left no-repeat;

}

/* @end */



/* @group news */

body#news #headerWrap{

	background: #fff url("../images/site/header7.jpg") top left no-repeat;

}

/* @end */



/* @group members */

body#members #headerWrap{

	background: #fff url("../images/site/header1.jpg") top left no-repeat;

}

/* @end */





/* @end */



/* @group training for the trades page */



div#hide_province_inter {

	display: none;

} 



div#hide_province_ab {

	display: none;

} 



div#hide_province_bc {

	display: none;

} 



div#hide_province_mb {

	display: none;

} 



div#hide_province_nl {

	display: none;

} 



div#hide_province_nb {

	display: none;

} 



div#hide_province_nwt {

	display: none;

} 



div#hide_province_ns {

	display: none;

} 



div#hide_province_nv {

	display: none;

} 



div#hide_province_on {

	display: none;

} 



div#hide_province_pei {

	display: none;

} 



div#hide_province_qc {

	display: none;

} 



div#hide_province_sk {

	display: none;

}



div#hide_province_yk {

	display: none;

}



/* @end */



/* @group Admin */







#headerWrapAdmin {

	overflow: visible; /* ensure the div stretches to contain its floats */

	/*height: 1%;  holly hack - width or height is required by IE for the above rule to work */

	background: #fff url("../images/site/intranet-header.jpg") top left no-repeat;

	height: 128px;

	width: 760px;  /* restrict the width */

	margin: 0 auto;

	position: relative;

}



#headerWrapAdmin h1 { 

	height: 40px;

	width: 152px;

	padding: 0;

	margin: 0;

	position: absolute;

	left: 418px;

	top: 50px;

	overflow: hidden;

	text-indent: -6666px;

}

#headerWrapAdmin h1 a, #headerWrapAdmin h1 a:hover {

	display: block;

	height: 40px;

	width: 152px;

	background: transparent url("../images/site/esc_e.gif") no-repeat left top;

	text-decoration: none;

}



#headerWrapAdmin h2 { /* bright future */

	background: transparent;

	width: 525px;

	padding: 0;

	margin: 0;

	position: absolute;

	left: 188px;

	top: 95px;

	font-size: 180%;

	font-weight: bold;

	color: #f0ab00;

}







#content_wide_admin {

	width:540px;

	margin: 0;

	padding: 0;

	font-size: 95%;

	line-height: 140%;

	float: left;}



#content_wide_admin table {

	border-collapse: collapse;

	width: 100%;

	text-align: left;

	font-size: 90%;

	margin: 6px 0;

	line-height: 130%;

}



#content_wide_admin fieldset {

	margin: 2em 0;

	border: none;

}

#content_wide_admin form div legend {

	font-size: 120%;

	color: #600;

	padding: 5px 0;

}

#content_wide_admin form div label {

	display: block;

	font-weight: bold;

	margin-top: 15px;

}

#content_wide_admin form div textarea {

	width: 450px;

	height: 100px;

	border-top: 2px solid #999;

	border-left: 2px solid #999;

	border-bottom: 1px solid #ccc;

	border-right: 1px solid #ccc;

}





#content_wide_admin form div input {

	border-top: 2px solid #999;

	border-left: 2px solid #999;

	border-bottom: 1px solid #ccc;

	border-right: 1px solid #ccc;

}



.radio input {

	width: 20px;

}



#content_wide_admin form div .required {

   font-size: 10px;

	color: #600;

}



#content_wide_admin form div input.wide {

	width: 475px;

}



#content_wide_admin form div input.file {

	border-style: none;

}



#content_wide_admin facts {

	border: 2px dotted #f9e3a9;

}



#calendar_listings ul li {

	list-style-type: none;

}



ul#calendar_listings li {

	list-style-type: none;

	padding-bottom: 15px;

}



#content_wide_admin calendar_actual {

	border: 2px dotted #f9e3a9;

	width: 200px;

	float: right;

}



/* @end */ 

.bluetext {

	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-size: 12px;

	font-weight: bolder;

	color: #339;

}