website: redesign part 13

website_next/header/style.css

@@ -1,20 +1,16 @@
 body {
   > header {
     position: fixed;
-    inset: 1.5rem var(--page-x) auto;
+    top: 1.5rem;
+    left: var(--page-x);
     z-index: var(--layer-header);
-    display: grid;
-    grid-template-columns: 1fr auto 1fr;
-    align-items: center;
-    font-size: var(--font-size-sm);
     line-height: 1;
-    text-transform: uppercase;
+    mix-blend-mode: difference;
 
     > a {
       --color: var(--white);
       opacity: 0.8;
 
-      justify-self: start;
       display: flex;
       align-items: center;
       gap: 0.5rem;
@@ -45,44 +41,5 @@ body {
         animation: cube-fill 5s linear infinite alternate;
       }
     }
-
-    > nav {
-      font-size: var(--font-size-xs);
-
-      ul {
-        display: flex;
-        gap: 0.5rem;
-        margin: 0;
-        padding: 0;
-        list-style: none;
-      }
-
-      a {
-        display: block;
-        padding: 0.75rem 1rem;
-        border-radius: 0.3125rem;
-        text-decoration: none;
-
-        color: var(--white);
-        background: var(--dark-gray);
-
-        &:hover {
-          background: var(--gray);
-        }
-
-        &:active {
-          background: var(--orange);
-        }
-
-        &[aria-current="page"] {
-          color: var(--black);
-          background: var(--dark-white);
-
-          &:hover {
-            background: var(--white);
-          }
-        }
-      }
-    }
   }
 }