/* Reset file - begins here */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0em;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0em;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
	padding-right: 100%;
}
ol, ul {
	list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
	vertical-align: top;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/* Reset file - ends here */

/* CSS for Energy Service - begins here */

body {
	font-family: Arial, Helvetica, sans-serif;
}

/* NOTE : These 'standard' font stylings are conventions to map the stylings available in the Web Publisher
applet for creating content from templates to how we want to style them here in this Energy Services
site */
h3 {
	font-size: 10pt;
}

/* Main Div Structure - begins here */
#mainContainer {
	width: 1000px;
}
/* Main Div Structure - ends here */

/* Top Page - begins here */
#topPage {
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: #003399;
}

#header {
	height: 100px;
	border-bottom: solid 3px #ffffff;
	border-top: solid 3px #ffffff;
}

#dteEnergyLogo {
	float: left;
}

#tagLine {
	float: left;
	width: 464px;
}

#searchArea {
	float: right;
	color: #FFFFFF;
	font-size: 10pt; 
}

#searchArea form {
	padding-top: 0px;
	padding-right:10px;
}

#searchArea img {
	top: 5px;
	position: relative;
}

#topNavigation {
	padding-top: 2px;
	padding-bottom: 2px;
	float: right;
	width: 100%;
	color: #FFFFFF;
	background-color: #003399;
}

/* Top Navigation links CSS - begins here */
.home {
	float: right;
	padding-right: 8px;
	border-right: solid 1px #ffffff;
}

.businessLinesTopNavLink {
	float: right;
	padding: 0px 8px 0px 8px;
	border-right: solid 1px #ffffff;
}

.contactUs {
	float: right;
	padding: 0px 8px 0px 8px;
}

.aboutUs {
	float: right;
	padding: 0px 8px 0px 8px;
	border-right: solid 1px #ffffff;
}

.careers {
	float: right;
	padding: 0px 8px 0px 8px;
	border-right: solid 1px #ffffff;
}

.newsRoom {
	float: right;
	padding: 0px 8px 0px 8px;
	border-right: solid 1px #ffffff;
}

#topNavigation {
	font-size: 11px;
}
/* Top Navigation links CSS - ends here */
/* Top Page - ends here */

/*Middle Page - begins here */
#middlePage {
	padding-top: 10px;
	float: left;
	width: 100%;
}

#warningMessage {
	text-decoration: blink;
}

#javascriptDisabledMessage {
	width: 480px;
	padding: 0px 0px 0px 15px;
	color: #ff3300;
	font-weight: bold;
}

#javascriptDisabledMessage a {
	color: #ff3300;
}

/*Side Navigation - begins here */
#sideNavigation {
	float:left;
	width: 174px;
}

.sideNavArrow {
	padding-right: 10px;
}

#contextNavigation {
	padding-left: 10px;
	padding-right: 10px;
}

#businessLines {
	display: none;
	padding-left: 10px;
}

.onsiteLeftNavAndLOBHeader {
	background-color: #0099CC;
}

.petcokeLeftNavAndLOBHeader {
	background-color: #009999;
}

.pulpPaperLeftNavAndLOBHeader {
	background-color: #066699;
}

.steelLeftNavAndLOBHeader {
	background-color: #339966;
}

.powerAndRenewablesLeftNavAndLOBHeader {
	background-color: #006666;
}

#siteNavigation {
	padding-left: 10px;
	padding-right: 10px;
}

#aboutUs {
	display: none;
	padding-left: 10px;
}

#careers {
	display: none;
	padding-left: 10px;
}

#newsroom {
	display: none;
	padding-left: 10px;
}

.nonBusinessLineLeftNav {
	background-color: #aabfe4;
}

.contextNavigationLink {
	text-align: justify;
	text-decoration: none;
	font-size: 12px;
	height: 23px;
	margin-bottom: 4px;
}

.contextNavigationLink a {
	color: white; 
	text-decoration: none;
	display: block;
	height: 16px;
	padding-top: 5px;
	padding-left: 5px;
}

