diff --git a/about.css b/about.css
new file mode 100644
index 0000000..2e1b52e
--- /dev/null
+++ b/about.css
@@ -0,0 +1,20 @@
+#contact_logobox {
+  flex-grow: 0;
+}
+
+#contact_logo {
+  max-width: 300px;
+}
+#contactbox {
+  flex-grow: 1;
+
+}
+
+.protocol {
+  flex-basis: 300px;
+}
+
+
+.contact {
+  flex-grow: 1;
+}
\ No newline at end of file
diff --git a/about.html b/about.html
new file mode 100644
index 0000000..9b0096a
--- /dev/null
+++ b/about.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html lang="english">
+
+<head>
+  <meta name="viewport">
+  <meta charset="UTF-8">
+  <title>marty.tf - about</title>
+  <link rel="icon" href="src/marty_narklos.png">
+  <link rel="stylesheet" href="style.css">
+  <link rel="stylesheet" href="about.css">
+  <script src="script.js"></script>
+</head>
+
+<body>
+  <div class="flexbox-v">
+    <div id="contact_logobox" class="box">
+      <img class="box" id="contact_logo" src="src/marty_narklos.png" alt="a drawing of me, by narklos">
+      <br>
+      <br>
+      headshot drawn by
+      <a class="link" href="https://linktr.ee/Narklos">narklos</a>
+    </div>
+    <div class="box links" id="contactbox">
+      <div class="flexbox-v">
+        <div class="box protocol">mail</div>
+        <div class="box contact">
+          <a href="mailto:marty@marty.tf"> marty@marty.tf </a>
+        </div>
+      </div>
+      <div class="flexbox-v">
+        <div class="box protocol">matrix</div>
+        <div class="box contact">
+          <a href="https://matrix.to/#/@marty:yap.marty.tf">
+            @marty:yap.marty.tf
+          </a>
+        </div>
+      </div>
+      <div class="flexbox-v">
+        <div class="box protocol">fediverse</div>
+        <div class="box contact">
+          <a rel="me" href="https://fedi.marty.tf/@marty">
+            @marty@fedi.marty.tf
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/base.css b/base.css
index db38f0f..d9c33fd 100644
--- a/base.css
+++ b/base.css
@@ -5,10 +5,10 @@
 
 * {
   font-family: "Mono Code";
-  color: var(--mtf-font-color);
+  color: #cdd6f4;
 }
 
-body {
+#base {
   background-color: #1e1e2e;
   background-repeat: no-repeat;
   background-attachment: fixed;
diff --git a/boxes.css b/boxes.css
index 2fe0c12..7532f57 100644
--- a/boxes.css
+++ b/boxes.css
@@ -10,12 +10,22 @@
     height: inherit;
 }
 
+/* - */
+/* - */
+/* - */
+/* - */
+/* - */
+/* - */
 .flexbox-h {
     display: flex;
     flex-wrap: nowrap;
     flex-direction: column;
 }
 
+
+
+
+/* - - - - - - */
 .flexbox-v {
     display: flex;
     flex-wrap: wrap;
@@ -35,4 +45,14 @@
 #content {
     flex-grow: 7;
     min-width: 600px;
+    height: 70vh;
+}
+
+#content_embed {
+    width: 95%;
+    height: 100%;
+}
+
+#townsquare-root {
+    height: 20vh;
 }
\ No newline at end of file
diff --git a/git.html b/git.html
new file mode 100644
index 0000000..ad1ebce
--- /dev/null
+++ b/git.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="english">
+
+<head>
+  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+  <meta charset="UTF-8">
+  <title>marty.tf - about</title>
+  <link rel="icon" href="src/marty_narklos.png">
+  <link rel="stylesheet" href="style.css">
+  <script src="script.js"></script>
+</head>
+
+<body>
+  git
+</body>
+
+</html>
\ No newline at end of file
diff --git a/index.html b/index.html
index 3308b85..d9b0eca 100644
--- a/index.html
+++ b/index.html
@@ -13,7 +13,7 @@
 
 <!-- Body -->
 
-<body>
+<body id="base">
 
   <div class="flexbox-v">
     <div class="flexbox-h">
@@ -25,6 +25,8 @@
         <p> </p>
       </div>
       <div class="box" id="links">
+        <p></p>
+        <a href="javascript:void(0)" onclick="show('about')">about</a>
         <p></p>
         <a href="javascript:void(0)" onclick="show('fedi')">fedi</a>
         <p></p>
diff --git a/script.js b/script.js
index 4d29c57..bddedf4 100644
--- a/script.js
+++ b/script.js
@@ -22,6 +22,6 @@ function getCookie(cname) {
 };
 
 function show(content) {
-    var cont = document.getElementById(content);
-    cont.src=content
+    var cont = document.getElementById("content");
+    cont.innerHTML="<embed src='" + content + ".html' id='content_embed'>";
 };
