diff --git a/src/index.html b/src/index.html
index a9a7bfc..25a64c1 100644
--- a/src/index.html
+++ b/src/index.html
@@ -16,65 +16,7 @@
 </head>
 
 <body>
-<!-- offer-->
-
-<div class="py-3  relative bg-[#191c1e] flex flex-col sm:flex-row justify-between items-center">
-  <!--  Black Friday -->
-  <div class="flex items-center gap-2.5  sm:ml-[100px] lg:ml-[200px] ">
-    <!-- Banner div  -->
-    <div class="px-2.5 py-1.5 bg-[#f3de6d] -rotate-3">
-      <span class="text-[#191c1e] text-base sm:text-xl ">Black</span>
-    </div>
-    <!-- Main heading -->
-    <h1 class="text-white text-lg sm:text-2xl ">Friday</h1>
-  </div>
 
-  <!--   Discount  -->
-  <div class="flex items-center gap-2 my-4 sm:my-0">
-    <span class="text-white text-xs sm:text-sm font-medium font-['Public Sans'] ">Up to</span>
-    <strong class="text-[#eac70b] text-2xl sm:text-[40px]   ">59%</strong>
-    <span class="text-white text-sm sm:text-xl  ">OFF</span>
-  </div>
-
-  <!-- shop now -->
-  <button class="flex items-center  sm:mr-[100px] lg:mr-[200px]">
-    <div class="h-11 px-3 bg-[#eac70b] rounded-sm justify-center items-center gap-2 inline-flex">
-      <div class="text-[#191c1e] text-sm sm:text-base font-bold font-['Public Sans'] uppercase  tracking-tight">Shop
-        now</div>
-      <i class="fa fa-arrow-right" aria-hidden="true"></i>
-    </div>
-  </button>
-
-  <!-- Exit Button -->
-  <button class="p-2 right-4 sm:right-6 absolute bg-[#303639] rounded-sm flex items-center">
-    <i class="fa-solid fa-x text-white text-xs"></i>
-  </button>
-</div>
-
-<!-- contact bar-->
-<div class="  lg:px-[150px] w-full py-2 bg-[#f8f8f8] justify-between items-center gap-2 flex flex-col lg:flex-row">
-  <ul class=" hidden sm:flex text-center min-[360px]:gap-3  ">
-    <li class="self-stretch text-[#666666] text-[13px] flex "><img class="w-5 mx-1 h-5"
-                                                                   src="../assets/images/icon.svg" alt=""> English-EG</li>
-    <li class="m-1.5 w-0 h-[10px]  border  border-[#d6d6d6]"></li>
-    <li class="self-stretch text-[#666666] text-[13px] ">Lorem, ipsum.
-    </li>
-    <li class="m-1.5 w-0  h-[10px]  border  border-[#d6d6d6]"></li>
-    <li class="self-stretch text-[#666666] text-[13px] ">Lorem, ipsum.</li>
-    <li class="m-1.5 w-0 ma h-[10px]  border  border-[#d6d6d6]"></li>
-    <li class="text-[#666666] text-[13px] flex ">Lorem, ipsum.</li>
-
-  </ul>
-
-  <ul class="flex gap-2 pt-[3px] pb-0.5">
-    <li class=" text-[#666666] text-[13px] ">Support@salla.sa <i
-            class="pl-2 fa-regular text-[#62D0B6]  fa-envelope"></i> </li>
-    <li class="m-1.5 shrink-0  mx-0 h-[10px]  border  border-[#d6d6d6]"></li>
-    <li class="text-[#666666] text-[13px] ">+966556754472 <i
-            class=" pr-2 fa-solid fa-phone-volume text-[#62D0B6] transform -scale-x-100"></i>
-    </li>
-  </ul>
-</div>
   <!-- Navbar -->
   <div id="navbar"></div>
 
diff --git a/src/offer&nav.html b/src/offer&nav.html
index a6c40f0..18ebccc 100644
--- a/src/offer&nav.html
+++ b/src/offer&nav.html
@@ -8,7 +8,64 @@
 </head>
 <body>
 
-
+<!-- offer-->
+
+<div class="py-3  relative bg-[#191c1e] flex flex-col sm:flex-row justify-between items-center">
+  <!--  Black Friday -->
+  <div class="flex items-center gap-2.5  sm:ml-[100px] lg:ml-[200px] ">
+    <!-- Banner div  -->
+    <div class="px-2.5 py-1.5 bg-[#f3de6d] -rotate-3">
+      <span class="text-[#191c1e] text-base sm:text-xl ">Black</span>
+    </div>
+    <!-- Main heading -->
+    <h1 class="text-white text-lg sm:text-2xl ">Friday</h1>
+  </div>
+
+  <!--   Discount  -->
+  <div class="flex items-center gap-2 my-4 sm:my-0">
+    <span class="text-white text-xs sm:text-sm font-medium font-['Public Sans'] ">Up to</span>
+    <strong class="text-[#eac70b] text-2xl sm:text-[40px]   ">59%</strong>
+    <span class="text-white text-sm sm:text-xl  ">OFF</span>
+  </div>
+
+  <!-- shop now -->
+  <button class="flex items-center  sm:mr-[100px] lg:mr-[200px]">
+    <div class="h-11 px-3 bg-[#eac70b] rounded-sm justify-center items-center gap-2 inline-flex">
+      <div class="text-[#191c1e] text-sm sm:text-base font-bold font-['Public Sans'] uppercase  tracking-tight">Shop
+        now</div>
+      <i class="fa fa-arrow-right" aria-hidden="true"></i>
+    </div>
+  </button>
+
+  <!-- Exit Button -->
+  <button class="p-2 right-4 sm:right-6 absolute bg-[#303639] rounded-sm flex items-center">
+    <i class="fa-solid fa-x text-white text-xs"></i>
+  </button>
+</div>
+
+<!-- contact bar-->
+<div class="  lg:px-[150px] w-full py-2 bg-[#f8f8f8] justify-between items-center gap-2 flex flex-col lg:flex-row">
+  <ul class=" hidden sm:flex text-center min-[360px]:gap-3  ">
+    <li class="self-stretch text-[#666666] text-[13px] flex "><img class="w-5 mx-1 h-5" src="../assets/images/icon.svg" alt=""> English-EG</li>
+    <li class="m-1.5 w-0 h-[10px]  border  border-[#d6d6d6]"></li>
+    <li class="self-stretch text-[#666666] text-[13px] ">Lorem, ipsum.
+    </li>
+    <li class="m-1.5 w-0  h-[10px]  border  border-[#d6d6d6]"></li>
+    <li class="self-stretch text-[#666666] text-[13px] ">Lorem, ipsum.</li>
+    <li class="m-1.5 w-0 ma h-[10px]  border  border-[#d6d6d6]"></li>
+    <li class="text-[#666666] text-[13px] flex ">Lorem, ipsum.</li>
+
+  </ul>
+
+  <ul class="flex gap-2 pt-[3px] pb-0.5">
+    <li class=" text-[#666666] text-[13px] ">Support@salla.sa <i
+            class="pl-2 fa-regular text-[#62D0B6]  fa-envelope"></i> </li>
+    <li class="m-1.5 shrink-0  mx-0 h-[10px]  border  border-[#d6d6d6]"></li>
+    <li class="text-[#666666] text-[13px] ">+966556754472 <i
+            class=" pr-2 fa-solid fa-phone-volume text-[#62D0B6] transform -scale-x-100"></i>
+    </li>
+  </ul>
+</div>
     <!--  navbar-->
     <nav>
 