.contextNavigationLink a:hover,
.contextNavigationLink a:focus:hover {
	height: 15px;
	padding-left: 5px;
	padding-top: 4px;
    border-left: white solid 2px;
    border-top: white solid 2px;
    border-right: lightgrey solid 2px;
    border-bottom: lightgrey solid 2px;
}

.contextNavigationLink a:active,
.contextNavigationLink a:focus {
    border-left: lightgrey solid 2px;
    border-top: lightgrey solid 2px;
    border-right: white solid 2px;
    border-bottom: white solid 2px;
}

.sideNavHeader a {
	width: 170px;
}

.sideNavHeader {
	text-align:justify;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 10px;
	padding: 8px 0px 4px 8px;
	height: 20px;
	border-bottom: solid 1px #6699CC;
}
.sideNavHeader a:link {color: #003399; text-decoration: none; }
.sideNavHeader a:visited {color: #000000; text-decoration: none; }
.sideNavHeader a:hover {color: #003399; text-decoration: none; }
/*Side Navigation - ends here */

/*Content Area - begins here */
#contentArea {
	float: left;
	width: 824px;
	font-size: 12px;
	text-align: left;
	line-height: 15px;
	border-left: solid 2px #003399;
}

#contentArea h2 {
	font-weight: bold;
	font-size: 15px;
}

/* Generic CSS for Content Area - begins here */
#pageTitle { 
	font-size: 12pt;
	font-weight: bold;
	padding-bottom: 15px;
}

#contentAreaBody {
	margin-left: 15px;
}

#contentAreaBody ul {
	list-style-type: disc;
	padding-left: 20px;
}

#contentAreaBody a {
	color: #003399;
}

.genericContentAreaBody {
	margin-right: 130px;
}

.bullet {
	background-image:url(/images/bullet.GIF);
	width: 6px;
	height:6px;
	margin-left: 7px;
}

#contactUs {
	float: left;
	width: 100%;
	padding-top: 15px;
}

#contactUsInclude {
	padding-top: 10px;
}

#contactUsConfirmNote {
	padding: 100px 0px 130px 50px;
}

/*#breadcrumbs {
	font-size: 8pt;
	text-align: left;
}*/
/* Generic CSS for Content Area - ends here */

/*CSS for Home Page Content Area - begins here */
.homePageContentAreaBody {
	margin-right: 240px;
}

.homePageContentAreaRightCol {
	font-size: 11px;
	width: 220px;
	padding: 4px 0px 0px 0px;
}

.headingRightColumn {
	font-size: 11px;
	font-weight: bold;
	margin-bottom: 5px;
}

#contentAreaRightCol {
	float: right;
}

#contextImages {
}

#contextAnimation {
	padding-left: 15px;
	padding-bottom: 15px;
 	background-repeat: no-repeat;
}

/* This CSS code is used for creating Thumbnail section on Home Page - begins here */
#homePageOverviewText {
	padding-right: 5px;
}

#contextImages {
	padding-top: 25px;
}

#bizLines {
	float: left;
	width: 45%;
}

.thumbnail {
	padding-right: 10px;
	float: left;
}

.thumbnailText {
	text-align: left;
}

#projectMap {
	padding-left: 15px;
	float: left;
}

.thumbnailHeading {
	font-size: 11px;
	font-weight: bold;
	color: #000000;
	padding-bottom: 5px;
}
/* This CSS code is used for creating Thumbnail section on Home Page- Ends here */
/*CSS for Home Page Content Area - ends here */

/* Middle Page - ends here */

/* Bottom Page - begins here */
#bottomPage {
	float: left;
	width: 100%;
	padding-top: 20px;
}
#footerLinks {
	text-align: center;
	font-size: 10px;
	padding-top: 10px;
	font-weight: normal;
	color: #000000;
}
#footerLinks a:link {color: #000000; text-decoration: none; }
#footerLinks a:visited {color: #660033; text-decoration: none; }
#footerLinks a:hover {color: #003399; text-decoration: none; }
/* Bottom Page - ends here */

/* CSS for aboutUs begins here */
.aboutUsContentAreaBody {
	margin-right: 20px;
}

