diff --git a/index.css b/index.css
index 359b2ef..bba0212 100644
--- a/index.css
+++ b/index.css
@@ -1,6 +1,6 @@
 body {
   font-family: Arial, Helvetica, sans-serif;
-  background: url('/public/assets/mario-bg.jpg');
+  background: url('/whack-a-mole/public/assets/mario-bg.jpg');
   background-repeat: no-repeat;
   background-size: cover;
   display: flex;
@@ -18,7 +18,7 @@ body {
   max-width: 540px;
   display: flex;
   flex-wrap: wrap;
-  background: url('/public/assets/box-bg.png');
+  background: url('/whack-a-mole/public/assets/box-bg.png');
   border: 4px solid white;
   border-radius: 12px;
   box-shadow: 3px 3px 8px 8px rgba(0, 0, 0, 0.15);
@@ -33,7 +33,7 @@ body {
   height: calc(100% / 3);
   min-width: calc(100% / 3);
   min-height: calc(100% / 3);
-  background: url('/public/assets/pipe.png');
+  background: url('/whack-a-mole/public/assets/pipe.png');
   background-size: contain;
   background-repeat: no-repeat;
   position: relative;
diff --git a/index.html b/index.html
index 02685c8..75fe69c 100644
--- a/index.html
+++ b/index.html
@@ -20,10 +20,10 @@ <h1>Whack A Mole</h1>
   <template id="game-tile">
     <div class="tile">
       <div class="mole">
-        <img class="hidden" src="/public/assets/monty-mole.png" />
+        <img class="hidden" src="/whack-a-mole/public/assets/monty-mole.png" />
       </div>
       <div class="plant">
-        <img class="hidden" src="/public/assets/piranha-plant.png" />
+        <img class="hidden" src="/whack-a-mole/public/assets/piranha-plant.png" />
       </div>
     </div>
   </template>