
@font-face {
  font-family: 'Quicksand';
  src: url('fonts/quicksand-regular-webfont.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('fonts/quicksand-regular-webfont.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'SinkinSans';
  src: url('fonts/SinkinSans-300Light-webfont.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('fonts/SinkinSans-300Light-webfont.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'Bebas';
  src: url('fonts/BEBAS-webfont.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('fonts/BEBAS-webfont.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

html, body{
	padding: 0px;
	margin: 0px;
	width: 100%;
	background-color: #000;
}

.section{
	width: 100%;
	background-color: red;
}

#section-1{
	height: 100%;
	width: 100%;
	background-color: black;
	background-image: url(images/1_background.jpg);
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
}

#section-1-content{
	height: 300px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: auto;
	margin-bottom: auto;
	position: absolute;


}

#section-1-title{

	
	font: 96px 'Bebas', Fallback, sans-serif;
	color: #ffffff;
	text-shadow: 2px 2px 17px rgba(10,0,0,0.3);
	
}

#section-1-caption{
	font: 36px 'SinkinSans', Fallback, sans-serif;
	color: #ffffff;
	text-shadow: 2px 2px 7px rgba(0,0,0,0.7);

}

#section-1-learn-more{
	background-image: url(images/1_learn.png);
	width: 323px;
	height: 96px;
	margin-top: 10px;

}

#section-1-learn-more:hover{
	cursor: pointer;
}

#section-1-arrow{
	
}

#section-1-arrow:hover{
	cursor: pointer;
}

#section-2{
	height: 200%;
	background-color: #000;
	color: #feffff;
	display: block;
	position: relative;
	

	
}

#section-2-header{
	
	height: 16px;
	width: 100%;
	background: url(images/2_banner.png) repeat-x;
	text-align: center;
	font: xx-large/106px 'Quicksand', Fallback, sans-serif;
	color: #feffff;
}

#section-2-background-container{
	height: 50%;
	width: 100%;
	background-color: orange;
	float: left;
	display: block;
	position: relative;
}

#section-2-background{
	background-color: #ff40ff;
	background-image: url(images/2_background_2.jpg);
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	 height: 100%;
	 width: 100%;
	position: absolute;
	top: 0px;
	display: block;
	float: left;

}

#section-2-background-replace{
	background-color: #4e8f00;
	background-image: url(images/2_background_2_blur.jpg);
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	 height: 100%;
	 width: 100%;
	position: absolute;
	top: 0px;
	display: block;
	float: left;
}

#section-2-title{
	font: 66px 'Quicksand', Fallback, sans-serif;
}

#section-2-content{
	font: 28px 'SinkinSans', Fallback, sans-serif;
	display: block;
	position: relative;
	width: 90%;
}

#section-2-content #p3{
	
}

#section-2-diagram{
	
}

#section-3{
	height: 1020px;
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	display: block;
	position: relative;
	background-color: #feffff;
}

#section-3-background-container{
	height: 1043px;
	width: 100%;
	
	position: absolute;
	top: 0px;
	left:0px;
	
	}

#section-3-background-1{
	height: 225px;
	background-color: black;
	
	background-image: url(images/3_background_gradient.png);
}

#section-3-background-scrolling{
	margin-top: 100px;
	height: 667px;
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	background-image: url(images/3_background_blurred.jpg);
	background-color: #4e8f00;
}

#section-3-content{
	margin-top: 50px;
	width: 100%;
	height: 1043px;
	position: absolute;
	top: 0px;
	left:0px;
	font-size: 20px;
}

#section-3-text{
	margin-left: auto;
	margin-right: auto;
}

#section-3-content-images{
	position: relative;
	background-color: #00fcff;
	width: 100%;
	margin-left: 110px;
	margin-top: 90px;
}

#section-3-content-image-1{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 470px;
	height: 310px;
	background: url(images/3_sreenshot_1.png) no-repeat;
	background-size: 400px;
}

#section-3-content-image-2{
	position: absolute;
	left: 200px;
	top: 110px;
	width: 470px;
	height: 310px;
	background: url(images/3_sreenshot_2.png) no-repeat;
	background-size: 400px;
}

#section-3-content-image-3{
	position: absolute;
	left: 400px;
	top: 220px;
	width: 470px;
	height: 310px;
	background: url(images/3_sreenshot_3.png) no-repeat;
	background-size: 400px;
}

#section-3-title-container{
	width: 658px;
	margin-left: auto;
	margin-right: auto;
}

#section-3-title{
	
		font: 42px 'Bebas', Fallback, sans-serif;
	color: #323232;
	text-shadow: 2px 2px 17px rgba(10,0,0,0.3);
	float: left;
	text-align: center;
}

#section-3-title-small{
	font: 12px 'Bebas', Fallback, sans-serif;
	color: #323232;
	text-shadow: 2px 2px 17px rgba(10,0,0,0.3);
	float: left;
	margin-left: 4px;
}

#section-3-yellow-bubble-container{
	width: 520px;
	height:50px;
	margin-top: 655px;
	margin-left: auto;
	margin-right: auto;
}

#section-4{
	height: 100%;
	 position: relative;
	background-color: #feffff;
	background-color: rgba(0,249,0,0.16);
	background-image: url(images/4_background.jpg);
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
}

#section-4-header{
	font: 38px 'Bebas', Fallback, sans-serif;
	height: 120px;
	width: 100%;
	text-align: center;
	padding-top: 50px;
	color: #feffff;
}

