fix up the stuff above the fold

views/pages/home.html.php

@@ -1,23 +1,34 @@
-<div id="feature">
-	<h2>The Otaku Social Network</h2>
-	<h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</h3>
-	<h2>Signup Now!</h2>
-	<hr/>
-	<form method="post" action="/users/signup">
-		<label for="username">Username</label>
-		<input type="text" name="username" id="username">
-		<label for="password">Password</label>
-		<input type="password" id="password" name="password">
-		<label for="email">Email</label>
-		<input type="text" id="email" name="email">
-		<input class="button green" type="submit" value="Signup!">
-	</form>
+<div>
+	<div id="recent">
+		<h2>The Otaku Social Network</h2>
+		<h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
+		eiusmod tempor incididunt ut labore et dolore magna aliqua.</h3>
+	</div>
+	<div id="signup">
+		<h2>Sign up:</h2>
+		<form method="post" action="/users/signup">
+			<table>
+				<tr>
+					<td><label for="username">Username</label></td>
+					<td><input type="text" name="username" id="username">
+				</tr>
+				<tr>
+					<td><label for="password">Password</label></td>
+					<td><input type="password" id="password" name="password"></td>
+				</tr>
+				<tr>
+					<td><label for="email">Email</label></td>
+					<td><input type="text" id="email" name="email"></td>
+				</tr>
+			</table>
+			<input class="button green" type="submit" value="Sign up">
+		</form>
+	</div>
 </div>
 
 <h2 class="ribbon">Why you'll &#9825; OtakuHub~</h2>
 <div class="triangle-ribbon"></div>
 <br class="cl" />
-
 <h3>For Us By Us</h3>
 <p>
 	Built by Otakus for Otakus, we know what you want, and we work tirelessly to give it to you.

webroot/css/base.css

@@ -36,6 +36,25 @@ h2.ribbon {
 	z-index: -1;
 }
 
+#recent {
+	float: left;
+	width: 560px;
+}
+#signup {
+	float: right;
+	text-align: center;
+}
+#signup table {
+	margin-bottom: 5px;
+}
+#signup table tr td:first-child {
+	text-align: right;
+}
+#signup table td {
+	padding: 3px;
+	vertical-align: middle;
+}
+
 h2 span {
 	position:absolute;
 	right:25px;
@@ -75,7 +94,7 @@ h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {
 	margin-right:5px;
 	vertical-align:-2px;
 }
-/*////   - Misc -   ////*/
+
 .fl {
 	float:left;
 }
@@ -615,15 +634,9 @@ body.ie7 form, body.ie8 {
 form p {
 	margin-bottom:15px;
 }
-form label {
-	float:left;
-	width:140px;
-	margin-top:5px;
-}
 form input, form textarea {
 	padding: 7px 5px;
 	border: 1px solid #ccc;
-	width: 200px;
 	border-radius: 3px;
 	-moz-border-radius: 3px;
 	-webkit-border-radius: 3px;