🐛 fix: remove horizontall scroll on mobile

sass/main.scss

@@ -103,21 +103,23 @@ body {
 }
 
 .content {
-  flex: 1;
   width: 100%;
   max-width: var(--max-layout-width);
   margin: 0 auto;
   margin-top: 6vmin;
   margin-bottom: 4rem;
-  padding: 0 24px;
   word-wrap: break-word;
 }
 
-article{
+article {
   max-width: calc(var(--max-layout-width) - 14rem);
   margin: 0 auto;
 }
 
+main {
+  padding: 0 24px;
+}
+
 .section-title {
   display: block;
   font-size: 2.2em;
@@ -195,6 +197,9 @@ p {
   .content {
     max-width: var(--medium-layout-width);
   }
+  main {
+    padding: 0;
+  }
 }
 @media only screen and (max-width: 300px) {
   .content {

sass/parts/_header.scss

@@ -118,6 +118,7 @@ header {
 
   .navbar {
     max-width: var(--medium-layout-width);
+    padding: 1em 0;
   }
 }