#aboutUsSubsections {
	padding: 10px 0px 20px 0px;
}

.aboutUsSubsection {
	padding: 20px 0px 10px 0px;
}

.aboutUsSubsection ul {
	padding: 0px 0px 0px 20px;
	list-style-type: disc;
}

.aboutUsSubsectionContent {
	padding: 20px 0px 0px 25px;
}

#coreBusiness {
	padding: 30px 0px 0px 0px;
}

#coreBusiness ul {
	padding: 0px 0px 0px 20px;
	list-style-type: disc;
}

.aboutUsImage {
	float:right;
	padding: 0px 0px 10px 30px;
}
/* CSS for aboutUs begins here */

/* CSS for projectDiagram begins here */
.projectDiagramContentAreaBody {
	margin-right: 0px;
}
/* CSS for projectDiagram ends here */

/* CSS for staff begins here */
.staffSubsection {
	width: 100%;
}

.staffBioText {
	float: right;
	width: 530px;
	/* note : b/c the bio image is float right, to move it left, the amount of padding-right must be increased */
	padding: 0px 35px 40px 0px;
}

.staffImage {
	float: left;
}
/* CSS for staff ends here */

.onSiteList {
	padding: 0px 0px 10px 55px;
}

#onSiteRangeOfServices {
	float: left;
	width: 100%;
	padding: 0px 0px 10px 0px;
}

#onSiteSystemsListLeft {
	width: 30%;
	float: left;
	padding-left: 40px;
}

#onSiteSystemsListRight {
	width: 30%;
	float: left;
}
/* CSS for staff ends here */

/* CSS for contactUs begin */
#contactUsTop {
	width: 100%;
	height: 160px;
}

#contactUsContent {
	padding-top: 15px;
	width: 675px;
}

fieldset {
	padding-top: 15px;
	padding-bottom: 5px;
	margin-left: 10px;
	border: 1px solid #003399;
}

legend {
	padding: 0.2em 0.5em;
	border: 1px solid #003399;
	font-size: 90%;
	text-align: right;
}

label {
	float:left;
	width:25%;
	margin-right:0.5em;
	padding-top:0.2em;
	text-align:right;
	font-weight:bold;
}

#contactUsExecutiveContent {
	padding-top: 10px;
}

.contactUsInputData {
	height: 100%;
	float: left;
}

#contactUsBottom {
	width: 100%;
}

#mapLink {
	padding-left: 10px;
}

#contactUsMailingAddress1 {
	float: left;
	padding-top: 30px;
}

#contactUsMailingAddress2 {
	font-weight: bold;
	padding-left: 12px;
	padding-bottom: 10px;
	line-height: 20px;
}

#ourOffice {
	float: right;
}

#contactUsOrEmail {
	padding: 20px 0px 0px 15px;
}

#contactUsMessage {
	width: 100%;
}

#contactUsPhoneAndCompany {
	padding-top: 30px;
}

.contactUsmailingAddress {
	height: 105px;
}

.mailAddress {
	padding-left: 5px;
}

.redFont {
	color: red;
}

.contactUsButton {
	float: left;
	padding: 5px 10px 0px 0px;
}

.executiveSubmitRow {
	height: 120px;
}

#contactUsSubmitRow {
	padding: 0px 0px 40px 176px;
}

/* CSS for contactUs end */

/*CSS for Line Of Business Content Area Pages - begins here */
.lobLandingPageContainer {
	padding: 10px 0px 10px 0px;
	width: 100%;
	height: 82px;
}

.lobLandingPageImage {
	float: left;
	width: 15%;
}

.lobLandingPageText {
	padding-top: 10px;
	float: right;
	width: 85%;
}

.lobImage {
	float: right;
	padding: 0px 0px 10px 10px;
}

.lobContentAreaRightCol {
	width: 200px;
}

.lobContentAreaBody {
	margin-right: 235px;
}

.homePageContentRightColOutsideShadowContainer {
	padding-bottom: 5px;
}

.homePageContentRightCol {
	font-size: 11px;
	padding: 10px 10px 30px 10px;
	background-color: #ffffff;
	border: solid 1px #666666;
}