#section-4-container{
	width: 940px;
	height: 540px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	margin-top: 40px;
}

#section-4-text{
	width: 400px;
	height: 300px;
	position: absolute;
	top:50px;
	left:500px;
	position:absolute;
	font: 18px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #feffff;
}

#section-4-yellow-bubble-container{
	width:  505px;
	height: 267px;
	position: absolute;
	top: 20px;
}

#section-5{
	background-color: white;
	height: 500px;
	background-image: url(images/5_background.jpg);
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	 position: relative;
}

#section-5-container{
	width:940px;
	height: 400px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

#section-5-left-container{
	width: 420px;
	height: 400px;
	position: absolute;
	left: 0px;
	top: 150px;
}

#section-5-screenshot{
	-webkit-box-shadow: 12px 12px 29px #555;
box-shadow:         12px 12px 29px #555;
}

#section-5-right-container{
	width: 420px;
	height: 400px;
	position: absolute;
	left: 520px;
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
	color: black;
}

#section-5-title{
	margin-top: 130px;
	font: 36px 'Bebas', Fallback, sans-serif;
	color: #feffff;
}


#section-6{
	background-color: #212121;
	height: 900px;
	background-image: url(images/6_background.jpg);
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	 position: relative;
}

#section-6-title{
	font: 36px 'Bebas', Fallback, sans-serif;
	color: #feffff;
}

#section-6-screenshot{
	margin-top:70px;
}

#section-7{
	background-color: #899199;
	height: 740px;

}

#section-7-container{
	
}

#section-8{
	background-color: #212121;
	height: 600px;
	background-image: url(images/8_background.jpg);
	-webkit-background-size: cover;
	 -moz-background-size: cover;
	 -o-background-size: cover;
	 background-size: cover;
	 position: relative;
}

#section-8-content{
	color: #feffff;
	font: 26px 'SinkinSans', Fallback, sans-serif;	
}

#section-8-enter-your-email-here{
	border-radius: 15px;
	border-width: 2px;
	border-color: #e34269;
	width: 322px;
	height: 65px;
	font-size: large;
	text-align: center;
}


::-webkit-input-placeholder { /* WebKit browsers */
    color:    #e34269;
    font: 20 'Quicksand', Fallback, sans-serif;
}

#section-8-get-started{
	width: 322px;
	height: 112px;
	background: url(images/8_get_started.png) no-repeat;
	margin-left: auto;
	margin-right: auto;
	color: #feffff;
	font: 28px/112px 'Quicksand', Fallback, sans-serif;
}

#section-8-get-started:hover{
	cursor: pointer;
}

#section-8-2{
	height: 560px;
	background-color: white;
	color:    #e34269;
	display: none;
}

#section-8-2-content{
	
}

#section-8-2-yes-please{
	width: 323px;
	height: 118px;
	background-image: url(images/5_yes_please.png);
	margin-left: auto;
	margin-right: auto;
}

#section-5-2-yes-please{
	cursor: pointer;
}
	
/*Thank you page*/	
#section-0{
	height: 100%;
	background-image: url(images/0_background.jpg);
	-webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	
}

#section-0-content{
	font-size: 100px;
	color: #feffff;
}

#section-0-content-2{

	color: #feffff;
}

#section-rainbow{
	
	background-image: url(images/rainbow.jpg);
	-webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	  
	  height: 100%;
	  width: 100%;
	  
}

#section-blue{
	width: 100%;
	height: 250px;
	background-color: #0074b4;
}

#section-red{
	
	background-image: url(images/red.jpg);
	-webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	  
	  height: 100%;
	  width: 100%;
	  
}

/****************************************
	    START CONVENIENCE CLASSES
****************************************/

a.white{
	color: #feffff;
}

div.yellow-bubble{
	background: url(images/0_yellow_bubble.png) no-repeat;
	width: 152px;
	height: 41px;
	font: 14px 'Bebas', Fallback, sans-serif;
	line-height:41px;
	text-align: center;
	color: #000;
}

div.yellow-bubble-thin{
	background: url(images/0_yellow_bubble_thin.png) no-repeat;
	width: 135px;
	height: 41px;
	font: 14px 'Bebas', Fallback, sans-serif;
	line-height:41px;
	text-align: center;
}

p.text{
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

div.down-arrow{
	margin-left: auto;
	margin-right: auto;
	width: 61px;
	height: 28px;
	background: url(images/1_arrow.png) no-repeat;
}

div.down-arrow-wide{
	margin-left: auto;
	margin-right: auto;
	width: 103px;
	height: 28px;
	background: url(images/1_arrow_wide.png) no-repeat;
}

div.box-centered{
	
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	
}

div.content-centered{
	
	text-align: center;
	
}

div.large-text{
	font: x-large/40px 'Quicksand', Fallback, sans-serif;
}

div.medium-text{
	font: 34px 'Quicksand', Fallback, sans-serif;
}

div.lobster{
	font: 'Lobster', Fallback, sans-serif;
}

img.retina{
	width: 100%;
}

div.text-shadow{
	text-shadow: 0px 2px rgba(0,0,0,0.1);
}

div.verticle-align{

	
}

div.trigger{
	height: 40px;
}

div#pp-cfp-root{
	
	font: bold 120px 'SinkinSans', Fallback, sans-serif;
	color: #ffffff;
}

/****************************************
	    END CONVENIENCE CLASSES
****************************************/
