diff --git a/lib/draw/BpmnRenderer.js b/lib/draw/BpmnRenderer.js
index 3c22dabf..63cceb6d 100644
--- a/lib/draw/BpmnRenderer.js
+++ b/lib/draw/BpmnRenderer.js
@@ -55,9 +55,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
           })
           .marker(0, 0, 10, 10, 10, 5)
             .attr({
-              markerUnits: 'strokeWidth',
-              markerWidth: 11,
-              markerHeight: 11,
+              markerWidth: 6,
+              markerHeight: 6,
               orient: 'auto',
               overflow: 'visible'
             }));
@@ -71,11 +70,10 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
             strokeWidth: 1,
             strokeDasharray: '1,0'
           })
-          .marker(0, 0, 10, 10, 4, 4)
+          .marker(0, 0, 12, 12, 6, 6)
             .attr({
-              markerUnits: 'strokeWidth',
-              markerWidth: 14,
-              markerHeight: 14,
+              markerWidth: 10,
+              markerHeight: 10,
               orient: 'auto',
               overflow: 'visible'
             }));
@@ -90,39 +88,25 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
             strokeLinecap: 'round',
             strokeDasharray: '1,0'
           })
-          .marker(0, 0, 10, 10, 11, 5)
+          .marker(0, 0, 12, 12, 12, 6)
             .attr({
-              markerUnits: 'strokeWidth',
-              markerWidth: 12,
-              markerHeight: 12,
+              markerWidth: 10,
+              markerHeight: 10,
               orient: 'auto',
               overflow: 'visible'
             }));
 
-    addMarker('directed-association-end',
-      paper
-        .path('M 0 0 L 10 5 L 0 10 Z')
-          .attr('class', 'djs-connection-marker')
-          .marker(0, 0, 10, 10, 10, 5)
-            .attr({
-              stroke: 'black',
-              fill: 'none',
-              strokeWidth: 1.5,
-              strokeLinecap: 'round',
-              strokeDasharray: '1,0'
-            }));
     addMarker('data-association-end',
       paper
         .path('M 0 0 L 10 5 L 0 10')
         .attr({
           fill: 'white',
-          stroke: 'Black'
+          stroke: 'black'
         })
         .marker(0, 0, 10, 10, 10, 5)
         .attr({
-          markerUnits: 'strokeWidth',
-          markerWidth: 16,
-          markerHeight: 9.6,
+          markerWidth: 8,
+          markerHeight: 6,
           orient: 'auto',
           overflow: 'visible',
           strokeWidth: 1,
@@ -133,40 +117,35 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       paper
         .path('M 0,0 7.089123,3.1832974 0.00383366,6.1129516 -7.0814464,3.1832966 z')
         .attr({
-          fill: 'White',
-          stroke: 'Black'
+          fill: 'white',
+          stroke: 'black'
         })
-        .marker(0, 0, 15, 15, 0, 0)
+        .marker(0, 0, 15, 15, -8, 3)
         .attr({
-          markerUnits: 'strokeWidth',
-          markerWidth: 12,
-          markerHeight: 12,
+          markerWidth: 10,
+          markerHeight: 10,
           orient: 'auto',
           overflow: 'visible',
           strokeWidth: 1,
-          strokeDasharray: '1,0',
-          refX: -8,
-          refY:  3.15
+          strokeDasharray: '1,0'
         }));
 
     addMarker('conditional-default-flow-marker',
       paper
         .path('M 3,0 10,11')
         .attr({
-          fill: 'Black',
-          stroke: 'Black'
+          fill: 'black',
+          stroke: 'black'
         })
-        .marker(0, 0, 15, 15, 0, 0)
+        .marker(0, 0, 10, 10, -6, 5.5)
         .attr({
-          markerUnits: 'strokeWidth',
-          markerWidth: 14,
-          markerHeight: 13,
+          markerWidth: 7,
+          markerHeight: 7,
           orient: 'auto',
           overflow: 'visible',
           strokeWidth: 1,
           strokeDasharray: '1,0',
-          refX: -4,
-          refY:  5.5
+          strokeLinecap: 'round'
         }));
   }
 
@@ -189,9 +168,9 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
     offset = offset || 0;
 
     attrs = computeStyle(attrs, {
-      stroke: 'Black',
-      strokeWidth: 1,
-      fill: 'White'
+      stroke: 'black',
+      strokeWidth: 2,
+      fill: 'white'
     });
 
     var cx = width / 2,
@@ -210,9 +189,9 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
     offset = offset || 0;
 
     attrs = computeStyle(attrs, {
-      stroke: 'Black',
+      stroke: 'black',
       strokeWidth: 2,
-      fill: 'White'
+      fill: 'white'
     });
 
     return p.rect(offset, offset, width - offset * 2, height - offset * 2, r).attr(attrs);
@@ -226,9 +205,9 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
     var points = [x_2, 0, width, y_2, x_2, height, 0, y_2 ];
 
     attrs = computeStyle(attrs, {
-      stroke: 'Black',
+      stroke: 'black',
       strokeWidth: 2,
-      fill: 'White'
+      fill: 'white'
     });
 
     return p.polygon(points).attr(attrs);
@@ -238,9 +217,9 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
     var points = flattenPoints(waypoints);
 
     attrs = computeStyle(attrs, [ 'no-fill' ], {
-      stroke: 'Black',
+      stroke: 'black',
       strokeWidth: 2,
-      fill: 'White'
+      fill: 'white'
     });
 
     return p.polyline(points).attr(attrs);
@@ -249,8 +228,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
   function drawPath(p, d, attrs) {
 
     attrs = computeStyle(attrs, [ 'no-fill' ], {
-      strokeWidth: 1,
-      stroke: 'Black'
+      strokeWidth: 2,
+      stroke: 'black'
     });
 
     return p.path(d).attr(attrs);
@@ -390,8 +369,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         }
       });
 
