@charset "utf-8";
/* CSS Document */
body {
	margin: 0 auto;
	padding: 10px 0 0 0;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	background: #809ab4 url(images/2009_sierra_web_02.jpg) repeat-x;
}

* {
	margin: 0;
	padding: 0;
}

p, h5, h4, h3, h2, h1  { margin-bottom: 15px; }

.photo_right { float: right; margin: 10px 0 10px 10px; }

td { padding: 5px; }

img.service_photo_one { float: left; margin: 0 10px 15px 0; }
img.service_photo_two { float: right; margin: 0 0 15px 10px; }

/* Error Styles */
#notice {
	clear:both;
	border: 2px solid #FF0000;
	color:#FF0000;
	background-color:#FFFFFF;
	margin: 0px 0px 10px 0px;
	padding: 5px;
	text-align:left;
}

#nice_notice {
	clear:both;
	border: 2px solid #006600;
	color:#006600;
	background-color:#FFFFFF;
	margin: 0px 0px 10px 0px;
	padding: 5px;
	text-align:left;
}


/* Layout Styles */

#container {
	width: 950px;
	text-align: left;
	margin: 0 auto;
	padding: 0;
	background: #262626 url(images/container_background.jpg) no-repeat;
}

	#header {
		height: 107px;
		width: 950px;
		position: relative;
		background: #262626 url(images/2009_sierra_web_04.gif) top center no-repeat;
	}
		#header a.login {
			display: block;
			width: 73px;
			height: 33px;
			text-indent: -9999px;
			position: absolute;
			background: url(images/2009_sierra_web_08.gif);
			top: 10px;
			left: 850px;
			z-index: 100;
		}
		
		#header h1 {
			position: absolute;
			top: 10px;
			left: 0;
			width: 276px;
			height: 136px;
		}
			#header h1 a {
				display: block;
				width: 276px;
				height: 136px;
				text-indent: -9999px;
				background: url(images/2009_sierra_web_06.gif);
			}
			
		#header h2 {
			position: absolute;
			width: 329px;
			height: 18px;
			text-indent: -9999px;
			top: 38px;
			left: 309px;
			background: url(images/2009_sierra_web_11.gif);
		}
		
		#header #nav {
			position: absolute;
			width: 631px;
			height: 41px;
			top: 66px;
			left: 309px;
		}
			#header #nav li {
				list-style: none;
				height: 41px;
				float: left;
			}
				#header #nav li a {
					display: block;
					height: 41px;
					text-indent: -9999px;
				}
				
				#header #nav li.home a { background: url(images/2009_sierra_nav_01.gif); width: 76px; }
				#header #nav li.home a:hover { background: url(images/2009_sierra_nav_01.gif) 0 -41px; }
				
				#header #nav li.areas a { background: url(images/2009_sierra_nav_02.gif); width: 154px; }
				#header #nav li.areas a:hover { background: url(images/2009_sierra_nav_02.gif) 0 -41px; }
				
				#header #nav li.clients a { background: url(images/2009_sierra_nav_03.gif); width: 75px; }
				#header #nav li.clients a:hover { background: url(images/2009_sierra_nav_03.gif) 0 -41px; }
				
				#header #nav li.about a { background: url(images/2009_sierra_nav_04.gif); width: 87px; }
				#header #nav li.about a:hover { background: url(images/2009_sierra_nav_04.gif) 0 -41px; }
				
				#header #nav li.jobs a { background: url(images/2009_sierra_nav_05.gif); width: 149px; }
				#header #nav li.jobs a:hover { background: url(images/2009_sierra_nav_05.gif) 0 -41px; }
				
				#header #nav li.contact a { background: url(images/2009_sierra_nav_06.gif); width: 90px; }
				#header #nav li.contact a:hover { background: url(images/2009_sierra_nav_06.gif) 0 -41px; }
				
			
		
		#header h2#services_title { display: none; }
		
		#header #side_nav {
			position: absolute;
			width: 276px;
			height: 380px;
			top: 162px;
			left: 0;
		}
			#header #side_nav li {
				list-style: none;
				height: 41px;
				width: 276px;
				height: 36px;
				float: left;
			}
				#header #side_nav li a {
					display: block;
					width: 276px;
					height: 36px;
					text-indent: -9999px;
				}
				
				#header #side_nav li.drilling a { background: url(images/2009_sierra_nav_side_01.jpg); height: 43px; }
				#header #side_nav li.drilling a:hover { background: url(images/2009_sierra_nav_side_01.jpg) -276px 0; height: 43px; }
				
				#header #side_nav li.workover a { background: url(images/2009_sierra_nav_side_02.jpg); }
				#header #side_nav li.workover a:hover { background: url(images/2009_sierra_nav_side_02.jpg) -276px 0; }
				
				#header #side_nav li.fracture a { background: url(images/2009_sierra_nav_side_03.jpg); }
				#header #side_nav li.fracture a:hover { background: url(images/2009_sierra_nav_side_03.jpg) -276px 0; }
				
				#header #side_nav li.wellsite a { background: url(images/2009_sierra_nav_side_04.jpg); }
				#header #side_nav li.wellsite a:hover { background: url(images/2009_sierra_nav_side_04.jpg) -276px 0; }
				
				#header #side_nav li.engineered a { background: url(images/2009_sierra_nav_side_05.jpg); }
				#header #side_nav li.engineered a:hover { background: url(images/2009_sierra_nav_side_05.jpg) -276px 0; }
				
				#header #side_nav li.high_angle a { background: url(images/2009_sierra_nav_side_06.jpg); }
				#header #side_nav li.high_angle a:hover { background: url(images/2009_sierra_nav_side_06.jpg) -276px 0; }
				
				#header #side_nav li.regulatory a { background: url(images/2009_sierra_nav_side_07.jpg); }
				#header #side_nav li.regulatory a:hover { background: url(images/2009_sierra_nav_side_07.jpg) -276px 0; }
				
				#header #side_nav li.asset a { background: url(images/2009_sierra_nav_side_08.jpg); }
				#header #side_nav li.asset a:hover { background: url(images/2009_sierra_nav_side_08.jpg) -276px 0; }
				
				#header #side_nav li.health a { background: url(images/2009_sierra_nav_side_09.jpg); }
				#header #side_nav li.health a:hover { background: url(images/2009_sierra_nav_side_09.jpg) -276px 0; }
				
				#header #side_nav li.project a { background: url(images/2009_sierra_web_37.jpg); height: 49px; }
				
	#content {
		margin: 0 10px 0 309px;
		width: 630px;
	}
		#content #home_content {
			padding-top: 58px;
			color: #fff;
		}
			#content #home_content #imageslider {
				margin-left: 198px;
				height: 355px;
			}
			
		#content #home_content div.column_one {
			float: left;
			width: 299px;
			background: #262626;
			min-height: 250px;
			position: relative;
		}
		#content #home_content div.column_one a  { color: #0099FF; }
			#content #home_content div.column_one h2 {
				height: 41px;
				width: 299px;
				background: url(images/2009_sierra_web_40.gif);
				text-indent: -9999px;
				margin-bottom: 0;
			}
			#content #home_content div.column_one div { padding: 0 10px 30px 10px; }
			
			#content #home_content div.column_one #oil_prices {
				position: absolute;
				top: 35px;
				left: -300px;
			}
			
		#content #home_content div.column_two {
			float: right;
			width: 299px;
			background: #262626;
			min-height: 250px;
			color: #fff;
		}
		#content #home_content div.column_two a  { color: #0099FF;  }
			#content #home_content div.column_two h2 {
				height: 41px;
				width: 299px;
				background: url(images/2009_sierra_web_42.gif);
				text-indent: -9999px;
				margin-bottom: 0;
			}
			#content #home_content div.column_two div { padding: 0 10px 30px 10px; }
			
			
		#content #sub_content {
			padding-top: 30px;
		}
			#content #sub_content h2 {
				text-indent: -9999px;
				width: 630px;
				height: 37px;
				margin-bottom: 0;
			}
			
			#content #sub_content h2#title_about { background: url(images/titles/about.jpg); }
			#content #sub_content h2#title_contact { background: url(images/titles/contact.jpg); }
			#content #sub_content h2#title_job { background: url(images/titles/jobs.jpg); }
			#content #sub_content h2#title_clients { background: url(images/titles/clients.jpg); }
			#content #sub_content h2#title_areas { background: url(images/titles/areas.jpg); }
			
			#content #sub_content h2#title_drilling { background: url(images/titles/drilling.jpg); }
			#content #sub_content h2#title_workover { background: url(images/titles/workover.jpg); }
			#content #sub_content h2#title_fracture { background: url(images/titles/fracture.jpg); }
			#content #sub_content h2#title_wellsite { background: url(images/titles/wellsite.jpg); }
			#content #sub_content h2#title_engineered { background: url(images/titles/engineered.jpg); }
			#content #sub_content h2#title_high_angle { background: url(images/titles/high_angle.jpg); }
			#content #sub_content h2#title_regulatory { background: url(images/titles/regulatory.jpg); }
			#content #sub_content h2#title_asset { background: url(images/titles/asset.jpg); }
			#content #sub_content h2#title_project { background: url(images/titles/project.jpg); }
			#content #sub_content h2#title_health { background: url(images/titles/health.jpg); }
			
			#content #sub_content h3#title_quick_contact { background: url(images/titles/quick_contact.gif); text-indent: -9999px; width: 590px; height: 37px; }
			
			#content #sub_content_inner {
				background: #FFF;
				padding: 20px 20px 40px 20px;
				min-height: 500px;
			}
			
	#footer {
		clear: both;
		position: relative;
		border-top: 3px solid #666;
		height: 150px;
		color: #CCC;
		background: #000;
	}
	#footer ul li {
		list-style: none;
		float: left;
		margin-right: 20px;
	}
	#footer a {
		color: #fff; 
	}
		#footer ul#footer_nav {
			position: absolute;
			top: 20px;
			left: 20px;
		}
		#footer ul#footer_info {
			position: absolute;
			top: 60px;
			left: 400px;
		}
			
			
