@charset "UTF-8";
/* CSS Document */


/* Reset 
--------------------------------------------------------------------------------------------------- */
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, caption {
	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;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

table, caption, tbody, tfoot, thead, tr, th, td {
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}

a img {border: none;}

a {text-decoration: none; font-weight: inherit;}

/* Fixes Mozilla 1 px left issue on flash
--------------------------------------------------------------------------------------------------- */

html>/**/body, x:-moz-any-link, x:default { position:relative; left:-0.5px; }

/* Fonts
--------------------------------------------------------------------------------------------------- */

@font-face {
    font-family: 'RockwellRegular';
    src: url('/css/fonts/rockwell-webfont.eot');
    src: url('/css/fonts/rockwell-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/rockwell-webfont.woff') format('woff'),
         url('/css/fonts/rockwell-webfont.ttf') format('truetype'),
         url('/css/fonts/rockwell-webfont.svg#RockwellRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'RockwellBold';
    src: url('/css/fonts/rockwellbold-webfont.eot');
    src: url('/css/fonts/rockwellbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/fonts/rockwellbold-webfont.woff') format('woff'),
         url('/css/fonts/rockwellbold-webfont.ttf') format('truetype'),
         url('/css/fonts/rockwellbold-webfont.svg#RockwellBold') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* Begin Main CSS
--------------------------------------------------------------------------------------------------- */

body {
	background: #fa0202;
	color: #414042;
	font: normal 1em/1em Arial, Helvetica, sans-serif;
	height: 100%;
}

#headerWrapper {
	background: url(gfx/fullHeaderBg.jpg) repeat-x top left;
  height: 148px;
}

#header {
	height: 131px;
	width: 960px;
	margin: 0 auto;
	position: relative;
}

#logo {
	position: absolute;
	top: 65px;
	left: 0;
	width: 737px;
	height: 60px;
  overflow: hidden;
}

#logo a {
	text-indent: -999px;
	width: 100%;
	height: 100%;
	display: block;
	background: url(gfx/logo.png) no-repeat left top;
}


/*** Superfish ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			164px; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			1.85em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			-13.3em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			-13.3em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			right;
	margin-top: 10px;
}

.sf-menu li {
	font-size: 12px;
	line-height: 1.2em;
}

.sf-menu li li {font-size: 1em;}

.sf-menu a {
	padding: 		4px 8px;
	text-decoration:none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#fff;
}
.sf-menu li {
	background:		#b7b6b6;
}

.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#ff0000;
	outline:		0;
}

#nav-learn-about-tar-sands {margin-left: 4px; width: 156px;}

#nav-learn-about-tar-sands a {background: url(gfx/downArrow.gif) no-repeat right center; padding-right: 18px;}

#nav-learn-about-tar-sands {padding-right: 8px;}

#nav-learn-about-tar-sands, #nav-learn-about-tar-sands li {background: #ff0000;}

#nav-learn-about-tar-sands li a {background-image: none; padding-right: .7em;}

#nav-learn-about-tar-sands li:hover, #nav-learn-about-tar-sands li.sfHover, #nav-learn-about-tar-sands li a:focus, #nav-learn-about-tar-sands li a:hover, #nav-learn-about-tar-sands li a:active {background-color: #b7b6b6;}

li#nav-twitter, li#nav-facebook {
  background: none; 
	width: 24px; 
	height: 24px;
  margin-left: 5px;
}

li#nav-twitter a {
	width: 24px;
	height: 24px;
	display: block;
	text-indent: -999px;
	overflow: hidden;
	background: url(gfx/Twitter_24x24.png) no-repeat left top;
	padding: 0;
}

li#nav-facebook a {
	width: 24px;
	height: 24px;
	display: block;
	text-indent: -999px;
	overflow: hidden;
	background: url(gfx/FaceBook_24x24.png) no-repeat left top;
	padding: 0;
}



/* Home Slider
---------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------- */

#sliderWrapper {
	height: 405px;
	background: url(gfx/sliderBg.jpg) repeat-x left top #fff;
	overflow: hidden;
}

