diff --git a/website/source/index.html.erb b/website/source/index.html.erb
index 3317551ac..69cb1913b 100644
--- a/website/source/index.html.erb
+++ b/website/source/index.html.erb
@@ -126,9 +126,9 @@
 						<header>
 							<h4>Terminal</h4>
 							<ul class='shell-dots'>
-								<li></li>
-								<li></li>
-								<li></li>
+								<li class="d1"></li>
+								<li class="d2"></li>
+								<li class="d3"></li>
 							</ul>
 						</header>
 						<div class="terminal-window">
@@ -165,7 +165,7 @@
 						a simple and approachable walkthrough for running Terraform locally.</p>
 				</div>
 				<div class="col-xs-offset-5 col-xs-12 col-sm-6 col-sm-offset-0 right">
-					<a class="outline-btn purple" href="/intro/index.html">Read the intro &#187;</a>
+					<a class="outline-btn" href="/intro/index.html">Read the intro &#187;</a>
 				</div>
 			</div>
 		</div>
diff --git a/website/source/layouts/_footer.erb b/website/source/layouts/_footer.erb
index 19bdc1506..cfa3f96fa 100644
--- a/website/source/layouts/_footer.erb
+++ b/website/source/layouts/_footer.erb
@@ -1,4 +1,5 @@
-<div id="footer">
+<div id="footer-wrap">
+	<div id="footer">
 	<div class="container">
 		<div class="footer-links">
 			<ul class="main-links nav navbar-nav rls-sb">
@@ -22,6 +23,7 @@
 		</div>
 	</div>
 </div>
+</div>
 
 <script src="/javascripts/lib/jquery-2.0.3.min.js"></script>
 <script src="/javascripts/lib/bootstrap.min.js"></script>
diff --git a/website/source/stylesheets/_home.less b/website/source/stylesheets/_home.less
index 3845cb888..5d4a5d052 100755
--- a/website/source/stylesheets/_home.less
+++ b/website/source/stylesheets/_home.less
@@ -23,7 +23,6 @@
 		font-size: 16px;
 		letter-spacing: 1px;
     line-height: 1.5em;
-		color: @consul-gray;
 		font-family: @font-family-lato;
 		font-weight: @font-weight-lato-sb;
 	}
@@ -93,11 +92,18 @@
 	}	
 }
 
+#footer-wrap{
+	background-color: white;
+	padding: 0 0 50px 0;
+}
 
 #footer{
-	background-color: @consul-footer-gray;
-    background: @consul-footer-gray url(../images/consul-footer-logo.png) center center no-repeat;
-    .img-retina("../images/consul-footer-logo.png", "../images/consul-footer-logo@2x.png", 446px, 443px);
+	background-color: white;
+	.skewY(-2deg);
+
+	>.container{
+		.skewY(2deg);
+	}
 
 	.footer-links{
 		margin-bottom: 20px;
@@ -145,7 +151,13 @@
 }
 
 #cta {
-	padding: 130px 0 130px;
+	padding: 180px 0;
+	background-color: @purple;
+	.skewY(-2deg);
+
+	>.container{
+		.skewY(2deg);
+	}
 
 	.intro {
 		.left {
@@ -153,16 +165,16 @@
 		}
 
 		.right {
-			margin-top: 12px;
+			//margin-top: 12px;
 		}
 
 	}
 
 	p{
+		color: white;
 		font-size: 14px;
 		letter-spacing: 1px;
-        line-height: 1.5em;
-		color: @consul-gray;
+    line-height: 1.5em;
 		font-family: @font-family-lato;
 		font-weight: @font-weight-lato-sb;
 	}
