fiddeling around

src/lessc/page/color.less

@@ -1,5 +1,6 @@
 @import "color-gruvbox.less";
 
+@color-body-background-mobile: @gb-lm-light-aqua;
 @color-body-background: @gb-lm-bg0-hard;
 @color-body-background-highlight: @gb-lm-bg0-soft;
 @color-body-font: @gb-lm-fg0;

src/lessc/page/main-hack-card.less

@@ -6,6 +6,7 @@
 }
 
 blockquote{
+  font-size: 1rem;
   margin-top: 1em;
   margin-bottom: 1em;
   margin-left: 0;

src/lessc/page/main-hack-code.less

@@ -26,6 +26,7 @@
 
 // inline code
  .inline-code{
+   font-size: 1rem;
    color: @color-code-inline;
 
    font-weight: bold;

src/lessc/page/main-hack.less

@@ -1,6 +1,3 @@
-//@import "color.less";
-//@import "font.less";
-
 @import "main-hack-code.less";
 @import "main-hack-flex.less";
 @import "main-hack-card.less";
@@ -9,6 +6,8 @@
 @standard-margin: 1em;
 
 p, pre {
+  font-size: 1rem;
+  font-style: normal;
   margin-top: 1em;
   margin-bottom: 1em;
 }
@@ -17,6 +16,7 @@ p, pre {
 // Header
 h1, h2, h3, h4, h5, h6 {
   font-size: 1.3rem;
+  font-style: normal;
   margin-top: 1.5em;
   margin-bottom: 1em;
 

src/lessc/page/main-navigation.less

@@ -26,6 +26,7 @@
       flex-grow: 1;
       float: left;
       font-family: @font-nav;
+      font-size: 1rem;
       padding: 0;
 
       &:after {

src/lessc/page/main.less

@@ -14,13 +14,24 @@
   --screen-size-small: 30em;
 }
 
+* {
+  text-rendering: geometricPrecision;
+}
+
 html {
+  -webkit-text-size-adjust: 100%;
   font-family: @font-normal;
-  line-height: 1.5em;
+  font-style: normal;
+
+  //line-height: 1.5em;
+  line-height: 1.5;
   @media @desktop{
     font-size: 16px;
+    background-color: @color-body-background;
   }
-  font-size: 23px;
+  //font-size: 32px;
+  font-size: 200%;
+  //background-color: @color-body-background-mobile;
   background-color: @color-body-background;
   color: @color-body-font;
 }
@@ -28,6 +39,7 @@ html {
 
 body {
   padding-bottom: 3em;
+  width: 100%;
 
   header {
     width: 100%;