Update css

Author: socketopp

_sass/main.scss

@@ -5,12 +5,9 @@
 
 @charset "utf-8";
 
-// The variables
-$base-font-family: Bitter, "Apple SD Gothic Neo", AppleGothic, NanumBarunGothic,
-    "Malgun Gothic", Dotum, sans-serif;
-$monospace-font-family: Monaco, Menlo, Consolas, "Courier New", DotumChe,
-    monospace;
-$palm-font-size: 16px;
+// Variables
+$base-font-family: Bitter, "Apple SD Gothic Neo", AppleGothic, NanumBarunGothic, "Malgun Gothic", Dotum, sans-serif;
+$monospace-font-family: Monaco, Menlo, Consolas, "Courier New", DotumChe, monospace;
 $base-font-size: 16px;
 $base-font-weight: 400;
 $small-font-size: $base-font-size * 0.875;
@@ -28,7 +25,6 @@ $grey-color-dark: darken($grey-color, 20%);
 
 // Width of the content area
 $content-width: 800px;
-
 $on-mobile: 335px;
 $on-palm: 600px;
 $on-laptop: 800px;
@@ -42,6 +38,7 @@ $on-laptop: 800px;
 /**
  * Basic styling
  */
+
 html,
 body {
     min-height: 100%;
@@ -50,18 +47,11 @@ body {
     padding: 0;
 }
 
-// * {
-//     box-sizing: border-box;
-//   }
-
 body {
     background-image: url("/assets/images/bg0.jpg");
     background-size: cover;
-    // background-image: radial-gradient( circle farthest-corner at 22.4% 21.7%,  rgba(4,189,228,1) 0%, rgba(2,83,185,1) 100.2% );
-
     font: $base-font-weight #{$base-font-size}/#{$base-line-height}
         $base-font-family;
-
     color: $text-color;
     background-color: $background-color;
     -webkit-text-size-adjust: 100%;
@@ -78,6 +68,8 @@ body {
     }
 }
 
+
+
 #header,
 #main,
 .footer {
@@ -97,32 +89,6 @@ body {
     overflow: auto;
 }
 
-/**
- * Links
- */
-
-a {
-    color: $text-color;
-    text-decoration: none;
-}
-
-nav a,
-div > a {
-    &:hover {
-        color: black;
-        text-decoration: underline;
-        transition: color 1s;
-    }
-}
-
-p a, footer a {
-    border-bottom: 1px dashed #8c8c8c;
-
-    &:hover {
-        border-bottom: 2px solid #8c8c8c;
-    }
-}
-
 /**
  * Header specific styles 
  * 
@@ -143,6 +109,46 @@ p a, footer a {
     padding-top: 2em;
 }
 
+#title {
+    font-size: 32px;
+    font-weight: 300;
+    line-height: 56px;
+    letter-spacing: -1px;
+    margin-bottom: 0;
+
+    @include media-query(279px) {
+        float: none;
+    }
+}
+
+#navigation {
+    float: right;
+    line-height: 56px;
+
+    .nav-link {
+        line-height: 1.5;
+
+        &:not(:last-child) {
+            margin-right: 20px;
+        }
+    }
+    @include media-query($on-mobile) {
+    
+        line-height: 30px;
+        .nav-link {
+            &:not(:last-child) {
+                margin-right: 15px;
+            }
+        }
+
+    }
+}
+
+/**
+ * Footer styles 
+ * 
+ */
+
 .footer {
     max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2));
     max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
@@ -160,6 +166,12 @@ p a, footer a {
     }
 }
 
+/**
+ * Body styles 
+ * 
+ */
+
+
 .wrapper {
     max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2));
     max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
@@ -177,19 +189,21 @@ p a, footer a {
     }
 }
 
-
-#title {
-    font-size: 32px;
-    font-weight: 300;
-    line-height: 56px;
-    letter-spacing: -1px;
-    margin-bottom: 0;
-
-    @include media-query(279px) {
-        float: none;
+#main {
+    padding: 20px 0;
+    @include media-query($on-palm) {
+        padding: 0;
     }
 }
 
+#main-wrapper {
+    max-width: calc(800px - (30px * 2));
+    margin-right: auto;
+    margin-left: auto;
+    padding-right: 30px;
+    padding-left: 30px;
+}
+
 .archive-title {
     margin: 0;
     font-weight: 100;
@@ -201,49 +215,32 @@ p a, footer a {
     padding-bottom: 1em;
 }
 
-#navigation {
-    float: right;
-    line-height: 56px;
-
-    .nav-link {
-        line-height: 1.5;
+/**
+ * Links
+ */
 
-        &:not(:last-child) {
-            margin-right: 20px;
-        }
-    }
-    @include media-query($on-mobile) {
-    
-        line-height: 30px;
-        .nav-link {
-            &:not(:last-child) {
-                margin-right: 15px;
-            }
-        }
+ a {
+    color: $text-color;
+    text-decoration: none;
+}
 
+nav a,
+div > a {
+    &:hover {
+        color: black;
+        text-decoration: underline;
+        transition: color 1s;
     }
 }
 
-/**
- * Main Page styles 
- * 
- */
+p a, footer a {
+    border-bottom: 1px dashed #8c8c8c;
 
-#main {
-    padding: 20px 0;
-    @include media-query($on-palm) {
-        padding: 0;
+    &:hover {
+        border-bottom: 2px solid #8c8c8c;
     }
 }
 
-#main-wrapper {
-    max-width: calc(800px - (30px * 2));
-    margin-right: auto;
-    margin-left: auto;
-    padding-right: 30px;
-    padding-left: 30px;
-}
-
 /**
  * Footer specific styles 
  *