#homePageSubHeader {
	font-size: 12pt;
	font-weight: bold;
	padding-bottom: 20px;
	margin-top: -30px;
	padding-left: 165px;
}

/* This is the CSS code for creating a Drop Shadow using images- Begin here */
.wrap1 {
	background:url(/images/shadow.gif) right bottom no-repeat;
}
.wrap2 {
	background:url(/images/corner_bl.gif) -4px 100% no-repeat;
}
.wrap3 {
	padding:0 8px 8px 0;
	background:url(/images/corner_tr.gif) 100% -4px no-repeat;
}
/* This is the CSS code for creating a Drop Shadow using images - end here */

#priorityLineOfBusinessCustomersHeading {
	font-size: 12px;
	font-weight: bold;
	color: #ffffff;
	padding: 4px 0px 4px 20px;
}

#priorityLineOfBusinessCustomers {
	padding: 15px 10px 15px 10px;
	text-align: left;
	line-height: 30px;
	list-style: none;
	background-color: #ffffff;
}

#priorityLineOfBusinessCustomers ul li {
	font-weight: bold;
}
	
#moreProjects {
	line-height: 40px;
	font-weight: bold;
	margin-left: 55px;
}
	

/* If these border properties (minus the color) are moved to priorityLineOfBusinessCustomers div id 
	selector section then the border colors don't appear in mozilla.  (It works fine in IE that way,
	but both work with the settings here.)
*/
.onsiteLOBRightColBorder {
	border: solid 2px #0099CC;
}

.petcokeLOBRightColBorder {
	border: solid 2px #009999;
}

.pulpPaperLOBRightColBorder {
	border: solid 2px #066699;
}

.steelLOBRightColBorder {
	border: solid 2px #339966;
}

.powerAndRenewablesLOBRightColBorder {
	border: solid 2px #006666;
}

/* All customers popup bottom border color */
.onsiteLOBPopupBottomBorder {
	border-bottom-color: #3399CC;
}

.petcokeLOBPopupBottomBorder {
	border-bottom-color: #009999;
}

.pulpPaperLOBPopupBottomBorder {
	border-bottom-color: #066699;
}

.steelLOBPopupBottomBorder {
	border-bottom-color: #339966;
}

.powerAndRenewablesLOBPopupBottomBorder {
	border-bottom-color: #006666;
}

/* All customers hover styles for subsections */
.onsiteLOBLink a:hover {
	color: #3399CC;
}

.petcokeLOBLink a:hover {
	color: #009999;
}

.pulpPaperLOBLink a:hover {
	color: #066699;
}

.steelLOBLink a:hover {
	color: #339966;
}

.powerAndRenewablesLOBLink a:hover {
	color: #006666;
}

.customerPopupLink a {
	font-weight: normal;
	padding-left: 5px;
	color: #000000;
	text-decoration: none;
	font-size: 12px;
	line-height: 30px;
}

/* To provide the "popup" mouseover functionality, the technique outlined at 
	http://www.brunildo.org/test/CPop.html was used.  It basically involves nested tags
	and the use of the a:hover feature of css */
.customerPopupLink a:hover {
	clear: both; /* IE */	
}
/* For lob right hand col popup content */
.customerPopupLink a .popupContentLOBCustRightCol {
	position: absolute;
	width: 537px;
	height: 350px;
	top: 130px;
	left: 210px;
}
.customerPopupLink a:hover .popupContentLOBCustRightCol {
	visibility: visible;
}

/* For covering bodycontent that lob right hand col popup content sits on top of */
.customerPopupLink a .popupContentLOBCustRightColBackDropVeil {
	display: block;
	position: absolute;
	padding: 5px;
	z-index: 10; /* IE */
 	visibility: hidden;
 	background-color: #FFFFFF;
	width: 595px;
	height: 1000px;
	top: 125px;
	left: 180px;
}

.customerPopupLink a:hover .popupContentLOBCustRightColBackDropVeil {
	visibility: visible;
}

/* for all customers ... page */
#lobAllCustomersPageHeader {
	padding-top: 15px;
	padding-left: 220px;
	height: 35px;
	font-size: 12px;
	font-weight:bold;
}

