diff --git a/main/src/site/notes/_css-sprite-sheets/work2.mp4 b/main/src/site/notes/_css-sprite-sheets/work2.mp4
deleted file mode 100644
index a576f3cb..00000000
Binary files a/main/src/site/notes/_css-sprite-sheets/work2.mp4 and /dev/null differ
diff --git a/main/src/site/notes/_css-sprite-sheets/animation-opaque.png b/main/src/site/notes/css-sprite-sheets/animation-opaque.png
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/animation-opaque.png
rename to main/src/site/notes/css-sprite-sheets/animation-opaque.png
diff --git a/main/src/site/notes/_css-sprite-sheets/animation.png b/main/src/site/notes/css-sprite-sheets/animation.png
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/animation.png
rename to main/src/site/notes/css-sprite-sheets/animation.png
diff --git a/main/src/site/notes/_css-sprite-sheets/hero.png b/main/src/site/notes/css-sprite-sheets/hero.png
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/hero.png
rename to main/src/site/notes/css-sprite-sheets/hero.png
diff --git a/main/src/site/notes/_css-sprite-sheets/index.html b/main/src/site/notes/css-sprite-sheets/index.html
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/index.html
rename to main/src/site/notes/css-sprite-sheets/index.html
diff --git a/main/src/site/notes/_css-sprite-sheets/minecraft.png b/main/src/site/notes/css-sprite-sheets/minecraft.png
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/minecraft.png
rename to main/src/site/notes/css-sprite-sheets/minecraft.png
diff --git a/main/src/site/notes/_css-sprite-sheets/snail.png b/main/src/site/notes/css-sprite-sheets/snail.png
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/snail.png
rename to main/src/site/notes/css-sprite-sheets/snail.png
diff --git a/main/src/site/notes/_css-sprite-sheets/sprite-sheet-demo.html b/main/src/site/notes/css-sprite-sheets/sprite-sheet-demo.html
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/sprite-sheet-demo.html
rename to main/src/site/notes/css-sprite-sheets/sprite-sheet-demo.html
diff --git a/main/src/site/notes/_css-sprite-sheets/star.png b/main/src/site/notes/css-sprite-sheets/star.png
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/star.png
rename to main/src/site/notes/css-sprite-sheets/star.png
diff --git a/main/src/site/notes/_css-sprite-sheets/twitter.png b/main/src/site/notes/css-sprite-sheets/twitter.png
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/twitter.png
rename to main/src/site/notes/css-sprite-sheets/twitter.png
diff --git a/main/src/site/notes/_css-sprite-sheets/work.mp4 b/main/src/site/notes/css-sprite-sheets/work.mp4
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/work.mp4
rename to main/src/site/notes/css-sprite-sheets/work.mp4
diff --git a/main/src/site/notes/css-sprite-sheets/work2.mp4 b/main/src/site/notes/css-sprite-sheets/work2.mp4
new file mode 100644
index 00000000..42b98880
Binary files /dev/null and b/main/src/site/notes/css-sprite-sheets/work2.mp4 differ
diff --git a/main/src/site/notes/_css-sprite-sheets/zoetrope.gif b/main/src/site/notes/css-sprite-sheets/zoetrope.gif
similarity index 100%
rename from main/src/site/notes/_css-sprite-sheets/zoetrope.gif
rename to main/src/site/notes/css-sprite-sheets/zoetrope.gif
diff --git a/main/src/site/notes/index.generated.combined.json b/main/src/site/notes/index.generated.combined.json
index 2fec0aa9..3f8b3a89 100644
--- a/main/src/site/notes/index.generated.combined.json
+++ b/main/src/site/notes/index.generated.combined.json
@@ -1,15 +1,4 @@
 [
- {
-  "href": "/notes/_css-sprite-sheets/",
-  "title": "CSS sprite sheets",
-  "media": "/notes/_css-sprite-sheets/template.jpg",
-  "date": "1 Jan 1970",
-  "public": false,
-  "tags": [
-   "css"
-  ],
-  "suggestions": []
- },
  {
   "href": "/notes/_first-post/",
   "title": "First post!!111",
@@ -83,6 +72,22 @@
    "/notes/debug-css-boxes-bookmarklet/"
   ]
  },
+ {
+  "href": "/notes/css-sprite-sheets/",
+  "title": "CSS sprite sheet animations",
+  "media": "/notes/css-sprite-sheets/hero.png",
+  "date": "3 Nov 2024",
+  "public": true,
+  "tags": [
+   "css"
+  ],
+  "suggestions": [
+   "/notes/pure-css-tictactoe-ai/",
+   "/notes/pure-css-volley-ball-game/",
+   "/notes/debug-css-boxes-bookmarklet/",
+   "/notes/simple-image-recognition-vanilla-js/"
+  ]
+ },
  {
   "href": "/notes/debug-css-boxes-bookmarklet/",
   "title": "Debug CSS boxes with this bookmarklet",
@@ -163,7 +168,7 @@
    "/notes/pure-css-volley-ball-game/",
    "/notes/debug-css-boxes-bookmarklet/",
    "/notes/pure-css-tictactoe-ai/",
-   "/notes/simple-image-recognition-vanilla-js/"
+   "/notes/css-sprite-sheets/"
   ]
  },
  {
@@ -207,9 +212,9 @@
   ],
   "suggestions": [
    "/notes/how-to-center-in-css/",
+   "/notes/css-sprite-sheets/",
    "/notes/simple-image-recognition-vanilla-js/",
-   "/notes/developing-bitwise-input-method/",
-   "/notes/pure-css-tictactoe-ai/"
+   "/notes/developing-bitwise-input-method/"
   ]
  },
  {
diff --git a/main/src/site/notes/index.html b/main/src/site/notes/index.html
index 47ff09fb..4ec71094 100644
--- a/main/src/site/notes/index.html
+++ b/main/src/site/notes/index.html
@@ -6,6 +6,11 @@
       subtitle="An index of notes, links, stories, anything really."
     />
     <card-carousel class="notes-carousel">
+      <blog-post-card
+        href="/notes/pure-css-halftone/"
+        title="CSS halftone effect"
+        description="Creating a halftone effect using HTML / CSS"
+      />
       <blog-post-card
         href="/notes/sweep-and-prune/"
         :media-src="url('sap-preview.mp4')"
@@ -13,9 +18,10 @@
         description="Collision detection algorithm explainer with live demos"
       />
       <blog-post-card
-        href="/notes/pure-css-halftone/"
-        title="CSS halftone effect"
-        description="Creating a halftone effect using HTML / CSS"
+        href="/notes/css-sprite-sheets/"
+        :media-src="url('css-sprite-sheets/work2.mp4')"
+        title="CSS sprite sheets"
+        description="Sprite sheet animations with CSS"
       />
       <blog-post-card
         href="/notes/dynamic-patrol-stealth-games/"
@@ -24,12 +30,6 @@
         title="Patrol behaviour w/ Markov chains"
         description="Stealth game AI algorithm with playable demos"
       />
-      <blog-post-card
-        href="/notes/pure-css-volley-ball-game/"
-        :media-src="url('pure-css-volley-ball-game/video.web.mp4')"
-        title="Pure CSS volley ball"
-        description="Volley ball / tennis game implemented purely using HTML and CSS"
-      />
     </card-carousel>
     <!-- <h2 class="section-title">Interactives</h2>
     <card-carousel class="notes-carousel">