diff --git a/public/categories/index.html b/public/categories/index.html
index c63e1f8..c34818c 100644
--- a/public/categories/index.html
+++ b/public/categories/index.html
@@ -4,8 +4,8 @@
   <meta charset="utf-8">
 <meta name="viewport" content="width=device-width">
 <title>Categories | Nickiel&#39;s Static Pages</title>
-<script type="text/javascript" src="/navbar.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+<script type="text/javascript" src="/navbar.js"></script>
 <link rel="stylesheet" href="/catppuccin.css">
 <link rel="stylesheet" href="/light_mode.css">
 <link rel="stylesheet" href="/dark_mode.css">
diff --git a/public/index.html b/public/index.html
index aee62e3..350df7e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5,8 +5,8 @@
   <meta charset="utf-8">
 <meta name="viewport" content="width=device-width">
 <title>Nickiel&#39;s Static Pages</title>
-<script type="text/javascript" src="/navbar.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+<script type="text/javascript" src="/navbar.js"></script>
 <link rel="stylesheet" href="/catppuccin.css">
 <link rel="stylesheet" href="/light_mode.css">
 <link rel="stylesheet" href="/dark_mode.css">
diff --git a/public/light_mode.css b/public/light_mode.css
index e69de29..8cd8de5 100644
--- a/public/light_mode.css
+++ b/public/light_mode.css
@@ -0,0 +1,64 @@
+
+
+.lightmode p {
+    color: var(--ctp-latte-text);
+}
+
+.lightmode {
+    background-color: var(--ctp-latte-base);
+}
+
+.lightmode a {
+    color: var(--ctp-latte-peach);
+}
+
+code.lightmode {
+    background-color: transparent;
+}
+code.lightmode > span {
+    background-color: transparent;
+}
+code.lightmode > span > span {
+    background-color: transparent;
+}
+code.lightmode > span > span > span {
+    background-color: transparent;
+}
+pre.lightmode {
+    background: var(--ctp-latte-crust);
+    border: 1px solid #ddd;
+    color: var(--ctp-latte-sky);
+    page-break-inside: avoid;
+    font-family: monospace;
+    font-size: 15px;
+    line-height: 1.6;
+    margin-bottom: 1.6em;
+    max-width: 100%;
+    overflow: auto;
+    padding: 1em 1.5em;
+    display: block;
+    word-wrap: break-word;
+}
+
+h1.lightmode, h2.darkmode, h3.darkmode, h4.darkmode, h5.darkmode, h6.darkmode {
+    color: var(--ctp-latte-sapphire);
+}
+
+.nav-list.lightmode a {
+    color: var(--ctp-latte-crust);
+}
+.nav-list.lightmode a:hover {
+    color: var(--ctp-latte-text);
+}
+.nav-list.lightmode {
+    background-color: var(--ctp-latte-mauve);
+}
+.nav-dropdown {
+    color: var(--ctp-latte-crust);
+}
+.nav-dropdown:hover {
+    color: var(--ctp-latte-text);
+}
+.nav-dropdown-content.lightmode {
+    background-color: var(--ctp-latte-mauve);
+}
diff --git a/public/navbar.js b/public/navbar.js
index 70acb09..fc6e641 100644
--- a/public/navbar.js
+++ b/public/navbar.js
@@ -1,3 +1,6 @@
+$(document).ready(function() {
+    light_mode();
+})
 
 function light_mode() {
     console.log("light mode!");
diff --git a/public/posts/chrono_track/index.html b/public/posts/chrono_track/index.html
index 027e90b..340351d 100644
--- a/public/posts/chrono_track/index.html
+++ b/public/posts/chrono_track/index.html
@@ -4,8 +4,8 @@
   <meta charset="utf-8">
 <meta name="viewport" content="width=device-width">
 <title>Chrono-Track User manual | Nickiel&#39;s Static Pages</title>
-<script type="text/javascript" src="/navbar.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+<script type="text/javascript" src="/navbar.js"></script>
 <link rel="stylesheet" href="/catppuccin.css">
 <link rel="stylesheet" href="/light_mode.css">
 <link rel="stylesheet" href="/dark_mode.css">
diff --git a/public/posts/index.html b/public/posts/index.html
index 51f39a0..75e5582 100644
--- a/public/posts/index.html
+++ b/public/posts/index.html
@@ -4,8 +4,8 @@
   <meta charset="utf-8">
 <meta name="viewport" content="width=device-width">
 <title>Posts | Nickiel&#39;s Static Pages</title>
-<script type="text/javascript" src="/navbar.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+<script type="text/javascript" src="/navbar.js"></script>
 <link rel="stylesheet" href="/catppuccin.css">
 <link rel="stylesheet" href="/light_mode.css">
 <link rel="stylesheet" href="/dark_mode.css">
diff --git a/public/posts/wgu_instructions/index.html b/public/posts/wgu_instructions/index.html
index 6dd8980..e40a7ec 100644
--- a/public/posts/wgu_instructions/index.html
+++ b/public/posts/wgu_instructions/index.html
@@ -4,8 +4,8 @@
   <meta charset="utf-8">
 <meta name="viewport" content="width=device-width">
 <title>WGU Capstone Setup Instructions | Nickiel&#39;s Static Pages</title>
-<script type="text/javascript" src="/navbar.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+<script type="text/javascript" src="/navbar.js"></script>
 <link rel="stylesheet" href="/catppuccin.css">
 <link rel="stylesheet" href="/light_mode.css">
 <link rel="stylesheet" href="/dark_mode.css">
diff --git a/public/tags/index.html b/public/tags/index.html
index 5dcd83f..7a4c562 100644
--- a/public/tags/index.html
+++ b/public/tags/index.html
@@ -4,8 +4,8 @@
   <meta charset="utf-8">
 <meta name="viewport" content="width=device-width">
 <title>Tags | Nickiel&#39;s Static Pages</title>
-<script type="text/javascript" src="/navbar.js"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+<script type="text/javascript" src="/navbar.js"></script>
 <link rel="stylesheet" href="/catppuccin.css">
 <link rel="stylesheet" href="/light_mode.css">
 <link rel="stylesheet" href="/dark_mode.css">