-      var fill = isThrowing ? 'Black' : 'None';
-      var stroke = isThrowing ? 'White' : 'Black';
+      var fill = isThrowing ? 'black' : 'none';
+      var stroke = isThrowing ? 'white' : 'black';
 
       var messagePath = drawPath(p, pathData, {
         strokeWidth: 1,
@@ -436,7 +415,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         }
       });
 
-      var fill = isThrowing ? 'Black' : 'None';
+      var fill = isThrowing ? 'black' : 'none';
 
       return drawPath(p, pathData, {
         strokeWidth: 1,
@@ -487,7 +466,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         }
       });
 
-      var fill = isThrowing ? 'Black' : 'None';
+      var fill = isThrowing ? 'black' : 'none';
 
       return drawPath(p, pathData, {
         strokeWidth: 1,
@@ -506,7 +485,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         }
       });
 
-      var fill = isThrowing ? 'Black' : 'None';
+      var fill = isThrowing ? 'black' : 'none';
 
       return drawPath(p, pathData, {
         strokeWidth: 1,
@@ -525,7 +504,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         }
       });
 
-      var fill = isThrowing ? 'Black' : 'None';
+      var fill = isThrowing ? 'black' : 'none';
 
       return drawPath(p, pathData, {
         strokeWidth: 1,
@@ -544,7 +523,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         }
       });
 
-      var fill = isThrowing ? 'Black' : 'None';
+      var fill = isThrowing ? 'black' : 'none';
 
       return drawPath(p, pathData, {
         strokeWidth: 1,
@@ -563,7 +542,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         }
       });
 
