diff --git a/src/App.js b/src/App.js
index 02721dd..23863e7 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,27 +1,27 @@
-import "./App.css";
-import Navbar from "./components/Navbar";
-import Footer from "./components/Footer";
-import Home from "./pages/Home";
-import Shop from "./pages/Shop";
-import About from "./pages/About";
-import Contact from "./pages/Contact";
-import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
-
-function App() {
-  return (
-    <div className="App">
-      <Router>
-        <Navbar />
-        <Routes>
-          <Route path="/" exact element={<Home />} />
-          <Route path="/shop" exact element={<Shop />} />
-          <Route path="/about" exact element={<About />} />
-          <Route path="/contact" exact element={<Contact />} />
-        </Routes>
-        <Footer />
-      </Router>
-    </div>
-  );
-}
-
+import "./App.css";
+import Navbar from "./components/Navbar";
+import Footer from "./components/Footer";
+import Home from "./pages/Home";
+import Shop from "./pages/Shop";
+import About from "./pages/About";
+import Contact from "./pages/Contact";
+import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
+
+function App() {
+  return (
+    <div className="App">
+      <Router>
+        <Navbar />
+        <Routes>
+          <Route path="/" exact element={<Home />} />
+          <Route path="/shop" exact element={<Shop />} />
+          <Route path="/about" exact element={<About />} />
+          <Route path="/contact" exact element={<Contact />} />
+        </Routes>
+        <Footer />
+      </Router>
+    </div>
+  );
+}
+
 export default App;
\ No newline at end of file
diff --git a/src/components/Footer.js b/src/components/Footer.js
index 1b06738..b18b293 100644
--- a/src/components/Footer.js
+++ b/src/components/Footer.js
@@ -1,22 +1,22 @@
-import React from "react";
-import InstagramIcon from '@mui/icons-material/Instagram';
-import TwitterIcon from '@mui/icons-material/Twitter';
-import FacebookIcon from '@mui/icons-material/Facebook';
-import LinkedInIcon from '@mui/icons-material/LinkedIn';
-import "../styles/Footer.css";
-
-function Footer() {
-  return (
-    <div className="footer">
-      <div className="socialMedia">
-        <a href="https://www.instagram.com/"><InstagramIcon /> </a> 
-        <a href="https://twitter.com/home"><TwitterIcon /> </a> 
-        <a href="https://www.facebook.com/"><FacebookIcon /> </a> 
-        <a href="https://www.linkedin.com/"><LinkedInIcon /> </a>
-      </div>
-      <p> &copy; 2023 chadstestsite.com</p>
-    </div>
-  );
-}
-
+import React from "react";
+import InstagramIcon from '@mui/icons-material/Instagram';
+import TwitterIcon from '@mui/icons-material/Twitter';
+import FacebookIcon from '@mui/icons-material/Facebook';
+import LinkedInIcon from '@mui/icons-material/LinkedIn';
+import "../styles/Footer.css";
+
+function Footer() {
+  return (
+    <div className="footer">
+      <div className="socialMedia">
+        <a href="https://www.instagram.com/"><InstagramIcon /> </a> 
+        <a href="https://twitter.com/home"><TwitterIcon /> </a> 
+        <a href="https://www.facebook.com/"><FacebookIcon /> </a> 
+        <a href="https://www.linkedin.com/"><LinkedInIcon /> </a>
+      </div>
+      <p> &copy; 2023 chadstestsite.com</p>
+    </div>
+  );
+}
+
 export default Footer;
\ No newline at end of file
diff --git a/src/components/ShopItem.js b/src/components/ShopItem.js
index b93c0a3..941843a 100644
--- a/src/components/ShopItem.js
+++ b/src/components/ShopItem.js
@@ -1,13 +1,13 @@
-import React from "react";
-
-function ShopItem({ image, name, price }) {
-  return (
-    <div className="shopItem">
-      <div style={{ backgroundImage: `url(${image})` }}> </div>
-      <h1> {name} </h1>
-      <p> ${price} </p>
-    </div>
-  );
-}
-
+import React from "react";
+
+function ShopItem({ image, name, price }) {
+  return (
+    <div className="shopItem">
+      <div style={{ backgroundImage: `url(${image})` }}> </div>
+      <h1> {name} </h1>
+      <p> ${price} </p>
+    </div>
+  );
+}
+
 export default ShopItem;
