* {
	font-family: Arial, Helvetica, sans-serif;
}

HTML {
	height: 100%;
}

BODY {
	/* to center the body or add a body background
	image, add the styles directly in the template
	head or body tag. Adding it here will affect
	the body alignment in SitePress edit mode! */
	margin: 0;
	height: 100%;
	background-color: #FFFFFF;
	font-size: 90%;
	color: #000000;
}

.clearAll {
	display: block;
	float: none;
	visibility: hidden;
	margin: 0;
	padding: 0;
	clear: both;
	width: 100%;
	height: 0px;
	overflow: hidden;
	font-size: 1px;
	line-height: 1px;
}

/* HEADINGS ------------------------------------------------------ */
H1 {
	font-size: 1.3em;
	font-weight: bold;
	color:#0033FF;
}

H2 {
	font-size: 1.1em;
	font-weight: normal;
}

SUP, .SupText { font-size: 65%; vertical-align: text-top; }

SUB, .SubText {  font-size: 65%; vertical-align: text-bottom; }



/* MAIN LAYOUT --------------------------------------------------- */

/* PAGE */
.page {
	margin: 0 auto;
	width: 800px;
	overflow: hidden;
	text-align: left;
}

/*	HEADER	*/
.header {
	background:#BDDCF3 url(/img/header.gif) no-repeat;
	height:52px;
	width:800px;
}

/* TEXT IMAGES STYLES commented out for validation SP will still read	*/
/*
.PageTitle_image { display:image; font-family: "Mistral"; font-weight:bold; font-size: 25px; text-transform:uppercase;  color: #ff9b17; background-color: #f3ff74; transparent: #f3ff74; }
.SectionTitle_image { display:image; font-family: "Mistral"; font-weight:bold; font-size: 26px; text-transform:uppercase;  color: #3366ff; background-color: #bddcf3; transparent: #bddcf3; }
.SectionTitleSub_image { display:image; font-family: "Mistral"; font-weight:bold; font-size: 18px; text-transform:uppercase;  color: #3366ff; background-color: #bddcf3; transparent: #bddcf3; img-class:sectionTitleSubImage; }

	
.menuItem_level4 { display:image; max-width:135px; font-family: "Mistral"; font-weight:bold; font-size: 20px; text-transform:uppercase;  color:#FFFF00;  background-color:#3cc06b; transparent: #3cc06b; }
.menuItem_level3 { display:image; max-width:135px; font-family: "Mistral"; font-weight:bold; font-size: 20px; text-transform:uppercase;  color:#FFFF00;  background-color:#3cc06b; transparent: #3cc06b; }
.closeWindowButton { display:image; font-family: "Mistral"; font-weight:bold; font-size: 22px; text-transform:uppercase; color: #F1FF60; background-color: #0033FF; img-class:closeButton; background-color: #0033FF; padding-top:2px; padding-right: 5px; padding-bottom: 0px; padding-left: 5px; }
*/

.sectionTitle{
	text-align:right;
	padding-right:20px;
	padding-top:5px;
	position:relative;
	z-index:99;
	}
	
/*	CONTENT	*/
.contentHolder {
	background:#ffffcc url(/img/main_bg.gif) repeat-y;
}
.contentHolder .content {
	float:left;
	padding: 15px 0 15px 10px;
	width:605px;
	min-height: 520px;
	position:relative;
}
.contentHolderHome {
	height:555px;
	width:800px;
	background:url(/img/home_bg.gif) no-repeat;
	}
	
.overviewPage .content,
.page_energy_control_systems_figure_8 .content {
	width:630px;
	padding:15px 0;
	}
.overviewPage .nextPrevLinks,
.page_energy_control_systems_figure_8 img.closeButton {
	padding-right:15px;
}
	
.caption {
	color:#1F4BF8;
	font-size:.8em;
}
.captionBlack{
	font-size:.8em;
	color:#000000;
}
.page_energy_control_systems_figure_8 .caption{
	padding-left:15px;
	}

