diff --git a/src/mapml.css b/src/mapml.css
index 6091526c8..871e2667d 100644
--- a/src/mapml.css
+++ b/src/mapml.css
@@ -107,15 +107,20 @@
   text-align: center;
 }
 
-.mapml-reload-button:not([aria-disabled="true"]):hover {
+.mapml-reload-button:hover,
+.mapml-reload-button[aria-disabled="true"] {
   background-color: #f4f4f4;
 }
 
 .mapml-reload-button[aria-disabled="true"] {
-  color: #bbb;
   cursor: default;
 }
 
+button.mapml-button:disabled,
+.mapml-button[aria-disabled="true"] {
+  color: #bbb;
+}
+
 .leaflet-control-layers-toggle {
   width: 44px !important;
   height: 44px !important;
@@ -679,12 +684,6 @@ svg.leaflet-image-layer.leaflet-interactive g {
 * layer item controls
 */
 
-button.mapml-button:disabled,
-.mapml-button[aria-disabled="true"],
-.mapml-layer-item:disabled button.mapml-button {
-  opacity: .3;
-}
-
 .mapml-button-icon {
   pointer-events: none;
 }
diff --git a/src/mapml/layers/MapMLLayer.js b/src/mapml/layers/MapMLLayer.js
index 0fccf6f88..ef1f380f5 100644
--- a/src/mapml/layers/MapMLLayer.js
+++ b/src/mapml/layers/MapMLLayer.js
@@ -624,6 +624,7 @@ export var MapMLLayer = L.Layer.extend({
         svgSettingsControlIcon.setAttribute('viewBox', '0 0 24 24');
         svgSettingsControlIcon.setAttribute('height', '22');
         svgSettingsControlIcon.setAttribute('width', '22');
+        svgSettingsControlIcon.setAttribute('fill', 'currentColor');
         settingsControlPath1.setAttribute('d', 'M0 0h24v24H0z');
         settingsControlPath1.setAttribute('fill', 'none');
         settingsControlPath2.setAttribute('d', 'M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z');