1 files changed, 48 insertions, 18 deletions

diff --git a/site/assets/css/css.css b/site/assets/css/css.css
index 0afa3725..4b42657b 100644
--- a/site/assets/css/css.css
+++ b/site/assets/css/css.css
@@ -16,7 +16,8 @@ html {
   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;
@@ -148,7 +151,7 @@ h3 {
   margin: 0 0 20px 0;
   padding: 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: 11px;
   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 */
@@ -368,7 +377,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 +547,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 #1e1e1e, 10px -10px #1e1e1e, 10px 10px #1e1e1e, -10px 10px #1e1e1e;
+  background: #1e1e1e;
+}
+.firefox .intro_section div > span {
+  box-decoration-break: clone;
 }
 
 /* footnotes */
@@ -559,22 +573,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;