.allCustomers li {
	list-style: none;
}

#allCustomersRightCol {
	float: right;
	line-height: 25px;
	width: 230px;
}

.popupContent {
	display: block;
	color: #000;
	padding: 5px;
 	border: 4px #EBECE4 solid;
 	position: absolute;
	z-index: 10; /* IE */
	visibility: hidden;
	background-color: #FFFFFF;
}

/* For right col popup on all lob customers window */
.customerPopupLink a .popupContentAllCustomersRightCol {
	width: 542px;
	height: 350px;
	top: 180px;
	left: 190px;
}

.customerPopupLink a:hover .popupContentAllCustomersRightCol {
	visibility: visible;
}

#allCustomersLeftCol {
	float: left;
	line-height: 25px;
	height: 450px;
}

/* For left col popup on all lob customers window */
.customerPopupLink a .popupContentAllCustomersLeftCol {
	width: 542px;
	height: 350px;
	top: 180px;
	left: 395px;
}

.customerPopupLink a:hover .popupContentAllCustomersLeftCol {
	visibility: visible;
}

/* For body of project text within all lob customer popups */
.popupBody {
	position: relative;
	top: 20px;
	padding-top: 10px;
	width: 100%;
	height: 175px;
	border-style: solid;
	border-width: 0px 0px 5px 0px;
	font: 100% Arial, Helvetica, Verdana, sans-serif;
	text-align: left;
}

#customerName {
	position: absolute;
	top: 39px;
	left: 30px;
	font-size: 150%;
	color: white;
}

.label {
	font-weight: bold;
	position: absolute;	
	left: 42px;
}

.data {
	position: absolute;	
	left: 152px;
	padding-right: 42px;
}	

.location {
	top: 10px;
}

.inService {
	top: 23px;
}

.project {
	top: 50px;
	line-height: 1.25;
}

/* end lob customer popup section */
/* CSS for Line Of Business Content Area - ends here */

/* CSS for careers starts here */
#employeeBenefitIntro {
	padding-bottom: 15px;
}

#careerIntroText {
	padding-bottom: 15px;
}

#careerLeftCol {
	padding-left: 20px;
	float: left;
	width: 210px;
}

#careerRightCol {
	float: left;
	padding-left: 20px;
	width: 210px;
}

#careersJoinTheTeam {
	float: left;
	width: 100%;
}

.careerImage {
	float: right;
	padding: 0px 0px 10px 10px;
}

/* CSS for careers ends here */

/* Google Search Page CSS begins here */
#searchPage{
	float:left;
	width: 75%;
}

#googlePageTitle {
	font-size: 12px;
	font-weight:bold;
	padding-left: 15px;
}

#googleSearchPage {
	float:left; 
	font-size: 10pt; 
	padding: 12px;
}

#googleLogo {
	float: right;
	padding: 0px 20px 0px 0px;
}

#googlePageSearchBar {
	float: left;
	width: 50%;
	font-size:12px;
	color: #ffffff;
	background-color:#0066CC;
	padding: 0px 0px 0px 0px;
	margin: 0px 10px 10px 15px;
	text-align: left;
}

#searchResult {
	float: left;
	font-size:12px;
	padding: 10px 0px 10px 0px;
	margin: 0px 10px 0px 15px;
}

.searchResultCached {
	font-size:12px;
	color: green;
}
	
#next {
	text-align: right;
	margin-right: 292px;
}

#resultPageFooter {
	margin-top: 20px;
	text-align: center;
}
/* Google Search Page CSS ends here */

/* CSS for Energy Service - ends here */

#petCokeUL {
	 padding-left: 20px;
}

#petCokeUL li {
	 padding-bottom: 20px;
}

h3 {
	font-weight: bold;
	font-size: 1.1em;
}

#newsroomImage {
	float: right;
}
	padding-bottom: 0;
	padding-left: 0em;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
	padding-right: 100%;
}
ol, ul {
	list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
	vertical-align: top;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

img.backButton {
	float: left;
	margin-top: 50px;
	margin-left: 30px;
}