diff --git a/src/components/download/banner.jsx b/src/components/download/banner.jsx
new file mode 100644
index 0000000..2cfd1a1
--- /dev/null
+++ b/src/components/download/banner.jsx
@@ -0,0 +1,12 @@
+import React from "react";
+
+function Banner() {
+    return (
+        <div className="rounded-lg m-auto w-full p-4 bg-rhino-purple text-white text-center mt-0 mb-4">
+            <p className="md:mb-0 mb-4">For an archive of previous releases, please visit our <a href="https://sourceforge.net/projects/rhino-linux-builder/files/" className="underline">SourceForge</a>.</p>
+            <p>Looking for our docker images? <a href="https://rhinolinux.org/wiki-docker.html" className="underline">Click here</a>.</p>
+        </div>
+    )
+}
+
+export default Banner;
\ No newline at end of file
diff --git a/src/components/download/selection.jsx b/src/components/download/selection.jsx
new file mode 100644
index 0000000..e0eb814
--- /dev/null
+++ b/src/components/download/selection.jsx
@@ -0,0 +1,60 @@
+import { useState } from 'react';
+import { genericContents, pineContents, rpiContents } from './downloads';
+import Banner from './banner';
+
+const DownloadSelection = () => {
+  const [selectedPlatform, setSelectedPlatform] = useState('generic');
+  
+  // Function to render content based on selected platform
+  const renderContent = () => {
+    let contentArray = [];
+
+    if (selectedPlatform === 'generic') {
+      contentArray = genericContents;
+    } else if (selectedPlatform === 'pine') {
+      contentArray = pineContents;
+    } else if (selectedPlatform === 'rpi') {
+      contentArray = rpiContents;
+    }
+
+    return contentArray.map((content, index) => (
+        <div key={index} className="p-4 my-4 bg-indigo-950 text-white rounded-lg shadow-md">
+            <h3 className="text-2xl">{content.title}</h3>
+            <p className="mt-2"><strong>Kernel:</strong> {content.details.kernel}</p>
+            <p><strong>Download Mirror:</strong> <a href={content.details.downloadMirror} target="_blank" rel="noopener noreferrer" className="text-rhino-purple underline">{content.details.downloadMirror}</a></p>
+            <p><strong>Download Size:</strong> {content.details.downloadSize}</p>
+            <p><strong>Source Code:</strong> <a href={content.details.sourceCode} target="_blank" rel="noopener noreferrer" className="text-rhino-purple underline">{content.details.sourceCode}</a></p>
+            <button onClick={() => {
+                navigator.clipboard.writeText(content.details.shasum);
+                alert('SHA256sum copied to clipboard!');
+            }} className="my-4 hover:scale-105 transition-all bg-rhino-purple text-white px-4 py-2 rounded-lg shadow-md">Copy SHA256sum</button>
+            {content.details.login && (
+                <p><strong>Login:</strong> <br /> Username: {content.details.login.username} <br /> Password: {content.details.login.password}</p>
+            )}
+        </div>
+    ));
+  };
+
+  return (
+    <div className="md:w-[65%] w-full mx-auto md:p-0 p-4">
+      <label htmlFor="platform" className="block text-sm font-medium text-white">Select a platform:</label>
+      <select
+        id="platform"
+        value={selectedPlatform}
+        onChange={(e) => setSelectedPlatform(e.target.value)}
+        className="block w-full mt-2 p-2 bg-indigo-950 text-white text-xl border-2 border-rhino-purple rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
+      >
+        <option value="generic">Generic (x86_64/ARM64)</option>
+        <option value="pine">Pine64 (ARM64)</option>
+        <option value="rpi">Raspberry Pi (ARM64)</option>
+      </select>
+
+      <div className="content-display mt-6">
+        {renderContent()}
+      </div>
+      <Banner />
+    </div>
+  );
+};
+
+export default DownloadSelection;
diff --git a/src/components/download/targetGeneric.jsx b/src/components/download/targetGeneric.jsx
deleted file mode 100644
index 62b7f9e..0000000
--- a/src/components/download/targetGeneric.jsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import React, { useState } from 'react';
-import { genericContents } from './downloads';
-import { motion, AnimatePresence } from 'framer-motion';
-
-function TargetGeneric() {
-    const [openIndex, setOpenIndex] = useState(null);
-
-    const toggleOpen = (index) => {
-        setOpenIndex(openIndex === index ? null : index);
-    };
-
-    return (
-        <div className="w-3/4 mx-auto py-8">
-            {genericContents.map((item, index) => (
-                <div key={item.title} className="border border-rhino-purple text-white text-2xl rounded-md mb-2">
-                    <div 
-                        className="bg-rhino-purple p-4 cursor-pointer" 
-                        onClick={() => toggleOpen(index)}
-                    >
-                        <h2 className="text-2xl">{item.title}</h2>
-                    </div>
-                    <AnimatePresence initial={false}>
-                        {openIndex === index && (
-                            <motion.div
-                                initial={{ height: 0, opacity: 0 }}
-                                animate={{ height: 'auto', opacity: 1 }}
-                                exit={{ height: 0, opacity: 0 }}
-                                transition={{ duration: 0.3 }}
-                                className="overflow-hidden"
-                            >
-                                <div className="p-4">
-                                    <p><a href={item.details.downloadMirror} className="text-rhino-purple underline">Download</a></p>
-                                    <p>Download Size: {item.details.downloadSize}</p>
-                                    <p>Included kernel: {item.details.kernel}</p>
-                                    <p>Source Code: <a href={item.details.sourceCode} className="text-rhino-purple underline">{item.details.sourceCode}</a></p>
-                                    {item.details.login && (
-                                        <div className="border p-2 rounded-md border-rhino-purple border-2 m-2">
-                                            <p>Username: {item.details.login.username}</p>
-                                            <p>Password: {item.details.login.password}</p>
-                                        </div>
-                                    )}
-                                    <p className="text-lg">SHA256sum: {item.details.shasum}</p>
-                                </div>
-                            </motion.div>
-                        )}
-                    </AnimatePresence>
-                </div>
-            ))}
-        </div>
-    );
-}
-
-export default TargetGeneric;
\ No newline at end of file
diff --git a/src/components/download/targetPine.jsx b/src/components/download/targetPine.jsx
deleted file mode 100644
index 30a9f3a..0000000
--- a/src/components/download/targetPine.jsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import React, { useState } from 'react';
-import { pineContents } from './downloads';
-import { motion, AnimatePresence } from 'framer-motion';
-
-function TargetPine() {
-    const [openIndex, setOpenIndex] = useState(null);
-
-    const toggleOpen = (index) => {
-        setOpenIndex(openIndex === index ? null : index);
-    };
-
-    return (
-        <div className="w-3/4 mx-auto py-8">
-            {pineContents.map((item, index) => (
-                <div key={item.title} className="border border-rhino-purple text-white text-2xl rounded-md mb-2">
-                    <div 
-                        className="bg-rhino-purple p-4 cursor-pointer" 
-                        onClick={() => toggleOpen(index)}
-                    >
-                        <h2 className="text-2xl">{item.title}</h2>
-                    </div>
-                    <AnimatePresence initial={false}>
-                        {openIndex === index && (
-                            <motion.div
-                                initial={{ height: 0, opacity: 0 }}
-                                animate={{ height: 'auto', opacity: 1 }}
-                                exit={{ height: 0, opacity: 0 }}
-                                transition={{ duration: 0.3 }}
-                                className="overflow-hidden"
-                            >
-                                <div className="p-4">
-                                    <p><a href={item.details.downloadMirror} className="text-rhino-purple underline">Download</a></p>
-                                    <p>Download Size: {item.details.downloadSize}</p>
-                                    <p>Included kernel: {item.details.kernel}</p>
-                                    <p>Source Code: <a href={item.details.sourceCode} className="text-rhino-purple underline">{item.details.sourceCode}</a></p>
-                                    {item.details.login && (
-                                        <div className="border p-2 rounded-md border-rhino-purple border-2 m-2">
-                                            <p>Username: {item.details.login.username}</p>
-                                            <p>Password: {item.details.login.password}</p>
-                                        </div>
-                                    )}
-                                    <p className="text-lg">SHA256sum: {item.details.shasum}</p>
-                                </div>
-                            </motion.div>
-                        )}
-                    </AnimatePresence>
-                </div>
-            ))}
-        </div>
-    );
-}
-
-export default TargetPine;
\ No newline at end of file
diff --git a/src/components/download/targetRpi.jsx b/src/components/download/targetRpi.jsx
deleted file mode 100644
index d089f9a..0000000
--- a/src/components/download/targetRpi.jsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import React, { useState } from 'react';
-import { rpiContents } from './downloads';
-import { motion, AnimatePresence } from 'framer-motion';
-
-function TargetRpi() {
-    const [openIndex, setOpenIndex] = useState(null);
-
-    const toggleOpen = (index) => {
-        setOpenIndex(openIndex === index ? null : index);
-    };
-
-    return (
-        <div className="w-3/4 mx-auto py-8">
-            {rpiContents.map((item, index) => (
-                <div key={item.title} className="border border-rhino-purple text-white text-2xl rounded-md mb-2">
-                    <div 
-                        className="bg-rhino-purple p-4 cursor-pointer" 
-                        onClick={() => toggleOpen(index)}
-                    >
-                        <h2 className="text-2xl">{item.title}</h2>
-                    </div>
-                    <AnimatePresence initial={false}>
-                        {openIndex === index && (
-                            <motion.div
-                                initial={{ height: 0, opacity: 0 }}
-                                animate={{ height: 'auto', opacity: 1 }}
-                                exit={{ height: 0, opacity: 0 }}
-                                transition={{ duration: 0.3 }}
-                                className="overflow-hidden"
-                            >
-                                <div className="p-4">
-                                    <p><a href={item.details.downloadMirror} className="text-rhino-purple underline">Download</a></p>
-                                    <p>Download Size: {item.details.downloadSize}</p>
-                                    <p>Included kernel: {item.details.kernel}</p>
-                                    <p>Source Code: <a href={item.details.sourceCode} className="text-rhino-purple underline">{item.details.sourceCode}</a></p>
-                                    {item.details.login && (
-                                        <div className="border p-2 rounded-md border-rhino-purple border-2 m-2">
-                                            <p>Username: {item.details.login.username}</p>
-                                            <p>Password: {item.details.login.password}</p>
-                                        </div>
-                                    )}
-                                    <p className="text-lg">SHA256sum: {item.details.shasum}</p>
-                                </div>
-                            </motion.div>
-                        )}
-                    </AnimatePresence>
-                </div>
-            ))}
-        </div>
-    );
-}
-
-export default TargetRpi;
\ No newline at end of file
diff --git a/src/components/download/targetSelector.jsx b/src/components/download/targetSelector.jsx
deleted file mode 100644
index fcd0f93..0000000
--- a/src/components/download/targetSelector.jsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import React, { useState } from "react";
-import TargetGeneric from "./targetGeneric";
-import TargetPine from "./targetPine";
-import TargetRpi from "./targetRpi";
-
-const targets = [
-  {
-    id: "generic",
-    name: "Desktop",
-    architecture: "x86_64/ARM64",
-    image: "https://via.placeholder.com/150",
-  },
-  {
-    id: "pine",
-    name: "Pine64",
-    architecture: "PinePhone/PineTab/PineTab2",
-    image: "https://via.placeholder.com/150",
-  },
-  {
-    id: "rpi",
-    name: "Raspberry Pi",
-    architecture: "Desktop/Server",
-    image: "https://via.placeholder.com/150",
-  },
-];
-
-const TargetSelector = () => {
-  const [target, setTarget] = useState(null);
-  const [buttonsVisible, setButtonsVisible] = useState(true);
-
-  const handleButtonClick = (id) => {
-    setTarget(id);
-    setButtonsVisible(false);
-  };
-
-  const renderTarget = () => {
-    switch (target) {
-      case "generic":
-        return <TargetGeneric />;
-      case "pine":
-        return <TargetPine />;
-      case "rpi":
-        return <TargetRpi />;
-      default:
-        return null;
-    }
-  };
-
-  return (
-    <div className="text-center lg:w-[65%] w-[95%] mx-auto mb-16 mt-16">
-      {buttonsVisible && (
-        <div className="flex flex-col lg:flex-row justify-center space-y-4 lg:space-y-0 lg:space-x-16 my-8">
-          {targets.map((target) => (
-            <button
-              key={target.id}
-              onClick={() => handleButtonClick(target.id)}
-              className="flex flex-col items-center p-4 md:p-8 rounded-md border-2 border-rhino-purple hover:shadow-bxs hover:scale-105 transition-all"
-              style={{ minWidth: "300px" }} // Ensure minimum width for each button
-            >
-              <img
-                src={target.image}
-                alt={target.name}
-                className="w-full h-32 md:h-40 mb-2 rounded object-cover"
-              />
-              <span className="text-white text-xl md:text-3xl">{target.name}</span>
-              <span className="text-white text-sm md:text-lg">({target.architecture})</span>
-            </button>
-          ))}
-        </div>
-      )}
-      <div className="mt-8">{renderTarget()}</div>
-    </div>
-  );
-};
-
-
-
-export default TargetSelector;
diff --git a/src/components/home/developers.jsx b/src/components/home/developers.jsx
index 9dd8901..fc0bdc7 100644
--- a/src/components/home/developers.jsx
+++ b/src/components/home/developers.jsx
@@ -30,7 +30,7 @@ function Developers() {
                         ))}
                     </div>
                     <div>
