diff --git a/public/assets/css/demo-slick/demo-slick.css b/public/assets/css/demo-slick/demo-slick.css
index 86f71f5..19b0fb9 100644
--- a/public/assets/css/demo-slick/demo-slick.css
+++ b/public/assets/css/demo-slick/demo-slick.css
@@ -11,7 +11,7 @@
   --color-gray-1: #697582;
   --color-gray-2: #747f8c;
   --color-gray-3: #8a95a2;
-  --color-primary-1: #1872e8;
+  --color-primary-1: #00898b;
   --color-primary-1-a: #2b87ff;
   --color-primary-light-1: #e3effe;
   --color-primary-light-1-a: #bcd1f1;
diff --git a/public/assets/css/style.css b/public/assets/css/style.css
index fe31300..0fb4a0b 100644
--- a/public/assets/css/style.css
+++ b/public/assets/css/style.css
@@ -191,7 +191,7 @@ Primary use: Multipurpose Template
   --color-gray-light-6: #bbb;
   --color-dark-mode-gray-1: rgba(255, 255, 255, 0.7);
   --color-dark-mode-gray-2: rgba(255, 255, 255, 0.1275);
-  --color-primary-1: #4567ed;
+  --color-primary-1: #00898b;
   --color-primary-1-a: #375ae3;
   --color-primary-light-1: #e3effe;
   --color-primary-light-1-a: #bcd1f1;
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index a269aa1..a4dfdcb 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,5 +1,6 @@
 import Image from "next/image";
-import { FaClock, FaFacebookF, FaFax, FaLinkedinIn, FaMapMarkerAlt, FaPhone } from "react-icons/fa";
+import { FaClock, FaFacebookF, FaFax, FaLinkedinIn, FaMapMarkerAlt } from "react-icons/fa";
+import { GiRotaryPhone } from "react-icons/gi";
 import ScrollToTop from "./ScrollToTop";
 import { fetchContact } from "@/services/payload/contact";
 import { Suspense } from "react";
@@ -53,7 +54,7 @@ async function FooterWithData() {
               </div>
             </li>
             <li className="flex items-center space-x-4 border-b border-gray-500 pb-2">
-              <FaPhone className="text-2xl text-white-300" />
+              <GiRotaryPhone className="text-2xl text-white-300" />
               <a
                 href={`tel:${contact?.phone ?? ""}`}
                 target="_blank"
@@ -141,7 +142,7 @@ function FooterSkeleton() {
               <div className="h-2 bg-gray-300 rounded flex-1"></div>
             </li>
             <li className="flex items-center space-x-4 border-b border-gray-500 pb-2">
-              <FaPhone className="text-2xl text-gray-300" />
+              <GiRotaryPhone className="text-2xl text-gray-300" />
               <div className="h-2 bg-gray-300 rounded flex-1"></div>
               <div className="h-2 bg-gray-300 rounded flex-1"></div>
             </li>