diff --git a/src/containers/Footer/index.tsx b/src/containers/Footer/index.tsx
new file mode 100644
index 0000000..0e27b85
--- /dev/null
+++ b/src/containers/Footer/index.tsx
@@ -0,0 +1,30 @@
+import { BrandContainer, Brand } from '../Navigation/types';
+import { Link } from 'react-router-dom';
+import { NormalText } from '../../common/CreateGameCard/types';
+import { LogoDarkWo } from '../../assets/images';
+import 'twin.macro';
+
+
+const Footer = () => {
+  return (
+    <footer tw="fixed w-full bottom-0">
+      <div tw="container dark:text-blanc flex w-full py-[56px] font-primary items-end gap-x-[10px] justify-between">
+       <BrandContainer tw="mb-[4px]">
+         <div tw="mr-[15px]">
+          <LogoDarkWo tw="w-[25px]" />
+         </div>
+         <Brand>Wega</Brand>
+       </BrandContainer>
+       <div>
+        <span tw="text-[21px] font-[400] leading-[19px]">
+         Play together, Own together
+        </span>
+       </div>
+       <div>
+         <Link to="https://wega.gitbook.io/wega-litepaper/" target="_blank"><NormalText>Documentation</NormalText></Link>
+       </div>
+      </div>
+    </footer>
+  )
+}
+export default Footer;
\ No newline at end of file
diff --git a/src/containers/Layout/index.tsx b/src/containers/Layout/index.tsx
index 1a80cbd..b18659a 100644
--- a/src/containers/Layout/index.tsx
+++ b/src/containers/Layout/index.tsx
@@ -6,10 +6,11 @@ import {
   type useMatches, 
   ScrollRestoration 
 } from 'react-router-dom';
-import 'twin.macro';
 import Navigation from '../Navigation'
+import Footer from '../Footer';
 import { Toaster } from 'react-hot-toast';
 import { GlobalModal } from '../../common/modals';
+import 'twin.macro';
 
 const Layout = () => {
  const navigation = useNavigation();
@@ -38,7 +39,7 @@ const Layout = () => {
      <GlobalModal>
       <Outlet />
      </GlobalModal>
-     <footer tw="container flex justify-center">This is the footer</footer>
+     <Footer />
      <ScrollRestoration getKey={getKey} />
      <Toaster />
     </>
diff --git a/src/containers/PlayPage/index.tsx b/src/containers/PlayPage/index.tsx
index f59bb7e..abd3774 100644
--- a/src/containers/PlayPage/index.tsx
+++ b/src/containers/PlayPage/index.tsx
@@ -31,7 +31,6 @@ const PlayPage = () => {
       <MainContainer>
         <Section 
         direction='col' 
-        tw="h-[300vh]"
         hdr={ <WordCarousel 
           pre="Play, wager and win" 
           className='dark:text-oranjo'