formatted header

Author: jwcooper

assets/sass/base/_mixins.scss

@@ -5,19 +5,19 @@
     [main-start] minmax(0, 1300px) [main-end]
     minmax(15px, 1fr) [full-end];
 
-  &> * {
+  & > * {
     grid-column: main;
   }
 }
 
 @mixin rounded-button {
   display: inline-block;
   font-size: 18px;
-  padding: 7px 50px 7px 50px;
+  padding: 15px 40px;
   color: #fff;
   font-weight: 500;
-  border-radius: 50px;
-  border: 3px solid #fff;
+  border-radius: 10px;
+  background-color: #63338f;
 
   &:hover {
     color: #000;

assets/sass/layout/_header.scss

@@ -72,6 +72,7 @@
 }
 
 .site-logo {
+  flex: 1 1 0;
 }
 
 .site-banner {
@@ -84,15 +85,17 @@
 }
 
 .get-started {
-  margin-left: auto;
-  padding-bottom: 10px;
+  display: flex;
+  flex: 2 1 0;
+  justify-content: end;
 
   a {
     @include rounded-button;
   }
 }
 
 .site-navigation {
+  flex: 2 1 0;
   padding: 0 0 10px 0;
   font-size: 18px;