diff --git a/util/transformSrc.js b/util/transformSrc.js
index 9162ebd2..3e0b6603 100644
--- a/util/transformSrc.js
+++ b/util/transformSrc.js
@@ -1,4 +1,5 @@
 import { bucket } from "../data/site.yaml";
+const path = require('path');
 
 // change provided srcs (png & mp4) to external bucket location for production.
 export const transformSrc = (src, dir = "") => {
@@ -13,8 +14,8 @@ export const transformSrc = (src, dir = "") => {
     process.env.NEXT_PUBLIC_NETLIFY_CONTEXT === "production" && // Not a deploy preview
     !src.endsWith("svg")
   ) {
-    return bucket + dir + src;
+    return path.join(bucket, dir, src);
   } else {
-    return dir + src;
+    return path.join(dir, src);
   }
 };
\ No newline at end of file