diff --git a/lms/static/sass/shared-v2/_help-tab.scss b/lms/static/sass/shared-v2/_help-tab.scss
index c9278d0e93..2bebe1fb1e 100644
--- a/lms/static/sass/shared-v2/_help-tab.scss
+++ b/lms/static/sass/shared-v2/_help-tab.scss
@@ -1,77 +1,80 @@
 .help-tab {
-  @include transform(rotate(-90deg));
-  @include transform-origin(0 0);
-  z-index: z-index(front);
-  top: 250px;
-  left: 0;
-  position: fixed;
+    @include transform(rotate(-90deg));
+    @include transform-origin(0 0);
+    z-index: z-index(front);
+    top: 250px;
+    left: 0;
+    position: fixed;
 
-  a:link,
-  a:visited {
-    cursor: pointer;
-    border: 1px solid $lms-border-color;
-    border-top-style: none;
-    border-radius: 0 0 ($baseline/2) ($baseline/2);
-    background: transparentize(palette(grayscale, white-t), 0.25);
-    color: transparentize(palette(grayscale-cool, x-dark), 0.25);
-    font-weight: bold;
-    text-decoration: none;
-    padding: 6px 22px 11px;
-    display: inline-block;
+    a:link,
+    a:visited {
+        cursor: pointer;
+        border: 1px solid $lms-border-color;
+        border-top-style: none;
+        border-radius: 0 0 ($baseline/2) ($baseline/2);
+        background: transparentize(palette(grayscale, white-t), 0.25);
+        color: transparentize(palette(grayscale-cool, x-dark), 0.25);
+        font-weight: bold;
+        text-decoration: none;
+        padding: 6px 22px 11px;
+        display: inline-block;
 
-    &:hover,
-    &:focus {
-      color: palette(grayscale, white-t);
-      background: palette(primary, base);
+        &:hover,
+        &:focus {
+            color: palette(grayscale, white-t);
+            background: palette(primary, base);
+        }
     }
-  }
 }
 
 .help-buttons {
-  padding: ($baseline/2) ($baseline*2.5);
+    padding: ($baseline/2) ($baseline*2.5);
 
-  a:link, a:visited {
-    padding: ($baseline*0.75) 0;
-    text-align: center;
-    cursor: pointer;
-    background: palette(grayscale, white-t);
-    text-decoration: none;
-    display: block;
-    border: 1px solid $lms-border-color;
+    a:link,
+    a:visited {
+        padding: ($baseline*0.75) 0;
+        text-align: center;
+        cursor: pointer;
+        background: palette(grayscale, white-t);
+        text-decoration: none;
+        display: block;
+        border: 1px solid $lms-border-color;
 
-    &#feedback_link_problem {
-      border-bottom-style: none;
-      border-radius: ($baseline/2) ($baseline/2) 0 0;
+        &#feedback_link_problem {
+            border-bottom-style: none;
+            border-radius: ($baseline/2) ($baseline/2) 0 0;
+        }
+
+        &#feedback_link_question {
+            border-top-style: none;
+            border-radius: 0 0 ($baseline/2) ($baseline/2);
+        }
+
+        &:hover,
+        &:focus {
+            color: palette(grayscale, white-t);
+            background: palette(primary, base);
+        }
     }
-
-    &#feedback_link_question {
-      border-top-style: none;
-      border-radius: 0 0 ($baseline/2) ($baseline/2);
-    }
-
-    &:hover, &:focus {
-      color: palette(grayscale, white-t);
-      background: palette(primary, base);
-    }
-  }
 }
 
 #feedback_form {
-  input,
-  textarea {
-    font: {
-      size: font-size(base);
-      family: $font-family-sans-serif;
+    input,
+    textarea {
+        font: {
+            size: font-size(base);
+            family: $font-family-sans-serif;
+        }
+        line-height: 1.4;
+    }
+
+    textarea[name="details"] {
+        height: 150px;
     }
-    line-height: 1.4;
-  }
-  textarea[name="details"] {
-    height: 150px;
-  }
 }
 
 #feedback_success_wrapper {
-  p {
-    padding: 0 $baseline $baseline $baseline;
-  }
+    p {
+        padding: 0 $baseline $baseline;
+    }
 }
diff --git a/lms/static/sass/shared-v2/_modal.scss b/lms/static/sass/shared-v2/_modal.scss
index cc95a4b72d..d11f9fa35b 100644
--- a/lms/static/sass/shared-v2/_modal.scss
+++ b/lms/static/sass/shared-v2/_modal.scss
@@ -1,6 +1,5 @@
 #lean_overlay {
     @include background-image(radial-gradient(circle at 50% 30%, $shadow-d1, $shadow-d2));
-    background: transparent;
     display: none;
     height:100%;
     left: 0;
@@ -27,7 +26,7 @@
         background: $modal-bg-color;
         border-radius: 0;
         border: 1px solid $lms-border-color;
-        box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.7);
+        box-shadow: inset 0 1px 0 0 $white-opacity-70;
         overflow: hidden;
         padding-left: ($baseline/2);
         padding-right: ($baseline/2);
