diff --git a/index.html b/index.html
index 42a7891a..24dcb884 100644
--- a/index.html
+++ b/index.html
@@ -4,20 +4,28 @@
     <meta charset="utf-8">
     <title>OWL Framework</title>
     <link rel="icon" href="data:,">
+    <link rel="stylesheet" href="main.css">
 
 
   </head>
   <body>
-    <h1>🦉 OWL Framework 🦉</h1>
-    
-    <ul>
-        <li>Github project: <a href="https://github.com/odoo/owl">https://github.com/odoo/owl</a></li>
-        <li>Documentation:  <a href="https://github.com/odoo/owl/blob/master/doc/readme.md">https://github.com/odoo/owl/blob/master/doc/readme.md</a>
-        <li>Online playground:  <a href="playground/">playground/</a>
-    </ul>
+    <div class="title">
+        <h1>🦉 OWL Framework 🦉</h1>
+        <div>Mysterious OWL: A web framework for structured, dynamic and maintainable applications</div>
+    </div>
 
-    <p>
-        Are you a designer? Do you like CSS? Improve this page: make a PR!
-    </p>
+    <div class="section misc">
+        <ul>
+            <li>Github project: <a href="https://github.com/odoo/owl">https://github.com/odoo/owl</a></li>
+            <li>Documentation:  <a href="https://github.com/odoo/owl/blob/master/doc/readme.md">https://github.com/odoo/owl/blob/master/doc/readme.md</a>
+            <li>Online playground:  <a href="playground/">playground/</a>
+        </ul>
+    </div>
+
+    <div class="footnote">
+        <p>
+            Are you a designer? Do you like CSS? Improve this page: make a PR!
+        </p>
+    </div>
   </body>
 </html>
\ No newline at end of file
diff --git a/main.css b/main.css
new file mode 100644
index 00000000..2760f2f6
--- /dev/null
+++ b/main.css
@@ -0,0 +1,23 @@
+body {
+    font-family: sans-serif;
+}
+
+.title, .section, .footnote {
+    width: 768px;
+    margin: auto;
+}
+
+.title div {
+    color: #333333;
+    font-style: italic;
+}
+.section {
+    background-color: #d5d5d5;
+    padding: 16px;
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
+.links a {
+    margin: 10px 5px;
+}
\ No newline at end of file