\ No newline at end of file
diff --git a/src/pages/About.js b/src/pages/About.js
index aee3dfd..4199452 100644
--- a/src/pages/About.js
+++ b/src/pages/About.js
@@ -1,23 +1,23 @@
-import React from "react";
-import MultiplePizzas from "../assets/shityourself.jpg";
-import "../styles/About.css";
-function About() {
-  return (
-    <div className="about">
-      <div
-        className="aboutTop"
-        style={{ backgroundImage: `url(${MultiplePizzas})` }}
-      ></div>
-      <div className="aboutBottom">
-        <h1> ABOUT US</h1>
-        <p>
-          Hello, My name is Chad and I'm currently working towards my goals on trying to become a developer. 
-          I been working hard and trying to learn quickly. 
-          I try to be patient but I really wanna just learn fast.
-        </p>
-      </div>
-    </div>
-  );
-}
-
+import React from "react";
+import MultiplePizzas from "../assets/shityourself.jpg";
+import "../styles/About.css";
+function About() {
+  return (
+    <div className="about">
+      <div
+        className="aboutTop"
+        style={{ backgroundImage: `url(${MultiplePizzas})` }}
+      ></div>
+      <div className="aboutBottom">
+        <h1> ABOUT US</h1>
+        <p>
+          Hello, My name is Chad and I'm currently working towards my goals on trying to become a developer. 
+          I been working hard and trying to learn quickly. 
+          I try to be patient but I really wanna just learn fast.
+        </p>
+      </div>
+    </div>
+  );
+}
+
 export default About;
\ No newline at end of file
diff --git a/src/pages/Contact.js b/src/pages/Contact.js
index 4104873..1d37925 100644
--- a/src/pages/Contact.js
+++ b/src/pages/Contact.js
@@ -1,34 +1,34 @@
-import React from "react";
-import TrainLeft from "../assets/1132066.jpg";
-import "../styles/Contact.css";
-
-function Contact() {
-  return (
-    <div className="contact">
-      <div
-        className="leftSide"
-        style={{ backgroundImage: `url(${TrainLeft})` }}
-      ></div>
-      <div className="rightSide">
-        <h1> Contact Us</h1>
-
-        <form id="contact-form" method="POST">
-          <label htmlFor="name">Full Name</label>
-          <input name="name" placeholder="Enter full name..." type="text" />
-          <label htmlFor="email">Email</label>
-          <input name="email" placeholder="Enter email..." type="email" />
-          <label htmlFor="message">Message</label>
-          <textarea
-            rows="6"
-            placeholder="Enter message..."
-            name="message"
-            required
-          ></textarea>
-          <button type="submit"> Send Message</button>
-        </form>
-      </div>
-    </div>
-  );
-}
-
+import React from "react";
+import TrainLeft from "../assets/1132066.jpg";
+import "../styles/Contact.css";
+
+function Contact() {
+  return (
+    <div className="contact">
+      <div
+        className="leftSide"
+        style={{ backgroundImage: `url(${TrainLeft})` }}
+      ></div>
+      <div className="rightSide">
+        <h1> Contact Us</h1>
+
+        <form id="contact-form" method="POST">
+          <label htmlFor="name">Full Name</label>
+          <input name="name" placeholder="Enter full name..." type="text" />
+          <label htmlFor="email">Email</label>
+          <input name="email" placeholder="Enter email..." type="email" />
+          <label htmlFor="message">Message</label>
+          <textarea
+            rows="6"
+            placeholder="Enter message..."
+            name="message"
+            required
+          ></textarea>
+          <button type="submit"> Send Message</button>
+        </form>
+      </div>
+    </div>
+  );
+}
+
 export default Contact;
\ No newline at end of file
diff --git a/src/pages/Home.js b/src/pages/Home.js
index d00d193..f6c97f4 100644
--- a/src/pages/Home.js
+++ b/src/pages/Home.js
@@ -18,3 +18,23 @@ function Home() {
 }
 
 export default Home;
