86 files changed, 1019 insertions, 0 deletions
diff --git a/.vs/Miau/FileContentIndex/a59963dc-6014-4039-9766-89b88150a502.vsidx b/.vs/Miau/FileContentIndex/a59963dc-6014-4039-9766-89b88150a502.vsidx
new file mode 100644
index 0000000..70532d8
--- /dev/null
+++ b/.vs/Miau/FileContentIndex/a59963dc-6014-4039-9766-89b88150a502.vsidx
diff --git a/.vs/Miau/v17/.wsuo b/.vs/Miau/v17/.wsuo
new file mode 100644
index 0000000..1c20e61
--- /dev/null
+++ b/.vs/Miau/v17/.wsuo
diff --git a/.vs/Miau/v17/DocumentLayout.json b/.vs/Miau/v17/DocumentLayout.json
new file mode 100644
index 0000000..eede2ed
--- /dev/null
+++ b/.vs/Miau/v17/DocumentLayout.json
@@ -0,0 +1,12 @@
+{
+  "Version": 1,
+  "WorkspaceRootPath": "C:\\Users\\Ivy\\Documents\\Website\\Miau\\",
+  "Documents": [],
+  "DocumentGroupContainers": [
+    {
+      "Orientation": 0,
+      "VerticalTabListWidth": 256,
+      "DocumentGroups": []
+    }
+  ]
+}
+\ No newline at end of file
diff --git a/.vs/VSWorkspaceState.json b/.vs/VSWorkspaceState.json
new file mode 100644
index 0000000..6b61141
--- /dev/null
+++ b/.vs/VSWorkspaceState.json
@@ -0,0 +1,6 @@
+{
+  "ExpandedNodes": [
+    ""
+  ],
+  "PreviewInSolutionExplorer": false
+}
+\ No newline at end of file
diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite
new file mode 100644
index 0000000..6786417
--- /dev/null
+++ b/.vs/slnx.sqlite
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..04ebd33
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "editor.wordWrap": "on"
+}
+\ No newline at end of file
diff --git a/Elements Tattoo.png b/Elements Tattoo.png
new file mode 100644
index 0000000..f912964
--- /dev/null
+++ b/Elements Tattoo.png
diff --git a/Elements diagram.png b/Elements diagram.png
new file mode 100644
index 0000000..48282f4
--- /dev/null
+++ b/Elements diagram.png
diff --git a/Factorio-gear_600x600.webp b/Factorio-gear_600x600.webp
new file mode 100644
index 0000000..5abfb0a
--- /dev/null
+++ b/Factorio-gear_600x600.webp
diff --git a/FreePixel.ttf b/FreePixel.ttf
new file mode 100644
index 0000000..d22b2a2
--- /dev/null
+++ b/FreePixel.ttf
diff --git a/arrow.png b/arrow.png
new file mode 100644
index 0000000..74dd687
--- /dev/null
+++ b/arrow.png
diff --git a/art.html b/art.html
new file mode 100644
index 0000000..3add23b
--- /dev/null
+++ b/art.html
@@ -0,0 +1,120 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="AlmightyMiau's Personal Website">
+    <link href="styles.css" rel="stylesheet">
+    <title>Miau - Art</title>
+    <link rel="icon" type="image/x-icon" href="miau.jpg">
+    <script>
+        function hidePages() {
+            let status = document.getElementById("pages").style.display;
+            if (status === "none") {
+                document.getElementById("pages").style.display = "block";
+            } else {
+                document.getElementById("pages").style.display = "none";
+            }
+        }
+        function hideBut() {
+            let status = document.getElementById("buttons").style.display;
+            if (status === "none") {
+                document.getElementById("buttons").style.display = "block";
+            } else {
+                document.getElementById("buttons").style.display = "none";
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div id="container">
+        <div class="topbar"></div>
+        <div id="flex">
+            <main>
+                <div class="title">&nbsp; Art</div>
+                <div class="content">
+                    <p>
+                        I enjoy drawing, creating characters, desinging 3D models, and carving wood, but
+                        find it hard to be motivated to do any of it.
+                    </p>
+                </div>
+                <div class="title">&nbsp; Drawings</div>
+                <div class="content">
+                    <div class="centered">
+                        <img width="31%" src="art/cat (1).jpg">
+                        <img width="65%" src="art/cat (2).jpg">
+                        <img width="54%" src="art/cyber-sec (1).jpg">
+                        <img width="42%" src="art/cyber-sec (2).jpg">
+                        <img width="45%" src="art/cyber-sec (3).jpg">
+                        <img width="50%" src="art/cyber-sec (4).jpg">
+                        <img width="95%" src="art/math (1).jpg">
+                        <img width="40%" src="art/math (2).jpg">
+                        <img width="55%" src="art/math (3).jpg">
+                        <img width="30%" src="art/math (4).jpg">
+                        <img width="33%" src="art/math (5).jpg">
+                        <img width="34%" src="art/math (7).jpg">
+                        <img width="60%" src="art/math (6).jpg">
+                        <img width="35%" src="art/tattoo.jpg">
+                        <img width="48%" src="art/digital (1).jpg">
+                        <img width="48%" src="art/digital (2).jpg">
+                    </div>
+                </div>
+            </main>
+            <aside>
+                <div class="sidebar-title">&nbsp; Pages <button onclick="hidePages()">&vArr;</button></div>
+                <div id="pages">
+                    <nav id="nav">
+                        <ul>
+                            <li>
+                                <a href="index.html">Home</a>
+                            </li>
+                            <li>
+                                <a href="silly.html">Silly</a>
+                            </li>
+                            <li>
+                                <a href="factorio.html">Factorio</a>
+                            </li>
+                            <li>
+                                <a href="art.html">Art</a>
+                            </li>
+                            <li>
+                                <a href="cats.html">Cats</a>
+                            </li>
+                        </ul>
+                    </nav>
+                </div>
+                <div class="sidebar-title">&nbsp; Buttons <button onclick="hideBut()">&vArr;</button></div>
+                <div id="buttons">
+                    <nav id="nav">
+                        <div style="width: 88px; margin:0 auto;" id="buttons">
+                            <br>
+                            <a href="https://goblin-heart.net/" target="_blank"><img
+                                    src="https://goblin-heart.net/assets/images/gg-button.gif"></a>
+                            <br>
+                            <a href="https://goblin-heart.net/sadgrl/" target="_blank"><img
+                                    alt="88x31 button that says LEARN - HTML, Layouts, CSS, Guides, Websites: Learn @ sadgrl.online"
+                                    src="https://goblin-heart.net/assets/images/sadgrl-button.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://auzziejay.com/images/noweb32.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://yesterweb.org/img/button.png"></a>
+                            <br>
+                            <a href="https://megidolaon.gay"><img 
+                                    src="https://megidolaon.gay/media/megidolaongay.png"></a>
+                            <br>
+                        </div>
+                        <br>
+                    </nav>
+                </div>
+            </aside>
+        </div>
+        <footer id="footer">&#916; Copyworng :3</footer>
+    </div>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/art/cat (1).jpg b/art/cat (1).jpg
new file mode 100644
index 0000000..9b8f824
--- /dev/null
+++ b/art/cat (1).jpg
diff --git a/art/cat (2).jpg b/art/cat (2).jpg
new file mode 100644
index 0000000..ab609a1
--- /dev/null
+++ b/art/cat (2).jpg
diff --git a/art/cyber-sec (1).jpg b/art/cyber-sec (1).jpg
new file mode 100644
index 0000000..eb2c12a
--- /dev/null
+++ b/art/cyber-sec (1).jpg
diff --git a/art/cyber-sec (2).jpg b/art/cyber-sec (2).jpg
new file mode 100644
index 0000000..12d435b
--- /dev/null
+++ b/art/cyber-sec (2).jpg
diff --git a/art/cyber-sec (3).jpg b/art/cyber-sec (3).jpg
new file mode 100644
index 0000000..b8b670a
--- /dev/null
+++ b/art/cyber-sec (3).jpg
diff --git a/art/cyber-sec (4).jpg b/art/cyber-sec (4).jpg
new file mode 100644
index 0000000..7178eda
--- /dev/null
+++ b/art/cyber-sec (4).jpg
diff --git a/art/digital (1).jpg b/art/digital (1).jpg
new file mode 100644
index 0000000..5e60826
--- /dev/null
+++ b/art/digital (1).jpg
diff --git a/art/digital (2).jpg b/art/digital (2).jpg
new file mode 100644
index 0000000..da4224e
--- /dev/null
+++ b/art/digital (2).jpg
diff --git a/art/math (1).jpg b/art/math (1).jpg
new file mode 100644
index 0000000..966b1f7
--- /dev/null
+++ b/art/math (1).jpg
diff --git a/art/math (2).jpg b/art/math (2).jpg
new file mode 100644
index 0000000..51c847f
--- /dev/null
+++ b/art/math (2).jpg
diff --git a/art/math (3).jpg b/art/math (3).jpg
new file mode 100644
index 0000000..f17f18f
--- /dev/null
+++ b/art/math (3).jpg
diff --git a/art/math (4).jpg b/art/math (4).jpg
new file mode 100644
index 0000000..958fb4e
--- /dev/null
+++ b/art/math (4).jpg
diff --git a/art/math (5).jpg b/art/math (5).jpg
new file mode 100644
index 0000000..f1e02ff
--- /dev/null
+++ b/art/math (5).jpg
diff --git a/art/math (6).jpg b/art/math (6).jpg
new file mode 100644
index 0000000..3ba9c9b
--- /dev/null
+++ b/art/math (6).jpg
diff --git a/art/math (7).jpg b/art/math (7).jpg
new file mode 100644
index 0000000..e5847c1
--- /dev/null
+++ b/art/math (7).jpg
diff --git a/art/tattoo.jpg b/art/tattoo.jpg
new file mode 100644
index 0000000..992486f
--- /dev/null
+++ b/art/tattoo.jpg
diff --git a/backgrounds/background.gif b/backgrounds/background.gif
new file mode 100644
index 0000000..0350cc4
--- /dev/null
+++ b/backgrounds/background.gif
diff --git a/backgrounds/bck-mindwarp.jpg b/backgrounds/bck-mindwarp.jpg
new file mode 100644
index 0000000..481013c
--- /dev/null
+++ b/backgrounds/bck-mindwarp.jpg
diff --git a/backgrounds/bck-pnklightning.jpg b/backgrounds/bck-pnklightning.jpg
new file mode 100644
index 0000000..49e9a59
--- /dev/null
+++ b/backgrounds/bck-pnklightning.jpg
diff --git a/backgrounds/catcolors.gif b/backgrounds/catcolors.gif
new file mode 100644
index 0000000..4aa9845
--- /dev/null
+++ b/backgrounds/catcolors.gif
diff --git a/backgrounds/comp014.gif b/backgrounds/comp014.gif
new file mode 100644
index 0000000..1633a30
--- /dev/null
+++ b/backgrounds/comp014.gif
diff --git a/backgrounds/comp016.gif b/backgrounds/comp016.gif
new file mode 100644
index 0000000..08f4c99
--- /dev/null
+++ b/backgrounds/comp016.gif
diff --git a/backgrounds/comp020.gif b/backgrounds/comp020.gif
new file mode 100644
index 0000000..b28e00d
--- /dev/null
+++ b/backgrounds/comp020.gif
diff --git a/backgrounds/comp021.gif b/backgrounds/comp021.gif
new file mode 100644
index 0000000..1c4e6a0
--- /dev/null
+++ b/backgrounds/comp021.gif
diff --git a/backgrounds/flowers.webp b/backgrounds/flowers.webp
new file mode 100644
index 0000000..281555d
--- /dev/null
+++ b/backgrounds/flowers.webp
diff --git a/backgrounds/gifbground-804-0009.gif b/backgrounds/gifbground-804-0009.gif
new file mode 100644
index 0000000..df6a1a0
--- /dev/null
+++ b/backgrounds/gifbground-804-0009.gif
diff --git a/backgrounds/num.gif b/backgrounds/num.gif
new file mode 100644
index 0000000..3734c75
--- /dev/null
+++ b/backgrounds/num.gif
diff --git a/backgrounds/piss.gif b/backgrounds/piss.gif
new file mode 100644
index 0000000..6214180
--- /dev/null
+++ b/backgrounds/piss.gif
diff --git a/backgrounds/stars.gif b/backgrounds/stars.gif
new file mode 100644
index 0000000..5fc703f
--- /dev/null
+++ b/backgrounds/stars.gif
diff --git a/backgrounds/stars3.gif b/backgrounds/stars3.gif
new file mode 100644
index 0000000..717ad16
--- /dev/null
+++ b/backgrounds/stars3.gif
diff --git a/breakthroughs.html b/breakthroughs.html
new file mode 100644
index 0000000..83c5e42
--- /dev/null
+++ b/breakthroughs.html
@@ -0,0 +1,120 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="AlmightyMiau's Personal Website">
+    <link href="styles.css" rel="stylesheet">
+    <title>Miau - Breakthroughs</title>
+    <link rel="icon" type="image/x-icon" href="miau.jpg">
+    <script>
+        function hidePages() {
+            let status = document.getElementById("pages").style.display;
+            if (status === "none") {
+                document.getElementById("pages").style.display = "block";
+            } else {
+                document.getElementById("pages").style.display = "none";
+            }
+        }
+        function hideBut() {
+            let status = document.getElementById("buttons").style.display;
+            if (status === "none") {
+                document.getElementById("buttons").style.display = "block";
+            } else {
+                document.getElementById("buttons").style.display = "none";
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div id="container">
+        <div class="topbar"></div>
+        <div id="flex">
+            <main>
+                <div class="title">&nbsp; Breakthroughs</div>
+                <div class="content">
+                    Over the past couple of months I've been reading the series <i>"Beware of Chicken: A Xianxia
+                        Cultivation Novel"</i> by <i>CasualFarmer</i>. I absolutely love this series and am taking the
+                    idea of breakthroughs from it. A breakthrough is a revelation someone has in relation to their
+                    cultivation style, which strengthens their bond with the world. Essentially, I will just be putting
+                    some of my random thoughts here, sometimes accompanied by images.
+                </div>
+                <div class="content" style="text-align: center;">
+                    <div class="date">8/7/2024</div>
+                    <p>
+                        Apparently coffee tastes different when it's brewed at different temperatures for different
+                        amounts of time, which is (probably) why the coffee I make tastes nothing like the coffee shop
+                        stuff
+                    </p>
+                </div>
+                <div class="content" style="text-align: center;">
+                    <div class="date">8/1/2024</div>
+                    <p>
+                        <img src="Elements diagram.png" id="image"> &nbsp; <img src="Elements Tattoo.png" id="image">
+                        <br>
+                        Earth creates metal, metal holds water, water feeds wood, wood feeds fire, <em>and Fire returns
+                            nutrients to the earth.</em>
+                    </p>
+                </div>
+            </main>
+            <aside>
+                <div class="sidebar-title">&nbsp; Pages <button onclick="hidePages()">&vArr;</button></div>
+                <div id="pages">
+                    <nav id="nav">
+                        <ul>
+                            <li>
+                                <a href="index.html">Home</a>
+                            </li>
+                            <li>
+                                <a href="breakthroughs.html">Breakthroughs</a>
+                            </li>
+                            <li>
+                                <a href="silly.html">Silly</a>
+                            </li>
+                            <li>
+                                <a href="factorio.html">Factorio</a>
+                            </li>
+                            <li>
+                                <a href="art.html">Art</a>
+                            </li>
+                            <li>
+                                <a href="cats.html">Cats</a>
+                            </li>
+                        </ul>
+                    </nav>
+                </div>
+                <div class="sidebar-title">&nbsp; Buttons <button onclick="hideBut()">&vArr;</button></div>
+                <div id="buttons">
+                    <nav id="nav">
+                        <div style="width: 88px; margin:0 auto;" id="buttons">
+                            <br>
+                            <a href="https://goblin-heart.net/" target="_blank"><img
+                                    src="https://goblin-heart.net/assets/images/gg-button.gif"></a>
+                            <br>
+                            <a href="https://goblin-heart.net/sadgrl/" target="_blank"><img
+                                    alt="88x31 button that says LEARN - HTML, Layouts, CSS, Guides, Websites: Learn @ sadgrl.online"
+                                    src="https://goblin-heart.net/assets/images/sadgrl-button.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://auzziejay.com/images/noweb32.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://yesterweb.org/img/button.png"></a>
+                            <br>
+                            <a href="https://megidolaon.gay"><img 
+                                    src="https://megidolaon.gay/media/megidolaongay.png"></a>
+                            <br>
+                        </div>
+                        <br>
+                    </nav>
+                </div>
+            </aside>
+        </div>
+        <footer id="footer">&#916; Copyworng :3</footer>
+    </div>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/cats.html b/cats.html
new file mode 100644
index 0000000..1a53ec3
--- /dev/null
+++ b/cats.html
@@ -0,0 +1,98 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="AlmightyMiau's Personal Website">
+    <link href="styles.css" rel="stylesheet">
+    <title>Miau - cats</title>
+    <link rel="icon" type="image/x-icon" href="miau.jpg">
+    <script>
+        function hidePages() {
+            let status = document.getElementById("pages").style.display;
+            if (status === "none") {
+                document.getElementById("pages").style.display = "block";
+            } else {
+                document.getElementById("pages").style.display = "none";
+            }
+        }
+        function hideBut() {
+            let status = document.getElementById("buttons").style.display;
+            if (status === "none") {
+                document.getElementById("buttons").style.display = "block";
+            } else {
+                document.getElementById("buttons").style.display = "none";
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div id="container">
+        <div class="topbar"></div>
+        <div id="flex">
+            <main>
+                <div class="title">&nbsp; Cats</div>
+                <div class="content">
+                    <p>I love cats they are very cute and fluffy and soft and cuddly</p>
+                </div>
+                <div class="title">&nbsp; Cats</div>
+                <div class="content">Placeholder for images :(</div>
+            </main>
+            <aside>
+                <div class="sidebar-title">&nbsp; Pages <button onclick="hidePages()">&vArr;</button></div>
+                <div id="pages">
+                    <nav id="nav">
+                        <ul>
+                            <li>
+                                <a href="index.html">Home</a>
+                            </li>
+                            <li>
+                                <a href="silly.html">Silly</a>
+                            </li>
+                            <li>
+                                <a href="factorio.html">Factorio</a>
+                            </li>
+                            <li>
+                                <a href="art.html">Art</a>
+                            </li>
+                            <li>
+                                <a href="cats.html">Cats</a>
+                            </li>
+                        </ul>
+                    </nav>
+                </div>
+                <div class="sidebar-title">&nbsp; Buttons <button onclick="hideBut()">&vArr;</button></div>
+                <div id="buttons">
+                    <nav id="nav">
+                        <div style="width: 88px; margin:0 auto;" id="buttons">
+                            <br>
+                            <a href="https://goblin-heart.net/" target="_blank"><img
+                                    src="https://goblin-heart.net/assets/images/gg-button.gif"></a>
+                            <br>
+                            <a href="https://goblin-heart.net/sadgrl/" target="_blank"><img
+                                    alt="88x31 button that says LEARN - HTML, Layouts, CSS, Guides, Websites: Learn @ sadgrl.online"
+                                    src="https://goblin-heart.net/assets/images/sadgrl-button.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://auzziejay.com/images/noweb32.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://yesterweb.org/img/button.png"></a>
+                            <br>
+                            <a href="https://megidolaon.gay"><img 
+                                    src="https://megidolaon.gay/media/megidolaongay.png"></a>
+                            <br>
+                        </div>
+                        <br>
+                    </nav>
+                </div>
+            </aside>
+        </div>
+        <footer id="footer">&#916; Copyworng :3</footer>
+    </div>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/factorio.html b/factorio.html
new file mode 100644
index 0000000..3c72789
--- /dev/null
+++ b/factorio.html
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="AlmightyMiau's Personal Website">
+    <link href="styles.css" rel="stylesheet">
+    <title>Miau - factorio</title>
+    <link rel="icon" type="image/x-icon" href="miau.jpg">
+    <script>
+        function hidePages() {
+            let status = document.getElementById("pages").style.display;
+            if (status === "none") {
+                document.getElementById("pages").style.display = "block";
+            } else {
+                document.getElementById("pages").style.display = "none";
+            }
+        }
+        function hideBut() {
+            let status = document.getElementById("buttons").style.display;
+            if (status === "none") {
+                document.getElementById("buttons").style.display = "block";
+            } else {
+                document.getElementById("buttons").style.display = "none";
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div id="container">
+        <div class="topbar"></div>
+        <div id="flex">
+            <main>
+                <div class="title">
+                    &nbsp; Factorio
+                    <img src="Factorio-gear_600x600.webp" style="width: 10%; margin-right: 5px;">
+                </div>
+                <div class="content">
+                    <div class="date">10/23/2024</div>
+                    <p>
+                        I just want to say that I have passed 1300 hours total and 600 on SE. I didn't finish SE before the dlc came out though, and got really burned out in trying to :(.
+                    </p>
+                </div>
+                <div class="content">
+                    <div class="date">7/4/2024</div>
+                    <p>
+                        Factorio is my favorite game ever and as of today, I have 1203.1 hours logged. I am currently
+                        playing an overhaul mod called Space Exploration (SE), and have been playing it for (exactly)
+                        500 hours.
+                    </p>
+                </div>
+            </main>
+            <aside>
+                <div class="sidebar-title">&nbsp; Pages <button onclick="hidePages()">&vArr;</button></div>
+                <div id="pages">
+                    <nav id="nav">
+                        <ul>
+                            <li>
+                                <a href="index.html">Home</a>
+                            </li>
+                            <li>
+                                <a href="silly.html">Silly</a>
+                            </li>
+                            <li>
+                                <a href="factorio.html">Factorio</a>
+                            </li>
+                            <li>
+                                <a href="art.html">Art</a>
+                            </li>
+                            <li>
+                                <a href="cats.html">Cats</a>
+                            </li>
+                        </ul>
+                    </nav>
+                </div>
+                <div class="sidebar-title">&nbsp; Buttons <button onclick="hideBut()">&vArr;</button></div>
+                <div id="buttons">
+                    <nav id="nav">
+                        <div style="width: 88px; margin:0 auto;" id="buttons">
+                            <br>
+                            <a href="https://goblin-heart.net/" target="_blank"><img
+                                    src="https://goblin-heart.net/assets/images/gg-button.gif"></a>
+                            <br>
+                            <a href="https://goblin-heart.net/sadgrl/" target="_blank"><img
+                                    alt="88x31 button that says LEARN - HTML, Layouts, CSS, Guides, Websites: Learn @ sadgrl.online"
+                                    src="https://goblin-heart.net/assets/images/sadgrl-button.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://auzziejay.com/images/noweb32.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://yesterweb.org/img/button.png"></a>
+                            <br>
+                            <a href="https://megidolaon.gay"><img 
+                                    src="https://megidolaon.gay/media/megidolaongay.png"></a>
+                            <br>
+                        </div>
+                        <br>
+                    </nav>
+                </div>
+            </aside>
+        </div>
+        <footer id="footer">&#916; Copyworng :3</footer>
+    </div>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/hoverBackground.js b/hoverBackground.js
new file mode 100644
index 0000000..d272d91
--- /dev/null
+++ b/hoverBackground.js
@@ -0,0 +1,5 @@
+var images = document.getElementById('bgs').querySelectorAll('img');
+var bg = document.getElementById('bg');
+
+
+images.forEach((el) => el.addEventListener('mouseover', (event) => bg.style.backgroundImage = 'url(' + el.src + ')' ));
+\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..299f704
--- /dev/null
+++ b/index.html
@@ -0,0 +1,176 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="AlmightyMiau's Personal Website">
+    <link href="styles.css" rel="stylesheet">
+    <title>Miau - Home Page</title>
+    <link rel="icon" type="image/x-icon" href="miau.jpg">
+    <script>
+        function hidePages() {
+            let status = document.getElementById("pages").style.display;
+            if (status === "none") {
+                document.getElementById("pages").style.display = "block";
+            } else {
+                document.getElementById("pages").style.display = "none";
+            }
+        }
+        function hideBut() {
+            let status = document.getElementById("buttons").style.display;
+            if (status === "none") {
+                document.getElementById("buttons").style.display = "block";
+            } else {
+                document.getElementById("buttons").style.display = "none";
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div id="container">
+        <div class="topbar"></div>
+        <div id="flex">
+            <main>
+                <div class="title">&nbsp; Welcome home pookie! </div>
+                <div class="content">
+                    <p>
+                        Hiiiii :3 I'm Miau. I like engineering and computers. I have somewhat of an obsession with
+                        factorio at 1300+ hours played in 3 years. I am also learning German and Japanese on Duolingo.
+                    </p>
+                </div>
+                <div class="title">&nbsp; Website Journal</div>
+                <div class="content">
+                    <div class="date">10/23/2024</div>
+                    <p>
+                        woa not neglected this time
+                    </p>
+                    <p>
+                        I added megidolaon's button to the side bar 
+                    </p>
+                    <p>
+                        added 4 stamps and 10 stickers to <a href="silly.html">silly</a>
+                    </p>
+                    <p> thats it :3</p>
+                </div>
+                <div class="content">
+                    <div class="date">10/20/2024</div>
+                    <p>
+                        <p>
+                            AAAAAAAAAAAAAAAAAAAAAAA I neglected my child again
+                        </p>
+                        <p>
+                            I am here today to add a new feature to the <a href="silly.html">SILLY</a> page, so that when you click/hover over the PISS sticker, it will change the background to that sticker. :3
+                        </p>
+                        <p>
+                            I am planning on adding a bunch of stuff to the <a href="factorio.html">Factorio</a> page, but i haven't gotten around to it bc it sounds like a lot of work &colon;&lpar;
+                        </p>
+                        <p>
+                            I am also <i>going to</i> add a list and pictures to the <a href="cats.html">Cats</a> page
+                        </p>
+                        <p>
+                            I've been in my first actual semester of college for the past 2 months, which is part of why I haven't been working on this. I really enjoy my comp sci class, even though I should probably be in a higher level class. If I could, I would only do this class (computers :3). I am also in a calculus 1 class, most of which I already learned in high school :/. My art appreciation class is quite interesting, learning about different paints, how they're made, what they excel in, etc. I really don't like my english class and I can't wait until I don't have to take any more.
+                        </p>
+                        <p>
+                            :3
+                        </p>
+                        <p>
+                            ok 2 hours later and I have added background effects to some of the stamps and stickers. (I don't think all of them need/deserve it)
+                            When you click on a sticker, for example the one that says piss, it will toggle that image as the background. The set of backgrounds at the bottom use a different method that I completely stole from <a href="https://goblin-heart.net/sadgrl/webmastery/downloads/tiledbgs">sadgrl</a>, which will have a preview of a background while you hover your cursor over it. 
+                        </p>
+                        <p>
+                            It is 4:23 am and I am quite eepy &brvbar;| goodnight
+                        </p>
+                    </p>
+                </div>
+                <div class="content">
+                    <div class="date">8/7/2024</div>
+                    <p>
+                        <p>&DDotrahd;&nbsp;Tried using python with flask to simplify adding new pages, but it didn't work out &colon;&lpar;</p>
+                        <p>&DDotrahd;&nbsp;Added a new page called <a href="silly.html">Silly</a></p>
+                        <p>&DDotrahd;&nbsp;Added a bunch of stamps and buttons to <a href="silly.html">Silly</a></p>
+                        <p>&DDotrahd;&nbsp;Finally added art to <a href="art.html">Art</a>. I have drawings of my cat Sassy, Adeptus Mechanicus artwork, memes I drew during math class, a marker tattoo I made a while ago, and some digital art</p>
+                        <p>&DDotrahd;&nbsp;Fixed tab titles, added a metadata description, and added a tab favicon
+                    </p>
+                </div>
+                <div class="content">
+                    <div class="date">8/1/2024</div>
+                    <p>
+                    <p>Wow it's already been a month and I haven't done anything on here.</p>
+                    <p>&DDotrahd;&nbsp;I finished my first college course recently. I had CIS-1A, an introduction to
+                        computer systems and microsoft office. It was pretty easy and I can't wait to start my fall
+                        term. I'm gonna have C++ programming, Calculus I, English comp, and Art appreciation.</p>
+                    <p>&DDotrahd;&nbsp;I made a new page today that I've been thinking about adding for a week now: <a
+                            href="breakthroughs.html">Breakthroughs</a>. I want a place
+                        where I can just put down my thoughts.</p>
+                    <p>&DDotrahd;&nbsp;The supervisor of a summer program I've gone to for a few years suggested a
+                        scholarship I should apply for, along with giving me a letter of recomendation. I started the
+                        application process today, but got too tired half way through</p>
+                    </p>
+                </div>
+                <div class="content">
+                    <div class="date">7/5/2024</div>
+                    <p>
+                        The first version of my personal website, made for the Harvard CS50 class. I'm making this
+                        personal site to learn HTML/CSS, and because I love how creative people are with their personal
+                        websites. I also don't like social media and this just feels better.
+                    </p>
+                </div>
+            </main>
+            <aside>
+                <div class="sidebar-title">&nbsp; Pages <button onclick="hidePages()">&vArr;</button></div>
+                <div id="pages">
+                    <nav id="nav">
+                        <ul>
+                            <li>
+                                <a href="index.html">Home</a>
+                            </li>
+                            <li>
+                                <a href="silly.html">Silly</a>
+                            </li>
+                            <li>
+                                <a href="factorio.html">Factorio</a>
+                            </li>
+                            <li>
+                                <a href="art.html">Art</a>
+                            </li>
+                            <li>
+                                <a href="cats.html">Cats</a>
+                            </li>
+                        </ul>
+                    </nav>
+                </div>
+                <div class="sidebar-title">&nbsp; Buttons <button onclick="hideBut()">&vArr;</button></div>
+                <div id="buttons">
+                    <nav id="nav">
+                        <div style="width: 88px; margin:0 auto;" id="buttons">
+                            <br>
+                            <a href="https://goblin-heart.net/" target="_blank"><img
+                                    src="https://goblin-heart.net/assets/images/gg-button.gif"></a>
+                            <br>
+                            <a href="https://goblin-heart.net/sadgrl/" target="_blank"><img
+                                    alt="88x31 button that says LEARN - HTML, Layouts, CSS, Guides, Websites: Learn @ sadgrl.online"
+                                    src="https://goblin-heart.net/assets/images/sadgrl-button.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://auzziejay.com/images/noweb32.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://yesterweb.org/img/button.png"></a>
+                            <br>
+                            <a href="https://megidolaon.gay"><img 
+                                    src="https://megidolaon.gay/media/megidolaongay.png"></a>
+                            <br>
+                        </div>
+                        <br>
+                    </nav>
+                </div>
+            </aside>
+        </div>
+        <footer id="footer">&#916; Copyworng :3</footer>
+    </div>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/miau.jpg b/miau.jpg
new file mode 100644
index 0000000..5a3d315
--- /dev/null
+++ b/miau.jpg
diff --git a/sillies/1nft.png b/sillies/1nft.png
new file mode 100644
index 0000000..d08f010
--- /dev/null
+++ b/sillies/1nft.png
diff --git a/sillies/20.gif b/sillies/20.gif
new file mode 100644
index 0000000..763d58a
--- /dev/null
+++ b/sillies/20.gif
diff --git a/sillies/3computer.jpg b/sillies/3computer.jpg
new file mode 100644
index 0000000..732e607
--- /dev/null
+++ b/sillies/3computer.jpg
diff --git a/sillies/3void.png b/sillies/3void.png
new file mode 100644
index 0000000..79d88f3
--- /dev/null
+++ b/sillies/3void.png
diff --git a/sillies/a16.gif b/sillies/a16.gif
new file mode 100644
index 0000000..262141e
--- /dev/null
+++ b/sillies/a16.gif
diff --git a/sillies/anti_internet.gif b/sillies/anti_internet.gif
new file mode 100644
index 0000000..f5ada32
--- /dev/null
+++ b/sillies/anti_internet.gif
diff --git a/sillies/b-boyliker.gif b/sillies/b-boyliker.gif
new file mode 100644
index 0000000..ed91108
--- /dev/null
+++ b/sillies/b-boyliker.gif
diff --git a/sillies/b-stardust.gif b/sillies/b-stardust.gif
new file mode 100644
index 0000000..bb47c19
--- /dev/null
+++ b/sillies/b-stardust.gif
diff --git a/sillies/b-twotrucks.gif b/sillies/b-twotrucks.gif
new file mode 100644
index 0000000..7688295
--- /dev/null
+++ b/sillies/b-twotrucks.gif
diff --git a/sillies/b-yippee.gif b/sillies/b-yippee.gif
new file mode 100644
index 0000000..1e3a96c
--- /dev/null
+++ b/sillies/b-yippee.gif
diff --git a/sillies/delete_system32.gif b/sillies/delete_system32.gif
new file mode 100644
index 0000000..724c3c3
--- /dev/null
+++ b/sillies/delete_system32.gif
diff --git a/sillies/delete_system32_1.gif b/sillies/delete_system32_1.gif
new file mode 100644
index 0000000..0ea3b72
--- /dev/null
+++ b/sillies/delete_system32_1.gif
diff --git a/sillies/getqueer.gif b/sillies/getqueer.gif
new file mode 100644
index 0000000..864c0bc
--- /dev/null
+++ b/sillies/getqueer.gif
diff --git a/sillies/girls.png b/sillies/girls.png
new file mode 100644
index 0000000..057fff5
--- /dev/null
+++ b/sillies/girls.png
diff --git a/sillies/iloveyaoi.gif b/sillies/iloveyaoi.gif
new file mode 100644
index 0000000..fb64103
--- /dev/null
+++ b/sillies/iloveyaoi.gif
diff --git a/sillies/irresistible.gif b/sillies/irresistible.gif
new file mode 100644
index 0000000..9e5c478
--- /dev/null
+++ b/sillies/irresistible.gif
diff --git a/sillies/like_the_legend_of_the_penis.webp b/sillies/like_the_legend_of_the_penis.webp
new file mode 100644
index 0000000..4dae8ac
--- /dev/null
+++ b/sillies/like_the_legend_of_the_penis.webp
diff --git a/sillies/megidolaongay.webp b/sillies/megidolaongay.webp
new file mode 100644
index 0000000..1836887
--- /dev/null
+++ b/sillies/megidolaongay.webp
diff --git a/sillies/oldyaoi.gif b/sillies/oldyaoi.gif
new file mode 100644
index 0000000..8b54f06
--- /dev/null
+++ b/sillies/oldyaoi.gif
diff --git a/sillies/piracy.webp b/sillies/piracy.webp
new file mode 100644
index 0000000..2f963ce
--- /dev/null
+++ b/sillies/piracy.webp
diff --git a/sillies/piss.gif b/sillies/piss.gif
new file mode 100644
index 0000000..6214180
--- /dev/null
+++ b/sillies/piss.gif
diff --git a/sillies/s-ddlc.png b/sillies/s-ddlc.png
new file mode 100644
index 0000000..50e6acb
--- /dev/null
+++ b/sillies/s-ddlc.png
diff --git a/sillies/s-evilpenis.png b/sillies/s-evilpenis.png
new file mode 100644
index 0000000..3989aba
--- /dev/null
+++ b/sillies/s-evilpenis.png
diff --git a/sillies/s-goodpenis.png b/sillies/s-goodpenis.png
new file mode 100644
index 0000000..63b18c5
--- /dev/null
+++ b/sillies/s-goodpenis.png
diff --git a/sillies/s-lazydraw.png b/sillies/s-lazydraw.png
new file mode 100644
index 0000000..f72f090
--- /dev/null
+++ b/sillies/s-lazydraw.png
diff --git a/sillies/s-robots.gif b/sillies/s-robots.gif
new file mode 100644
index 0000000..1859c08
--- /dev/null
+++ b/sillies/s-robots.gif
diff --git a/sillies/s-sparkleon.png b/sillies/s-sparkleon.png
new file mode 100644
index 0000000..9240a5a
--- /dev/null
+++ b/sillies/s-sparkleon.png
diff --git a/sillies/s-underattack.png b/sillies/s-underattack.png
new file mode 100644
index 0000000..1bdada8
--- /dev/null
+++ b/sillies/s-underattack.png
diff --git a/sillies/s-weenor.gif b/sillies/s-weenor.gif
new file mode 100644
index 0000000..13a3a21
--- /dev/null
+++ b/sillies/s-weenor.gif
diff --git a/sillies/s-wire.jpg b/sillies/s-wire.jpg
new file mode 100644
index 0000000..c1567ef
--- /dev/null
+++ b/sillies/s-wire.jpg
diff --git a/sillies/sparkleon.png b/sillies/sparkleon.png
new file mode 100644
index 0000000..c9e28d0
--- /dev/null
+++ b/sillies/sparkleon.png
diff --git a/sillies/subtext.gif b/sillies/subtext.gif
new file mode 100644
index 0000000..fb17c81
--- /dev/null
+++ b/sillies/subtext.gif
diff --git a/sillies/trainspride.gif b/sillies/trainspride.gif
new file mode 100644
index 0000000..5b5ed4a
--- /dev/null
+++ b/sillies/trainspride.gif
diff --git a/sillies/transrightsnow.webp b/sillies/transrightsnow.webp
new file mode 100644
index 0000000..997a741
--- /dev/null
+++ b/sillies/transrightsnow.webp
diff --git a/sillies/weezer.gif b/sillies/weezer.gif
new file mode 100644
index 0000000..129d9a5
--- /dev/null
+++ b/sillies/weezer.gif
diff --git a/silly.html b/silly.html
new file mode 100644
index 0000000..ec7f340
--- /dev/null
+++ b/silly.html
@@ -0,0 +1,168 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="description" content="AlmightyMiau's Personal Website">
+    <link href="styles.css" rel="stylesheet">
+    <title>Miau - Silly</title>
+    <link rel="icon" type="image/x-icon" href="miau.jpg">
+    <script>
+        function hidePages() {
+            let status = document.getElementById("pages").style.display;
+            if (status === "none") {
+                document.getElementById("pages").style.display = "block";
+            } else {
+                document.getElementById("pages").style.display = "none";
+            }
+        }
+        function hideBut() {
+            let status = document.getElementById("buttons").style.display;
+            if (status === "none") {
+                document.getElementById("buttons").style.display = "block";
+            } else {
+                document.getElementById("buttons").style.display = "none";
+            }
+        }
+        function sillyBackground(argument) {
+            let image = document.body.style.backgroundImage
+            console.log(image);
+            console.log(argument);
+            argument = "url(\"" + argument + "\")"
+            console.log(argument);
+            if (image == argument) {
+                document.body.style.backgroundImage = "url('backgrounds/stars3.gif')";
+            } else {
+                document.body.style.backgroundImage = argument;
+            }
+        }
+    </script>
+</head>
+
+<body id="bg">
+    <div id="container">
+        <div class="topbar"></div>
+        <div id="flex">
+            <main>
+                <div class="title">&nbsp; Images, Stamps, & Buttons </div>
+                <div class="content">
+                    <p>
+                        All of the sillies that I've "borrowed" from other websites
+                    </p>
+                    <p>
+                        Some stamps and stickers can be clicked :3
+                    </p>
+                </div>
+                <div class="title">&nbsp; Stamps </div>
+                <div class="content">
+                    <img width="99" height="56" src="sillies/20.gif">
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/girls.png')"><img width="99" height="56" src="sillies/girls.png"></button>
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/s-evilpenis.png')"><img width="99" height="56" src="sillies/s-evilpenis.png"></button>
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/s-goodpenis.png')"><img width="99" height="56" src="sillies/s-goodpenis.png"></button>
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/s-weenor.gif')"><img width="99" height="56" src="sillies/s-weenor.gif"></button>
+                    <img width="99" height="56" src="sillies/s-lazydraw.png">
+                    <img width="99" height="56" src="sillies/s-robots.gif">
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/s-sparkleon.png')"><img width="99" height="56" src="sillies/s-sparkleon.png"></button>
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/s-underattack.png')"><img width="99" height="56" src="sillies/s-underattack.png"></button>
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/sparkleon.png')"><img width="99" height="56" src="sillies/sparkleon.png"></button>
+                    <img width="99" height="56" src="sillies/s-wire.jpg">
+                    <img width="99" height="56" src="sillies/anti_internet.gif">
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/delete_system32_1.gif')"><img width="99" height="56" src="sillies/delete_system32_1.gif"></button>
+                    <img width="99" height="56" src="sillies/like_the_legend_of_the_penis.webp">
+                    <img width="99" height="56" src="sillies/s-ddlc.png">
+                </div>
+                <div class="title">&nbsp; Stickers </div>
+                <div class="content">
+                    <img width="88" height="31" src="sillies/1nft.png">
+                    <img width="88" height="31" src="sillies/3computer.jpg">
+                    <img width="88" height="31" src="sillies/a16.gif">
+                    <img width="88" height="31" src="sillies/piracy.webp">
+                    <img width="88" height="31" src="sillies/transrightsnow.webp">
+                    <img width="184" height="31" src="sillies/trainspride.gif">
+                    <img width="184" height="31" src="sillies/b-boyliker.gif">
+                    <button style="background-color: transparent; margin: -6px;" onclick="sillyBackground('sillies/piss.gif')"><img width="88" height="31" src="sillies/piss.gif"></button>
+                    <img width="184" height="31" src="sillies/b-twotrucks.gif">
+                    <img width="184" height="31" src="sillies/b-yippee.gif">
+                    <img width="88" height="31" src="sillies/getqueer.gif">
+                    <img width="184" height="31" src="sillies/b-stardust.gif">
+                    <img width="184" height="31" src="sillies/irresistible.gif">
+                    <img width="88" height="31" src="sillies/3void.png">
+                    <img width="184" height="31" src="sillies/subtext.gif">
+                    <img width="184" height="31" src="sillies/iloveyaoi.gif">
+                    <img width="88" height="31" src="sillies/oldyaoi.gif">
+                    <img width="184" height="31" src="sillies/weezer.gif">
+                    <img width="184" height="31" src="sillies/delete_system32.gif">
+                </div>
+                <div class="title">&nbsp; Backgrounds (Hover for preview)</div>
+                <div class="content" id="bgs">
+                    <img width="100" height="100" src="backgrounds/stars3.gif">
+                    <img width="100" height="100" src="backgrounds/background.gif">
+                    <img width="100" height="100" src="backgrounds/bck-mindwarp.jpg">
+                    <img width="100" height="100" src="backgrounds/bck-pnklightning.jpg">
+                    <img width="100" height="100" src="backgrounds/catcolors.gif">
+                    <img width="100" height="100" src="backgrounds/comp014.gif">
+                    <img width="100" height="100" src="backgrounds/comp016.gif">
+                    <img width="100" height="100" src="backgrounds/comp020.gif">
+                    <img width="100" height="100" src="backgrounds/flowers.webp">
+                    <img width="100" height="100" src="backgrounds/gifbground-804-0009.gif">
+                    <img width="100" height="100" src="backgrounds/num.gif">
+                </div>
+            </main>
+            <aside>
+                <div class="sidebar-title">&nbsp; Pages <button onclick="hidePages()">&vArr;</button></div>
+                <div id="pages">
+                    <nav id="nav">
+                        <ul>
+                            <li>
+                                <a href="index.html">Home</a>
+                            </li>
+                            <li>
+                                <a href="silly.html">Silly</a>
+                            </li>
+                            <li>
+                                <a href="factorio.html">Factorio</a>
+                            </li>
+                            <li>
+                                <a href="art.html">Art</a>
+                            </li>
+                            <li>
+                                <a href="cats.html">Cats</a>
+                            </li>
+                        </ul>
+                    </nav>
+                </div>
+                <div class="sidebar-title">&nbsp; Buttons <button onclick="hideBut()">&vArr;</button></div>
+                <div id="buttons">
+                    <nav id="nav">
+                        <div style="width: 88px; margin:0 auto;" id="buttons">
+                            <br>
+                            <a href="https://goblin-heart.net/" target="_blank"><img
+                                    src="https://goblin-heart.net/assets/images/gg-button.gif"></a>
+                            <br>
+                            <a href="https://goblin-heart.net/sadgrl/" target="_blank"><img
+                                    alt="88x31 button that says LEARN - HTML, Layouts, CSS, Guides, Websites: Learn @ sadgrl.online"
+                                    src="https://goblin-heart.net/assets/images/sadgrl-button.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://auzziejay.com/images/noweb32.gif"></a>
+                            <br>
+                            <a href="https://yesterweb.org/no-to-web3/"><img style="border:1px solid white;"
+                                    src="https://yesterweb.org/img/button.png"></a>
+                            <br>
+                            <a href="https://megidolaon.gay"><img 
+                                    src="https://megidolaon.gay/media/megidolaongay.png"></a>
+                            <br>
+                        </div>
+                        <br>
+                    </nav>
+                </div>
+            </aside>
+        </div>
+        <footer id="footer">&#916; Copyworng :3</footer>
+    </div>
+    <script src="hoverBackground.js"></script>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/stars3.gif b/stars3.gif
new file mode 100644
index 0000000..717ad16
--- /dev/null
+++ b/stars3.gif
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000..74f06c5
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,201 @@
+@font-face {
+    font-family: "FreePixel";
+    src: url("FreePixel.ttf") format("truetype");
+}
+
+:root {
+    --background-img: url("stars3.gif");
+    --background: #251a2d79;
+    --main-color-dk: #370c5a;
+    --main-color: #EB53D3;
+    --accent-1: #6eebff;
+    --accent-2: #d625e3;
+    --content-spacing: 5px;
+    --banner: url("miau.jpg");
+    --titleBars: #330b3f;
+    --text-color: white;
+    --border: 2px solid rgb(34, 34, 34);
+    --arrows: url('arrow.png');
+    --img-size: 150px;
+}
+
+.centered {
+    text-align: center;
+}
+.center-image {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    width: 6%;
+}
+
+#image {
+    width: var(--img-size);
+    height: var(--img-size);
+}
+
+.small {
+    width: 88;
+    height: 31;
+}
+
+html,
+body {
+    margin: 0;
+    box-sizing: border-box;
+    font-family: "FreePixel";
+}
+
+body {
+    background-image: var(--background-img);
+    color: var(--text-color);
+    background-attachment: fixed;
+}
+
+.topbar {
+    background-image: var(--banner);
+    height: 150px;
+    margin-bottom: var(--content-spacing);
+    border: var(--border);
+}
+
+#container,
+.topbar img {
+    max-width: 850px;
+    margin: 0 auto;
+}
+a {
+    color:var(--accent-1);
+}
+.topbar img {
+    image-rendering: pixelated;
+    image-rendering: -moz-crisp-edges;
+    image-rendering: crisp-edges;
+}
+
+#container {
+    border-top: none;
+}
+
+#flex {
+    display: flex;
+    max-width: 850px;
+}
+
+aside {
+    width: 30%;
+    margin-left: var(--content-spacing);
+    /* border-left: var(--border); */
+    background-color: var(--background);
+    border: var(--border);
+    border-top: 0px;
+}
+
+.title, .sidebar-title {
+    background-image: var(--titleBars);
+    font-weight: bold;
+    border-top: var(--border);
+    border-bottom: var(--border);
+    margin-bottom: -2px;
+    font-size: 20px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+main {
+    width: 74%;
+    background-color: var(--background);
+    border: var(--border);
+    border-top: 0px;
+}
+
+nav {
+    position: sticky;
+    top: 20px;
+}
+
+nav ul {
+    list-style-image: var(--arrows);
+    margin-left: 0;
+    padding-left: 30px;
+    color: var(--accent-1);
+}
+
+.content {
+    padding: 25px;
+    margin-top: -2px;
+    border-top: var(--border);
+}
+
+.date {
+    color: var(--accent-2);
+    text-align: center;
+    font-size: 14px;
+    padding: 0px;
+    margin-top: -5px;
+    margin-bottom: 5px;
+}
+
+footer {
+    /* border: var(--border); */
+    color: red;
+    font-weight: bold;
+    height: 25px;
+    margin-top: var(--content-spacing);
+    background-color: var(--titleBars);
+    text-align: center;
+}
+
+button {
+    background-color:var(--titleBars);
+    border: none;
+    color:rgb(148, 37, 37);
+    margin:5px;
+
+    /* THIS DISABLES NAV TOGGLE BUTTONS */
+    /* display: none; */
+}
+
+@media only screen and (max-width: 640px) {
+    nav ul {
+        list-style-image: none;
+        list-style-type: none;
+    }
+
+    #flex {
+        flex-wrap: wrap;
+    }
+
+    main {
+        width: 100%;
+        order: 2;
+    }
+
+    aside {
+        display: block;
+        width: 100%;
+        order: 1;
+        margin-left: 0;
+    }
+
+    nav ul {
+        display: flex;
+        flex-wrap: wrap;
+    }
+
+    nav ul li {
+        padding-right: 10px;
+    }
+
+    nav ul>ul, #buttons, nav div a, nav div br, nav br {
+        display: none;
+    }
+
+}
+
+@media only screen and (max-height: 640px) {
+    nav ul>ul {
+        display: none;
+    }
+}