/*	Home Page NAVIGATION */
.logo{ position:absolute; z-index:50; margin-left:190px; margin-top:85px;}
.energy{
	position:absolute;
	margin-top:230px;
	margin-left:5px;
	}
.energy a{
	display:block;
	background:url(/img/energy.gif) no-repeat;
	height:315px;
	width:153px;
	}
.energy a:hover, .page_energy .energy a{
	display:block;
	background:url(/img/energy_over.gif) no-repeat;
	height:315px;
	width:153px;
	}
.fuels{
	position:absolute;
	margin-top:55px;
	margin-left:0px;
	}
.fuels a{
	display:block;
	background:url(/img/fuels.gif) no-repeat;
	height:153px;
	width:215px;
	}
.fuels a:hover, .page_fuels .fuels a{
	display:block;
	background:url(/img/fuels_over.gif) no-repeat;
	height:153px;
	width:215px;
	}
.technology{
	position:absolute;
	margin-top:0px;
	margin-left:215px;
	}
.technology a{
	display:block;
	background:url(/img/technology.gif) no-repeat;
	height:152px;
	width:224px;
	}
.technology a:hover, .page_technology .technology a{
	display:block;
	background:url(/img/technology_over.gif) no-repeat;
	height:152px;
	width:224px;
	}
.environment{
	position:absolute;
	margin-top:0px;
	margin-left:430px;
	}
.environment a{
	display:block;
	background:url(/img/environment.gif) no-repeat;
	height:174px;
	width:215px;
	}
.environment a:hover, .page_environment .environment a{
	display:block;
	background:url(/img/environment_over.gif) no-repeat;
	height:174px;
	width:215px;
	}
.renewables{
	position:absolute;
	margin-top:10px;
	margin-left:620px;
	z-index:0;
	}
.renewables a{
	display:block;
	background:url(/img/renewables.gif) no-repeat;
	height:284px;
	width:179px;
	}
.renewables a:hover, .page_renewables .renewables a{
	display:block;
	background:url(/img/renewables_over.gif) no-repeat;
	height:284px;
	width:179px;
	}
	
/*	Section Menu	*/
.sectionMenu{
	display:block;
	margin-left:0px;
	margin-top:0px;
	z-index:100;
	height:555px;
	width:800px;
	padding:5px 10px;
}
.sectionContent{
	position:absolute; 	
	margin-left:595px;
	margin-top:230px; 
	z-index:99;
}
.page_home .sectionMenu{display:none;}
.sectionMenu ul{
	list-style:none;
	padding-left:0;
	margin-left:0;
	width:180px;
}
.sectionMenu li{
	margin:15px 0;
	text-indent:-20px;
	padding-left:20px;
}
.sectionMenu a{
	color:#000077;
}
.sectionHeader{
	text-align:center;
	margin-left:-20px;
	}

.menuBGimage{
position:absolute;
margin-left:580px;
margin-top:220px;
}

/*	topBar	*/
.nextPrevLinks {
	float:right;
	color: #0033CC;
}
.nextPrevLinks IMG {
	vertical-align: middle;
}
.nextPrevLinks .previous {
	padding-right: 5px;
}


.page_vocabulary_editor FORM {
	display: inline;
}




.index * {
	border-collapse: collapse;
}
.index TD {
	padding: 3px 5px;
	border-bottom: 1px dotted #FFCD00;
}
.index TH {
	padding: 5px;
	background-color: #FFCD00;
	color: #FF6600;
}
.index TH A {
	color: #FF6600 !important;
}
.index TD A {
	color: #0033EE !important;
}
.index TD.odd {
	background-color: #FFFFFF;
}
.index TD.even{
	background-color: #FFFFF2;
}
.index TD.oddselected {
	background-color: #FFF9E1;
}
.index TD.evenselected {
	background-color: #FFF4CC;
}