+import React from "react";
+import { Link } from "react-router-dom";
+import BannerImage from "../assets/Tokyo-Ghoul-Backgrounds.jpg";
+import "../styles/Home.css";
+
+function Home() {
+  return (
+    <div className="home" style={{ backgroundImage: `url(${BannerImage})` }}>
+      <div className="headerContainer">
+        <h1> Chad's Test Website </h1>
+        <p> This is kinda fun</p>
+        <Link to='shop'>
+          <button> This is a button </button>
+        </Link>
+      </div>
+    </div>
+  );
+}
+
+export default Home;
diff --git a/src/styles/About.css b/src/styles/About.css
index 8564070..62ae9e5 100644
--- a/src/styles/About.css
+++ b/src/styles/About.css
@@ -1,37 +1,37 @@
-.about {
-    width: 100%;
-    height: 90vh;
-    display: flex;
-    flex-direction: column;
-  }
-  
-  .aboutTop {
-    width: 100%;
-    height: 45%;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-    font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
-  }
-  
-  .aboutBottom {
-    display: flex;
-    flex-direction: column;
-    height: 55%;
-    align-items: center;
-    margin-top: 50px;
-  }
-  
-  .aboutBottom p {
-    width: 1200px;
-  }
-  
-  .about .aboutBottom h1 {
-    font-weight: 400;
-    font-size: 70px;
-    color: black;
-    height: 30px;
-    display: flex;
-    justify-content: center;
-    transform: translateY(-40px);
+.about {
+    width: 100%;
+    height: 90vh;
+    display: flex;
+    flex-direction: column;
+  }
+  
+  .aboutTop {
+    width: 100%;
+    height: 45%;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+    font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
+  }
+  
+  .aboutBottom {
+    display: flex;
+    flex-direction: column;
+    height: 55%;
+    align-items: center;
+    margin-top: 50px;
+  }
+  
+  .aboutBottom p {
+    width: 1200px;
+  }
+  
+  .about .aboutBottom h1 {
+    font-weight: 400;
+    font-size: 70px;
+    color: black;
+    height: 30px;
+    display: flex;
+    justify-content: center;
+    transform: translateY(-40px);
   }
\ No newline at end of file
diff --git a/src/styles/Contact.css b/src/styles/Contact.css
index 06f11da..46214f8 100644
--- a/src/styles/Contact.css
+++ b/src/styles/Contact.css
@@ -1,80 +1,80 @@
-.contact {
-    width: 100%;
-    height: 90vh;
-    display: flex;
-  }
-  
-  .contact .leftSide {
-    height: 100%;
-    flex: 50%;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-  }
-  
-  .contact .rightSide {
-    height: 100%;
-    flex: 50%;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-  }
-  
-  .contact .rightSide h1 {
-    font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande",
-      "Lucida Sans", Arial, sans-serif;
-    font-weight: 10;
-    font-size: 50px;
-    margin-left: 30px;
-  }
-  
-  form {
-    display: flex;
-    flex-direction: column;
-    width: auto;
-    height: auto;
-    padding: 30px;
-  }
-  
-  form input {
-    height: 40px;
-    width: 80%;
-    border: none;
-    border-bottom: 1px solid #121619;
-    color: black;
-  }
-  
-  form textarea {
-    margin-top: 15px;
-    height: 70px;
-    width: 80%;
-    border: none;
-    border-bottom: 1px solid #121619;
-    color: black;
-  }
-  input::placeholder,
-  textarea::placeholder {
-    font-weight: bold;
-    color: black;
-    font-family: Arial, Helvetica, sans-serif;
-  }
-  form input:focus,
-  textarea:focus {
-    outline: none;
-  }
-  
-  form label {
-    margin-top: 15px;
-    color: grey;
-  }
-  
-  form button {
-    margin-top: 40px;
-    width: 140px;
-    height: 40px;
-    border: none;
-    background-color: #121619;
-    color: whitesmoke;
-    font-size: 15px;
-    cursor: pointer;
+.contact {
+    width: 100%;
+    height: 90vh;
+    display: flex;
+  }
+  
+  .contact .leftSide {
+    height: 100%;
+    flex: 50%;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+  }
+  
+  .contact .rightSide {
+    height: 100%;
+    flex: 50%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+  
+  .contact .rightSide h1 {
+    font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande",
+      "Lucida Sans", Arial, sans-serif;
+    font-weight: 10;
+    font-size: 50px;
+    margin-left: 30px;
+  }
+  
+  form {
+    display: flex;
+    flex-direction: column;
+    width: auto;
+    height: auto;
+    padding: 30px;
+  }
+  
+  form input {
+    height: 40px;
+    width: 80%;
+    border: none;
+    border-bottom: 1px solid #121619;
+    color: black;
+  }
+  
+  form textarea {
+    margin-top: 15px;
+    height: 70px;
+    width: 80%;
+    border: none;
+    border-bottom: 1px solid #121619;
+    color: black;
+  }
+  input::placeholder,
+  textarea::placeholder {
+    font-weight: bold;
+    color: black;
+    font-family: Arial, Helvetica, sans-serif;
+  }
+  form input:focus,
+  textarea:focus {
+    outline: none;
+  }
+  
+  form label {
+    margin-top: 15px;
+    color: grey;
+  }
+  
+  form button {
+    margin-top: 40px;
+    width: 140px;
+    height: 40px;
+    border: none;
+    background-color: #121619;
+    color: whitesmoke;
+    font-size: 15px;
+    cursor: pointer;
   }
\ No newline at end of file
diff --git a/src/styles/Footer.css b/src/styles/Footer.css
index c15e729..98f5933 100644
--- a/src/styles/Footer.css
+++ b/src/styles/Footer.css
@@ -1,21 +1,21 @@
-.footer {
-  width: 100%;
-  height: 200px;
-  background-color: #121619;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-direction: column;
-  padding-top: 10px;
-}
-
-.socialMedia svg {
-  color: white;
-  margin: 20px;
-  font-size: 70px;
-  cursor: pointer;
-}
-
-.footer p {
-  color: white;
+.footer {
+  width: 100%;
+  height: 200px;
+  background-color: #121619;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  padding-top: 10px;
+}
+
+.socialMedia svg {
+  color: white;
+  margin: 20px;
+  font-size: 70px;
+  cursor: pointer;
+}
+
+.footer p {
+  color: white;
 }
\ No newline at end of file
diff --git a/src/styles/Home.css b/src/styles/Home.css
index bf8f4a9..a3b85b7 100644
--- a/src/styles/Home.css
+++ b/src/styles/Home.css
@@ -1,98 +1,98 @@
-.home {
-  width: 100%;
-  height: 90vh;
-  display: flex;
-  justify-content: center;
-  align-items: left;
-  flex-direction: column;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: cover;
-  font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
-}
-
-.headerContainer {
-  width: auto;
-  margin-left: 50px;
-}
-
-.headerContainer h1 {
-  justify-content: center;
-  align-items: center;
-  font-size: 90px;
-  height: 60px;
-  font-weight: 50;
-  color: black;
-}
-
-.headerContainer p {
-  padding: 0;
-  font-size: 40px;
-  font-weight: lighter;
-  color: black;
-}
-
-.headerContainer button {
-  color: black;
-  border: none;
-  border-radius: 5px;
-  cursor: pointer;
-  justify-content: center;
-  background-color: #121619;
-  height: 50px;
-  width: 180px;
-  color: white;
-  text-decoration: none;
-  font-size: 20px;
-}
-
-.headerContainer button:hover {
-  background-color: #07090a;
-  cursor: pointer;
-  transition: 0.3s ease-in;
-}
-
-@media only screen and (max-width: 650px) {
-  .home {
-    justify-content: center;
-    align-items: center;
-  }
-  .headerContainer h1,
-  .headerContainer p {
-  }
-
-  .headerContainer {
-    margin-left: 0px;
-    border-radius: 10px;
-    padding: 10px;
-    width: 80%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-direction: column;
-    background-color: #121619;
-    color: white;
-  }
-
-  .headerContainer h1 {
-    font-size: 40px;
-    height: 30px;
-    color: white;
-  }
-
-  .headerContainer p {
-    font-size: 30px;
-    color: white;
-  }
-
-  .headerContainer button {
-    background-color: white;
-    color: #121619;
-    margin-bottom: 30px;
-  }
-
-  .headerContainer button:hover {
-    background-color: rgb(225, 225, 225);
-    color: #121619;
-  }
+.home {
+  width: 100%;
+  height: 90vh;
+  display: flex;
+  justify-content: center;
+  align-items: left;
+  flex-direction: column;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
+}
+
+.headerContainer {
+  width: auto;
+  margin-left: 50px;
+}
+
+.headerContainer h1 {
+  justify-content: center;
+  align-items: center;
+  font-size: 90px;
+  height: 60px;
+  font-weight: 50;
+  color: black;
+}
+
+.headerContainer p {
+  padding: 0;
+  font-size: 40px;
+  font-weight: lighter;
+  color: black;
+}
+
+.headerContainer button {
+  color: black;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+  justify-content: center;
+  background-color: #121619;
+  height: 50px;
+  width: 180px;
+  color: white;
+  text-decoration: none;
+  font-size: 20px;
+}
+
+.headerContainer button:hover {
+  background-color: #07090a;
+  cursor: pointer;
+  transition: 0.3s ease-in;
+}
+
+@media only screen and (max-width: 650px) {
+  .home {
+    justify-content: center;
+    align-items: center;
+  }
+  .headerContainer h1,
+  .headerContainer p {
+  }
+
+  .headerContainer {
+    margin-left: 0px;
+    border-radius: 10px;
+    padding: 10px;
+    width: 80%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    background-color: #121619;
+    color: white;
+  }
+
+  .headerContainer h1 {
+    font-size: 40px;
+    height: 30px;
+    color: white;
+  }
+
+  .headerContainer p {
+    font-size: 30px;
+    color: white;
+  }
+
+  .headerContainer button {
+    background-color: white;
+    color: #121619;
+    margin-bottom: 30px;
+  }
+
+  .headerContainer button:hover {
+    background-color: rgb(225, 225, 225);
+    color: #121619;
+  }
 }
\ No newline at end of file
diff --git a/src/styles/Navbar.css b/src/styles/Navbar.css
index f907935..461ada4 100644
--- a/src/styles/Navbar.css
+++ b/src/styles/Navbar.css
@@ -1,102 +1,102 @@
-.navbar {
-    width: 100%;
-    height: 100px;
-    background-color: #121619;
-    display: flex;
-    flex-direction: row;
-  }
-  
-  .navbar .leftSide {
-    flex: 50%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    padding-left: 150px;
-  }
-  
-  .navbar .leftSide img {
-    width: 70px;
-  }
-  
-  .navbar .rightSide {
-    flex: 50%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-  
-  .navbar a {
-    color: white;
-    text-decoration: none;
-    margin: 20px;
-  }
-  
-  .navbar .rightSide button {
-    background-color: transparent;
-    border: none;
-    color: white;
-    cursor: pointer;
-  }
-  
-  .navbar .rightSide svg {
-    font-size: 40px;
-  }
-  
-  .navbar #open {
-    padding-left: 0px;
-  }
-  .navbar #open img {
-    display: none;
-  }
-  
-  .navbar #close img {
-    display: inherit;
-  }
-  
-  .navbar #open .hiddenLinks {
-    display: inherit;
-    margin-left: 30px;
-  }
-  
-  .navbar #close .hiddenLinks {
-    display: none;
-  }
-  
-  .navbar #open a {
-    width: 70px;
-    margin: 5px;
-  }
-  @media only screen and (max-width: 900px) {
-    .navbar .rightSide a {
-      width: 70px;
-    }
-    .navbar .leftSide {
-      padding-left: 50px;
-    }
-  }
-  
-  @media only screen and (max-width: 600px) {
-    .navbar .rightSide a {
-      display: none;
-    }
-  
-    .navbar .rightSide {
-      justify-content: flex-end;
-      padding-right: 50px;
-    }
-  
-    .navbar .rightSide button {
-      display: inherit;
-    }
-  }
-  
-  @media only screen and (min-width: 600px) {
-    .navbar .rightSide button {
-      display: none;
-    }
-  
-    .hiddenLinks {
-      display: none;
-    }
+.navbar {
+    width: 100%;
+    height: 100px;
+    background-color: #121619;
+    display: flex;
+    flex-direction: row;
+  }
+  
+  .navbar .leftSide {
+    flex: 50%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    padding-left: 150px;
+  }
+  
+  .navbar .leftSide img {
+    width: 70px;
+  }
+  
+  .navbar .rightSide {
+    flex: 50%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  
+  .navbar a {
+    color: white;
+    text-decoration: none;
+    margin: 20px;
+  }
+  
+  .navbar .rightSide button {
+    background-color: transparent;
+    border: none;
+    color: white;
+    cursor: pointer;
+  }
+  
+  .navbar .rightSide svg {
+    font-size: 40px;
+  }
+  
+  .navbar #open {
+    padding-left: 0px;
+  }
+  .navbar #open img {
+    display: none;
+  }
+  
+  .navbar #close img {
+    display: inherit;
+  }
+  
+  .navbar #open .hiddenLinks {
+    display: inherit;
+    margin-left: 30px;
+  }
+  
+  .navbar #close .hiddenLinks {
+    display: none;
+  }
+  
+  .navbar #open a {
+    width: 70px;
+    margin: 5px;
+  }
+  @media only screen and (max-width: 900px) {
+    .navbar .rightSide a {
+      width: 70px;
+    }
+    .navbar .leftSide {
+      padding-left: 50px;
+    }
+  }
+  
+  @media only screen and (max-width: 600px) {
+    .navbar .rightSide a {
+      display: none;
+    }
+  
+    .navbar .rightSide {
+      justify-content: flex-end;
+      padding-right: 50px;
+    }
+  
+    .navbar .rightSide button {
+      display: inherit;
+    }
+  }
+  
+  @media only screen and (min-width: 600px) {
+    .navbar .rightSide button {
+      display: none;
+    }
+  
+    .hiddenLinks {
+      display: none;
+    }
   }
