diff --git a/main/css/pagelist.css b/main/css/pagelist.css
new file mode 100644
index 0000000..0832f8b
--- /dev/null
+++ b/main/css/pagelist.css
@@ -0,0 +1,52 @@
+@font-face {
+ font-family: 'Crimson Text';
+ font-style: normal;
+ font-weight: 400;
+ font-display: swap;
+ src: url("../fonts/CrimsonText.woff2") format('woff2');
+}
+
+body {
+ margin: auto;
+ margin-top: 5vh;
+ max-width: 500px;
+}
+
+div.contents, .navigation {
+ padding-left: 0.5em;
+ padding-right: 0.5em;
+}
+
+.navigation li {
+ display: block;
+}
+
+#header-icon {
+ width: 10em;
+ /* this should really just be a background image but that's even messier so here we are */
+ user-select: none;
+ -webkit-user-select: none;
+}
+
+#header-text {
+ filter: drop-shadow(4px 4px 10px #78557c);
+ font-size: 2em;
+}
+
+h1, h2 {
+ color: #f3c3f7;
+ font-family: "Wenceslas", serif;
+}
+
+p, ul {
+ font-family: 'Crimson Text', serif;
+ font-size: 1.2rem;
+ color: #e5adea;
+ max-width: 1000px;
+}
+
+@media only screen and (max-width: 300px) {
+ #header-text {
+ margin-left: -3em;
+ }
+}
\ No newline at end of file
diff --git a/main/pages/index.njk b/main/pages/index.njk
new file mode 100644
index 0000000..ea8089d
--- /dev/null
+++ b/main/pages/index.njk
@@ -0,0 +1,35 @@
+---
+title: List of Pages
+icon: /assets/flompy.png
+---
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ title }}
+
+
+
+
+ {{ collections.all | eleventyNavigation | eleventyNavigationToHtml({
+ listClass: "navigation"
+ }) | safe }}
+
+
+
\ No newline at end of file
+