better

index.php

@@ -74,52 +74,19 @@
 		</div>
 	</div>
 	
-	<div id="trip" data-20000="top:-150%" data-22000="top:0%;" data-28000="top:-100%;" data-20000="background:rgba(0,0,0,0);" data-23000="background:rgba(130,104,130,.5);">
-		<div class="container">
-			<h4 class="beanie">Trip</h4>
-			<div class="beanie one-third column">
-				<li>provide a party dress</li>
-				<li>bestow outdoor bloody mary's</li>
-				<li>handle their hotel</li>
-				<li>grant them a good laugh</li>
-				<li>facilitate their flights</li>
-			</div>
-			<div class="beanie one-third column">				
-				<li>contribute to cocktails</li>
-				<li>donate a dinner</li>
-				<li>supply some sugary snacks</li>
-				<li>furnish their room w/ flowers</li>
-				<li>cap off a meal with coffee</li>
-				<li>fuel a photography session</li>
-			</div>
-			<div class="beanie one-third column">
-				<li>give them gallery tickets</li>
-				<li>cater the cottage</li>
-				<li>add an event to their itinerary</li>
-				<li>purchase some pretty things</li>
-				<li>entrust some escargot</li>
-				<li>partake in NYC pizza</li>
-				<li>romance them on the rooftop</li>
-			</p>
-		</div>
-	</div>
-	
-	<div id="vows">
-		<div class="easing" data-23000="top:100%" data-24000="top:25%;" data-34000="top:25%;">
-			<div id="bml">
-				<h3>September 27<sup>th</sup>, &nbsp;<span id="year">2014</span>.</h3>	
-			</div>
-			<div class="buy-love">
-				<a id="inline" href="#buy-love"><button>Buy Some Love</button></a>
-			</div>
-		</div>
-	</div>
-	
-	<div id="wish">
-		<div class="easing" data-25000="left:100%" data-26000="left:0%;">
-			<div class="container">
+	<div id="trip" data-20000="top:-150%" data-22000="top:0%;" data-28000="top:-100%;" data-20000="background:rgba(0,0,0,0);" data-27000="background:rgba(130,104,130,.5);">
+		<div class="easing" data-20000="bottom:-250%" data-22000="bottom:0%;">
+				<div id="gform">
 				<?php gravity_form(1, false, false, false, '', true); ?>
-			</div>
+				</div>
+				<div id="heart">&nbsp;</div>
+				<div id="bml">
+					<h3>September 27<sup>th</sup>, &nbsp;<span id="year">2014</span>.</h3>	
+				</div>
+				
+				<div class="buy-love">
+					<a id="inline" href="#buy-love"><button>Buy Some Love</button></a>
+				</div>
 		</div>
 	</div>
 	

style.css

@@ -47,7 +47,7 @@ a img {border: 0;}
 .clear:after,.entry-content:after,.comment-content:after,.site-header:after,.site-content:after,.site-footer:after {clear: both;}
 
 /* #Base 960 Grid ================================================== */
-.container                                  { position: absolute; width: 960px; margin: 0 auto; padding: 0; }
+.container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
 /* Hackety Hack - position needs to be abolute for Skrollr to work right */
 .container .column,
 .container .columns                         { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
@@ -296,4 +296,60 @@ html, body {width:100%;height:100%;padding:0;margin:0;overflow-x:hidden;}
 	border-radius: 4px;
 	cursor: pointer; cursor: hand;
 }
-#inline a button {text-decoration: none !important;}
+#inline a button {text-decoration: none !important;}
+
+#heart {
+    position: relative;
+    width: 100px;
+    height: 90px;
+}
+#heart:before,
+#heart:after {
+    position: absolute;
+    content: "";
+    left: 20px;
+    top: 0;
+    width: 20px;
+    height: 35px;
+    background: red;
+    -moz-border-radius: 20px 20px 0 0;
+    border-radius: 20px 20px 0 0;
+    -webkit-transform: rotate(-45deg);
+       -moz-transform: rotate(-45deg);
+        -ms-transform: rotate(-45deg);
+         -o-transform: rotate(-45deg);
+            transform: rotate(-45deg);
+    -webkit-transform-origin: 0 100%;
+       -moz-transform-origin: 0 100%;
+        -ms-transform-origin: 0 100%;
+         -o-transform-origin: 0 100%;
+            transform-origin: 0 100%;
+}
+#heart:after {
+    left: 0;
+    -webkit-transform: rotate(45deg);
+       -moz-transform: rotate(45deg);
+        -ms-transform: rotate(45deg);
+         -o-transform: rotate(45deg);
+            transform: rotate(45deg);
+    -webkit-transform-origin: 100% 100%;
+       -moz-transform-origin: 100% 100%;
+        -ms-transform-origin: 100% 100%;
+         -o-transform-origin: 100% 100%;
+            transform-origin :100% 100%;
+}
+
+
+/* #Gravity Forms ================================================== */
+
+#gform {
+	width:600px;
+	margin: 0 auto;
+}
+#gform label {
+	font-family: Reenie Beanie;
+	font-size:250%;
+}
+
+ul.gfield_checkbox li {float:left;}
+