More mobile updates

assets/sass/pages/homepage.scss

@@ -7,6 +7,12 @@
 
   padding-top: 200px;
 
+  @include media-up(lg) {
+    position: absolute;
+    bottom: 28%;
+    width: 100%;
+  }
+
   > div {
     display: grid;
     align-items: center;
@@ -158,6 +164,7 @@
 
 .navigation {
   position: relative;
+
   z-index: 999;
 
   display: grid;
@@ -165,6 +172,9 @@
 
   @include media-up(lg) {
     grid-template-columns: repeat(4, 1fr);
+    position: absolute;
+    bottom: 5%;
+    width: 100%;
   }
 
   > div {

assets/sass/partials/_neon-sign.scss

@@ -1,8 +1,27 @@
+// Function for standard neon glow effect
+@function neon-glow($color) {
+  @return 0 0 5px #fff, 0 0 5px #fff, 0 0 21px $color, 0 0 42px $color,
+    0 0 82px $color, 0 0 92px $color, 0 0 142px $color, 0 0 181px $color;
+}
+
 /* Neon sign styling */
 .neon-sign {
   text-align: center;
   line-height: 5rem;
-  transform: rotate(-10deg);
+
+  .homepage-neon & {
+    transform: rotate(-5deg);
+    width: 90%;
+    margin: auto;
+
+    @include media-up(lg) {
+      position: absolute;
+      top: 5%;
+      left: 60%;
+      transform: translateX(-50%) rotate(-10deg);
+      z-index: 1;
+    }
+  }
 
   @include media-up(lg) {
     position: absolute;
@@ -62,12 +81,6 @@
   }
 }
 
-// Function for standard neon glow effect
-@function neon-glow($color) {
-  @return 0 0 5px #fff, 0 0 5px #fff, 0 0 21px $color, 0 0 42px $color,
-    0 0 82px $color, 0 0 92px $color, 0 0 142px $color, 0 0 181px $color;
-}
-
 // Mixin for pulse animation - generates keyframes for any color
 @mixin neon-pulse-animation($name, $color) {
   @keyframes #{$name} {

assets/sass/partials/_vu-meter.scss

@@ -1,11 +1,14 @@
 /* VU Meter on desk */
 .vu-meter {
   position: absolute;
-  left: 50%;
   top: 10px;
   width: 120px;
   height: 60px;
   z-index: 8;
+
+  @include media-up(md) {
+    left: 50%;
+  }
 }
 
 .vu-meter-body {

layouts/index.html

@@ -6,7 +6,7 @@
 <div class="window hidden-lg-down">{{ partial "elements/window.html" . }}</div>
 
 <!-- Neon sign above monitor -->
-{{ partial "elements/neon-sign.html" . }}
+<div class="homepage-neon">{{ partial "elements/neon-sign.html" . }}</div>
 
 <!-- Sticky notes -->
 <div class="sticky-note note1 hidden-xl-down">fix bugs</div>