\ No newline at end of file
diff --git a/src/styles/Shop.css b/src/styles/Shop.css
index 76a4f4c..484adf2 100644
--- a/src/styles/Shop.css
+++ b/src/styles/Shop.css
@@ -1,63 +1,63 @@
-.shop {
-    width: 100%;
-    height: auto;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-direction: column;
-  }
-
-  .shop .shopTitle {
-    font-family: cursive;
-    font-size: 60px;
-  }
-  
-  .shopList {
-    width: 70vw;
-    height: auto;
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr;
-    place-items: center;
-  }
-
-  /* SHOP ITEM STYLING */
-  
-  .shopItem {
-    border-radius: 15px;
-    width: 300px;
-    height: 350px;
-    margin: 20px;
-    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);
-  }
-  .shopItem:hover {
-    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.5);
-    transition: 0.3s ease-in;
-    cursor: pointer;
-  }
-  
-  .shopItem div {
-    border-top-left-radius: 15px;
-    border-top-right-radius: 15px;
-    width: 100%;
-    height: 200px;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-  }
-  
-  .shopItem h1,
-  .shopItem p {
-    margin-left: 20px;
-  }
-  
-  @media only screen and (max-width: 1300px) {
-    .shopList {
-      grid-template-columns: 1fr 1fr;
-    }
-  }
-  
-  @media only screen and (max-width: 800px) {
-    .shopList {
-      grid-template-columns: 1fr;
-    }
+.shop {
+    width: 100%;
+    height: auto;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+  }
+
+  .shop .shopTitle {
+    font-family: cursive;
+    font-size: 60px;
+  }
+  
+  .shopList {
+    width: 70vw;
+    height: auto;
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+    place-items: center;
+  }
+
+  /* SHOP ITEM STYLING */
+  
+  .shopItem {
+    border-radius: 15px;
+    width: 300px;
+    height: 350px;
+    margin: 20px;
+    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);
+  }
+  .shopItem:hover {
+    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.5);
+    transition: 0.3s ease-in;
+    cursor: pointer;
+  }
+  
+  .shopItem div {
+    border-top-left-radius: 15px;
+    border-top-right-radius: 15px;
+    width: 100%;
+    height: 200px;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+  }
+  
+  .shopItem h1,
+  .shopItem p {
+    margin-left: 20px;
+  }
+  
+  @media only screen and (max-width: 1300px) {
+    .shopList {
+      grid-template-columns: 1fr 1fr;
+    }
+  }
+  
+  @media only screen and (max-width: 800px) {
+    .shopList {
+      grid-template-columns: 1fr;
+    }
   }
\ No newline at end of file