diff --git a/src/components/HeaderBottom/HeaderBottom.module.scss b/src/components/HeaderBottom/HeaderBottom.module.scss
new file mode 100644
index 0000000..b6bb0e5
--- /dev/null
+++ b/src/components/HeaderBottom/HeaderBottom.module.scss
@@ -0,0 +1,7 @@
+@use '../../variables';
+
+.header-bottom {
+    @media (max-width: 1024px) {
+        display: none;
+    }
+}
diff --git a/src/components/HeaderBottom/HeaderBottom.tsx b/src/components/HeaderBottom/HeaderBottom.tsx
new file mode 100644
index 0000000..7984c44
--- /dev/null
+++ b/src/components/HeaderBottom/HeaderBottom.tsx
@@ -0,0 +1,16 @@
+import React from 'react';
+
+import styles from "./HeaderBottom.module.scss";
+
+import { HeaderNavBar } from '../HeaderNavBar/HeaderNavBar';
+
+const HeaderBottom = () => {
+
+    return (
+        <div className={styles["header-bottom"]}>
+          <HeaderNavBar />
+        </div>
+    );
+}
+
+export {HeaderBottom};
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index 18e007d..4ef54c4 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -3,6 +3,7 @@ import React from 'react';
 import styles from "./Home.module.scss";
 
 import { HeaderTop } from '../components/HeaderTop/HeaderTop';
+import { HeaderBottom } from '../components/HeaderBottom/HeaderBottom';
 
 const Home = () => {
 
@@ -10,6 +11,7 @@ const Home = () => {
     <>
     <header className={styles["header"]}>
       <HeaderTop />
+      <HeaderBottom />
     </header>
 
     <main></main>