.slide {
	width: 960px;
	float: left;
	position:relative;
}

/* original slider 
.slide img {
  float: left;
	width: 551px;
}
*/

/* remove items between here and bottom for original */

.videoSliderImage, .sliderImage {
	float: left;
	position: relative;
	top: 80px;
}

.videoSliderImage span {
	width: 64px;
	height: 64px;
	text-indent: -999px;
	overflow: hidden;
	background: url(gfx/play-button.png) no-repeat left top;
	position: absolute;
	left: 193px;
	top: 103px;
}

/* remove items between here and top for original */

.staticSlide .slideContent p {
	font: 20px/1.2em RockwellRegular,Garmond,Times,serif
}

.slideContent {
	width: 380px;
	float: right;
	margin-right: 30px;
	margin-top: 68px;
	display: inline;
	position: relative;
}

.slideContent .quote {
	font: normal 28px/1.2em RockwellRegular, Garmond, Times, serif;
	margin-bottom: 14px;
}

.slideContent .quoter {
	font: normal 18px/1.2em RockwellRegular, Garmond, Times, serif;
}

.sliderRight {
	cursor: pointer;
	height: 21px;
	background-image: url(gfx/iconSprites.png);
	background-repeat: no-repeat;
	background-position: 0 -28px;
	display: block;
	font: normal 18px/1em rockwellRegular, Garmond, Times, serif;
	padding: 5px 0 0 35px; 
	color: #ff0000;
	top: 275px;
	position: absolute;
}

.pause {
	cursor: pointer;
	height: 21px;
	background-image: url(gfx/iconSprites_new.png);
	background-repeat: no-repeat;
	background-position: 0 -111px;
	display: block;
	font: normal 18px/1em rockwellRegular, Garmond, Times, serif;
	padding: 5px 0 0 35px; 
	color: #ff0000;
	top: 275px;
	left: 100px;
	position: absolute;
}

.pause.paused {background-position: 0 -139px;}

.slide .movieIcon {
	height: 21px;
	width: auto;
	background-image: url(gfx/iconSprites.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	display: block;
	font: normal 18px/1em rockwellRegular, Garmond, Times, serif;
	padding: 5px 0 0 35px; 
	color: #ff0000;
	position: absolute;
	top: 235px;
	left: 0;
	text-indent: 0;
}

.slide .movieIcon:hover {background-position: 0 0px;}

p#sliderFbJoin, p#followdraw {
	width: 411px;
	float: left;
	color: #414042;
	font: normal 34px/157px RockwellRegular, Garmond, Times, serif;
	padding-left: 60px;
	margin: 130px 0 0 20px;
	display: inline;
	background: url(gfx/FaceBook_48x48.png) no-repeat left center;
}

p#followdraw {background: url(gfx/Twitter_48x48.png) no-repeat left center; font-size: 29px;}

p#sliderFbJoin a, p#followdraw a {
	padding-right: 50px;
	background: url(/css/gfx/parenth.gif) no-repeat right center;
	height: 157px;
	display: block;
	color: #414042;
} 

.fb-like-box {
	float: right; 
	padding-top: 80px;
	margin-right: 20px;
	display: inline;
}

#twitterSlideBox {
	float: right;
	padding-top: 80px;
	margin-right: 20px;
	display:inline;
	width: 385px;
}

.sliderControls {
	position: relative;
	top: 350px;
	left: 550px;
}

.fbslide .sliderRight, .twitterslide .sliderRight {
  position: absolute;
  top: 0;
	left: 0;
}

.fbslide .pause, .twitterslide .pause {
  position: absolute;
	left: 100px;
	top:0;
}

.pause:hover {cursor: pointer;}

.twitterslide p {
	font: normal 29px/1.2em RockwellRegular, Garmond, Times, serif;
	color: #414042;
	margin: 20px 0 0 0;
}

