diff --git a/guile-docs.scm b/guile-docs.scm
index a578b84..83d838b 100644
--- a/guile-docs.scm
+++ b/guile-docs.scm
@@ -12,20 +12,18 @@
 
 (define (mime-type file-name)
   (or (assoc-ref '(("js" . application/javascript)
+                   ("css" . text/css)
                    ("html" . text/html)
                    ("scm" . text/stml)
                    ("wasm" . application/wasm))
                  (extension file-name))
       'text/plain))
 
-(define (render-stml file-name)
-  (values '((content-type . (text/html)))
-          (sxml->html-string (load file-name))))
-
 (define (render-file file-name)
   (let ((type (mime-type file-name)))
     (if (eq? type 'text/stml)
-        (render-stml file-name)
+        (values '((content-type . (text/html)))
+                (sxml->html-string (load file-name)))
         (values `((content-type . (,type)))
                 (call-with-input-file file-name get-bytevector-all)))))
 
@@ -39,12 +37,12 @@
   (define %prefix `(,(getcwd) "public"))
   (define (prepend-prefix path) (string-join (append %prefix `(,path)) file-name-separator-string))
 
-  (let* ((f (prepend-prefix (uri-decode path))))
+  (let ((f (prepend-prefix (uri-decode path))))
     (cond ((and (file-exists? f) (not (directory? f)))
            (render-file f))
           ((equal? "/" path)
            (render-file (prepend-prefix "index.scm")))
-          (else not-found path))))
+          (else (not-found path)))))
 
 (define (handle-request request body)
   (let ((method (request-method request))
diff --git a/public/index.scm b/public/index.scm
index 6895178..b69f5b6 100644
--- a/public/index.scm
+++ b/public/index.scm
@@ -1,6 +1,7 @@
-'(html
-  (head
-   (title "Welcome to Guile Docs"))
-  (body
-   (h1 "Welcome to Guile Docs")
-   (p "This is Guile Docs.")))
+;; TODO: move to modules - need to set up pre-inst-env or w/e
+(define overall-wrapper (load "overall-wrapper.scm"))
+
+(overall-wrapper
+ '(main
+   (h1 "Welcome")
+   (p "This is GuileDocs.")))
diff --git a/public/overall-wrapper.scm b/public/overall-wrapper.scm
new file mode 100644
index 0000000..67c6e1d
--- /dev/null
+++ b/public/overall-wrapper.scm
@@ -0,0 +1,25 @@
+;; todo: module
+(lambda (content)
+  `(html
+    (link (@ (rel "stylesheet")
+             (type "text/css")
+             (href "style.css")))
+    (head
+     (title "Welcome to GuileDocs"))
+    (body
+     (div (@ (id "overall-wrapper"))
+          (header (h3 "🚀GuileDocs")
+                  (input (@ (type "text")
+                            (placeholder "Search (ctrl-s)")))
+                  (menu
+                   (li "Core Library")
+                   (li "Quick Ref")))
+          (nav (section (h4 "Navigation")
+                        (menu (li "Top")
+                              (li "Examples")
+                              (li "See Also")))
+               (section (h4 "Namespace")
+                        (menu (li "guile")
+                              (li "srfi"))))
+          ,content
+          (footer (p (i "powered by solarpunks.")))))))
diff --git a/public/style.css b/public/style.css
new file mode 100644
index 0000000..61a9d88
--- /dev/null
+++ b/public/style.css
@@ -0,0 +1,34 @@
+body {
+    background-color: #cdfcab;
+}
+
+#overall-wrapper {
+    max-width: 1000px;
+    margin: 0 auto;
+}
+
+header menu {
+    display: inline-block;
+}
+header menu li {
+    display: inline-block;
+    padding: 2px;
+    margin: 0 2px;
+}
+
+nav {
+    float: left;
+    padding: 0 50px 0 0;
+}
+
+main {
+    padding: 0 50px;
+}
+
+footer {
+    clear: both;
+}
+
+footer p {
+    text-align: center;
+}