diff --git a/src/main/java/org/olat/ims/qti21/ui/components/_content/hotspotInteraction.html b/src/main/java/org/olat/ims/qti21/ui/components/_content/hotspotInteraction.html
index 3baa0c506be0909413db2db0c16f653408b68af3..f9b50d33366c8f55f265f4a2e94baead42b5bedb 100644
--- a/src/main/java/org/olat/ims/qti21/ui/components/_content/hotspotInteraction.html
+++ b/src/main/java/org/olat/ims/qti21/ui/components/_content/hotspotInteraction.html
@@ -25,9 +25,10 @@
 	<script type="text/javascript">
 	jQuery(function() {
 		jQuery('#${qtiContainerId}_img').maphilight({
-			fillColor: '888888',
-			strokeColor: '333333',
-			strokeOpacity: 0.5,
+			fillColor: 'bbbbbb',
+        	fillOpacity: 0.5,
+			strokeColor: '666666',
+			strokeOpacity: 0.8,
 			strokeWidth: 3,
 			alwaysOn: true
 		});
diff --git a/src/main/webapp/static/js/jquery/qti/jquery.hotspot.js b/src/main/webapp/static/js/jquery/qti/jquery.hotspot.js
index 26823d09e1aa1815ace1be50b581a8482be6dc68..2d35266e6cea7bb7968ad98d7c8c012d0eefe8d6 100644
--- a/src/main/webapp/static/js/jquery/qti/jquery.hotspot.js
+++ b/src/main/webapp/static/js/jquery/qti/jquery.hotspot.js
@@ -96,19 +96,21 @@
     function colorData(data) {
     	if(data.selectedOn) {
         	data.fillColor = '0000ff';
+        	data.fillOpacity = 0.5;
     		data.strokeColor = '0000ff';
     		data.strokeOpacity = 1;
     		data.shadow = true;
-    		data.shadowX = 4;
-    		data.shadowY = 4;
-    		data.shadowRadius = 8;
+    		data.shadowX = 0;
+    		data.shadowY = 0;
+    		data.shadowRadius = 7;
     		data.shadowColor = '000000';
     		data.shadowOpacity = 0.8;
     		data.shadowPosition = 'outside';
     	} else {
-        	data.fillColor = '888888';
-    		data.strokeColor = '333333';
-    		data.strokeOpacity = 0.5;
+			data.fillColor = 'bbbbbb';
+        	data.fillOpacity = 0.5;
+    		data.strokeColor = '666666';
+    		data.strokeOpacity = 0.8;
     		data.shadow = false;
     	}
     }