@@ -54,8 +53,14 @@
             position: relative;
 
             &::before {
-                @include background-image(radial-gradient(50% 50%, circle closest-side, rgba(255,255,255, 0.8) 0%, rgba(255,255,255, 0) 100%));
-                content: "";
+                @include background-image(
+                    radial-gradient(
+                        50% 50%, circle closest-side,
+                        $white-opacity-80 0%,
+                        $white-transparent 100%
+                    )
+                );
+                content: '';
                 display: block;
                 height: 400px;
                 left: 0;
@@ -63,24 +68,34 @@
                 position: absolute;
                 top: -140px;
                 width: 100%;
-                z-index: 1;
+                z-index: z-index(base);
             }
 
             hr {
-                @include background-image(linear-gradient(180deg, rgba(255,255,255, 0) 0%,
-                        rgba(255,255,255, 0.8) 50%,
-                        rgba(255,255,255, 0)));
+                @include background-image(
+                    linear-gradient(
+                        180deg,
+                        $white-transparent 0%,
+                        $white-opacity-80 50%,
+                        $white-transparent
+                    )
+                );
                 height: 1px;
                 width: 100%;
                 border: none;
                 margin: 0;
                 position: relative;
-                z-index: 2;
+                z-index: z-index(base);
 
                 &::after {
-                    @include background-image(linear-gradient(180deg, rgba(200,200,200, 0) 0%,
-                            rgba(200,200,200, 1) 50%,
-                            rgba(200,200,200, 0)));
+                    @include background-image(
+                        linear-gradient(
+                            180deg,
+                            $light-grey-transparent 0%,
+                            $light-grey-solid 50%,
+                            $light-grey-transparent
+                        )
+                    );
                     height: 1px;
                     width: 100%;
                     bottom: 0;
@@ -95,8 +110,8 @@
                 @extend .hd-4;
                 position: relative;
                 text-align: center;
-                text-shadow: 0 1px rgba(255,255,255, 0.4);
-                z-index: 2;
+                text-shadow: 0 1px $white-opacity-40;
+                z-index: z-index(base);
                 text-transform: uppercase;
                 font-family: $font-family-serif;
 
@@ -107,9 +122,9 @@
         }
 
         .modal-form-error {
-            background: tint($red,90%);
-            border: 1px solid rgb(143, 14, 14);
-            color: rgb(143, 14, 14);
+            background: palette(error, xx-trans);
+            border: 1px solid palette(error, dark);
+            color: palette(error, dark);
             display: none;
             margin-bottom: $baseline;
             padding: 12px;
@@ -140,8 +155,8 @@
 
             .input-group {
                 @include clearfix();
-                border-bottom: 1px solid rgb(210,210,210);
-                box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
+                border-bottom: 1px solid palette(grayscale, light);
+                box-shadow: 0 1px 0 0 $white-opacity-60;
                 margin-bottom: ($baseline*1.5);
                 padding-bottom: ($baseline/2);
             }
@@ -156,11 +171,12 @@
 
                 &.field-error {
                     display: block;
-                    color: #8F0E0E;
+                    color: palette(error, dark);
 
-                    + input, + textarea {
-                        border: 1px solid #CA1111;
-                        color: #8F0E0E;
+                    + input,
+                    + textarea {
+                        border: 1px solid palette(error, dark);
+                        color: palette(error, dark);
                     }
                 }
             }
@@ -170,7 +186,7 @@
             }
 
             textarea {
-                background: rgb(255,255,255);
+                background: palette(grayscale, white-t);
                 display: block;
                 height: 45px;
                 margin-bottom: $baseline;
@@ -180,7 +196,7 @@
             input[type="email"],
             input[type="text"],
             input[type="password"] {
-                background: rgb(255,255,255);
+                background: palette(grayscale, white-t);
                 display: block;
                 height: 45px;
                 margin-bottom: $baseline;
@@ -240,7 +256,7 @@
     #help_wrapper,
     #feedback_form_wrapper,
     .discussion-alert-wrapper {
-        padding: 0 ($baseline*1.5) ($baseline*1.5) ($baseline*1.5);
+        padding: 0 ($baseline*1.5) ($baseline*1.5);
 
         header {
             @include padding-left(0);
diff --git a/lms/static/sass/shared-v2/_variables.scss b/lms/static/sass/shared-v2/_variables.scss
index 81542474c0..bc473d1a98 100644
--- a/lms/static/sass/shared-v2/_variables.scss
+++ b/lms/static/sass/shared-v2/_variables.scss
@@ -7,6 +7,15 @@ $lms-border-color: palette(grayscale, light);
 $lms-label-color: palette(grayscale, black);
 $lms-active-color: palette(primary, base);
 
+$white-transparent: rgba(255, 255, 255, 0);
+$white-opacity-40: rgba(255, 255, 255, 0.4);
+$white-opacity-60: rgba(255, 255, 255, 0.6);
+$white-opacity-70: rgba(255, 255, 255, 0.7);
+$white-opacity-80: rgba(255, 255, 255, 0.8);
+
+$light-grey-transparent: rgba(200,200,200, 0);
+$light-grey-solid: rgba(200,200,200, 1);
+
 // Icons
 $lms-dark-icon-color: palette(grayscale, white-t);
 $lms-dark-icon-background-color: palette(grayscale, black);