-                        <img src={post.image} alt="Image" className="w-full" />
+                        <img src={post.image} alt="Image" className="w-full rounded-lg" />
                     </div>
                 </div>
             ))}
diff --git a/src/components/home/hero.jsx b/src/components/home/hero.jsx
index b74c423..d4c1ca7 100644
--- a/src/components/home/hero.jsx
+++ b/src/components/home/hero.jsx
@@ -12,15 +12,15 @@ function Hero() {
                     The rolling release, Ubuntu-based distribution made <span className="text-rhino-purple"><i>by developers, for developers.</i></span>
                 </h2>
             </div>
-            <img src="/img/home/image.png" className=" lg:w-[65%] hover:scale-[102%] transition-all w-[95%] h-full pt-0 mx-auto rounded-[0.65em]" />
+            <img src="/img/home/image.png" className=" lg:w-[65%] hover:scale-[102%] transition-all w-[95%] h-full pt-0 mx-auto rounded-lg" />
             <div className="flex flex-wrap justify-center mt-4 w-[70%] mx-auto pb-8">
         <Link href="#learn" className="m-2 hover:scale-110 transition-all">
-            <span className="rounded-[0.65em] p-2 bg-rhino-purple text-white text-2xl text-center block">
+            <span className="rounded-lg p-2 bg-rhino-purple text-white text-2xl text-center block">
                 Learn More
             </span>
         </Link>
         <Link href="/download/" className="m-2 hover:scale-110 transition-all">
-            <span className="rounded-[0.65em] p-2 bg-rhino-purple text-white text-2xl text-center block">
+            <span className="rounded-lg p-2 bg-rhino-purple text-white text-2xl text-center block">
                 Download
             </span>
         </Link>
diff --git a/src/components/home/packages.jsx b/src/components/home/packages.jsx
index 86205ac..1e1d260 100644
--- a/src/components/home/packages.jsx
+++ b/src/components/home/packages.jsx
@@ -10,8 +10,8 @@ const data = [
         ],
         image: "/img/home/rhino-pkg.webp",
         link: {
-            text: "Learn more about Pacstall →",
-            url: "https://pacstall.dev"
+            text: "Learn more about rhino-pkg →",
+            url: "#"
         },
     }
 ]
diff --git a/src/pages/download.jsx b/src/pages/download.jsx
index 82a4751..370a674 100644
--- a/src/pages/download.jsx
+++ b/src/pages/download.jsx
@@ -1,7 +1,7 @@
 import React from "react";
 import Menu from "../components/navbar";
 import Hero from "../components/download/hero";
-import TargetSelector from "../components/download/targetSelector";
+import Selection from "../components/download/selection";
 import Footer from "../components/footer";
 
 export default function Home() {
@@ -9,7 +9,7 @@ export default function Home() {
     <main>
       <Menu />
       <Hero />
-      <TargetSelector />
+      <Selection />
       <Footer />
     </main>
   );
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 12f4f38..3ae668a 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -6,5 +6,5 @@
 
 body {
   background-color: #13093c;
-  font-family: "Ubuntu", sans-serif;
+  font-family: "Ubuntu", sans-serif !important;
 }
\ No newline at end of file