/*	FOOTER	*/
.footer {
	clear: both;
	background:#fffa76 url(/img/footer_bg.gif) repeat-y;
	height:33px;
}
.footerContent {
	padding: 3px 5px 0 180px;
	text-align: right;
}
.footerContent IMG{border:0;}
.adobeLink{
	width:150px;
	float:left;
	padding:3px 0 0 0;
	text-align:left;
	}
 
.footerInteractive { padding: 3px 5px 0 180px; text-align: left;}
.footerInteractive IMG{border:0;}

.continueText{
	float:left;
	padding:3px 0 0 5px;
	}
.page_test .next {display:none;}
.page_overview .previous {display:none;}


/* NAVIGATION */
.menuLogo{
	margin-top:-51px;
	margin-left:10px;
	position:relative;
	z-index:100;
}
.menuLogo A{
	display:block;
	width:152px;
	height:166px;
	background:url(/img/logo.png);
}
.menuLogo A:hover{
	display:block;
	width:152px;
	height:166px;
	background:url(/img/logo_over.png);
}
.menu {
	width: 167px;
	float: left;
	padding: 0 0 20px 0;
}
.menu A{ 
	color:#FFFF00; 
	font-weight:bold;
	text-decoration:none;
	}
.menu A:hover {
	color:#FFFFCC;
	}
.menu ul{ 
	list-style:none;
	padding:0 0 0 10px;
	margin:0;
	text-transform:uppercase;
}
.menu ul li{ 
	padding:0;
	margin:5px 0;
}
li.level_2 {display:inline;}
li.level_4 { 
	margin:15px 0 0 0 !important;
}
li.level_5 {
	font-size:.9em;
	padding:0 ; 
	margin:0;
	color:#FFFFFF;
	text-transform: none;
}
li.level_5 A {
	padding:0; 
	margin:0;
	color:#FFFFFF;
	text-transform: none;
	font-weight:normal;
}
li.level_5 A:hover {
	color:#FFFF00;
}
li.level_6 {display:none;}

.menu .SELECTED,
.menu .OPENED {
	color: #FFFF33;
}
.menu .level_4 .SELECTED,
.menu .level_4 .OPENED {
	text-decoration: underline;
}


/*	Bottom Navigation on Home Page	*/
.bottomNavHome{
	background-color:#009966;
	width:800px;
	height:45px;
	}
.homeNav{
	float:left;
	font-size:.9em;
	width: 580px;
	line-height:1.5em;
}
.homeNav ul {
	margin:0;
	padding:2px 0 0 15px;
}
.homeNav ul li{ 
	margin: 10px 10px 10px 0; 
	border-right: 1px solid #99FF99;
}
.homeNav A {
	margin-right: 10px;
	color:#99FF99;
	text-decoration:none;
	white-space:nowrap;
}
.homeNav A:hover {
	margin-right: 10px;
	color:#FFF047;
	text-decoration:none;
	white-space:nowrap;
}
.homeNav ul li.contact{
	border-right:none;
}

.homeHelp{
	float:right;
	padding:8px 15px 0 0;
	}
.homeHelp IMG{border:0;}
#homePages{
	}

/*	numbers at the top right that count pages */
.title {
	clear:both; 
	float:left;
	padding-bottom:15px;
	}
.title H1 {
	float:left; 
	width:450px; 
	margin:0;
	}
.numbers{
	float:right;
	width:80px;
	font-size: 1.3em;
	font-weight: bold;
	color:#0033FF;
	}
	
/* INNERBOX TEMPLATE for orange rounded box inside content	*/
.innerBox {width:550px;}
.innerBoxContent{
	background:#ffce71 url(/img/innerbox_bg.gif) repeat-y top left;
	margin:0;
	padding:10px 20px 10px 10px;
	width:591px;
	min-height:400px;
}
.innerBoxHeader{
	background:#f3ff74 url(/img/innerboxH1_bg.gif) no-repeat top left;
	margin:0 ;
	padding:0px;
	color:#ff9b17;
	width:620px;
	height:30px;
}
.innerBoxHeader H1{
	padding:4px 0 0 15px;
	margin:0;
	float:left;
}
.pageNumber {
	font-size:14px; 
	line-height:90%; 
}