-      var fill = isThrowing ? 'Black' : 'None';
+      var fill = isThrowing ? 'black' : 'none';
 
       return drawPath(p, pathData, {
         strokeWidth: 1,
@@ -598,7 +577,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
     'bpmn:TerminateEventDefinition': function(p, data) {
       var circle = drawCircle(p, data.width, data.height, 8, {
         strokeWidth: 4,
-        fill: 'Black'
+        fill: 'black'
       });
 
       return circle;
@@ -636,7 +615,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var servicePathBG = drawPath(p, pathDataBG, {
         strokeWidth: 1,
-        fill: 'None'
+        fill: 'none'
       });
 
       var fillPathData = pathMap.getScaledPath('TASK_TYPE_SERVICE_FILL', {
@@ -649,7 +628,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       var serviceFillPath = drawPath(p, fillPathData, {
         strokeWidth: 0,
         stroke: 'none',
-        fill: 'White'
+        fill: 'white'
       });
 
       var pathData = pathMap.getScaledPath('TASK_TYPE_SERVICE', {
@@ -661,7 +640,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var servicePath = drawPath(p, pathData, {
         strokeWidth: 1,
-        fill: 'White'
+        fill: 'white'
       });
 
       return task;
@@ -681,7 +660,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var userPath = drawPath(p, pathData, {
         strokeWidth: 0.5,
-        fill: 'None'
+        fill: 'none'
       });
 
       var pathData2 = pathMap.getScaledPath('TASK_TYPE_USER_2', {
@@ -693,7 +672,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var userPath2 = drawPath(p, pathData2, {
         strokeWidth: 0.5,
-        fill: 'None'
+        fill: 'none'
       });
 
       var pathData3 = pathMap.getScaledPath('TASK_TYPE_USER_3', {
@@ -705,7 +684,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var userPath3 = drawPath(p, pathData3, {
         strokeWidth: 0.5,
-        fill: 'Black'
+        fill: 'black'
       });
 
       return task;
@@ -722,8 +701,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var userPath = drawPath(p, pathData, {
         strokeWidth: 0.25,
-        fill: 'None',
-        stroke: 'Black'
+        fill: 'none',
+        stroke: 'black'
       });
 
       return task;
@@ -744,8 +723,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var sendPath = drawPath(p, pathData, {
         strokeWidth: 1,
-        fill: 'Black',
-        stroke: 'White'
+        fill: 'black',
+        stroke: 'white'
       });
 
       return task;
@@ -899,7 +878,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
     },
     'bpmn:Lane': function(p, data) {
       var rect = drawRect(p, data.width, data.height, 0, {
-        fill: 'None'
+        fill: 'none'
       });
 
       var semantic = getSemantic(data);
@@ -916,7 +895,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var circle = drawCircle(p, data.width, data.height, data.height * 0.24, {
         strokeWidth: 2.5,
-        fill: 'None'
+        fill: 'none'
       });
 
       return diamond;
@@ -937,7 +916,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var exclusivePath = drawPath(p, pathData, {
         strokeWidth: 1,
-        fill: 'Black'
+        fill: 'black'
       });
 
       return diamond;
@@ -958,7 +937,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var complexPath = drawPath(p, pathData, {
         strokeWidth: 1,
-        fill: 'Black'
+        fill: 'black'
       });
 
       return diamond;
@@ -979,7 +958,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var parallelPath = drawPath(p, pathData, {
         strokeWidth: 1,
-        fill: 'Black'
+        fill: 'black'
       });
 
       return diamond;
@@ -992,7 +971,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       var outerCircle = drawCircle(p, data.width, data.height, data.height * 0.20, {
         strokeWidth: 1,
-        fill: 'None'
+        fill: 'none'
       });
 
       var type = semantic.eventGatewayType;
@@ -1013,7 +992,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
         var eventPath = drawPath(p, pathData, {
           strokeWidth: 2,
-          fill: 'None'
+          fill: 'none'
         });
       }
 
@@ -1033,7 +1012,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         var parallelPath = drawPath(p, pathData);
         parallelPath.attr({
           strokeWidth: 1,
-          fill: 'None'
+          fill: 'none'
         });
       } else if((type === 'Exclusive') && instantiate) {
 
@@ -1043,7 +1022,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         var innerCircle = drawCircle(p, data.width, data.height, data.height * 0.26);
         innerCircle.attr({
           strokeWidth: 1,
-          fill: 'None'
+          fill: 'none'
         });
         drawEvent();
       }
@@ -1083,28 +1062,21 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       return path;
     },
     'bpmn:Association': function(p, data) {
-      var polyline = drawLine(p, data.waypoints);
 
       // TODO(nre): style according to directed state
-      return polyline.attr({
+      return drawLine(p, data.waypoints, {
         strokeDasharray: '3,3'
       });
     },
     'bpmn:DataInputAssociation': function(p, data) {
-      var polyline = drawLine(p, data.waypoints);
-
-      return polyline.attr({
-        strokeDasharray: '1,4',
-        strokeWidth: '1',
+      return drawLine(p, data.waypoints, {
+        strokeDasharray: '2,4',
         markerEnd: marker('data-association-end')
       });
     },
     'bpmn:DataOutputAssociation': function(p, data) {
-      var polyline = drawLine(p, data.waypoints);
-
-      return polyline.attr({
-        strokeDasharray: '1,4',
-        strokeWidth: '1',
+      return drawLine(p, data.waypoints, {
+        strokeDasharray: '2,4',
         markerEnd: marker('data-association-end')
       });
     },
@@ -1116,8 +1088,9 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       var path = drawPath(p, pathData, {
         markerEnd: marker('messageflow-end'),
         markerStart: marker('messageflow-start'),
-        strokeDasharray: '3',
-        strokeWidth : 1
+        strokeDasharray: '10',
+        strokeLinecap: 'round',
+        strokeWidth: 1
       });
 
       if (!!di.messageVisibleKind) {
@@ -1133,11 +1106,11 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
         var messageAttrs = { strokeWidth: 1 };
 
         if (di.messageVisibleKind === 'initiating') {
-          messageAttrs.fill = 'White';
-          messageAttrs.stroke = 'Black';
+          messageAttrs.fill = 'white';
+          messageAttrs.stroke = 'black';
         } else {
           messageAttrs.fill = '#888';
-          messageAttrs.stroke = 'White';
+          messageAttrs.stroke = 'white';
         }
 
         drawPath(p, markerPathData, messageAttrs);
@@ -1189,7 +1162,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       // arrow
       var dataInput = drawPath(p, arrowPathData, {
         strokeWidth: 1,
-        fill: 'Black'
+        fill: 'black'
       });
 
       return dataObject;
@@ -1207,8 +1180,8 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       });
 
       var dataStore = drawPath(p, DATA_STORE_PATH, {
-        strokeWidth: 1,
-        fill: 'Black',
+        strokeWidth: 2,
+        fill: 'black',
         strokeMiterlimit: 4,
         'stroke-linejoin': 'miter',
         strokeLinecap: 'butt',
@@ -1225,8 +1198,15 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       var semantic = getSemantic(data),
           cancel = semantic.cancelActivity;
 
-      var outer = renderer('bpmn:Event')(p, data, cancel ? null : { strokeDasharray: '4' });
-      var inner = drawCircle(p, data.width, data.height, INNER_OUTER_DIST, cancel ? null : { strokeDasharray: '5' });
+      var outer = renderer('bpmn:Event')(p, data, cancel ? null : {
+        strokeLinecap: 'round',
+        strokeDasharray: '7,6'
+      });
+
+      var inner = drawCircle(p, data.width, data.height, INNER_OUTER_DIST, cancel ? null : {
+        strokeLinecap: 'round',
+        strokeDasharray: '6'
+      });
 
       renderEventContent(data, p);
 
@@ -1236,7 +1216,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
       return drawRect(p, data.width, data.height, TASK_BORDER_RADIUS, {
         strokeWidth: 1,
         strokeDasharray: '8,3,1,3',
-        fill: 'None',
+        fill: 'none',
         pointerEvents: 'none'
       });
     },
@@ -1332,7 +1312,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
           my: (data.height - 13) / data.height
         }
       });
-      drawPath(p, compensationPath);
+      drawPath(p, compensationPath, { strokeWidth: 1 });
     },
     'LoopMarker': function(p, data, position) {
       var loopPath = pathMap.getScaledPath('MARKER_LOOP', {
@@ -1348,7 +1328,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       drawPath(p, loopPath, {
         strokeWidth: 1,
-        fill: 'None',
+        fill: 'none',
         strokeLinecap: 'round',
         strokeMiterlimit: 0.5
       });
@@ -1367,7 +1347,7 @@ function BpmnRenderer(events, styles, bpmnRegistry, pathMap) {
 
       drawPath(p, loopPath, {
         strokeWidth: 1,
-        fill: 'Black'
+        fill: 'black'
       });
     }
   };