Mostly fixed the menu icon.

_includes/header.html

@@ -2,7 +2,7 @@
   <div class="wrapper">
     <a class="site-title" href="/"><img height="64" src="/images/logo.png" alt="{{ site.title }}" style="margin: 18px 0 18px 0"></a>
     <nav class="site-nav">
-      <a href="#" class="menu-icon">&#9776;</a>
+      <a href="#" class="menu-icon"><span style="display:flex;font-size:24px;margin:12px 0 0 8px;padding:0px;">&#8801;</span></a>
       <div class="trigger">
         <ul style="list-style: none;">
           <li><a class="page-link" href="/" style="text-decoration: none;">/</a></li>

_sass/_layout.scss

@@ -72,6 +72,33 @@
     }
 }
 
+/*.ham-menu { 
+  display: inline-block; 
+  position: relative; 
+  margin: 2px 0; 
+}
+
+.ham-menu, .ham-menu::before, .ham-menu::after { 
+  width: 100px; 
+  height: 20px; 
+  border-radius: 7px; 
+  background-color: black; 
+}
+
+.ham-menu::before, .ham-menu::after { 
+  content: ""; 
+  display: block; 
+  position: absolute; 
+}
+
+.ham-menu::before { 
+  bottom: 130%; 
+} 
+
+.ham-menu::after { 
+  top: 130%; 
+}*/
+
 .site-footer {
     margin: calc($spacing-unit / 4);
     //border-radius: 12px 12px;