.twitterslide p a.red {color: #ff0000;}

.followdraw {
	height: 32px;
	background: url(gfx/Twitter_32x32.png) no-repeat left center;
	display: block;
	font: normal 18px/32px rockwellRegular, Garmond, Times, serif;
	padding-left: 45px; 
	color: #ff0000;
	top: 350px;
	margin-left: 500px;
	position: absolute;
}

.slide a {color: #000;}

.followdraw a {color: #ff0000;}
	
	

/* Content
---------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------- */

#contentWrapper {
  background: url(gfx/sliderBg.jpg) repeat-x left top #fff;
  padding: 50px 0 30px 0;
}

#content {
	width: 960px;
	margin: 0 auto;
}

.videoThumb.six {margin-right: 0;}

#content .videoThumb {margin-bottom: 15px;}

.summary {
	border-bottom: 1px dotted;
	margin-bottom: 20px;
	margin-top: 20px;
}

.more {font-style: italic;}

.more a {text-decoration: underline; color: #414042;}

.indent {margin-left: 20px;}

/* Footer
---------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------- */

#footerWrapper {
	background: url(gfx/footerBg.jpg) no-repeat center top;
	padding: 23px 0 30px 0;
	min-height: 610px;
}

#footer {
	width: 960px;
	margin: 0 auto;
}

#footerVideos {padding-bottom: 40px;}

.videoThumb {
	width: 140px;
	margin-right: 23px;
	float: left;
	-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .7);
  -moz-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .7);
  box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .7);
	height: 117px;
	position: relative;
}

.movieIcon {
	position: absolute;
	background-image: url(gfx/iconSprites.png);
	background-position: 0 -56px;
	overflow: hidden;
	text-indent: -999px;
	width: 27px;
	height: 25px;
	display: block;
	left: 108px;
	top: 86px;
}

.movieIcon:hover {background-position: 0 -83px;}

.yourVoice {
	width: 120px;
	height: 82px;
	float: left;
	position: relative;
	background-color: #f10404;
	font: normal 22px/1.2em rockwellRegular, Garmond, Times, serif;
	padding: 35px 0 0 20px;
	color: #fff;
}

