@charset "UTF-8";

/* Lyaout styles start here*/
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	font-size: 14px;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	background: #FFFFFF url(../images/DaylightBkgrd.jpg) no-repeat center top fixed;
	width: 100%;
	min-height: 100px;
/*	height: 500px;*/
	display: table;
/*	background: url(../images/Pixel_Shim.jpg) repeat;*/
	/*background-color: 0e1a42;*/
}
body  h1 {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 24px;
	margin: 20px 0 0 0;
	padding: 0;
	font-weight: bold;
	font-style: italic;
	letter-spacing: -1px;
}
body  h2 {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	margin: 20px 0 0 0;
	padding: 0;
	color: #125476;
	font-weight: bold;
	letter-spacing: -1px;
}
body  h3 {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	margin: 20px 0 0 0;
	padding: 0;
	color: #333333;
	font-weight: bold;
}
.twoColLgSide #bkgrd {
	text-align: center;
	margin: 0;
	padding: 0;
	background: transparent url(../images/topBar.png) repeat-x fixed;
	width: 100%;
	height: 100%;
}
.twoColLgSide #nav_top {
	width: 1014px;
	height: 48px;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	background: transparent url(../images/topBar.png) repeat-x;
	position: fixed;
	left: 0;
	right: 0;
	z-index: 1000;
}
.twoColLgSide #nav_top ul {
	float: right;
	margin: 0;
	padding: 0;
}
.twoColLgSide #nav_top li {
	list-style-type: none;
	display: inline;
	margin: 0;
	padding: 0 20px 10px 12px;
	/*background: url(../images/topNavDivLine.png) no-repeat 1px 65%;*/
	border-right: 1px solid #555;
}
.twoColLgSide #nav_top a {
	color: #333333;
	font-size: 10px;
	font-weight: bold;
	margin: 0;
	padding: 0;
	text-decoration: none;
	position: relative;
	top: 2px;
}
.twoColLgSide #nav_top a:hover {
	color: #008ac3;
}
.twoColLgSide #containerBkgrd {
	width: 1044px;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	background: transparent url(../images/bkgrdShadow.png) repeat-y;
}
.twoColLgSide #containerBottom {
	width: 1044px;
	height: 23px;
	margin: 0 auto;
	padding: 0 0 100px 0;
	/*url to the bottom rounded corner*/
	background: transparent url(../images/bottomShadow.png) no-repeat; 
}
.twoColLgSide #container {
	width: 1004px;
	margin: 0 auto;
	padding: 27px 0 0 0;
	text-align: left; /* this overrides the text-align: center on the body element. */
} 
.twoColLgSide #logo {
	margin: 0;
	padding: 0;
	height: 100px;
}
.twoColLgSide #logo img {
	margin: 0;
	padding: 0;
	border-style: none;
	text-decoration: none; 
}
.twoColLgSide #mainNav {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
}
.twoColLgSide #mainNav ul {
	margin: 0 0 0 -4px;
	padding: 0;
	float: left;
	width: 1012px;
	list-style: none;
	position: relative; /*--Set relative positioning on the unordered list itself - not on the list item--*/
	font-size: 11px;
	font-weight: bold;
	background: url(../images/mainNav_stretch.gif) repeat-x;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-topright: 4px;
	-khtml-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-topleft: 4px;
	-khtml-border-radius-topleft: 4px;
	-webkit-border-top-left-radius: 4px;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 4px;
	-khtml-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 4px;
	-khtml-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
}
.twoColLgSide #mainNav li {
	float: left;
	margin: 0; padding: 0;
	border-right: 1px solid #555; /*--Divider for each parent level links--*/
}
.twoColLgSide #mainNav li a {
	padding: 10px 17px;
	display: block;
	color: #333333;
	text-decoration: none;
}
.twoColLgSide #mainNav li:hover { 
	background: #faf9f9 url(../images/mainNav_active.gif) repeat-x;
	/*--Notice the hover color is on the list item itself, not on the link. This is so it can stay highlighted even when hovering over the subnav--*/
/*--Bottom right rounded corner--*/
	-moz-border-radius-topright: 4px;
	-khtml-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-topleft: 4px;
	-khtml-border-radius-topleft: 4px;
	-webkit-border-top-left-radius: 4px;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 4px;
	-khtml-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 4px;
	-khtml-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
}
.twoColLgSide #mainNav li a:hover {
	color: #008ac3;
}
.twoColLgSide #mainNav li span {
	float: inherit;
	padding: 0;
	position: absolute;
/*	left: 0; top:35px;*/
	display: none; /*--Hide by default--*/
/*	width: 184px;*/
	background: #faf9f9;
	border: 1px solid #bbbbbb;
	color: #f0f0f0;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}
.twoColLgSide #mainNav li:hover span { 
	display: block; /*--Show subnav on hover--*/
 }
