diff --git a/css/map.css b/css/map.css
index d1b2914f3..f96eacc5a 100644
--- a/css/map.css
+++ b/css/map.css
@@ -1182,23 +1182,30 @@ text.gpx {
 }
 
 .layer-mapillary g * {
-    stroke-width: 2;
-    stroke: #ffc600;
+    stroke-width: 1;
+    stroke: #444;
     fill: #ffc600;
 }
 
 .layer-mapillary g:hover * {
-    stroke-width: 2;
-    stroke: #ff9900;
+    stroke-width: 1;
+    stroke: #333;
     fill: #ff9900;
 }
 
-.layer-mapillary g.selected * {
-    stroke-width: 4;
-    stroke: #ff5800;
+.layer-mapillary g.selected  * {
+    stroke-width: 2;
+    stroke: #222;
     fill: #ff5800;
 }
 
+.layer-mapillary g:hover path.viewfield,
+.layer-mapillary g.selected path.viewfield,
+.layer-mapillary g path.viewfield {
+    stroke-width: 0;
+    fill-opacity: 0.6;
+}
+
 /* Modes */
 
 .mode-draw-line .vertex.active,
diff --git a/js/id/renderer/mapillary_layer.js b/js/id/renderer/mapillary_layer.js
index 08dd331ab..179e588bf 100644
--- a/js/id/renderer/mapillary_layer.js
+++ b/js/id/renderer/mapillary_layer.js
@@ -129,12 +129,14 @@ iD.MapillaryLayer = function (context) {
                     .attr('class', 'image');
 
                 enter.append('path')
-                    .attr('d', 'M 0,-5 l 0,-20 l -5,30 l 10,0 l -5,-30');
+                    .attr('class', 'viewfield')
+                    .attr('transform', 'scale(1.5,1.5),translate(-8, -13)')
+                    .attr('d', 'M 6,9 C 8,8.4 8,8.4 10,9 L 16,-2 C 12,-5 4,-5 0,-2 z');
 
                 enter.append('circle')
                     .attr('dx', '0')
                     .attr('dy', '0')
-                    .attr('r', '8');
+                    .attr('r', '6');
 
                 g.attr('transform', transform);