diff --git a/src/components/download/Download.css b/src/components/download/Download.css
index 45df728..76ed5f1 100644
--- a/src/components/download/Download.css
+++ b/src/components/download/Download.css
@@ -35,6 +35,15 @@ section#download {
   margin: 2rem;
 }
 
+.download-link {
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  padding: 0;
+  color: inherit;
+  font: inherit;
+}
+
 .download-icon {
   margin: 1rem 2rem;
   border: 2px solid #fff;
diff --git a/src/components/download/Download.js b/src/components/download/Download.js
index d7f796c..b65adfd 100644
--- a/src/components/download/Download.js
+++ b/src/components/download/Download.js
@@ -30,11 +30,11 @@ const Download = () => {
         </p>
         <IconContext.Provider value={{ size: "15" }}>
           <div className="download-icons">
-            <a  onClick={onButtonClick}>
+            <button onClick={onButtonClick} className="download-link">
               <div className="download-icon">
                 <FaFilePdf /> <p>Resume</p> 
               </div>
-            </a>
+            </button>
             <div className="download-icon">
               <FaFilePdf /> <p>CV</p>
             </div>
diff --git a/src/components/navbar/Navbar.js b/src/components/navbar/Navbar.js
index 18dd2b8..c4ac725 100644
--- a/src/components/navbar/Navbar.js
+++ b/src/components/navbar/Navbar.js
@@ -26,7 +26,7 @@ const Navbar = () => {
           id={showMenu ? "nav-links-mobile" : "nav-links-mobile-hide"}
         >
           <li>
-            <a href="#">Home</a>
+            <a href="#home">Home</a>
           </li>
           <li>
             <a href="#projects">Projects</a>
diff --git a/src/components/projectsExtended/ProjectsExtended.js b/src/components/projectsExtended/ProjectsExtended.js
index 63715ff..8f534fe 100644
--- a/src/components/projectsExtended/ProjectsExtended.js
+++ b/src/components/projectsExtended/ProjectsExtended.js
@@ -1,8 +1,7 @@
-// figure out if this is nessesary or not. perhaps it can be put in a function and hoisted instead.
+// figure out if this is necessary or not. perhaps it can be put in a function and hoisted instead.
 // Import dependencies
-import React, { useRef, useState, useEffect } from "react";
+import React, { useRef, useEffect } from "react";
 import './ProjectsExtended.css';
-import * as tf from "@tensorflow/tfjs";
 import * as cocossd from "@tensorflow-models/coco-ssd";
 import Webcam from "react-webcam";
 import { drawRect } from "./utilities";
@@ -13,49 +12,63 @@ function  ProjectsExtended()
     const webcamRef = useRef(null);
     const canvasRef = useRef(null);
   
-    // Main function
-    const runCoco = async () => {
-      const net = await cocossd.load();
-      console.log("COCOSSD LOaded");
-      //  Loop and detect hands
-      setInterval(() => {
-        detect(net);
-      }, 10);
-    };
-  
-    const detect = async (net) => {
-      // Check data is available
-      //console.log(webcamRef.current);
-      if (
-        typeof webcamRef.current !== "undefined" &&
-        webcamRef.current !== null &&
-        webcamRef.current.video.readyState === 4
-      ) {
-        // Get Video Properties
-        const video = webcamRef.current.video;
-        const videoWidth = webcamRef.current.video.videoWidth;
-        const videoHeight = webcamRef.current.video.videoHeight;
-        //video.play();
-  
-        // Set video width
-        webcamRef.current.video.width = videoWidth;
-        webcamRef.current.video.height = videoHeight;
-  
-        // Set canvas height and width
-        canvasRef.current.width = videoWidth;
-        canvasRef.current.height = videoHeight;
-  
-        // Make Detections
-        const obj = await net.detect(video);
-        console.log(obj);
-  
-        // Draw mesh
-        const ctx = canvasRef.current.getContext("2d");
-        drawRect(obj, ctx); 
-      }
-    };
-  
-    useEffect(()=>{runCoco()},[]);
+    useEffect(() => {
+      // Detect function
+      const detect = async (net) => {
+        // Check data is available
+        //console.log(webcamRef.current);
+        if (
+          typeof webcamRef.current !== "undefined" &&
+          webcamRef.current !== null &&
+          webcamRef.current.video.readyState === 4
+        ) {
+          // Get Video Properties
+          const video = webcamRef.current.video;
+          const videoWidth = webcamRef.current.video.videoWidth;
+          const videoHeight = webcamRef.current.video.videoHeight;
+          //video.play();
+    
+          // Set video width
+          webcamRef.current.video.width = videoWidth;
+          webcamRef.current.video.height = videoHeight;
+    
+          // Set canvas height and width
+          canvasRef.current.width = videoWidth;
+          canvasRef.current.height = videoHeight;
+    
+          // Make Detections
+          const obj = await net.detect(video);
+          console.log(obj);
+    
+          // Draw mesh
+          const ctx = canvasRef.current.getContext("2d");
+          drawRect(obj, ctx); 
+        }
+      };
+
+      // Main function
+      const runCoco = async () => {
+        const net = await cocossd.load();
+        console.log("COCOSSD Loaded");
+        //  Loop and detect hands
+        const intervalId = setInterval(() => {
+          detect(net);
+        }, 10);
+        return intervalId;
+      };
+
+      let intervalId;
+      runCoco().then(id => {
+        intervalId = id;
+      });
+
+      // Cleanup function to clear interval on unmount
+      return () => {
+        if (intervalId) {
+          clearInterval(intervalId);
+        }
+      };
+    }, []);
   
     return (
       <div className="ProjectsExtended">