New tab's style

_sass/minima/_layout.scss

@@ -34,6 +34,7 @@
 }
 
 .site-nav {
+  margin-top: 10px;
   float: right;
   line-height: $base-line-height * $base-font-size * 2.25;
 
@@ -50,7 +51,22 @@
   }
 
   .page-link:hover {
-    // color: #020202;
+    text-decoration: none;
+  }
+
+  .page-link:hover:after {
+    // border-bottom: solid 3px #26a9df;
+    border-color: #58595B;
+  }
+
+  .page-link:after {
+    content: " ";
+    width: 22px;
+    border-bottom: solid 3px #cbcfda;
+    position: absolute;
+    top: 30px;
+    left: 18px;
+    float: left;
   }
 
   @media (min-width: 640px) {
@@ -59,13 +75,11 @@
         // border-top: none;
         // border-right: solid 1px;
 
-        border-top: 4px #333 solid;
+        // text-decoration: none;
+        // box-shadow: #0000001f 0px 5px 10px 0px;
 
-        text-decoration: none;
-        box-shadow: #0000001f 0px 5px 10px 0px;
-
-        z-index: 100;
-        margin-right: 0px;
+        // z-index: 100;
+        // margin-right: 0px;
 
       color: #222 !important;
 
@@ -78,10 +92,6 @@
       min-width: 60px;
       position: relative;
 
-      border: solid 1px #999;
-      border-top: none;
-      border-radius: 0 0 10px 10px;
-
       margin: 0 0 0 -1px;
       padding: 2px 10px 4px 9px;
 
@@ -97,9 +107,9 @@
       z-index: 8;
     }
 
-    .active {
+    .active:after {
       // padding-top: 20px;
-      color: #222;
+      border-color: #58595B;
     }
   }
 
@@ -109,8 +119,6 @@
     font-weight: 600;
     text-align: center;
 
-    border-top: solid 4px #b6c1cc;
-
     // Gaps between nav items, but not on the last one
     &:not(:last-child) {
       // margin-right: -6px;
@@ -118,9 +126,10 @@
   }
 
   .active {
-    border-top: solid 4px #333;
+    // border-top: solid 4px #333;
   }
 
+
   @include media-query($on-palm) {
     position: absolute;
     top: 9px;