diff --git a/frontend/src/Components/ExternalNavBar.js b/frontend/src/Components/ExternalNavBar.js
deleted file mode 100644
index 71c1dd0..0000000
--- a/frontend/src/Components/ExternalNavBar.js
+++ /dev/null
@@ -1,99 +0,0 @@
-import React, { useState } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-    faBars,
-    faXmark,
-
-} from "@fortawesome/free-solid-svg-icons";
-import "../Styles/Navbar.css";
-import { Link } from "react-router-dom";
-import Logo from "../Assets/CHS_Logo.png"
-import LanguageSelector from "../Components/LanguageSelector"
-import { useTranslation } from 'react-i18next'
-
-function Navbar(props) {
-    const [nav, setNav] = useState(false);
-    const { t } = useTranslation();
-
-    const openNav = () => {
-        setNav(!nav);
-    };
-
-    return (
-        <div className="navbar-section" >
-            <h1 className="navbar-title">
-                <Link to="/" className="navbar-sign" onclick="reloadPage()">
-                    <img src = {Logo} alt ="Header-logo" />
-                </Link>
-            </h1>
-
-            {/* Desktop */}
-            <ul className ="navbar-items" id="mainNav">
-
-                <li >
-                    <Link to="/" className = "navbar-links">
-                        {t("Home")}
-                    </Link>
-                </li>
-                <li >
-                    <Link to="/searchpage" className = "navbar-links">
-                        {t("search")}
-                    </Link>
-                </li>
-                <li >
-                    <a href="#footer" className = "navbar-links">
-                        {t("explore")}
-                    </a>
-                </li>
-
-                <li>
-
-                    <LanguageSelector/>
-                </li>
-            </ul>
-
-            {/* Mobile */}
-            <div className={`mobile-navbar ${nav ? "open-nav" : ""}`}>
-                <div onClick={openNav} className="mobile-navbar-close">
-                    <FontAwesomeIcon icon={faXmark} className="hamb-icon" />
-                </div>
-
-                <ul className="mobile-navbar-links" id = "mainNav_mobile">
-                    <li>
-                        <Link onClick={openNav} to="/">
-                            {t("Home")}
-                        </Link>
-                    </li>
-                    <li>
-                        <Link onClick={openNav} to="/searchpage">
-                            {t("search")}
-                        </Link>
-                    </li>
-                    <li >
-                        <a onClick={openNav} href = "#footer">
-                            {t("explore")}
-                        </a>
-                    </li>
-                    <li>
-                        <LanguageSelector/>
-                    </li>
-
-                </ul>
-
-
-            </div>
-
-
-            {/* Hamburger Icon */}
-            <div className="mobile-nav">
-                <FontAwesomeIcon
-                    icon={faBars}
-                    onClick={openNav}
-                    className="hamb-icon"
-                />
-            </div>
-        </div>
-    );
-}
-
-export default Navbar;
diff --git a/frontend/src/Pages/SearchPage.js b/frontend/src/Pages/SearchPage.js
index bdb68e8..3e28ca3 100644
--- a/frontend/src/Pages/SearchPage.js
+++ b/frontend/src/Pages/SearchPage.js
@@ -1,11 +1,14 @@
 import React from "react";
 import SearchBar from "../Components/SearchBar";
-import ExNavbar from "../Components/ExternalNavBar";
+import Navbar from "../Components/Navbar";
 import Footer from "../Components/Footer";
 import {useState, useEffect} from "react";
 import "../Styles/ScrollUp.css";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import {  faAngleUp } from "@fortawesome/free-solid-svg-icons";
+import About from "../Components/About";
+import Contact from "../Components/Contact";
+
 
 function SearchPage() {
     const [goUp, setGoUp] = useState(false);
@@ -30,8 +33,10 @@ function SearchPage() {
 
   return(
       <div>
-        <ExNavbar />
+        <Navbar />
         <SearchBar />
+        <About/>
+        <Contact/>
           <Footer />
           <div
               onClick={scrollToTop}
diff --git a/frontend/src/Styles/MeddictSearchBar.css b/frontend/src/Styles/MeddictSearchBar.css
index 61f9e35..39f63ad 100644
--- a/frontend/src/Styles/MeddictSearchBar.css
+++ b/frontend/src/Styles/MeddictSearchBar.css
@@ -437,3 +437,69 @@ body {
   }
 }
 
+@media (max-width: 408px) {
+  .meddict-search {
+    width: 100%;
+    max-width: 390px;
+    margin: 0 auto;
+  }
+
+  .meddict-search input {
+    width: 100%;
+    max-width: 210px;
+  }
+
+  .result-container {
+    flex-direction: column;
+    height: auto;
+    margin-top: 50px;
+  }
+
+  .result-left,
+  .result-right {
+    width: 100%;
+  }
+
+  .result-image {
+    border-radius: 0;
+  }
+
+  .result-card {
+    max-width: 100%;
+  }
+}
+
+@media (max-width: 400px) {
+  .meddict-search {
+    width: 100%;
+    max-width: 380px;
+    margin: 0 auto;
+  }
+
+  .meddict-search input {
+    width: 100%;
+    max-width: 200px;
+  }
+
+  .result-container {
+    flex-direction: column;
+    height: auto;
+    margin-top: 50px;
+  }
+
+  .result-left,
+  .result-right {
+    width: 100%;
+  }
+
+  .result-image {
+    border-radius: 0;
+  }
+
+  .result-card {
+    max-width: 100%;
+  }
+}
+
+
+