diff --git a/html/script.js b/html/script.js
index 3013633..0777f0c 100644
--- a/html/script.js
+++ b/html/script.js
@@ -2976,12 +2976,19 @@ function initMap() {
 
     initFilters();
 
+    ol.control.LayerSwitcher.forEachRecursive(layers_group, function(lyr) {
+        if (lyr.get('type') != 'base')
+            return;
+        lyr.dimKey = lyr.on('postrender', dim);
+    });
+
     new Toggle({
         key: "MapDim",
         display: "Dim Map",
         container: "#settingsLeft",
         init: MapDim,
         setState: function(state) {
+            /*
             if (!state) {
                 ol.control.LayerSwitcher.forEachRecursive(layers_group, function(lyr) {
                     if (lyr.get('type') != 'base')
@@ -2995,6 +3002,7 @@ function initMap() {
                     lyr.dimKey = lyr.on('postrender', dim);
                 });
             }
+            */
             if (loadFinished) {
                 OLMap.render();
             }
@@ -4940,8 +4948,19 @@ function togglePersistence() {
 
 function dim(evt) {
     try {
-        const dim = mapDimPercentage * (1 + 0.25 * toggles['darkerColors'].state) + layerExtraDim;
-        const contrast = mapContrastPercentage * (1 + 0.1 * toggles['darkerColors'].state) + layerExtraContrast;
+        let currentDimPercentage;
+        let currentContrastPercentage;
+
+        if (toggles['MapDim'].state) {
+            currentDimPercentage = mapDimPercentage;
+            currentContrastPercentage = mapContrastPercentage;
+        } else {
+            currentDimPercentage = mapDimPercentage / 4;
+            currentContrastPercentage = mapContrastPercentage / 4 + 0.01;
+        }
+
+        const dim = currentDimPercentage * (1 + 0.25 * toggles['darkerColors'].state) + layerExtraDim;
+        const contrast = currentContrastPercentage * (1 + 0.1 * toggles['darkerColors'].state) + layerExtraContrast;
         if (dim > 0.0001) {
             evt.context.globalCompositeOperation = 'multiply';
             evt.context.fillStyle = 'rgba(0,0,0,'+dim+')';