diff --git a/Spiderman.jpg b/Spiderman.jpg
new file mode 100644
index 0000000..b5b4def
Binary files /dev/null and b/Spiderman.jpg differ
diff --git a/index.HTML b/index.HTML
new file mode 100644
index 0000000..8dac9ea
--- /dev/null
+++ b/index.HTML
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" type="text/css" href="./style.css" />
+    <style>
+      @keyframes glow {
+        0% {
+          text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
+          background-color: rgba(255, 0, 0, 0.8);
+        }
+        50% {
+          text-shadow: 0 0 20px rgba(255, 255, 255, 0.8);
+          background-color: rgba(255, 0, 0, 0.5);
+        }
+        100% {
+          text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
+          background-color: rgba(255, 0, 0, 0.8);
+        }
+      }
+
+      .glowing-text {
+        font-size: 36px;
+        font-weight: bold;
+        color: #e12323;
+        animation: glow 1.5s ease-in-out infinite;
+      }
+    </style>
+  </head>
+  <body>
+    <nav>
+      <ul>
+        <li class="d-inline">
+          <a class="nav-link" href="/Home">Super Hero Crochet!</a>
+        </li>
+        <li class="d-inline">
+          <a class="nav-link" href="/">Home</a>
+        </li>
+        <li class="d-line">
+          <a class="nav-link" href="/about">About</a>
+        </li>
+        <li class="d-line">
+          <a class="nav-link" href="/about">How To</a>
+        </li>
+      </ul>
+    </nav>
+    <main>
+      <section>
+        <h1 class="glowing-text">WHO LIKES TO CROCHET?</h1>
+      </section>
+      <section>
+        <h1>Crochet Spiderman Everyone</h1>
+        <img src="Spiderman.jpg" alt="Author Headshot" />
+        <p>Made By: A Digital Creator</p>
+      </section>
+      <article>
+        <section>
+          <h2>53stitches</h2>
+          <p>Free Crochet Patterns</p>
+          <div>
+            <h3>Nerdy Amigurumi Dolls</h3>
+            <p>"www.53stitches.com"</p>
+          </div>
+        </section>
+      </article>
+    </main>
+  </body>
+</html>
+
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..97d6dcb
--- /dev/null
+++ b/style.css
@@ -0,0 +1,72 @@
+    
+    
+    
+    body{
+    margin: 0;
+     background-color: rgb(246, 43, 43)
+    font-family- Arial,sans-serif;
+    padding: 0;
+    font-size: 22px;
+    font-weight: 44px;
+    max-width: 800px;
+    margin-left: auto;
+    margin-right: auto;
+} 
+h1{
+    color: #ea3333;
+    font-size: 55px;
+}   
+.shadowed-text {
+    text-shadow: 2px 9px 4px (0, 0, 0.5);
+    text-shadow: color(srgb red rgb(64, 139, 64) rgb(54, 54, 135))
+
+
+}
+glowing-text {
+    font-size: 36px;
+    font-weight: bold;
+    color: #c2efbb; /* Text color */
+    text-shadow: 0 0 10px rgba(57, 185, 138, 0.5); /* Initial shadow effect */
+    animation: glow 1.5s ease-in-out infinite;
+  }
+  @keyframes glow {
+    0% {
+      text-shadow: 0 0 10px rgba(255, 0, 0, 0.5);
+    }
+    50% {
+      text-shadow: 0 0 20px rgba(0, 255, 26, 0.8);
+    }
+    100% {
+      text-shadow: 0 0 10px rgba(90, 100, 100, 0.5);
+    }
+
+
+.nav-link{
+    color: rgb(29, 119, 79);
+    text-decoration: none;
+    font-size: 33px;
+}
+main {
+    max-width: 601px;
+    width: 100%;
+    margin-top: 24px;
+    margin-bottom: 24px;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+section{
+    margin: 20px o;
+    padding: 16px;
+
+}
+#title {
+    font-size: 33px;
+    font-weight: 800px
+}
+.d-inline{
+    display: inline;
+}
+nav > ul {
+    list-style: none;
+}
