@charset "utf-8";

/* General */

html, body {
margin: 0;
padding: 0;
}

body {
background: #eaecea;
font-family: helvetica;
}

	body a {
	text-rendering: optimizeLegibility;
	}

#wrapper {
overflow: hidden;
min-width: 800px;
}



a:link, a:visited {
text-decoration: none;
color: #ec3d2f;
padding: 0;
margin: 0;
}

	a:hover { 
	color: #fff;
	}
	
	ul a:link, ul a:visited {
	color: #fff;}
	
	ul a:hover {
	color: #ec3d2f; }
	
em {
color: #ec3d2f;
font-weight: bold;
font-style: normal;
}

ul {
list-style-type: none;
padding: 0;
margin: 0;
text-align: center;
}

hr {
border: 0px; 
height: 1px; 
background: #000;
padding: 0;
margin: 0;
}

img {
border: none;
}


h1, h2, h3, h4, h5 {
padding: 0; 
margin: 0;
text-decoration: none;
text-transform: uppercase;
-webkit-font-smoothing: antialiased;
}

hgroup {z-index: 10;}

		h1 {
		text-align: center;
		font-family: adrianna-extended-1,adrianna-extended-2, sans-serif;
		font-size: 72px;
		color: #fff;
		font-weight: 500;
		letter-spacing: 5px;
		line-height: 72px;
		}
			
		h2 {
		text-align: center;
		font-family:baskerville, caslon, serif;
		color: #111;
		text-transform: none;
		font-weight: 100;
		font-size: 26px; 
		font-style: italic;
		margin: 0 0 10px 0;
		}
	
		h3 {
		position:relative;
		text-align: center;
		font-family: adrianna-extended-1,adrianna-extended-2, sans-serif;
		font-size: 20px;
		color: #111;
		font-weight: 500;
		letter-spacing: 1px;
		}
			
			h3#title {
			font-size: 20px;
			color: #111;
			margin: 70px 0 0 0;
			z-index: 1000;
			}
			
			h3.white {color: #fff;}
		
		h4 {
		text-align: center;
		font-family: adrianna-extended-1,adrianna-extended-2, sans-serif;
		font-size: 20px;
		color: #111;
		font-weight: 500;
		letter-spacing: 1px;
		background: #ec3d2f;
		padding: 10px 20px;
		}
		
section {
padding: 10px 0;
margin: 0;
}

article {
position: absolute;
background: #fff;
padding: 30px;
left: 50%;
text-align: center;
z-index: 900;
}

p { 
font-size: 19px; 
line-height: 26px;
font-family: "ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, Times; 
font-weight: normal;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
}

/*Tokens*/

.icon {
position: absolute;
z-index: 1000;
margin-top:15px;
}

	#icontruck {right: 40px; }
	
	#iconwater {right: 80px; }
	
	#icontoxic {right: 160px; }
	
	#iconfluid2 {right: 120px; }
	
	#iconmethane {left: 40px; }
	
	#iconnowater {left: 80px; }
	
	#iconhealth{left: 120px;}
	
	#iconfluid {left: 160px; }
	
	#iconair {left: 200px; }
	
	#icongas {left: 50%; margin-left: -14px;  }


figure#drop {
position: fixed;
top: 380px;
left: 50%;
margin-left:-36px;
z-index:201;
}

	#toxin {
	width: 36px;
	height: 46px;
	background: url(Fracking/toxin.png);
	position: absolute;
	top: 7500px;
	z-index: 202;
	left: 50%;
	margin-left: -18px;
	}

/* 1. Sky */

section#sky {
background:url(Fracking/noise.png) #79c5ce;
height: 1800px;
width: 100%;
padding: 200px 0 0 0;
position: relative; 
z-index:200;
}

	article#description {
	margin: 300px 0 0 -242px;
	width: 425px;
	border: 1px #fff solid;
	outline: 10px #222 solid;
	background: #222;
	color: #fff;
	}
	
		article#description h3 {color: #fff;}
		
		aside {
		position: relative;
		margin: 50px auto 30px;
		height: 42px;
		width: 350px;
		text-align: center;
		z-index:10;
		}	

	#cloud1 {
	position: absolute;
	top: 350px; 
	right: -20px;
	}
	
	#cloud2 {
	position: absolute;
	top: 500px;
	left: -400px;
	}
	
	#cloud3 {
	position: absolute;
	top: 590px;
	left: -130px;
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	transform: rotate(180deg);}
	
	#cloud4 {
	position: absolute;
	top: 420px;
	right: 50px;}
	
	#cloud5 {
	position: absolute;
	top: 775px;
	right: -300px;}
	
	#cloud6 {
	position: absolute;
	top: 1550px;
	left: 150px;}
	
	#cloud7 {
	position: absolute;
	top: 1050px;
	right: 20px;
	-webkit-transform: rotate(-5deg);
	-ms-transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	transform: rotate(-5deg);}
	
	#cloud8 {
	position: absolute;
	top: 1800px;
	left: 350px;}
	
	#cloud9 {
	position: absolute;
	top: 2500px;
	right: 10px;}
	
	#copy {
	position: relative;
	top: 980px;
	margin:auto;
	}

/* 2.5 Copy */

section#copy {
background:url(img/noise.png) #79c5ce;
height: 100px;
width: 100%;
padding: 20px 0 0 0;
position: relative; 
z-index:200;
}



/* Webkit Hacks  */
@media screen and (-webkit-min-device-pixel-ratio:0) {	
	#tiptip_content {
		padding: 4px 8px 5px 8px;
		background-color: #222;
	}
	#tiptip_holder.tip_bottom #tiptip_arrow_inner { 
		border-bottom-color: #222;
	}
	#tiptip_holder.tip_top #tiptip_arrow_inner { 
		border-top-color: #222;
	}
}

#thumb {display: none;}

</style>