@@ -170,7 +182,7 @@
 
 
 	.outline-btn {
-		padding: 8px;
+		padding: 16px 40px;
 		display: inline-block;
 		&:focus {
 	    	outline: 0;
@@ -180,18 +192,20 @@
 
 	a {
 		font-weight: 500;
-	    font-size: 16px;
-	    text-transform: uppercase;
-	    letter-spacing: 3px;
-	    color: @purple;
-	    &:hover {
-	    	text-decoration: none;
-	    }
+    font-size: 24px;
+    text-transform: uppercase;
+    letter-spacing: 3px;
+    color: white;
+    .lato-light();
+
+    &:hover {
+    	text-decoration: none;
+    }
 	}
 }
 
 #demos{
-	padding: 30px 0 60px;
+	padding: 180px 0 60px;
 	background-color: #000;
 	margin-top: -80px;
 	.skewY(-2deg);
@@ -201,23 +215,23 @@
 	}
 
 	.explantion {
-		margin: 40px 0 40px 0;
+		margin: 40px 0 60px 15px;
+		border-left: 8px solid #1e1e1e;
 
 		h2 {
-			font-size: 22px;
-			color: white;
-			text-transform: uppercase;
-			font-family: @font-family-lato;
-			font-weight: @font-weight-lato-xb;
+			margin-top: 0;
+			font-size: 28px;
+			color: lighten(@purple, 5%);
+			.lato-light();
 		}
 
 		p{
+			margin-bottom: 0;
 			font-size: 16px;
 			letter-spacing: 1px;
 	    line-height: 1.5em;
-			color: white;
-			font-family: @font-family-lato;
-			font-weight: @font-weight-lato-sb;
+			color: @gray-light;
+			font-weight: 400;
 		}
 	}
 
@@ -225,7 +239,7 @@
 		margin-bottom: 80px;
 
 		.terminal-item{
-			border-bottom: 1px solid #eaeae;
+			margin-bottom: 120px;
 
 			&.last{
 				border-bottom: none;
@@ -261,6 +275,7 @@
 					position: relative;
 					text-align: center;
 					padding: 3px;
+					background-color: #1e1e1e;
 					border-bottom: 2px solid #1e1e1e;
 
 					h4{
@@ -311,14 +326,14 @@
 					}
 					.txt-p {
 						font-weight: bold;
-						color: lighten(@purple, 15%);
+						color: lighten(@green, 10%);
 					}
 					p{
 						margin-bottom: 2px;
 						white-space: pre-wrap;
 					}
 					.cursor {
-						background-color: @light-purple;
+						background-color: lighten(@purple, %5);
 					}
 				}
 			}
diff --git a/website/source/stylesheets/_variables.less b/website/source/stylesheets/_variables.less
index b19dd8de4..6dcee49d8 100755
--- a/website/source/stylesheets/_variables.less
+++ b/website/source/stylesheets/_variables.less
@@ -18,16 +18,15 @@
 
 @white: 					      #fff;
 @black: 					      #242424;
+@orange:                #e78c5b;
+@blue:                  #5b7fe7;
+@green:                 #5be764;
 @gray-darker: 				  #555;
 @gray: 						      #777;
 @gray-light:   				  #939393;
 @gray-lighter:   			  #979797;
 @red: 						      #dd4e58;
 @red-dark:            	#c5454e;
-@red-darker:            #b03c44;
-@tan:   					      #f0f0e5;
-@consul-gray:				    #909090;
-@consul-footer-gray:		#d7d4d7;
 @purple:   					    #822ff7;
 @light-purple:				  #f7f3f9;
 @btn-color:  				    #4592C5;
diff --git a/website/source/stylesheets/main.css b/website/source/stylesheets/main.css
index 9ca073152..f0a7d5600 100644
--- a/website/source/stylesheets/main.css
+++ b/website/source/stylesheets/main.css
@@ -546,7 +546,6 @@ body.page-sub #header {
   font-size: 16px;
   letter-spacing: 1px;
   line-height: 1.5em;
-  color: #909090;
   font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-weight: 500;
 }
@@ -628,17 +627,24 @@ body.page-sub #header {
 #feature-clone h2 {
   color: white;
 }
-#footer {
-  background-color: #d7d4d7;
-  background: #d7d4d7 url(../images/consul-footer-logo.png) center center no-repeat;
-  background-image: url("../images/consul-footer-logo.png");
-  background-size: 446px 443px;
+#footer-wrap {
+  background-color: white;
+  padding: 0 0 50px 0;
 }