/* jQuery Styles */

 #s3slider {
   width: 381px; /* important to be same as image width */
   height: 336px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 381px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

#content li.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
   list-style: none;
   margin-left: 0;
   
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: normal 12px "Trebuchet MS", Arial;
   padding: 10px 13px;
   width: 250px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   top: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}
.s3sliderImage span.top {
	top: 0;
	left: 0;
}
.s3sliderImage span.bottom {
	bottom: 0;
    left: 0;
}
.s3sliderImage span.left {
	top: 0;
    left: 0;
	width: 110px !important;
	height: 333px;
}
.s3sliderImage span.right {
	left: 556px;
	bottom: 0;
	width: 200px !important;
	height: 35px;
	display: none;
}

.clear {
   clear: both;
}
		
		
/* News Styles */


.labelfield{ /*CSS for label field in general*/
color:brown;
font-size: 90%;
}

.datefield{ /*CSS for date field in general*/
color:gray;
font-size: 90%;
}

#example1 li{ /*CSS specific to demo 1*/
margin-bottom: 4px;
}

#example2 div{ /*CSS specific to demo 2*/
margin-bottom: 5px;
}

#example2 div a{ /*CSS specific to demo 2*/
text-decoration: none;
}



code{ /*CSS for insructions*/
color: #666;
}
#example2 .labelfield { display: none; }