diff --git a/src/assets/videos/demo.mp4 b/remote-assets/demo.mp4
similarity index 100%
rename from src/assets/videos/demo.mp4
rename to remote-assets/demo.mp4
diff --git a/src/assets/videos/index.ts b/src/assets/videos/index.ts
deleted file mode 100644
index e89e22b..0000000
--- a/src/assets/videos/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default as DemoVideo } from './demo.mp4';
\ No newline at end of file
diff --git a/src/components/landing/HeroSection/HeroSection.tsx b/src/components/landing/HeroSection/HeroSection.tsx
index 4816c26..412eab0 100644
--- a/src/components/landing/HeroSection/HeroSection.tsx
+++ b/src/components/landing/HeroSection/HeroSection.tsx
@@ -1,6 +1,5 @@
 import React, { FC } from 'react';
 import { Box, Heading, Text, Center, VStack, BoxProps } from '@chakra-ui/react';
-import { DemoVideo } from '../../../assets/videos';
 import { DemoVideoPosterImg } from '../../../assets/images';
 import { CtaButton, SiteLogo, PageSection } from '../';
 
@@ -11,7 +10,7 @@ export const HeroSection: FC<HeroSectionProps> = ({ flexShrink }) => {
     <Box flexShrink={flexShrink} as='header' pos='relative' zIndex={0}>
       <Box
         as='video'
-        src={DemoVideo}
+        src={`${__webpack_public_path__}/remote-assets/demo.mp4`}
         poster={DemoVideoPosterImg}
         autoPlay
         loop
diff --git a/types.d.ts b/types.d.ts
index e44ab55..62e52ee 100644
--- a/types.d.ts
+++ b/types.d.ts
@@ -16,7 +16,4 @@ declare module "*.webp" {
   export = value;
 }
 
-declare module '*.mp4' {
-  const src: string;
-  export default src;
-}
\ No newline at end of file
+declare const __webpack_public_path__: string;
\ No newline at end of file