js automation and mobile menu

app/temp/scripts/Vendor.js

@@ -0,0 +1 @@
+!function(e){var n={};function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:o})},t.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(t.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var r in e)t.d(o,r,function(n){return e[n]}.bind(null,r));return o},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=1)}([,function(e,n,t){"use strict";t.r(n);t(2)},function(e,n){!function(e,n,t,o){var r=[],s={_version:"3.11.3",_config:{classPrefix:"",enableClasses:!0,enableJSClass:!0,usePrefixes:!0},_q:[],on:function(e,n){var t=this;setTimeout((function(){n(t[e])}),0)},addTest:function(e,n,t){r.push({name:e,fn:n,options:t})},addAsyncTest:function(e){r.push({name:null,fn:e})}},a=function(){};a.prototype=s,a=new a;var i=[];var l=t.documentElement,f="svg"===l.nodeName.toLowerCase();!function(){var e,n,t,o,s,l;for(var f in r)if(r.hasOwnProperty(f)){if(e=[],(n=r[f]).name&&(e.push(n.name.toLowerCase()),n.options&&n.options.aliases&&n.options.aliases.length))for(t=0;t<n.options.aliases.length;t++)e.push(n.options.aliases[t].toLowerCase());for(o=typeof n.fn==="function"?n.fn():n.fn,s=0;s<e.length;s++)1===(l=e[s].split(".")).length?a[l[0]]=o:(a[l[0]]&&(!a[l[0]]||a[l[0]]instanceof Boolean)||(a[l[0]]=new Boolean(a[l[0]])),a[l[0]][l[1]]=o),i.push((o?"":"no-")+l.join("-"))}}(),function(e){var n=l.className,t=a._config.classPrefix||"";if(f&&(n=n.baseVal),a._config.enableJSClass){var o=new RegExp("(^|\\s)"+t+"no-js(\\s|$)");n=n.replace(o,"$1"+t+"js$2")}a._config.enableClasses&&(e.length>0&&(n+=" "+t+e.join(" "+t)),f?l.className.baseVal=n:l.className=n)}(i),delete s.addTest,delete s.addAsyncTest;for(var u=0;u<a._q.length;u++)a._q[u]();e.Modernizr=a}(window,window,document)}]);

app/temp/styles/style.css

@@ -333,6 +333,9 @@ img {
   width: 100%;
   z-index: 2;
   transition: background-color .3s ease-out; }
+  .site-header--is-expanded {
+    background-color: orange;
+    padding-bottom: 18px; }
   @media (min-width: 800px) {
     .site-header {
       position: fixed;
@@ -341,6 +344,52 @@ img {
     .site-header__btn-container {
       padding: 32px 0px 32px 0px;
       float: right; } }
+  .site-header__menu-icon {
+    width: 20px;
+    height: 19px;
+    position: absolute;
+    z-index: 10;
+    top: 10px;
+    right: 10px; }
+    .site-header__menu-icon::before {
+      content: "";
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 20px;
+      height: 3px;
+      background: #FFF;
+      transform-origin: 0 0;
+      transition: transform .3s ease-out; }
+    .site-header__menu-icon__middle {
+      position: absolute;
+      top: 8px;
+      left: 0;
+      width: 20px;
+      height: 3px;
+      background: #FFF;
+      transition: all .3s ease-out;
+      transform-origin: 0 50%; }
+    .site-header__menu-icon::after {
+      content: "";
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 20px;
+      height: 3px;
+      background: #FFF;
+      transform-origin: 0 100%;
+      transition: transform .3s ease-out; }
+    @media (min-width: 800px) {
+      .site-header__menu-icon {
+        display: none; } }
+  .site-header__menu-icon--close-x::before {
+    transform: rotate(45deg) scaleX(1.25); }
+  .site-header__menu-icon--close-x .site-header__menu-icon__middle {
+    transform: scaleX(0);
+    opacity: 0; }
+  .site-header__menu-icon--close-x::after {
+    transform: rotate(-45deg) scaleX(1.25) translateY(1px); }
   .site-header__menu-content {
     opacity: 0;
     transform: scale(1.2);
@@ -349,6 +398,10 @@ img {
     z-index: -10;
     padding-top: 90px;
     text-align: center; }
+    .site-header__menu-content--is-visible {
+      transform: scale(1);
+      opacity: 1;
+      z-index: 1; }
     @media (min-width: 800px) {
       .site-header__menu-content {
         opacity: 1;
@@ -357,17 +410,24 @@ img {
         transform: scale(1); } }
   .site-header__logo {
     position: absolute;
-    top: 3px;
+    top: 0px;
+    padding: 5px 15px;
     left: 50%;
     transform-origin: 50% 0%;
     transform: translateX(-50%) scale(0.8);
-    transition: transform .3s ease-out; }
+    transition: transform .3s ease-out;
+    background-color: rgba(0, 0, 0, 0.5); }
+    .site-header__logo--orange-bg {
+      background-color: orange; }
     @media (min-width: 800px) {
       .site-header__logo {
+        padding: 0;
+        top: 3px;
         position: relative;
         float: left;
         left: auto;
-        transform: translateX(0); } }
+        transform: translateX(0);
+        background-color: rgba(0, 0, 0, 0); } }
 
 .primary-nav {
   padding-top: 10px; }
@@ -450,13 +510,13 @@ img {
       .large-hero__title {
         font-size: 4.8rem; } }
   .large-hero__subtitle {
-    font-family: "CocogooseNormal";
+    font-weight: 400;
     color: white;
     font-size: 1.5rem;
     margin: 0; }
     @media (min-width: 530px) {
       .large-hero__subtitle {
-        font-size: 2.9rem; } }
+        font-size: 2.4rem; } }
   .large-hero__description {
     color: #FFF;
     font-weight: 00;