diff --git a/public/index.php b/public/index.php
index c057ab1..797235b 100644
--- a/public/index.php
+++ b/public/index.php
@@ -10,6 +10,14 @@
 	<meta name="msapplication-TileColor" content="#00aba9">
 	<meta name="theme-color" content="#ffffff">
 <?php
+	function getByteString($bytes) {
+    $symbols = array('B', 'KB', 'MB', 'GB', 'TB');
+    $exp = ($bytes ? floor(log($bytes)/log(1024)) : 0);
+    return sprintf(
+    	'%.2f '.$symbol[$exp], 
+    	($bytes ? $bytes/pow(1024, floor($exp)) : 0)
+    );
+	}
 	function getPercentageUsed($total, $used) {
 		return ($total && $used ?
 			sprintf('%.4f', (100 * $used / $total))
@@ -125,35 +133,80 @@
 	</style>
 </head>
 <body>
+<header>
 	<h1>homo.casa</h1>
-	<h2>hinamizawa</h2>
-	<div class="pie">
-		<div class="slice hinamizawa" id="hinamizawa-used"></div>
+	<p>Gods and dice are best when silent.</p>
+</header>
+<div id="homes">
+	<h2>homes</h2>
+		<div class="home">
+			<h3>hinamizawa - <?php echo getByteString($hinamizawa_total); ?></h3>
+			<p>the village where we all reside</p>
+			<div class="pie">
+				<div class="slice hinamizawa" id="hinamizawa-used"></div>
+			</div>
+			<h4>Free Space: <em><?php echo
+				getByteString($hinamizawa_free);
+			?></em></h4>
+			<h4>Space Used: <em><?php echo
+				getByteString($hinamizawa_used);
+			?></em></h4>
+		</div>
+		<div class="home">
+			<h3>maebara - <?php echo getByteString($maebara_total); ?></h3>
+			<p>a famous artist, his loving wife, and their charismatic son</p>
+			<div class="pie">
+				<div class="slice maebara" id="maebara-used"></div>
+			</div>
+			<h4>Free Space: <em><?php echo
+				getByteString($maebara_free);
+			?></em></h4>
+			<h4>Space Used: <em><?php echo
+				getByteString($maebara_used);
+			?></em></h4>
+		</div>
+		<div class="home">
+			<h3>houjou - <?php echo getByteString($houjou_total); ?></h3>
+			<p>a little girl awaiting the return of her big brother</p>
+			<div class="pie">
+				<div class="slice houjou" id="houjou-used"></div>
+			</div>
+			<h4>Free Space: <em><?php echo
+				getByteString($houjou_free);
+			?></em></h4>
+			<h4>Space Used: <em><?php echo
+				getByteString($houjou_used);
+			?></em></h4>
+		</div>
+		<div class="home">
+			<h3>ryuuguu - <?php echo getByteString($ryuuguu_total); ?></h3>
+			<p>a caring father and his superstitious daughter</p>
+			<div class="pie">
+				<div class="slice ryuuguu" id="ryuuguu-used"></div>
+			</div>
+			<h4>Free Space: <em><?php echo
+				getByteString($ryuuguu_free);
+			?></em></h4>
+			<h4>Space Used: <em><?php echo
+				getByteString($ryuuguu_used);
+			?></em></h4>
+		</div>
+		<div class="home">
+			<h3>sonozaki - <?php echo getByteString($sonozaki_total); ?></h3>
+			<p>a grandmother of twins carrying on her stone face</p>
+			<div class="pie">
+				<div class="slice sonozaki" id="sonozaki-used"></div>
+			</div>
+			<h4>Free Space: <em><?php echo
+				getByteString($sonozaki_free);
+			?></em></h4>
+			<h4>Space Used: <em><?php echo
+				getByteString($sonozaki_used);
+			?></em></h4>
+		</div>
 	</div>
-	<h3>
-
-	<h2>maebara</h2>
-	<div class="pie">
-		<div class="slice maebara" id="maebara-used"></div>
-	</div>
-
-	<h2>houjou</h2>
-	<div class="pie">
-		<div class="slice houjou" id="houjou-used"></div>
-	</div>
-
-	<h2>ryuuguu</h2>
-	<div class="pie">
-		<div class="slice ryuuguu" id="ryuuguu-used"></div>
-	</div>
-
-	<h2>sonozaki</h2>
-	<div class="pie">
-		<div class="slice sonozaki" id="sonozaki-used"></div>
-	</div>
-
 	<footer>
-		<p>Child of Man. What do you seek from this world?</p>
+		<p>Child of Man. What do you seek from this World?</p>
 	</footer>
 </body>
 </html>
\ No newline at end of file
