made edlp logo in pure css using columns and :after :before

sites/all/themes/custom/edlptheme/assets/styles/app.scss

@@ -7,53 +7,54 @@
 // @License: GPL-V3
 
 @import 'base/reset';
-
-@import 'base/vars';
-@import 'base/grid';
 @import 'base/colors';
-@import 'base/buttons';
+@import 'base/layout';
 
-
-body, html{
-  position: relative;
-  width: 100%;
-  height:100%;
-  font-family: Georgia, serif;
-  font-style: normal;
-  margin:0;
-  padding:0;
-}
-
-div.layout-container{
-  position: relative;
-  width:100%; height:100%;
-  padding:1em;
-  box-sizing: border-box;
-  z-index: 1;
-}
-
-header[role="banner"]{
-  outline: 1px solid blue;
+// header
+#block-edlptheme-branding{
+  h1{
+    margin:0; display: inline-block;
+    font-size: 1.5em;
+    text-transform: lowercase;
+    a{
+      $col_w:3.74em;
+      $col_gap:2em;
+      line-height: 0.93;
+      text-align: center;
+      color: inherit;
+      text-decoration: none;
+      display: inline-block;
+      columns:$col_w 2;
+      column-gap: $col_gap;
+      word-break:break-all;
+      hyphens:auto;
+      position: relative;
+      &:after, &:before{
+        content: '';
+        position: absolute;
+        top:50%;
+        height:0;
+      }
+      &:before{
+        left:$col_w;
+        border-bottom:0.08em solid #000;
+        width:2.5em;
+        transform: rotateZ(-45deg);
+      }
+      &:after{
+        $w:0.5em;
+        top:47%;
+        left:($col_w+$col_gap/2);
+        border-top:0.2em solid red;
+        width:$w;
+        transform: rotateZ(45deg);
+      }
+    }
+  }
 }
 
 
-main[role="main"]{
-  outline:1px solid green;
-  background-color: $transparent-bg;
-  // display: none;
-}
-
-footer[role="contentinfo"]{
-  // outline: 1px solid pink;
-  position: fixed;
-  bottom:0;
-  width:100%;
-}
-
-canvas#edlp-map{
-  // outline: 1px solid grey;
-}
-
+// Footer
 @mixin oblique-list {
   display: inline-block;
   position: relative;
@@ -80,6 +81,7 @@ footer{
   padding: 0 0 0.5em 0;
   >.region{
     display: table-cell;
+    white-space: nowrap;
     // outline: 1px dotted purple;
     // position: relative;
   }
@@ -139,6 +141,7 @@ footer{
     display: inline-block;
     // vertical-align: top;
     ul{
+      white-space: nowrap;
       li{
         @include oblique-list;
         margin:0;

sites/all/themes/custom/edlptheme/assets/styles/base/_buttons.scss

@@ -1,25 +0,0 @@
-
-// Buttons
-//
-// Buttons
-//
-// Markup:
-// <a href="" class="btn {{modifier_class}}">Button</a>
-//
-// .btn--hollow      - Hollow button
-// .btn--hollow-white  - Hollow button
-// .btn--blue        - Blue button
-// .btn--block       - Block button
-// .btn--small       - Small button
-// .btn--plain       - Plain button
-//
-// Styleguide Common.Buttons
-
-
-.btn {
-	&--hollow {
-		background: red;
-		display: inline-block;
-		padding: 10px;
-	}
-}

sites/all/themes/custom/edlptheme/assets/styles/base/_layout.scss

@@ -0,0 +1,40 @@
+
+body, html{
+  position: relative;
+  width: 100%;
+  height:100%;
+  font-family: Georgia, serif;
+  font-style: normal;
+  margin:0;
+  padding:0;
+}
+
+div.layout-container{
+  position: relative;
+  width:100%; height:100%;
+  padding:1em;
+  box-sizing: border-box;
+  z-index: 1;
+}
+
+header[role="banner"]{
+  // outline: 1px solid blue;
+}
+
+
+main[role="main"]{
+  // outline:1px solid green;
+  background-color: $transparent-bg;
+  // display: none;
+}
+
+footer[role="contentinfo"]{
+  // outline: 1px solid pink;
+  position: fixed;
+  bottom:0;
+  width:100%;
+}
+
+canvas#edlp-map{
+  // outline: 1px solid grey;
+}