diff --git a/customize.dist/loading.js b/customize.dist/loading.js
index 29c2dd988..e41ef807b 100644
--- a/customize.dist/loading.js
+++ b/customize.dist/loading.js
@@ -33,6 +33,9 @@ define(['/customize/messages.js'], function (Messages) {
   align-items: center;
   font: 20px 'Open Sans', 'Helvetica Neue', sans-serif !important;
 }
+#cp-loading.cp-loading-transparent {
+    background-color: rgba(231, 231, 231, 0.7);
+}
 #cp-loading.cp-loading-hidden {
   opacity: 0;
   visibility: hidden;
diff --git a/www/common/common-interface.js b/www/common/common-interface.js
index 5ede42982..a12b759f7 100644
--- a/www/common/common-interface.js
+++ b/www/common/common-interface.js
@@ -866,6 +866,7 @@ define([
             // Show the loading screen
             $loading.css('display', '');
             $loading.removeClass('cp-loading-hidden');
+            $loading.removeClass('cp-loading-transparent');
             if (config.newProgress) {
                 // XXX re-add progress bar for step 6 after password prompt for PPP
                 // XXX also burn after reading
@@ -918,7 +919,8 @@ define([
         $loading.find('.cp-loading-progress').remove();
         // Hide the spinner
         $('.cp-loading-spinner-container').hide();
-        if (transparent) { $loading.css('opacity', 0.9); }
+        $loading.removeClass('cp-loading-transparent');
+        if (transparent) { $loading.addClass('cp-loading-transparent'); }
 
         // Add the error message
         var $error = $loading.find('#cp-loading-message').show();