diff --git a/_config.yml b/_config.yml
index 7c6881f..5fddcd7 100644
--- a/_config.yml
+++ b/_config.yml
@@ -17,6 +17,7 @@ ga_analytics: UA-74118570-2
 
 # Social
 twitter_username: ewpratten
+insta_username: evanpratten
 github_username:  ewpratten
 devrant_username: ewpratten
 gitlab_username: ewpratten
@@ -42,6 +43,9 @@ collections:
 
 highlighter: rouge
 
+sass:
+    sass_dir: _sass
+
 plugins:
   - jekyll-feed
   - jekyll-redirect-from # https://github.com/jekyll/jekyll-redirect-from
diff --git a/_includes/head.html b/_includes/head.html
index d746267..d10dfa6 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
         integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
         <link rel="stylesheet" href="{{site.baseurl}}/assets/css/main.css">
+        <!-- <link rel="stylesheet" href="{{site.baseurl}}/assets/css/dark.css"> -->
     <link rel="stylesheet" href="{{site.baseurl}}/assets/css/github-syntax.css">
     <link rel="stylesheet" href="{{site.baseurl}}/assets/css/fontawesome.css">
     <link href="https://fonts.googleapis.com/css?family=IBM+Plex+Mono:400,400i|IBM+Plex+Sans:100,100i,400,400i,700,700i" rel="stylesheet">
diff --git a/_layouts/posts.html b/_layouts/posts.html
index ff96b5a..e993ced 100644
--- a/_layouts/posts.html
+++ b/_layouts/posts.html
@@ -22,7 +22,7 @@
                 <hr>
 
                 <div class="list-group" id="posts">
-                    <a href="#posts" class="list-group-item list-group-item-action list-group-item-dark">Featured
+                    <a href="#posts" class="feature list-group-item list-group-item-action list-group-item-dark ">Featured
                         Post</a>
 
                     {% assign i = 0 %}
diff --git a/about.md b/about.md
index 0395050..86d9c5b 100644
--- a/about.md
+++ b/about.md
@@ -38,12 +38,12 @@ The following is my key history:
 I exist in various places around the internet. Mainly:
 
  - [Twitter](https://twitter.com/{{site.twitter_username}})
+ - [Instagram](https://www.instagram.com/((site.insta_username)))
+ - <a data-toggle="modal" data-target="#snapcode" href="">Snapchat</a>
  - <a data-toggle="modal" data-target="#devrant-disclaimer" href="">devRant</a>
  - [GitHub](https://github.com/{{site.github_username}})
  - [GitLab](https://gitlab.com/{{site.gitlab_username}})
- - [RetryLife Git](https://git.retrylife.ca/{{site.rtlgit_username}})
  - [Keybase](https://keybase.com/{{site.keybase_username}})
- - <a data-toggle="modal" data-target="#snapcode" href="">Snapchat</a>
 
 ## My gear
 Currently, I use the following hardware:
diff --git a/assets/css/dark.css b/assets/css/dark.css
new file mode 100644
index 0000000..2411f25
--- /dev/null
+++ b/assets/css/dark.css
@@ -0,0 +1,57 @@
+/* Colors */
+
+:root {
+    --bg-color: rgb(29, 33, 48);
+    --content-bg: rgb(35, 41, 55);
+    --panel-bg: rgb(46, 53, 74);
+    --highlight-clr: rgb(39, 232, 167);
+    --text-clr: rgb(228, 240, 252);
+    --heading-clr: rgb(81, 99, 119);
+    --link-clr: rgb(49, 174, 132);
+}
+
+body {
+    background-color: var(--bg-color);
+    color: var(--text-clr);
+}
+
+h1, h2, h3, h4, h5, h6 {
+    color: var(--heading-clr);
+}
+
+.container, .navbar-dark {
+    background-color: var(--content-bg) !important;
+}
+
+.profile {
+    border-color: var(--content-bg) !important;
+}
+
+.site-info {
+    background-color: var(--content-bg) !important;
+}
+
+.list-group, .list-group-item {
+    background-color: var(--panel-bg) !important;
+    color: var(--text-clr) !important;
+}
+
+.list-group, .list-group-item h5{
+    color: var(--link-clr) !important;
+}
+
+.feature{
+    background-color: var(--heading-clr) !important;
+}
+
+.navbar-brand {
+    color: var(--highlight-clr) !important;
+}
+
+a {
+    color: var(--link-clr);
+}
+
+a::hover {
+    color: var(--highlight-clr) !important;
+}
\ No newline at end of file