Finally proper overlapping css rules on the tiles

frontend/src/components/Tile.vue

@@ -42,21 +42,27 @@ export default {
   height: 1px;
 }
 .tile-symbol{
-  height: 1px;
+  position: relative;
     border-radius: 10px;
     background: transparent;
     border: none;
     display: inline-block;
 }
 .tile-background{
+  position: absolute;
+  top: 0;
+  left: 0;
     display: inline-block;
+    z-index: 1;
 }
 .tile-front{
+  position: relative;
+  top: 0;
+  left: 0;
   margin: 0;
   padding: 0;
     display: inline-block;
-  transform: translateY(-100%);   
-  -webkit-transform: translateY(-100%);
+    z-index: 2;
   
 
 }