diff --git a/demo/index.html b/demo/index.html
index 7a417c50..c1f2e0b0 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -46,6 +46,7 @@
       .matter-js-compare-build.matter-demo canvas {
         opacity: 0.5;
         background: transparent !important;
+        z-index: 25 !important;
       }
     </style>
   </head>
diff --git a/demo/src/index.ejs b/demo/src/index.ejs
index cb568ca4..ba3197c6 100644
--- a/demo/src/index.ejs
+++ b/demo/src/index.ejs
@@ -35,7 +35,6 @@
         width: 100%;
         height: 100%;
         border: 0;
-        z-index: 1;
         pointer-events: none;
       }
 
@@ -43,9 +42,15 @@
         display: none;
       }
 
+      .matter-js.dev.matter-demo canvas {
+        background: transparent !important;
+        z-index: 20;
+      }
+
       .matter-js-compare-build.matter-demo canvas {
         opacity: 0.5;
         background: transparent !important;
+        z-index: 15 !important;
       }
 
       @media only screen and (min-width: 1300px) {
@@ -54,6 +59,11 @@
           position: relative;
           z-index: 20;
         }
+
+        .matter-js-compare-build.matter-demo canvas {
+          position: relative;
+          z-index: 15;
+        }
       }
     </style>
   </head>