-@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  #footer {
-    background-image: url("../images/consul-footer-logo@2x.png");
-    background-size: 446px 443px;
-  }
+#footer {
+  background-color: white;
+  -webkit-transform: skewY(-2deg);
+  -moz-transform: skewY(-2deg);
+  -ms-transform: skewY(-2deg);
+  -o-transform: skewY(-2deg);
+  transform: skewY(-2deg);
+}
+#footer > .container {
+  -webkit-transform: skewY(2deg);
+  -moz-transform: skewY(2deg);
+  -ms-transform: skewY(2deg);
+  -o-transform: skewY(2deg);
+  transform: skewY(2deg);
 }
 #footer .footer-links {
   margin-bottom: 20px;
@@ -675,24 +681,34 @@ body.page-sub #header {
   }
 }
 #cta {
-  padding: 130px 0 130px;
+  padding: 180px 0;
+  background-color: #822ff7;
+  -webkit-transform: skewY(-2deg);
+  -moz-transform: skewY(-2deg);
+  -ms-transform: skewY(-2deg);
+  -o-transform: skewY(-2deg);
+  transform: skewY(-2deg);
+}
+#cta > .container {
+  -webkit-transform: skewY(2deg);
+  -moz-transform: skewY(2deg);
+  -ms-transform: skewY(2deg);
+  -o-transform: skewY(2deg);
+  transform: skewY(2deg);
 }
 #cta .intro .left {
   text-align: right;
 }
-#cta .intro .right {
-  margin-top: 12px;
-}
 #cta p {
+  color: white;
   font-size: 14px;
   letter-spacing: 1px;
   line-height: 1.5em;
-  color: #909090;
   font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-weight: 500;
 }
 #cta .outline-btn {
-  padding: 8px;
+  padding: 16px 40px;
   display: inline-block;
 }
 #cta .outline-btn:focus {
@@ -700,16 +716,18 @@ body.page-sub #header {
 }
 #cta a {
   font-weight: 500;
-  font-size: 16px;
+  font-size: 24px;
   text-transform: uppercase;
   letter-spacing: 3px;
-  color: #822ff7;
+  color: white;
+  font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 100;
 }
 #cta a:hover {
   text-decoration: none;
 }
 #demos {
-  padding: 30px 0 60px;
+  padding: 180px 0 60px;
   background-color: #000;
   margin-top: -80px;
   -webkit-transform: skewY(-2deg);
@@ -726,28 +744,29 @@ body.page-sub #header {
   transform: skewY(2deg);
 }
 #demos .explantion {
-  margin: 40px 0 40px 0;
+  margin: 40px 0 60px 15px;
+  border-left: 8px solid #1e1e1e;
 }
 #demos .explantion h2 {
-  font-size: 22px;
-  color: white;
-  text-transform: uppercase;
+  margin-top: 0;
+  font-size: 28px;
+  color: #9148f8;
   font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: 700;
+  font-weight: 100;
 }
 #demos .explantion p {
+  margin-bottom: 0;
   font-size: 16px;
   letter-spacing: 1px;
   line-height: 1.5em;
-  color: white;
-  font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: 500;
+  color: #939393;
+  font-weight: 400;
 }
 #demos .terminals {
   margin-bottom: 80px;
 }
 #demos .terminals .terminal-item {
-  border-bottom: 1px solid #eaeae;
+  margin-bottom: 120px;
 }
 #demos .terminals .terminal-item.last {
   border-bottom: none;
@@ -775,6 +794,7 @@ body.page-sub #header {
   position: relative;
   text-align: center;
   padding: 3px;
+  background-color: #1e1e1e;
   border-bottom: 2px solid #1e1e1e;
 }
 #demos .terminals .terminal-item .terminal header h4 {
@@ -820,14 +840,14 @@ body.page-sub #header {
 }
 #demos .terminals .terminal-item .terminal .terminal-window .txt-p {
   font-weight: bold;
-  color: #ae79fa;
+  color: #87ee8e;
 }
 #demos .terminals .terminal-item .terminal .terminal-window p {
   margin-bottom: 2px;
   white-space: pre-wrap;
 }
 #demos .terminals .terminal-item .terminal .terminal-window .cursor {
-  background-color: #f7f3f9;
+  background-color: #NaNNaNNaN;
 }
 #demos .terminals .terminal-item .feature-bullets {
   list-style-type: none;