/*	POPUPS ON MAIN PAGE	*/
.contentHolderPopup {
	position:absolute;
	margin-left:0;
	width:620px;
	z-index:100;
}
.popup {
	position: relative;
	padding-top:30px;
	width:620px;
	margin:0 0 0 90px;
	text-align:left;
}
.popupContent {
	background:url(/img/popup_bg.png) repeat-y;
	margin:0 auto;
	padding:10px 20px 10px 10px;
	width:591px;
	min-height:420px;
}
.popupHeader{
	background:url(/img/popupHeader_bg.png) no-repeat top left;
	margin:0 auto;
	padding:1px 0px;
	color:#ff9b17;
	width:620px;
	height:27px;
}
.popupHeader .pageNumber {
	font-size:14px; 
	color:#ff9b17;
	line-height:90%; 
	float:right;
	padding:6px 30px 0 0;
}
.popupHeader H1 {
	padding:2px 0 0 15px;
	margin:0;
	float:left;
	}

.popupCloseButton{
	position: absolute;
	right: 20px;
	margin-top:-15px;
	cursor: pointer;
}
#vocabulary .popupCloseButton{
	position: relative;
	right: 0;
	margin: 10px;
	text-align: right;
}

	

/*	FYI POPUPS	*/
#fyiPopup {
	text-align:left;
}
.fyiPopup {
	position: absolute;
	top: 75px;
	padding-top:30px;
	width:620px;
	margin:0 0 0 177px;
	text-align:left;
}	
.fyiPopupContent {
	background:url(/img/FYIpopup_bg.png) repeat-y;
	margin:0 auto;
	padding:10px 30px 10px 25px;
	width:571px;
	height:420px;
	color:#0000cc;
}
.popupScrollableContent {
	height:410px;
	overflow: auto;
}

	
.fyiPopupHeader{
	background:url(/img/FYIpopupHeader_bg.png) no-repeat top left;
	margin:0 auto;
	padding:1px 0px;
	width:620px;
	height:27px;
}
.fyiPopupHeader H1 {
	padding:2px 0 0 20px;
	margin:0;
	float:left;
	color:#FFFFFF;
	}
.fyiPopupFlag{
	position:absolute;
	margin-top:-35px;
	margin-left:-10px;
	}


.FYI_button {
	display: block;
	padding: 56px 3px 10px 10px;
	width: 190px;
	background: url(/img/fyiButton.gif) no-repeat left top;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	color: #0000DD !important;
}
.FYI_button_large {
	display: block;
	padding: 60px 3px 10px 10px;
	width: 190px;
	height: 25px;
	background: url(/img/fyiButtonLarge.gif) no-repeat left top;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	color: #0000DD !important;
}


/*	VOCABULARY */
.vacabularyWordList TD {
	padding: 3px 5px;
}


/*	VOCABULARY POPUPS WITH TABS*/
#vocabularyPopup{
	position: absolute;
	top: 100px;
	left: 54%;
	background-color:#FFC35D;
}

#vocabulary{
	width:300px;
}
.vocabPopupHeader{
	clear:both;
	height:35px;
}
.vocabPopupHeader .title{
	text-align:left;
	background-color:#f3ff74;
	padding:8px 5px 3px 10px;
	width:285px;

}
.tabs{
	margin:-17px 0 0 0; 
	float:right; 
	padding-bottom:1px;
}

.langTab {
	display:inline;
	padding:1px 10px;
	text-align:right;
	margin:0 0 0 2px;
	background-color:#FF9900;
	cursor: pointer;
}
.langTabSelected {
	display:inline;
	padding:1px 10px;
	text-align:right;
	margin:0 0 0 2px;
	background-color:#FFC35D;
}

.langContent {
	display: none;
}
.langContentSelected {
	display: block;
	padding:10px;
	text-align:left;
	min-height:340px;
}


/*	PAGE STYLES	*/

.image_at_right td.image{
	vertical-align:top;
	padding-left:20px;
}
.image_at_right td.text{
	vertical-align:top;
}
.image_bottom_caption_right td.image{
	vertical-align:top;
	padding-right:15px;
}

.DYKtext{
	width:300px;
	color:blue; 
	font-size:1.1em;
	position:absolute;
	margin:50px 0 0 90px;
	font-weight:bold;
}
.leftImageWithCaption{
	float:left;
	width:130px;
	font-size:.8em;
	padding-right:15px;
}

/*	 for yellow box with blue text in content*/
.yellowBox{
	color:blue; 
	background:#FFFF66;
	margin:0;
	padding:10px;
}
.black {color: #000000;}
ul.yellowBox{
	padding:10px 10px 10px 30px;
	}
.blue{color:blue;}
.blueLarge{
	color:blue;
	font-size:1.5em;
	font-weight:bold;
	}
.indent{
	padding-left:15px;
	}
 

/* INTERACTIVES */
 
TABLE.interactive_table {
	border-top: 1px solid black;
	border-left: 1px solid black;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;	line-height:1em;
	}
TABLE.interactive_table TH {
	color:#FFFFFF;
	font-weight:bold;
	background:#2352ff;
	border-bottom: 1px solid black;
	border-right: 1px solid black;
	padding:5px 0;
	text-align:center;
	}
TABLE.interactive_table TD {
	border-bottom: 1px solid black;
	border-right: 1px solid black;
	padding:5px 0;
	text-align:center;
	}
 
A.button_done {
	background-image:url(/img/done.gif);
	display:block;
	width:52px;
	height:28px;
 	text-indent:-200px;
	overflow:hidden;
}

A.button_done_disabled {
	background-image:url(/img/donedisabled.GIF);
	display:block;
	width:52px;
	height:28px;
 	text-indent:-200px;
	overflow:hidden;
}


A:hover.button_done {
	background-image:url(/img/done_over.gif);
}

A.button_reset {
	background-image:url(/img/reset.gif);
	display:block;
	width:55px;
	height:28px;
 	text-indent:-200px;
	overflow:hidden;
}
A:hover.button_reset {
	background-image:url(/img/reset_over.gif);
}
 
TABLE.interactive_graph {
	border-top: 1px solid black;
	border-left: 1px solid black;
	background-color:#FFFFFF;
	}
TABLE.interactive_graph TD {
	border-bottom: 1px solid black;
	border-right: 1px solid black;
	width:60px;
	height:40px;
	text-align:center;
	}

.hidden_text1, .hidden_text2, .hidden_text3, 
.hidden_text4, .hidden_text5, .hidden_text6,
.hidden_text7, .hidden_text8, .hidden_text9 {
	color:#666666;
	}
.answer{ color:#0000BB;}
.validation{
	color:#CC0000 !important;
	visibility:hidden;
}
.hintContainer{
	width:366px;
	text-align:center;
	position:absolute;
	bottom:50px;
	margin:0 0 0 120px;
}
.hint{
	color:#0000EE;
	font-weight:bold;
	font-size:1.1em;
	}

.feedback {
	display:none;
}

.dragThese {text-align:center;}
.draggable { 
	text-align:center;
	float:left;
	padding:10px 15px;
	margin-bottom:-34px;
}
.dragto {
	background-color:#FFC252;
	padding:10px;
	clear:both;
}


.formula {
	visibility:hidden;
	}
	
.flashComponent EMBED,
.flashComponent OBJECT {
	display: block;
}
	

.correct {
	color:black;
}
	

.wrong {
	color:red;
}
	
/* accessibility */
 
     span.accesskey {
       text-decoration:none;
     }
 
     .accessibility {
       position: absolute;
       top: -999em;
       left: -999em;
     }
 
/* end accessibility */

