add nice heading placement

src/css/layout/_header.scss

@@ -4,10 +4,26 @@
   #header {
     top: 80px;
     position: absolute;
+    left: 50%;
+    transform: translate(-50%, 70px);
+
+    > h1 {
+      font-size: 60pt;
+      display: inline-block;
+      color: _palette(accent1);
+      margin: 0 0 0 40px;
+
+      &:first-child {
+        color: _palette(accent2);
+        margin: 0 0 0 10px;
+      }
+    }
 
     > #logo > img {
       height: 140pt;
       width: auto;
+      display: inline-block;
+      float: left;
     }
     /*
         @include breakpoint('<=xlarge') {

src/index.html

@@ -76,12 +76,12 @@
 </nav>
 
 <header id="header">
+  <h1>Schulze</h1>
   <picture id="logo">
     <source srcset="/img/logo/logo@0.25x.webp" type="image/webp">
     <source srcset="/img/logo/logo@0.25x.png" type="image/png">
     <img src="/img/logo/logo@0.25x.png" alt="Schulze Studio logo">
-  </picture>
-  <h1>Schulze</h1>
+  </picture><br>
   <h1>Studio</h1>
 </header>