.yourVoice a {color: #fff;}

.bottomColumn {
	width: 280px;
	padding-right: 40px;
	float: left;
}

.bottomColumn h3 a {color: #fff;}

.bottomColumn p {color: #fff;}

.bottomColumn p a {font-weight: bold; color: #fff;}

.bottomColumn p a:hover {text-decoration: underline;}


/* Safecracker
---------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------- */

.SearchVideos {display: none!important;}

.field {margin-bottom: 15px;} 

.field label {
  font: .875em/1.2em Arial, Helvetica, sans-serif; 
	width: 10%;
	padding: 5px 5px 5px 0;
	display: block;
	float: left;
	clear: both;
	line-height: 1;
}

.field input {
	width: 45%;
	padding: 3px;
	background: #ffffff;
	border: 1px solid #666;
	float: left;
	display: block;
	margin-bottom: 5px;
	font: normal .875em/1.2em Arial,Helvetica,sans-serif;
  background: -moz-linear-gradient(top, rgba(213,213,213,1) 0%, rgba(255,255,255,1) 34%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(213,213,213,1)), color-stop(34%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, rgba(213,213,213,1) 0%,rgba(255,255,255,1) 34%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, rgba(213,213,213,1) 0%,rgba(255,255,255,1) 34%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, rgba(213,213,213,1) 0%,rgba(255,255,255,1) 34%); /* IE10+ */
  background: linear-gradient(top, rgba(213,213,213,1) 0%,rgba(255,255,255,1) 34%); /* W3C */
}

.field.video label {width: 20%; margin-top:30px;}

.field input:focus, .textarea textarea:focus, .captcha input:focus {
		background: transparent;
		webkit-box-shadow: 0px 0px 5px 0px #666666;
    -moz-box-shadow: 0px 0px 5px 0px #666666;
    box-shadow: 0px 0px 5px 0px #666666; 
	}
	
p.small {
	font-size: .6em;
	font-style: italic;
	clear: left;
	position: relative;
	left: 11%;
}

p.error {
	color: #ff0000;
	float: left;
	width: 30%;
	margin: 5px 0 0 20px;
}

.video p.error {margin-left: 0;}

.video p.small, .captcha p.small {left: 0;}

.required {color: #ff0000;}

.captcha {
	margin-top: 20px;
}

.captcha label {
  font: .875em/1.2em Arial, Helvetica, sans-serif; 
	width: auto;
	padding: 5px 5px 5px 0;
	display: block;
	float: left;
	margin-bottom: 15px;
	clear: both;
	line-height: 1;
}

.captcha input {
	float: left;
	margin-right: 10px;
}

.submit {margin-top: 50px; clear: both; display: block;}

.textarea label {
	float: none;
	width: auto;
}

.textarea textarea {
	width: 58%;
	padding: 3px;
	background: #ffffff;
	border: 1px solid #666;
	float: left;
	display: block;
	margin-bottom: 5px;
	font: normal .875em/1.2em Arial,Helvetica,sans-serif;
}

.charsRemaining {color: #ff0000;}

/* Galleria Slideshow */

#galleria {width: 500px; float: right; margin-left: 10px; margin-bottom: 10px;}

/* Standard Styles most sites edit as needed
---------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------- */


em, i {font-style: italic;}
strong, b {font-weight: bold;}
.left {float: left; width: auto;}
.right {float: right; width: auto;}
sub {vertical-align: sub; font-size: 50%;}
sup {vertical-align: super; font-size: 50%;}

p {
	font-size: .875em;
	line-height: 1.2em;
	margin-bottom: .6em;
}

h2 {
	font: normal 1.75em/1.2em RockwellRegular, Garmond, Times, serif;
	margin-bottom: .5em;
	color: #414042;
}

h3 {
	font: normal 1.5em/1.2em RockwellRegular, Garmond, Times, serif;
	margin-bottom: .5em;
	color: #fff;
}

#content h3, #content h4, #content h3 a, #content h4 a {color: #414042;}

h4 {
	font: normal .875em/1.2em RockwellBold, Garmond, Times, serif;
	margin-bottom: .5em;
	color: #fff;
}

#content ul {
	padding: 0 10px 1em 20px;
  list-style: outside disc;
}

#content ul ul {padding-bottom: 0;}

#content ol {
	padding: 0 10px 1em 20px;
	list-style: outside decimal;
}

#content ol ol {padding-bottom: 0;}

#content li {
	margin-bottom: .4em;
	line-height: 1.5em;
	font-size: .875em;
}

#content li li {font-size: 1em;}

hr {
	width: 100%;
	display: block;
}

blockquote {
	width: 90%;
	padding: 0px 20px 0 20px;
	border: 1px solid #ff0000;
	border-left: 4px solid #ff0000;
	background-color: #e6e6d8;
	margin-bottom: 20px;
	clear: both;
}

blockquote p {
	margin-bottom: 0;
	padding: 10px 0;
	font-weight: bold;
}

img.left {margin-right: 10px !important;}
img.right {margin-left: 10px !important;}

#searchsite input {float: left; margin-bottom: 20px;}
#searchsite .submit {margin: 0 0 20px 20px;}

tr.resultRowTwo {background-color: #cfcfcf;}

#sitemap {clear: both;}

#sitemap {list-style-type: none; font-weight: bold; padding-left: 0;}
#sitemap ul {list-style-type: disc; font-weight: normal; padding-left: 40px;}
#sitemap ul ul {list-style-type: square; font-weight: normal; padding-left: 40px;}

#content a {color: #000;}

#content a:hover {text-decoration: underline;}

/* Helpers
--------------------------------------------------------------------------------------------------- */

.replTransparent a {
	text-indent: -999999px;
	overflow: hidden;
	display: block;
	height: 100%;
	width: 100%;
}

.replSpan {
 	position:relative;
	font-style: italic;
	overflow: hidden;
}

.replSpan span {
	position: absolute;
	height: 100%;
	width: 100%;
}

/* Clear Fix
--------------------------------------------------------------------------------------------------- */
.clear { clear: both; }

/* new clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */