/*------------------------------------------------------------------
[Master Stylesheet]

Project:	RigEye Services
Version:	1.0
Last change: 9/17/2008
Created by:	Matt Crest, Artletic.com

-------------------------------------------------------------------

[Color codes]

Dark grey (text): #333333
Dark Blue (headings, links) #000066
Mid Blue (header) #333399
Light blue (top navigation) #CCCCFF
Mid grey: #666666

[Typography]

Body copy:		1.2em/1.6em Verdana, Helvetica, Arial, Geneva, sans-serif;
Headers:		2.7em/1.3em Helvetica, Arial, "Lucida Sans Unicode", Verdana, sans-serif;
Input, textarea:	1.1em Helvetica, Verdana, Geneva, Arial, sans-serif;
Sidebar heading:	1.5em Helvetica, Trebuchet MS, Arial, sans-serif;

Notes:	decreasing heading by 0.4em with every subsequent heading level
-------------------------------------------------------------------

[Table of contents]

1. Reset Styles
2. Utilities
3. Aesthetics / #content
		3.1. Headers / h1, h2, h3
		3.2. Links / a:link
		3.3. Navigation / #nav
		3.4. Footer / #footer
		3.5. Form Elements / form
		3.6. Text / p, blockquotes
4. Structure & Layout

5. Page Specific / 


------------------------------------------------------------------*/

/*----------------
 1. RESET STYLES - courtesy of Eric Meyer
 ---------------*/
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 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
	font-size: 62.5%;
	font-family: Verdana, Geneva, sans-serif;
}
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;
}
blockquote:before, blockquote:after,
q:before, q:after {
}
blockquote, q {
	quotes: "" "";
}
 
/*----------------
 2. UTILITIES (common classes for removing margins, padding, floating, clearing, aligning text, etc)
---------------*/
 .clearer {
 	clear: both;
 }
 
/*----------------
 3. AESTHETICS
---------------*/
	 
	 /* --- 3.1 HEADERS --- */
	 
	 h1 {
	 
	 }
	 h2 {
	 	font-size: 2em;
		text-transform: uppercase;
		font-weight: bold;
		color: #934514;
		margin: 1.8em 0 .6em 0;
	 }
	 .secondColSmall h2 {
		margin-top: 0; 
	 }
	 h3 {
	 	font-size: 1.8em;
		color: #426b26;
		font-weight: normal;
	 }
	 h4 {
	 
	 }
	 
	 
	 /* --- 3.2 LINKS --- */
	 p a:link, p a:visited {
	 	color: #37548d;
		border-bottom: 1px solid;
		text-decoration: none;
	 }
	 p a:hover, p a:active {
	 	background-color: #37548d;
		color: #fff;
		border-bottom: 1px solid #37548d;
		text-decoration: none;
	 }
	 /* dont forget about the nagging img links - probably dont want an underline or border */
	 a:link img, a:visited img { 
	 	border: none;
	 }
	 a:hover img, a:active {
	 
	 }
	 a.membershipLinks {
		margin: 5px auto; 
		display: block;
	 }
	 h3 a:link, h3 a:visited {
		color: #426b26;
		font-weight: normal;
		text-decoration: none;
		border-bottom: 1px solid;
	 }
	 h3 a:hover, h3 a:active {
		background-color: #426b26;
		color: #fff;
		font-weight: normal;
	 }
	 
	 
	 /* --- 3.3 NAVIGATION --- */
	 #newsletterBox {
	 	position: relative;
		top: 0;
		width: 940px;
		margin: 0 auto;
		z-index: 25;
		text-align: center;
	 }
	 #toppanel {
	 	position: absolute;
		top: 0;
		right: 0px;
		width: 400px;
	 }
	 #panel {
	 	width: 400px;
		position: relative;
		top: 0;
		height: 0;
		z-index: 10;
		overflow: hidden;
		text-align: left;
	 }
	 #panel p {
	 	color: #fff;
		font-size: 12px;
		padding: 0 20px;
		margin: 20px auto;
	 }
	 #panel_contents {
		background: #000;
		filter:alpha(opacity=70);
		-moz-opacity:0.70;
		-khtml-opacity: 0.70;
		opacity: 0.70;
		height: 100%;
		width: 400px;
		position: absolute;
		z-index: -1;
	 }
	 form#newsletterForm {
	 	margin: 0 20px;
	 }
	 #newsletterForm input.submit {
	 	padding: 3px 5px;
		margin-left: 10px;
	 } 
	 .panel_button {
		margin: 0 auto 0;
		position: relative;
		top: 0;
		width: 173px;
		height: 35px;
		background: url(../images/panel_button.png) 0 -19px no-repeat;
		z-index: 20;
		filter:alpha(opacity=70);
		-moz-opacity:0.70;
		-khtml-opacity: 0.70;
		opacity: 0.70;
		cursor: pointer;
	}
	.panel_button a {
		text-decoration: none;
		color: #fff;
		font-size: 14px;
		font-weight: bold;
		position: relative;
		top: 5px;
		left: 5px;
		padding-top: 10px;
		font-family: Arial, Helvetica, sans-serif;
	}
	.panel_button a:hover {
		color: #999999;
	}
	.panel_button img{
		position: relative;   
		top: 8px;
		border: none;
	}
	 
	 #logo {
		position: relative;
		top: 40px;
		left: 5px;
	 }
	 ul#nav {
		 list-style:none;
		 width: 668px;
		 height: 50px;
		 position: absolute;
		 top: 0;
		 left: 272px;
		 background: transparent url(../images/navigation.png) no-repeat 0 1px !important;
		 background: transparent url(../images/navigation-ie6.png) no-repeat 0 1px;
	 }
	 #nav li {
		float: left; 
		font-size: 2em ;
		font-family: Verdana, Geneva, sans-serif;
	 }
	 #nav li a:link, #nav li a:visited {
    	position: absolute;
    	top: 0;
    	height: 50px;
		line-height: 50px;
    	text-indent: -9000px;
    	overflow: hidden;
		text-decoration: none;
	}
	
	#nav .navHome a:link, #nav .navHome a:visited {
        left: 0;
        width: 94px;
    }
	#nav .navHome a:hover, #nav .navHome a:focus {
		background: url(../images/navigation.png) no-repeat 0 -52px !important;
		background: url(../images/navigation-ie6.png) no-repeat 0 -52px;
	}
	#nav .navHome a:active, #home #nav .navHome a:link, #home #nav .navHome a:visited {
		background: url(../images/navigation.png) no-repeat 0 -105px !important;
		background: url(../images/navigation-ie6.png) no-repeat 0 -105px;
	}
	
	#nav .navBenefits a:link, #nav .navBenefits a:visited {
        left: 94px;
        width: 120px;
    }
	#nav .navBenefits a:hover, #nav .navBenefits a:focus {
		background: url(../images/navigation.png) no-repeat -94px -52px !important;
		background: url(../images/navigation-ie6.png) no-repeat -94px -52px;
	}
	#nav .navBenefits a:active, #benefits #nav .navBenefits a:link, #benefits #nav .navBenefits a:visited {
		background: url(../images/navigation.png) no-repeat -94px -105px !important;
		background: url(../images/navigation-ie6.png) no-repeat -94px -105px;
	}
	
	#nav .navHowItWorks a:link, #nav .navHowItWorks a:visited {
        left: 214px;
        width: 173px;
    }
	#nav .navHowItWorks a:hover, #nav .navHowItWorks a:focus {
		background: url(../images/navigation.png) no-repeat -214px -52px !important;
		background: url(../images/navigation-ie6.png) no-repeat -214px -52px;
	}
	#nav .navHowItWorks a:active, #howItWorks #nav .navHowItWorks a:link, #howItWorks #nav .navHowItWorks a:visited {
		background: url(../images/navigation.png) no-repeat -214px -105px !important;
		background: url(../images/navigation-ie6.png) no-repeat -214px -105px;
	}
	
	#nav .navAboutUs a:link, #nav .navAboutUs a:visited {
        left: 387px;
        width: 132px;
    }
	#nav .navAboutUs a:hover, #nav .navAboutUs a:focus {
		background: url(../images/navigation.png) no-repeat -387px -52px !important;
		background: url(../images/navigation-ie6.png) no-repeat -387px -52px;
	}
	#nav .navAboutUs a:active, #aboutUs #nav .navAboutUs a:link, #aboutUs #nav .navAboutUs a:visited {
		background: url(../images/navigation.png) no-repeat -387px -105px !important;
		background: url(../images/navigation-ie6.png) no-repeat -387px -105px;
	}
	
	#nav .navContactUs a:link, #nav .navContactUs a:visited {
        left: 519px;
        width: 149px;
    }
	#nav .navContactUs a:hover, #nav .navContactUs a:focus {
		background: url(../images/navigation.png) no-repeat -519px -52px !important;
		background: url(../images/navigation-ie6.png) no-repeat -519px -52px;
	}
	#nav .navContactUs a:active, #contactUs #nav .navContactUs a:link, #contactUs #nav .navContactUs a:visited {
		background: url(../images/navigation.png) no-repeat -519px -105px !important;
		background: url(../images/navigation-ie6.png) no-repeat -519px -105px;
	}
	 
	 
	 /* --- 3.4 FOOTER --- */
	 #footerBar p {
		 color: #934514;
		 font-size: 1em;
		 padding: 20px 0;
		 line-height: 10px;
	 
	 }
	 	#footerBar p a:link, #footerBar p a:visited {
			color: #934514;
			text-decoration: none;
			border: none;
		}
		#footerBar p a:hover {
			color: #934514;
			text-decoration: underline;
			background: none;
		}
	 
	 
	 
	 /* --- 3.5 FORM ELEMENTS --- */
	 form {
	 
	 }
	 
 	 /* --- 3. TEXT --- */
	small {
		font-size: .8em;
	}
	strong {
		font-weight: bold;	
	}
	strong.highlight {
		font-weight: normal;
		background: #fffbcc;
	}
	em {
		font-style:italic;
	}
	p {
		font-size: 1.4em;
		line-height: 1.4em;
		margin: 1em 0;;
	}
	blockquote {
		background: url(../images/quote-bg.png) no-repeat 0 0;	
		overflow: visible;
		padding: 1px 0 0 20px;
		font-size: 1em;
		line-height: 1.4em;
		font-style: italic;
		margin: 0 0 .5em -20px;
	}
		blockquote .byline {
			font-style: normal;
			font-size: .8em;
			font-weight: bold;
			color: #934514;
		}
	
	p a.learnMore, p a.learnMore:link, p a.learnMore:visited {
		background: url(../images/btn-learn_more.png) no-repeat 0 0;
		display: block;
		margin: 0 auto;
		text-indent: -9999em;
		text-decoration:none;
		width: 103px;
		height: 26px;
		border: none;
	}
	p a.learnMore:hover {
		background: url(../images/btn-learn_more.png) no-repeat 0 -27px;
		border: none
	}
	a#brochure {
		background: url(../images/btn-brochure.png) no-repeat 0 0;
		display: block;
		margin: 0;
		text-indent: -9999em;
		width: 244px;
		height: 75px;
		overflow: hidden;
	}
	a#brochure:hover {
		background: url(../images/btn-brochure.png) no-repeat 0 -75px;
	}
	ul {
		list-style: url(../images/bullet-green.png);
		margin: 0 0 2em 4px;
	}
	li {
		font-size: 1.4em;
		margin: .4em 0 6px 1em;
	}
	 
	 
/*----------------
 4. STRUCTURE & LAYOUT
---------------*/
	.centerBox {
		width: 940px;
		margin: 0 auto;
		/*border: 1px solid #FCF;*/
		position: relative;
	}
	#logoBar {
		position: absolute;
		top: 0;
		width: 100%;
		margin: 0 auto;
		z-index: 99;
	}
	#topBar {
		background: #fff url(../images/topbar-bg.png) repeat-x;
		width: 100%;
		height: 27px;
		position: absolute;
		top: 0;
	}
	#logo {
		position: absolute;
		top: 16px;
		left: 50px;
		z-index: 99;
	 }
	#navBar {
		background: #fff url(../images/navbar-bg.png) repeat-x -4px 0 !important;
		background: #fff url(../images/navbar-bg-ie6.png) repeat-x;
		width: 100%;
		height: 50px;
		z-index: 2;
		position: absolute;
		top: 27px;
	}
	#eventsBar {
		background: #fff;
		position: relative;
		top: 0;
		border-bottom: 1px solid #e6de8a;
		width: 100%;	
		clear: both;
		margin-bottom: 40px !important;
		margin-bottom: 160px;
	 }
	#contentBar {
		background: #fff;
		width: 100%;
		position: relative;
		top: 140px;
		margin-bottom: 40px !important;
		margin-bottom: 160px;
	}
	/* some weird FF bug
	#aboutUs #contentBar, #contactUs #contentBar {
		top: 100px;
	}
	*/
	#footerBar {
		background: #fffbcc;
		border-top: 1px solid #e6de8a;
		width: 100%;
		height: 50px;
		text-align: center;
		position: relative;
		top: 140px !important;
		top: 0;
		margin-top: 40px;
	}
	.firstColBig {
		width: 560px;
		margin: 0 0 0 47px !important;
		margin-left: 23px;
		float: left;
	}
	.secondColSmall {
		width: 300px;
		float: right;
	}
	

/*----------------
 5. PAGE SPECIFIC STYLES
---------------*/
	/* --- HOME PAGE --- */
	#home #topBar {
		background: #fff url(../images/topbar-home-bg.png) repeat-x;
		width: 100%;
		height: 199px;
		position: relative;
	}
	#home #navBar {
		position: relative;
		top: 0px;
	}
	#home #logo {
		position: relative;
		top: 40px;
		left: 5px;
	 }
	 #home #tagline {
		position: absolute;
		top: 53px;
		left: 300px;
	 }
	 
	 #home #contentBar {
		top: 0;
		margin: 40px 0; 
	 }
	 #home #footerBar {
		top: 0 !important; 
	 }
	 #slideBar {
		background: #fffbcc;
		border-top: 1px solid #e6de8a;
		border-bottom: 1px solid #e6de8a;
		width: 100%;
		height: 318px;
		margin: 4px 0 15px;
	}
		#slideBar #slideHolder {
			width: 940px;
			height: 318px;
			overflow: hidden;
		}
		#slideBar .slide {
			width: 940px;
			height: 318px;
			float:left;
			background: #fffbcc;
		}
			#slideBar .slide p {
				font-size: 1.4em;
				line-height: 1.6em;
				margin-top: 15px;
				text-align: center;
			}
		.slide .firstColReg {
			width: 405px;
			margin: 42px 0 0 47px !important;
			margin-left: 23px;
			float: left;
			text-align: center;
		}
		#slideBar .slideImage {
			position: absolute;
			top:0;
			right:0;
		}
	/* --- BENEFITS PAGE --- */
	.benefitBox {
		background: #f7f5e3;
		width: 560px;
		margin: 10px 0;
	}
	.benefitBox img {
		float: left;
		margin: 0 25px 0 0;
	}
	.benefitBox h3 {
		font-style: italic;
		line-height: 1.2em;
		padding: 20px 10px 10px 0;
	}
	#benefits .firstColBig {
		width: 560px;
		margin: 0 !important;
		float: left;
	}
	#benefits .centerBox .centerBox {
		margin-left: 50px;	
	}
	/* --- HOW IT WORKS PAGE --- */
	
	a#uses-office {
		background: url(../images/btn-uses.png) no-repeat 0 0;
		display: block;
		float: left;
		margin: 0 20px 0 0;
		text-indent: -9999em;
		width: 242px;
		height: 75px;
		overflow: hidden;
	}
	a#uses-office:hover {
		background: url(../images/btn-uses.png) no-repeat 0 -75px;
	}
	a#uses-office2 {
		background: url(../images/btn-uses.png) no-repeat 0 0;
		display: block;
		margin: 80px auto 15px;
		text-indent: -9999em;
		width: 242px;
		height: 75px;
		overflow: hidden;
	}
	a#uses-office2:hover {
		background: url(../images/btn-uses.png) no-repeat 0 -75px;
	}
	a#uses-rig {
		background: url(../images/btn-uses.png) no-repeat 0 -153px;
		display: block;
		float: left;
		margin: 0 0 0 15px;
		text-indent: -9999em;
		width: 242px;
		height: 75px;
		overflow: hidden;
	}
	a#uses-rig:hover {
		background: url(../images/btn-uses.png) no-repeat 0 -228px;
	}
	a#uses-rig2 {
		background: url(../images/btn-uses.png) no-repeat 0 -153px;
		display: block;
		margin: 80px auto 15px;
		text-indent: -9999em;
		width: 242px;
		height: 75px;
		overflow: hidden;
	}
	a#uses-rig2:hover {
		background: url(../images/btn-uses.png) no-repeat 0 -228px;
	}
	#rigUsesDiagram {
		position: relative;
		width: 940px;
		margin: 15px 0 80px 0;
	}
	#officeUsesDiagram {
		position: relative;
		width: 940px;
		margin: 0 0 60px 0;
	}
		a#hookRigFloorVideo-office {
			position:absolute;
			top: 155px;
			left: 60px;
			display: block;
			height: 110px;
			width: 225px;
			background: url(../images/rig-diagram-office-floor.png) no-repeat;
			text-indent: -9999em;
			overflow: hidden;
			cursor: pointer;
		}
		a#hookRigFloorVideo-rig {
			position:absolute;
			top: 155px;
			left: 60px;
			display: block;
			height: 110px;
			width: 225px;
			background: url(../images/rig-diagram-rig-floor.png) no-repeat;
			text-indent: -9999em;
			overflow: hidden;
			cursor: pointer;
		}
		a#hookTrailerVideo-office {
			position:absolute;
			top: 105px;
			left: 444px;
			display: block;
			height: 111px;
			width: 222px;
			background: url(../images/rig-diagram-office-trailer.png) no-repeat;
			text-indent: -9999em;
			overflow: hidden;
			cursor: pointer;
		}
		a#hookTrailerVideo-rig {
	position:absolute;
	top: 45px;
	left: 444px;
	display: block;
	height: 140px;
	width: 222px;
	background: url(../images/rig-diagram-rig-trailer.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	cursor: pointer;
	background-image: url(../images/rig-diagram-rig-trailer.png);
		}
		
		a#hookShakerVideo-office {
			position:absolute;
			top: 450px;
			left: 444px;
			display: block;
			height: 100px;
			width: 231px;
			background: url(../images/rig-diagram-office-shakers.png) no-repeat;
			text-indent: -9999em;
			overflow: hidden;
			cursor: pointer;
		}
		a#hookShakerVideo-rig {
	position:absolute;
	top: 455px;
	left: 444px;
	display: block;
	height: 140px;
	width: 231px;
	background: url(../images/rig-diagram-rig-shakers.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	cursor: pointer;
	background-image: url(../images/rig-diagram-rig-shakers.png);
		}
		
		a#hookDerrickVideo-rig {
	position:absolute;
	top: 20px;
	left: 40px;
	display: block;
	height: 124px;
	width: 222px;
	background: url(../images/rig-diagram-office-derrick.png) no-repeat;
	text-indent: -9999em;
	overflow: hidden;
	cursor: pointer;
	background-image: url(../images/rig-diagram-rig-derrick.png);
		}

	/* --- ABOUT US PAGE --- */
		#aboutUs blockquote {
		overflow: visible;
		padding: 1px 0 0 20px;
		font-size: .9em;
		line-height: 1.4em;
		font-style: italic;
		margin: 0 20px 20px 20px;
		color: #444;
	}