2 files changed, 54 insertions, 20 deletions
diff --git a/site/assets/css/applets.css b/site/assets/css/applets.css
index aa9ce47f..729737fe 100644
--- a/site/assets/css/applets.css
+++ b/site/assets/css/applets.css
@@ -143,6 +143,9 @@
 
 /* tabulator */
 
+.tabulator {
+  font-family: 'Roboto', sans-serif;
+}
 .tabulator-row {
   transition: background-color 100ms cubic-bezier(0,0,1,1);
   background-color: rgba(255,255,255,0.0);
diff --git a/site/assets/css/css.css b/site/assets/css/css.css
index 0afa3725..d710b3a8 100644
--- a/site/assets/css/css.css
+++ b/site/assets/css/css.css
@@ -9,14 +9,15 @@ html, body {
   overflow-x: hidden;
 }
 html {
-  background: #111111;
+  background: #181818;
 }
 
 .content {
   opacity: 0;
   transition: opacity 0.2s cubic-bezier(0,1,1,1);
 }
-html.desktop .content, html.mobile .content {
+html.desktop .content,
+html.mobile .content {
   opacity: 1;
 }
 
@@ -28,7 +29,7 @@ header {
   left: 0;
   width: 100%;
   height: 70px;
-  z-index: 2;
+  z-index: 9999;
   background: #1e1e1e;
   display: flex;
   flex-direction: row;
@@ -53,8 +54,10 @@ header .logo {
   height: 30px;
 }
 header .site_name {
+  font-family: 'Roboto', sans-serif;
   font-weight: bold;
   color: #fff;
+  font-size: 14px;
 }
 header .sub {
   margin-left: 4px;
@@ -146,9 +149,9 @@ h2 {
 }
 h3 {
   margin: 0 0 20px 0;
-  padding: 0;
+  padding: 20px 0 0 0;
   font-size: 14pt;
-  font-weight: 600;
+  font-weight: 500;
   transition: color 0.2s cubic-bezier(0,0,1,1);
 }
 h4 {
@@ -170,6 +173,8 @@ h4 {
   margin: 0;
   padding: 0 0 10px 0;
   font-family: 'Roboto Mono';
+  font-weight: 400;
+  font-size: 14px;
   text-transform: uppercase;
   letter-spacing: 2px;
 }
@@ -210,13 +215,17 @@ section {
 p {
   margin: 0 0 20px 0;
   line-height: 2;
+  font-size: 15px;
+  font-weight: 400;
 }
 .content a {
-  color: #ff0;
+  color: #fff;
+  text-decoration: none;
+  border-bottom: 1px dashed;
   transition: color 0.2s cubic-bezier(0,0,1,1);
 }
-.content a:hover {
-  color: #fff;
+.desktop .content a:hover {
+  color: #ff8;
 }
 
 /* top of post metadata */
@@ -254,6 +263,7 @@ p {
 }
 .right-sidebar ul {
   margin-bottom: 10px;
+  color: #aaa;
 }
 
 /* lists */
@@ -368,7 +378,7 @@ section.fullwidth .image {
 .caption {
   text-align: left;
   font-size: 9pt;
-  color: #bbb;
+  color: #999;
   max-width: 960px;
   margin: 10px auto 0 auto;
   font-family: 'Roboto';
@@ -538,17 +548,22 @@ section.intro_section {
   font-size: 38px;
   line-height: 60px;
   margin-bottom: 30px;
-  color: #fff;
+  color: #ddd;
+  font-weight: 300;
 }
 .intro_section .hero_subdesc {
   font-size: 18px;
   line-height: 36px;
   max-width: 640px;
+  font-weight: 300;
   color: #ddd;
 }
-.intro_section span {
-  box-shadow: -10px -10px #000, 10px -10px #000, 10px 10px #000, -10px 10px #000;
-  background: #000;
+.intro_section div > span {
+  box-shadow: -10px -10px #181818, 10px -10px #181818, 10px 10px #181818, -10px 10px #181818;
+  background: #181818;
+}
+.firefox .intro_section div > span {
+  box-decoration-break: clone;
 }
 
 /* footnotes */
@@ -559,22 +574,38 @@ a.footnote {
   display: inline-block;
   bottom: 10px;
   text-decoration: none;
-  color: #ff0;
+  color: #ff8;
+  border: 0;
   left: 2px;
+  transition-duration: 0s;
+}
+a.footnote_shim {
+  display: inline-block;
+  width: 1px; height: 1px;
+  overflow: hidden;
+  position: relative;
+  top: -90px;
+  visibility: hidden;
 }
 .right-sidebar a.footnote {
   bottom: 8px;
 }
 .desktop a.footnote:hover {
-  background-color: #ff0;
+  background-color: #ff8;
   color: #000;
 }
-a.footnote_anchor {
-  font-weight: bold;
-  color: #ff0;
+.backlinks {
   margin-right: 10px;
-  text-decoration: underline;
-  cursor: pointer;
+}
+.content .backlinks a {
+  color: #ff8;
+  font-size: 10px;
+  text-decoration: none;
+  border: 0;
+  font-weight: bold;
+  position: relative;
+  bottom: 5px;
+  margin-right: 2px;
 }
 ul.footnotes {
   list-style-type: decimal;