working with header animations - marked/highlightjs fixes

client/assets/scss/main.scss

@@ -1,12 +1,14 @@
 @import './utils.scss';
 html {
-    font-family: 'Roboto Slab', serif;
+    //font-family: 'Roboto Slab', serif;
+        font-family: 'Raleway', Calibri, Arial, sans-serif;
 }
 body {
     max-width: 100%;
     overflow-x: hidden;
     position: relative;
     -webkit-font-smoothing: subpixel-antialiased;
+    font-weight: 300;
 }
 h1,
 h2,
@@ -15,10 +17,11 @@ h4,
 h5,
 h6 {
     margin: 0;
-    font-weight: 500;
+    font-weight: 300;
 }
 p {
-    font-weight: 300;
+    font-weight: 200;
+    font-size: 1.1em;
 }
 *,
 *:after,
@@ -36,16 +39,14 @@ a {
     }
 }
 code,
-pre code{
+pre{
   white-space: pre-wrap;
-  position: relative;
 }
 .Layout {
     height: 100%;
     display: flex;
     flex-direction: column;
     .Footer,
-    .Header,
     .Main {
         display: flex;
         padding-right: calc(50% - 997px / 2);