diff --git a/.gitignore b/.gitignore
index 8f322f0..100bd8f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,7 +4,7 @@
 /node_modules
 /.pnp
 .pnp.js
-
+.env
 # testing
 /coverage
 
diff --git a/src/app/container_page.tsx b/src/app/container_page.tsx
index 303fab9..f4e222e 100644
--- a/src/app/container_page.tsx
+++ b/src/app/container_page.tsx
@@ -1,5 +1,6 @@
 import Footer from '~/components/footer/Footer';
 import NavBar from '~/components/navBar/navBar';
+import Categories from '~/components/categories/categories';
 
 type ContainerPageProps = {
   children: React.ReactNode;
@@ -18,7 +19,10 @@ export function ContainerPage({
     <>
       {typeof nav === 'boolean' && nav ? <NavBar /> : nav}
       {header && header}
-      <main className="min-h-screen overflow-hidden mx-auto">{children}</main>
+      <main className="min-h-screen overflow-hidden mx-auto">
+        <Categories/>
+        {children}
+      </main>
       {footer && <Footer />}
     </>
   );
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 640cd85..4c46aef 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,6 +1,6 @@
 'use client';
 import './globals.css';
-import type { Metadata } from 'next';
+
 import { Inter } from 'next/font/google';
 
 import { AuthContextProvider } from '../context/AuthContext';
@@ -8,10 +8,6 @@ import { ThemeProvider } from 'next-themes';
 
 const inter = Inter({ subsets: ['latin'] });
 
-export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app',
-};
 
 export default function RootLayout({
   children,
diff --git a/src/app/products/page.tsx b/src/app/products/page.tsx
index ba7cf29..931c244 100644
--- a/src/app/products/page.tsx
+++ b/src/app/products/page.tsx
@@ -2,6 +2,5 @@ import { ContainerPage } from '../container_page';
 
 export default function Landing() {
   return <ContainerPage>
-    Products page
   </ContainerPage>;
 }
diff --git a/src/components/categories/categories.tsx b/src/components/categories/categories.tsx
new file mode 100644
index 0000000..d250452
--- /dev/null
+++ b/src/components/categories/categories.tsx
@@ -0,0 +1,17 @@
+const Categories = () => {
+    return(
+        <div className="hidden w-full h-[60px] md:block mt-16 bg-opacity-70 bg-white shadow">
+            <ul className="flex justify-around items-center w-full h-full font-medium">
+                <li>Repuestos</li>
+                <li>Exterior</li>
+                <li>Bombillos</li>
+                <li>Farolas</li>
+                <li>Stops</li>
+                <li>Exploradoras</li>
+                <li>Audio</li>
+                <li>Interior</li>
+            </ul>
+        </div>
+    )
+}
+export default Categories;
\ No newline at end of file
diff --git a/src/components/navBar/navBar.tsx b/src/components/navBar/navBar.tsx
index 4b4a8ab..debfa2d 100644
--- a/src/components/navBar/navBar.tsx
+++ b/src/components/navBar/navBar.tsx
@@ -23,8 +23,8 @@ const NavBar: FC<NavBarProps> = ({}) => {
 
   return (
     <div>
-      <div className="z-50 fixed top-0 bg-opacity-70 bg-white w-full backdrop-blur-sm flex-col shadow-sm">
-        <nav className="p-4 flex items-center h-[60px] justify-between mx-auto">
+      <div className="z-50 fixed top-0 bg-opacity-70 bg-white w-full backdrop-blur-sm flex-col">
+        <nav className="p-4 flex items-center h-[60px] justify-between mx-auto my-1">
           {/* Contenedor lado izquierdo menu hamburguesa-imagenes*/}
           <div className="flex items-center gap-2">
             {/* Icono hamburguesa */}
@@ -68,7 +68,7 @@ const NavBar: FC<NavBarProps> = ({}) => {
             <div className="flex items-center justify-center ">
               <InputField
                 style={{ width: '50vw' }}
-                className="shadow-md bg-opacity-70 bg-white "
+                className="bg-opacity-70 bg-white "
                 placeholder="Buscar Productos"
                 leftIcon={<Icon icon="SearchIcon" />}
               />
diff --git a/src/types/icons.d.ts b/src/types/icons.d.ts
index fb3def8..584064a 100644
--- a/src/types/icons.d.ts
+++ b/src/types/icons.d.ts
@@ -1 +1 @@
-export type IconTypes = | 'CardCredit' | 'CarShoping' | 'Cash' | 'Close' | 'Facebook' | 'HamburguerClose' | 'HamburguerOpen' | 'Heart' | 'icon' | 'Instagram' | 'Login' | 'MapLocation' | 'Moon' | 'quotationMarks' | 'SearchIcon' | 'Shield' | 'Sun' | 'Truck' | 'warranty' | 'Whatsapp' 
\ No newline at end of file
+export type IconTypes = | 'CarShoping' | 'CardCredit' | 'Cash' | 'Close' | 'Facebook' | 'HamburguerClose' | 'HamburguerOpen' | 'Heart' | 'Instagram' | 'Login' | 'MapLocation' | 'Moon' | 'SearchIcon' | 'Shield' | 'Sun' | 'Truck' | 'Whatsapp' | 'icon' | 'quotationMarks' | 'warranty' 
\ No newline at end of file