diff --git a/priv/chapter1.html b/priv/chapter1.html
index 33a1b7f..a5046b3 100644
--- a/priv/chapter1.html
+++ b/priv/chapter1.html
@@ -3,10 +3,38 @@
 <head>
     <title>Tank Bison with lazer eyes.</title>
     <meta charset="UTF-8">
-    <link href= "https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
-          rel="stylesheet">
     <script src="https://unpkg.com/htmx.org@1.9.6"></script>
-
+    <style>
+      html {
+          max-width: 80ch;
+          padding: 3em 1em;
+          margin: auto;
+          line-height: 1.75;
+          font-size: 1.25em;
+          background-color: rgb( 0 70 67);
+          color: rgb(171 209 198);
+          font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
+          line-height: 1.5;
+      }
+
+      button {
+          background-color: #f9bc60;
+          color: #001e1d;
+          border-radius: 9999px;
+          width: 10rem;
+          height: 4rem;
+          font-size: 1rem; /* 16px */
+      }
+
+      a {
+          color: #FFFFFF;
+      }
+
+      p {
+          padding-left: 1.25rem; /* 20px */
+          padding-right: 1.25rem; /* 20px */
+      }
+    </style>
 </head>
 
 <body class="px-10">
diff --git a/priv/index.html b/priv/index.html
index 6dd6eab..4b43a93 100644
--- a/priv/index.html
+++ b/priv/index.html
@@ -3,19 +3,40 @@
 <head>
     <title>Tank Bison with lazer eyes.</title>
     <meta charset="UTF-8">
-    <link href= "https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
-          rel="stylesheet">
     <script src="https://unpkg.com/htmx.org@1.9.6"></script>
 
     <style>
       html {
-          max-width: 70ch;
+          max-width: 80ch;
           padding: 3em 1em;
           margin: auto;
           line-height: 1.75;
           font-size: 1.25em;
+          background-color: rgb( 0 70 67);
+          color: rgb(171 209 198);
+          font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
+          line-height: 1.5;
+      }
+
+      button {
+          background-color: #f9bc60;
+          color: #001e1d;
+          border-radius: 9999px;
+          width: 10rem;
+          height: 4rem;
+          font-size: 1rem; /* 16px */
+      }
+
+      a {
+          color: #FFFFFF;
+      }
+
+      p {
+          padding-left: 1.25rem; /* 20px */
+          padding-right: 1.25rem; /* 20px */
       }
     </style>
+
 </head>
 
 <body class="">
@@ -98,8 +119,6 @@ <h1 class="text-black-600 text-5xl font-bold">
         || <a href="/chapter1" hx-boost="true">Next Chapter →</a>
       </p>
 
-
-
 </div>
 </body>
 </html>
diff --git a/src/barista-routes.lfe b/src/barista-routes.lfe
index 4977b60..15afd59 100644
--- a/src/barista-routes.lfe
+++ b/src/barista-routes.lfe
@@ -24,6 +24,14 @@
          (lfe_io:format "headers: ~p~n" `(,headers))
          (barista:response 200 headers body))))
 
+  (('GET (list (binary ("chapter2")))  (= `#m(body ,body) req))
+   (progn
+     (lfe_io:format "Serving up get on chapter 2~n" '())
+     (let* ((headers (generate-headers))
+            (body (list (template:load "chapter2.html"))))
+       (lfe_io:format "headers: ~p~n" `(,headers))
+       (barista:response 200 headers body))))
+
   (('POST (list (binary ("chapter1-clicked")) )(= `#m(body ,body) req))
    (progn
      (let* ((headers (generate-headers))