.twoColLgSide #mainNav li span a { 
	display: list; /*--Since we declared a link style on the parent list link, we will correct it back to its original state--*/
	/*border-top: 1px solid #666;*/ /*--Divider for each of the sub level links--*/
	padding: 6px 25px;
} 
.twoColLgSide #mainNav li span a:hover {
	display: block;
	text-decoration: none;
	color: #008ac3;
	background: url(../images/subNav_active.gif) repeat-x;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}
.twoColLgSide  #sidebar {
	float: left; /* since this element is floated, a width must be given */
	width: 200px; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 5px 10px 15px 20px;
}
.twoColLgSide #mainContentBkgrd {
	margin-top: -15px;
	background: url(../images/content_Bkgrd.png) repeat-x;
}
.twoColLgSide #mainContent { 
	margin: 48px 40px 40px 60px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 28px 0 10px 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
} 
.twoColLgSide #mainContent a {
	color: #1376c9;
	font-size: 14px;
	text-decoration: none;
}
.twoColLgSide #mainContent a:hover {
	color: #1376c9;
	text-decoration: underline;
}

.twoColLgSide #homeContent a {
	color: #1376c9;
	font-size: 14px;
	text-decoration: none;
}
.twoColLgSide #homeContent a:hover {
	color: #1376c9;
	text-decoration: underline;
}
/*.twoColLgSide .contentAreaBottom {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(../images/contentAreaBottom.png) no-repeat scroll 0 0;
	height: 14px;
	width: 1004px;
}
.twoColLgSide .contentAreaTop {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(../images/contentAreaTop.png) no-repeat scroll 0 0;
	height: 14px;
	width: 1004px;
}
.twoColLgSide .contentAreaBox {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: transparent url(../images/contentAreaMiddle.png) repeat-y scroll 0 0;
	color: #444444;
	padding: 1px 5px 1px 60px;
	width: 1004px;
}*/
.twoColLgSide #homeHeader {
	margin: 33px 0 0 0;
	padding: 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	width: 1004px;
	height: 300px;
	background: url(../images/FPD_Home_Header.jpg) no-repeat; 
} 
.twoColLgSide #homeHeader h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	color: #DDDDDD
}
.twoColLgSide #homeHeader p {
	margin: 0;
	padding: 130px 435px 10px 45px;
}
#flashcontent {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
/*	background: #dad2c5 url(images/Alt_Header_Bkgrnd.jpg) no-repeat;*/
}
.twoColLgSide #servicesNav {
	margin: 0;
	padding: 20px 0 0 0;
	float: left;
	height: 360px; width: 380px;
}
.twoColLgSide #servicesNav ul li {
/*	margin: 0;
	padding: 0;*/
	display: block;
	list-style-type: none;
}
.twoColLgSide #servicesNav ul li a {
	display: block;
	height: 100px; width: 300px;
	background: transparent url(../images/servicesNav.jpg) no-repeat 0 0;
	text-indent: -9009px;
	/*border-style: none;*/
}
.twoColLgSide #servicesNav ul li a:hover {
	background-position: -300px 0;
}
.twoColLgSide #servicesNav ul li#field a {
	background-position: 0 -100px;
	width: 300px;
}
.twoColLgSide #servicesNav ul li#field a:hover {
	background-position: -300px -100px;
}
.twoColLgSide #servicesNav ul li#control a {
	background-position: 0 -200px;
	width: 300px;
}
.twoColLgSide #servicesNav ul li#control a:hover {
	background-position: -300px -200px;
}
.twoColLgSide #home {
	float: left;
	margin: 0;
	padding: 14px 0 20px 0;
	width: 580px;
}
.twoColLgSide #home h1 {
	padding: 0;
}
.twoColLgSide #aboutImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 30px 40px 0;
}
.twoColLgSide #constructionImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 30px 20px 0;
}
.twoColLgSide #constructionVideo {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 20px 20px 0;
	min-height: 400px;
}
.twoColLgSide #fieldImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 30px 20px 0;
}
.twoColLgSide #controlImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 30px 20px 0;
}
.twoColLgSide #projectsImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 20px 20px 0;
}
.twoColLgSide #emissionsImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 30px 20px 0;
}
.twoColLgSide #employmentImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 30px 40px 0;
}
.twoColLgSide #safetyImage {
	float: right;
	margin: 0 0 0 40px;
	padding: 30px 30px 40px 0;
}
.twoColLgSide #contact {
	margin: 0;
	padding: 0;
}
.twoColLgSide #contact h1 {
	margin: 20px 0 0 0;
	padding: 0;
}
.twoColLgSide #contact h2 {
	margin: 20px 0 0 40px;
	padding: 0;
}
.twoColLgSide #contact ul { 
	list-style-type: none;
}
.twoColLgSide #contactImage {
	float: right;
	margin: 0;
	padding: 30px 30px 40px 0;
}
.twoColLgSide #completedProjects {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	/*background:#FFFFFF url(images/listings.jpg) no-repeat scroll 0 0;*/
	font-size: 12px;
	color: #444444;
	float: left;
	width: 945px;
	margin: 10px;
	padding: 20px;
}
.twoColLgSide #completedProjects h1 {
	margin: 0 0 20px 30px;
}
.twoColLgSide #completedProjects .white {
	background-color: transparent;
}
table, th, td {
	border: 2px solid #E2E2E2;
	border-collapse: collapse;
}
table {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: url(../images/tableTop.gif) repeat-x scroll 0 0;
	border-color: #000000 -moz-use-text-color;
	border-style: solid none;
	border-width: 1px medium;
	width: 945px;
}
th {
	color: #EEEEEE;
	font-size: 90%;
	padding: 5px 10px;
	text-align: left;
	font-variant: small-caps;
	/*text-transform: smallcaps;*/
}
td {
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	background: #FFFFFF none repeat scroll 0 0;
	padding: 5px 10px;
}
tr.d0 td {
	background-color: #FFFFFF;
}
tr.d1 td {
	background-color: #EEEEEE;
}
.twoColLgSide #completedContentBkgrd {
	margin: 33px 0 0 0;
	padding: 18px 0 0 0;
	background: url(../images/content_Bkgrd.png) repeat-x;
}
.twoColLgSide #RASIabilities {
	width: 1004px;
	margin: 0;
	padding: 0;
}
.twoColLgSide #RASIabilities h3 {
	text-align: left;
	font-size: 11px;
	color: #333333;
	margin: 0;
	padding: 30px 0 0 40px;
}
.twoColLgSide #RASIabilities ul {
	float: left;
	margin: 0;
	padding: 0 0 0 40px;
}
.twoColLgSide #RASIabilities li {
	list-style-type: none;
	font-size: 10px;
	margin: 0;
	padding: 0;
	/*background: url(../images/topNavDivLine.png) no-repeat 1px 65%;*/
	text-align: left;
}
.twoColLgSide #RASIabilities a {
	color: #AAAAAA;
	font-size: 10px;
	line-height: 1em;
	font-weight: bold;
	margin: 0;
	padding: 0;
	text-decoration: none;
}
.twoColLgSide #RASIabilities a:hover {
	color: #0ed80e;
}
.twoColLgSide #RASIabilities01 {
	float: left;
	width: 240px;
	margin: 0;
	padding: 0;
}
.twoColLgSide #RASIabilities02 {
	float: left;
	width: 240px;
	margin: 0;
	padding: 0;
}
.twoColLgSide #RASIabilities03 {
	float: left;
	width: 240px;
	margin: 0;
	padding: 0;
}
.twoColLgSide #RASIabilities04 {
	float: left;
	width: 226px;
	margin: 0;
	padding: 0 0 60px 0;
}
.twoColLgSide #footer {
	margin: 0 auto;
	padding: 0;
	width: 1004px;
	position: relative;
	background: url(../images/footerBkgrd.gif) repeat-x scroll 0 0;
	background-color:#666666
} 
.twoColLgSide #footerMap {
	margin: 0;
	padding: 20px 10px 20px 20px;
}
.twoColLgSide #footerMap h3 {
	text-align: left;
	font-size: 12px;
	color: #f0f0f0;
	margin: 0;
	padding: 0 0 0 68px;
}
.twoColLgSide #footerMap ul {
	float: left;
	margin: 0;
	padding: 0 0 0 80px;
}
.twoColLgSide #footerMap li {
	list-style-type: none;
	margin: 0;
	padding: 0;
	/*background: url(../images/topNavDivLine.png) no-repeat 1px 65%;*/
	text-align: left;
}
.twoColLgSide #footerMap a {
	color: #BABABA;
	font-size: 10px;
	line-height: 1em;
	font-weight: bold;
	margin: 0;
	padding: 0;
	text-decoration: none;
}
.twoColLgSide #footerMap a:hover {
	color: #f0f0f0;
}
.twoColLgSide #footerMap1 {
	float: left;
	width: 240px;
	margin: 0;
	padding: 0;
}
.twoColLgSide #footerMap2 {
	float: left;
	width: 240px;
	margin: 0;
	padding: 0;
}
.twoColLgSide #footerMap3 {
	float: left;
	width: 240px;
	margin: 0;
	padding: 0;
}
.twoColLgSide #footerMap4 {
	float: left;
	width: 250px;
	margin: 0;
	padding: 0 0 40px 0;
}
.twoColLgSide #footerBottom {
	margin: 0;
	padding: 0 0 20px 0;
}
.twoColLgSide #footerBottom p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 5px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	text-align: center; 
	font-size: 10px;
	line-height: 1em;
	color: #CCCCCC;
}
.twoColLgSide #footerBottom h3 {
	text-align: center;
	font-size: 11px;
	line-height: 1.2em;
	color: #f0f0f0;
	margin: 0;
	padding: 0;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear: both;
    height: 0;
    font-size: 1px;
    line-height: 0px;
}