diff --git a/_sass/_variables.scss b/_sass/_variables.scss
new file mode 100644
index 0000000..5272b64
--- /dev/null
+++ b/_sass/_variables.scss
@@ -0,0 +1,2 @@
+$dark: #3d3d3d;
+$dark-bg-color: #272727;
\ No newline at end of file
diff --git a/_sass/dark-styles.scss b/_sass/dark-styles.scss
new file mode 100644
index 0000000..a050201
--- /dev/null
+++ b/_sass/dark-styles.scss
@@ -0,0 +1,10 @@
+@import "../node_modules/bulma/sass/utilities/initial-variables";
+@import "./variables";
+$scheme-main: $dark;
+$scheme-invert: $white;
+$footer-background-color: $scheme-main;
+$link: $scheme-invert;
+$link-hover: $scheme-invert;
+$text: $scheme-invert;
+$text-strong: $scheme-invert;
+$body-background-color: $dark-bg-color;
\ No newline at end of file
diff --git a/_sass/main.scss b/_sass/main.scss
index 7ccce03..c0109be 100644
--- a/_sass/main.scss
+++ b/_sass/main.scss
@@ -26,14 +26,8 @@ $primary-invert: $pink-invert;
 // 4. Import the rest of Bulma
 */
 @import url('https://fonts.googleapis.com/css?family=Nunito:400,700');
+@import "../node_modules/bulma/sass/utilities/initial-variables";
+@import "./variables";
 $family-sans-serif: "Nunito", sans-serif;
-$primary: #3b3b3b;
-$dark: #303030;
-$footer-background-color: $dark;
-$footer-color: true;
-$scheme-main: $primary;
-$scheme-main-bis: #343434;
-$link: #cfcfcf;
-$link-hover: #ffffff;
-$text: white;
+@import "./dark-styles.scss";
 @import "../node_modules/bulma/bulma";
diff --git a/css/extra.css b/css/extra.css
index 2daaed4..692ec2e 100644
--- a/css/extra.css
+++ b/css/extra.css
@@ -1,39 +1,11 @@
-:root {
-    color-scheme: dark;
-}
-body {
-    background-color: #363636;
-    display: flex;
-    flex-direction: column;
-    min-height: 100vh;
-}
-p, .navbar-menu a, .title {
-    color: white;
-}
-.container {
-    max-width: 960px;
-}
-.greeting h2 {
-    padding-top: 10px;
-}
-.social-bar {
-    display: flex;
-    flex-direction: row;
-    justify-content: flex-start;
-    margin: 10px 0px 0px;
-}
-.social-bar a {
-    margin-right: 20px;
-}
-.projects {
-    padding: 1.50rem;
-}
-.projects .card {
-    margin-bottom: 1.5rem;
-}
 .avatar-img {
     object-fit: cover;
     width: 150px;
     height: 150px;
     clip-path: circle();
+}
+
+p {
+    display: flex;
+    justify-content: space-between;
 }
\ No newline at end of file
diff --git a/css/main.css b/css/main.css
index b6859c4..b7491d4 100644
--- a/css/main.css
+++ b/css/main.css
@@ -117,7 +117,7 @@ fieldset[disabled] .file-name, fieldset[disabled] .select select, .select fields
   user-select: none;
   -moz-appearance: none;
   -webkit-appearance: none;
-  background-color: rgba(10, 10, 10, 0.2);
+  background-color: rgba(255, 255, 255, 0.2);
   border: none;
   border-radius: 9999px;
   cursor: pointer;
@@ -137,7 +137,7 @@ fieldset[disabled] .file-name, fieldset[disabled] .select select, .select fields
   width: 20px;
 }
 .modal-close::before, .delete::before, .modal-close::after, .delete::after {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   content: "";
   display: block;
   left: 50%;
@@ -155,10 +155,10 @@ fieldset[disabled] .file-name, fieldset[disabled] .select select, .select fields
   width: 2px;
 }
 .modal-close:hover, .delete:hover, .modal-close:focus, .delete:focus {
-  background-color: rgba(10, 10, 10, 0.3);
+  background-color: rgba(255, 255, 255, 0.3);
 }
 .modal-close:active, .delete:active {
-  background-color: rgba(10, 10, 10, 0.4);
+  background-color: rgba(255, 255, 255, 0.4);
 }
 .is-small.modal-close, .is-small.delete {
   height: 16px;
@@ -317,7 +317,7 @@ th:not([align]) {
 }
 
 html {
-  background-color: #3b3b3b;
+  background-color: #272727;
   font-size: 16px;
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
@@ -355,14 +355,14 @@ pre {
 }
 
 body {
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   font-size: 1em;
   font-weight: 400;
   line-height: 1.5;
 }
 
 a {
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
   cursor: pointer;
   text-decoration: none;
 }
@@ -370,7 +370,7 @@ a strong {
   color: currentColor;
 }
 a:hover {
-  color: #ffffff;
+  color: hsl(0deg, 0%, 100%);
 }
 
 code {
@@ -409,7 +409,7 @@ span {
 }
 
 strong {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   font-weight: 700;
 }
 
@@ -420,7 +420,7 @@ fieldset {
 pre {
   -webkit-overflow-scrolling: touch;
   background-color: hsl(0deg, 0%, 96%);
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   font-size: 0.875em;
   overflow-x: auto;
   padding: 1.25rem 1.5rem;
@@ -443,7 +443,7 @@ table th:not([align]) {
   text-align: inherit;
 }
 table th {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 
 @keyframes spinAround {
@@ -456,26 +456,26 @@ table th {
 }
 /* Bulma Elements */
 .box {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   border-radius: 6px;
-  box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
-  color: white;
+  box-shadow: 0 0.5em 1em -0.125em rgba(255, 255, 255, 0.1), 0 0px 0 1px rgba(255, 255, 255, 0.02);
+  color: hsl(0deg, 0%, 100%);
   display: block;
   padding: 1.25rem;
 }
 
 a.box:hover, a.box:focus {
-  box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px #cfcfcf;
+  box-shadow: 0 0.5em 1em -0.125em rgba(255, 255, 255, 0.1), 0 0 0 1px hsl(0deg, 0%, 100%);
 }
 a.box:active {
-  box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2), 0 0 0 1px #cfcfcf;
+  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.2), 0 0 0 1px hsl(0deg, 0%, 100%);
 }
 
 .button {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   border-color: hsl(0deg, 0%, 86%);
   border-width: 1px;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   cursor: pointer;
   justify-content: center;
   padding-bottom: calc(0.5em - 1px);
@@ -506,14 +506,14 @@ a.box:active {
 }
 .button:hover, .button.is-hovered {
   border-color: hsl(0deg, 0%, 71%);
-  color: #ffffff;
+  color: hsl(0deg, 0%, 100%);
 }
 .button:focus, .button.is-focused {
   border-color: hsl(229deg, 53%, 53%);
   color: hsl(0deg, 0%, 21%);
 }
 .button:focus:not(:active), .button.is-focused:not(:active) {
-  box-shadow: 0 0 0 0.125em rgba(207, 207, 207, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25);
 }
 .button:active, .button.is-active {
   border-color: hsl(0deg, 0%, 29%);
@@ -522,16 +522,16 @@ a.box:active {
 .button.is-text {
   background-color: transparent;
   border-color: transparent;
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   text-decoration: underline;
 }
 .button.is-text:hover, .button.is-text.is-hovered, .button.is-text:focus, .button.is-text.is-focused {
   background-color: hsl(0deg, 0%, 96%);
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .button.is-text:active, .button.is-text.is-active {
   background-color: #e8e8e8;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .button.is-text[disabled], fieldset[disabled] .button.is-text {
   background-color: transparent;
@@ -541,11 +541,11 @@ a.box:active {
 .button.is-ghost {
   background: none;
   border-color: transparent;
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
   text-decoration: none;
 }
 .button.is-ghost:hover, .button.is-ghost.is-hovered {
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
   text-decoration: underline;
 }
 .button.is-white {
@@ -798,12 +798,12 @@ a.box:active {
   color: rgba(0, 0, 0, 0.7);
 }
 .button.is-dark {
-  background-color: #303030;
+  background-color: #3d3d3d;
   border-color: transparent;
   color: #fff;
 }
 .button.is-dark:hover, .button.is-dark.is-hovered {
-  background-color: #2a2a2a;
+  background-color: #373737;
   border-color: transparent;
   color: #fff;
 }
@@ -812,21 +812,21 @@ a.box:active {
   color: #fff;
 }
 .button.is-dark:focus:not(:active), .button.is-dark.is-focused:not(:active) {
-  box-shadow: 0 0 0 0.125em rgba(48, 48, 48, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(61, 61, 61, 0.25);
 }
 .button.is-dark:active, .button.is-dark.is-active {
-  background-color: #232323;
+  background-color: #303030;
   border-color: transparent;
   color: #fff;
 }
 .button.is-dark[disabled], fieldset[disabled] .button.is-dark {
-  background-color: #303030;
-  border-color: #303030;
+  background-color: #3d3d3d;
+  border-color: #3d3d3d;
   box-shadow: none;
 }
 .button.is-dark.is-inverted {
   background-color: #fff;
-  color: #303030;
+  color: #3d3d3d;
 }
 .button.is-dark.is-inverted:hover, .button.is-dark.is-inverted.is-hovered {
   background-color: #f2f2f2;
@@ -835,32 +835,32 @@ a.box:active {
   background-color: #fff;
   border-color: transparent;
   box-shadow: none;
-  color: #303030;
+  color: #3d3d3d;
 }
 .button.is-dark.is-loading::after {
   border-color: transparent transparent #fff #fff !important;
 }
 .button.is-dark.is-outlined {
   background-color: transparent;
-  border-color: #303030;
-  color: #303030;
+  border-color: #3d3d3d;
+  color: #3d3d3d;
 }
 .button.is-dark.is-outlined:hover, .button.is-dark.is-outlined.is-hovered, .button.is-dark.is-outlined:focus, .button.is-dark.is-outlined.is-focused {
-  background-color: #303030;
-  border-color: #303030;
+  background-color: #3d3d3d;
+  border-color: #3d3d3d;
   color: #fff;
 }
 .button.is-dark.is-outlined.is-loading::after {
-  border-color: transparent transparent #303030 #303030 !important;
+  border-color: transparent transparent #3d3d3d #3d3d3d !important;
 }
 .button.is-dark.is-outlined.is-loading:hover::after, .button.is-dark.is-outlined.is-loading.is-hovered::after, .button.is-dark.is-outlined.is-loading:focus::after, .button.is-dark.is-outlined.is-loading.is-focused::after {
   border-color: transparent transparent #fff #fff !important;
 }
 .button.is-dark.is-outlined[disabled], fieldset[disabled] .button.is-dark.is-outlined {
   background-color: transparent;
-  border-color: #303030;
+  border-color: #3d3d3d;
   box-shadow: none;
-  color: #303030;
+  color: #3d3d3d;
 }
 .button.is-dark.is-inverted.is-outlined {
   background-color: transparent;
@@ -869,10 +869,10 @@ a.box:active {
 }
 .button.is-dark.is-inverted.is-outlined:hover, .button.is-dark.is-inverted.is-outlined.is-hovered, .button.is-dark.is-inverted.is-outlined:focus, .button.is-dark.is-inverted.is-outlined.is-focused {
   background-color: #fff;
-  color: #303030;
+  color: #3d3d3d;
 }
 .button.is-dark.is-inverted.is-outlined.is-loading:hover::after, .button.is-dark.is-inverted.is-outlined.is-loading.is-hovered::after, .button.is-dark.is-inverted.is-outlined.is-loading:focus::after, .button.is-dark.is-inverted.is-outlined.is-loading.is-focused::after {
-  border-color: transparent transparent #303030 #303030 !important;
+  border-color: transparent transparent #3d3d3d #3d3d3d !important;
 }
 .button.is-dark.is-inverted.is-outlined[disabled], fieldset[disabled] .button.is-dark.is-inverted.is-outlined {
   background-color: transparent;
@@ -881,12 +881,12 @@ a.box:active {
   color: #fff;
 }
 .button.is-primary {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   border-color: transparent;
   color: #fff;
 }
 .button.is-primary:hover, .button.is-primary.is-hovered {
-  background-color: #353535;
+  background-color: #00c4a7;
   border-color: transparent;
   color: #fff;
 }
@@ -895,21 +895,21 @@ a.box:active {
   color: #fff;
 }
 .button.is-primary:focus:not(:active), .button.is-primary.is-focused:not(:active) {
-  box-shadow: 0 0 0 0.125em rgba(59, 59, 59, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(0, 209, 178, 0.25);
 }
 .button.is-primary:active, .button.is-primary.is-active {
-  background-color: #2e2e2e;
+  background-color: #00b89c;
   border-color: transparent;
   color: #fff;
 }
 .button.is-primary[disabled], fieldset[disabled] .button.is-primary {
-  background-color: #3b3b3b;
-  border-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
+  border-color: hsl(171deg, 100%, 41%);
   box-shadow: none;
 }
 .button.is-primary.is-inverted {
   background-color: #fff;
-  color: #3b3b3b;
+  color: hsl(171deg, 100%, 41%);
 }
 .button.is-primary.is-inverted:hover, .button.is-primary.is-inverted.is-hovered {
   background-color: #f2f2f2;
@@ -918,32 +918,32 @@ a.box:active {
   background-color: #fff;
   border-color: transparent;
   box-shadow: none;
-  color: #3b3b3b;
+  color: hsl(171deg, 100%, 41%);
 }
 .button.is-primary.is-loading::after {
   border-color: transparent transparent #fff #fff !important;
 }
 .button.is-primary.is-outlined {
   background-color: transparent;
-  border-color: #3b3b3b;
-  color: #3b3b3b;
+  border-color: hsl(171deg, 100%, 41%);
+  color: hsl(171deg, 100%, 41%);
 }
 .button.is-primary.is-outlined:hover, .button.is-primary.is-outlined.is-hovered, .button.is-primary.is-outlined:focus, .button.is-primary.is-outlined.is-focused {
-  background-color: #3b3b3b;
-  border-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
+  border-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .button.is-primary.is-outlined.is-loading::after {
-  border-color: transparent transparent #3b3b3b #3b3b3b !important;
+  border-color: transparent transparent hsl(171deg, 100%, 41%) hsl(171deg, 100%, 41%) !important;
 }
 .button.is-primary.is-outlined.is-loading:hover::after, .button.is-primary.is-outlined.is-loading.is-hovered::after, .button.is-primary.is-outlined.is-loading:focus::after, .button.is-primary.is-outlined.is-loading.is-focused::after {
   border-color: transparent transparent #fff #fff !important;
 }
 .button.is-primary.is-outlined[disabled], fieldset[disabled] .button.is-primary.is-outlined {
   background-color: transparent;
-  border-color: #3b3b3b;
+  border-color: hsl(171deg, 100%, 41%);
   box-shadow: none;
-  color: #3b3b3b;
+  color: hsl(171deg, 100%, 41%);
 }
 .button.is-primary.is-inverted.is-outlined {
   background-color: transparent;
@@ -952,10 +952,10 @@ a.box:active {
 }
 .button.is-primary.is-inverted.is-outlined:hover, .button.is-primary.is-inverted.is-outlined.is-hovered, .button.is-primary.is-inverted.is-outlined:focus, .button.is-primary.is-inverted.is-outlined.is-focused {
   background-color: #fff;
-  color: #3b3b3b;
+  color: hsl(171deg, 100%, 41%);
 }
 .button.is-primary.is-inverted.is-outlined.is-loading:hover::after, .button.is-primary.is-inverted.is-outlined.is-loading.is-hovered::after, .button.is-primary.is-inverted.is-outlined.is-loading:focus::after, .button.is-primary.is-inverted.is-outlined.is-loading.is-focused::after {
-  border-color: transparent transparent #3b3b3b #3b3b3b !important;
+  border-color: transparent transparent hsl(171deg, 100%, 41%) hsl(171deg, 100%, 41%) !important;
 }
 .button.is-primary.is-inverted.is-outlined[disabled], fieldset[disabled] .button.is-primary.is-inverted.is-outlined {
   background-color: transparent;
@@ -964,26 +964,26 @@ a.box:active {
   color: #fff;
 }
 .button.is-primary.is-light {
-  background-color: whitesmoke;
-  color: #878787;
+  background-color: #ebfffc;
+  color: #00947e;
 }
 .button.is-primary.is-light:hover, .button.is-primary.is-light.is-hovered {
-  background-color: #eeeeee;
+  background-color: #defffa;
   border-color: transparent;
-  color: #878787;
+  color: #00947e;
 }
 .button.is-primary.is-light:active, .button.is-primary.is-light.is-active {
-  background-color: #e8e8e8;
+  background-color: #d1fff8;
   border-color: transparent;
-  color: #878787;
+  color: #00947e;
 }
 .button.is-link {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   border-color: transparent;
   color: rgba(0, 0, 0, 0.7);
 }
 .button.is-link:hover, .button.is-link.is-hovered {
-  background-color: #c9c9c9;
+  background-color: #f9f9f9;
   border-color: transparent;
   color: rgba(0, 0, 0, 0.7);
 }
@@ -992,21 +992,21 @@ a.box:active {
   color: rgba(0, 0, 0, 0.7);
 }
 .button.is-link:focus:not(:active), .button.is-link.is-focused:not(:active) {
-  box-shadow: 0 0 0 0.125em rgba(207, 207, 207, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25);
 }
 .button.is-link:active, .button.is-link.is-active {
-  background-color: #c2c2c2;
+  background-color: #f2f2f2;
   border-color: transparent;
   color: rgba(0, 0, 0, 0.7);
 }
 .button.is-link[disabled], fieldset[disabled] .button.is-link {
-  background-color: #cfcfcf;
-  border-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
+  border-color: hsl(0deg, 0%, 100%);
   box-shadow: none;
 }
 .button.is-link.is-inverted {
   background-color: rgba(0, 0, 0, 0.7);
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .button.is-link.is-inverted:hover, .button.is-link.is-inverted.is-hovered {
   background-color: rgba(0, 0, 0, 0.7);
@@ -1015,32 +1015,32 @@ a.box:active {
   background-color: rgba(0, 0, 0, 0.7);
   border-color: transparent;
   box-shadow: none;
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .button.is-link.is-loading::after {
   border-color: transparent transparent rgba(0, 0, 0, 0.7) rgba(0, 0, 0, 0.7) !important;
 }
 .button.is-link.is-outlined {
   background-color: transparent;
-  border-color: #cfcfcf;
-  color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
+  color: hsl(0deg, 0%, 100%);
 }
 .button.is-link.is-outlined:hover, .button.is-link.is-outlined.is-hovered, .button.is-link.is-outlined:focus, .button.is-link.is-outlined.is-focused {
-  background-color: #cfcfcf;
-  border-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
+  border-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .button.is-link.is-outlined.is-loading::after {
-  border-color: transparent transparent #cfcfcf #cfcfcf !important;
+  border-color: transparent transparent hsl(0deg, 0%, 100%) hsl(0deg, 0%, 100%) !important;
 }
 .button.is-link.is-outlined.is-loading:hover::after, .button.is-link.is-outlined.is-loading.is-hovered::after, .button.is-link.is-outlined.is-loading:focus::after, .button.is-link.is-outlined.is-loading.is-focused::after {
   border-color: transparent transparent rgba(0, 0, 0, 0.7) rgba(0, 0, 0, 0.7) !important;
 }
 .button.is-link.is-outlined[disabled], fieldset[disabled] .button.is-link.is-outlined {
   background-color: transparent;
-  border-color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
   box-shadow: none;
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .button.is-link.is-inverted.is-outlined {
   background-color: transparent;
@@ -1049,10 +1049,10 @@ a.box:active {
 }
 .button.is-link.is-inverted.is-outlined:hover, .button.is-link.is-inverted.is-outlined.is-hovered, .button.is-link.is-inverted.is-outlined:focus, .button.is-link.is-inverted.is-outlined.is-focused {
   background-color: rgba(0, 0, 0, 0.7);
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .button.is-link.is-inverted.is-outlined.is-loading:hover::after, .button.is-link.is-inverted.is-outlined.is-loading.is-hovered::after, .button.is-link.is-inverted.is-outlined.is-loading:focus::after, .button.is-link.is-inverted.is-outlined.is-loading.is-focused::after {
-  border-color: transparent transparent #cfcfcf #cfcfcf !important;
+  border-color: transparent transparent hsl(0deg, 0%, 100%) hsl(0deg, 0%, 100%) !important;
 }
 .button.is-link.is-inverted.is-outlined[disabled], fieldset[disabled] .button.is-link.is-inverted.is-outlined {
   background-color: transparent;
@@ -1061,16 +1061,16 @@ a.box:active {
   color: rgba(0, 0, 0, 0.7);
 }
 .button.is-link.is-light {
-  background-color: whitesmoke;
+  background-color: white;
   color: #4a4a4a;
 }
 .button.is-link.is-light:hover, .button.is-link.is-light.is-hovered {
-  background-color: #eeeeee;
+  background-color: #f9f9f9;
   border-color: transparent;
   color: #4a4a4a;
 }
 .button.is-link.is-light:active, .button.is-link.is-light.is-active {
-  background-color: #e8e8e8;
+  background-color: #f2f2f2;
   border-color: transparent;
   color: #4a4a4a;
 }
@@ -1478,7 +1478,7 @@ a.box:active {
   font-size: 1.5rem;
 }
 .button[disabled], fieldset[disabled] .button {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   border-color: hsl(0deg, 0%, 86%);
   box-shadow: none;
   opacity: 0.5;
@@ -1666,7 +1666,7 @@ a.box:active {
 .content h4,
 .content h5,
 .content h6 {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   font-weight: 600;
   line-height: 1.125;
 }
@@ -1782,7 +1782,7 @@ a.box:active {
   vertical-align: top;
 }
 .content table th {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .content table th:not([align]) {
   text-align: inherit;
@@ -1790,12 +1790,12 @@ a.box:active {
 .content table thead td,
 .content table thead th {
   border-width: 0 0 2px;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .content table tfoot td,
 .content table tfoot th {
   border-width: 2px 0 0;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .content table tbody tr:last-child td,
 .content table tbody tr:last-child th {
@@ -1984,7 +1984,7 @@ div.icon-text {
 }
 .notification code,
 .notification pre {
-  background: #3b3b3b;
+  background: #3d3d3d;
 }
 .notification pre code {
   background: transparent;
@@ -2012,23 +2012,23 @@ div.icon-text {
   color: rgba(0, 0, 0, 0.7);
 }
 .notification.is-dark {
-  background-color: #303030;
+  background-color: #3d3d3d;
   color: #fff;
 }
 .notification.is-primary {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .notification.is-primary.is-light {
-  background-color: whitesmoke;
-  color: #878787;
+  background-color: #ebfffc;
+  color: #00947e;
 }
 .notification.is-link {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .notification.is-link.is-light {
-  background-color: whitesmoke;
+  background-color: white;
   color: #4a4a4a;
 }
 .notification.is-info {
@@ -2079,13 +2079,13 @@ div.icon-text {
   background-color: hsl(0deg, 0%, 93%);
 }
 .progress::-webkit-progress-value {
-  background-color: white;
+  background-color: hsl(0deg, 0%, 100%);
 }
 .progress::-moz-progress-bar {
-  background-color: white;
+  background-color: hsl(0deg, 0%, 100%);
 }
 .progress::-ms-fill {
-  background-color: white;
+  background-color: hsl(0deg, 0%, 100%);
   border: none;
 }
 .progress.is-white::-webkit-progress-value {
@@ -2125,40 +2125,40 @@ div.icon-text {
   background-image: linear-gradient(to right, hsl(0deg, 0%, 96%) 30%, hsl(0deg, 0%, 93%) 30%);
 }
 .progress.is-dark::-webkit-progress-value {
-  background-color: #303030;
+  background-color: #3d3d3d;
 }
 .progress.is-dark::-moz-progress-bar {
-  background-color: #303030;
+  background-color: #3d3d3d;
 }
 .progress.is-dark::-ms-fill {
-  background-color: #303030;
+  background-color: #3d3d3d;
 }
 .progress.is-dark:indeterminate {
-  background-image: linear-gradient(to right, #303030 30%, hsl(0deg, 0%, 93%) 30%);
+  background-image: linear-gradient(to right, #3d3d3d 30%, hsl(0deg, 0%, 93%) 30%);
 }
 .progress.is-primary::-webkit-progress-value {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
 }
 .progress.is-primary::-moz-progress-bar {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
 }
 .progress.is-primary::-ms-fill {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
 }
 .progress.is-primary:indeterminate {
-  background-image: linear-gradient(to right, #3b3b3b 30%, hsl(0deg, 0%, 93%) 30%);
+  background-image: linear-gradient(to right, hsl(171deg, 100%, 41%) 30%, hsl(0deg, 0%, 93%) 30%);
 }
 .progress.is-link::-webkit-progress-value {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
 }
 .progress.is-link::-moz-progress-bar {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
 }
 .progress.is-link::-ms-fill {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
 }
 .progress.is-link:indeterminate {
-  background-image: linear-gradient(to right, #cfcfcf 30%, hsl(0deg, 0%, 93%) 30%);
+  background-image: linear-gradient(to right, hsl(0deg, 0%, 100%) 30%, hsl(0deg, 0%, 93%) 30%);
 }
 .progress.is-info::-webkit-progress-value {
   background-color: hsl(207deg, 61%, 53%);
@@ -2214,7 +2214,7 @@ div.icon-text {
   animation-name: moveIndeterminate;
   animation-timing-function: linear;
   background-color: hsl(0deg, 0%, 93%);
-  background-image: linear-gradient(to right, white 30%, hsl(0deg, 0%, 93%) 30%);
+  background-image: linear-gradient(to right, hsl(0deg, 0%, 100%) 30%, hsl(0deg, 0%, 93%) 30%);
   background-position: top left;
   background-repeat: no-repeat;
   background-size: 150% 150%;
@@ -2247,8 +2247,8 @@ div.icon-text {
   }
 }
 .table {
-  background-color: #3b3b3b;
-  color: hsl(0deg, 0%, 21%);
+  background-color: #3d3d3d;
+  color: hsl(0deg, 0%, 100%);
 }
 .table td,
 .table th {
@@ -2277,20 +2277,20 @@ div.icon-text {
 }
 .table td.is-dark,
 .table th.is-dark {
-  background-color: #303030;
-  border-color: #303030;
+  background-color: #3d3d3d;
+  border-color: #3d3d3d;
   color: #fff;
 }
 .table td.is-primary,
 .table th.is-primary {
-  background-color: #3b3b3b;
-  border-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
+  border-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .table td.is-link,
 .table th.is-link {
-  background-color: #cfcfcf;
-  border-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
+  border-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .table td.is-info,
@@ -2324,7 +2324,7 @@ div.icon-text {
 }
 .table td.is-selected,
 .table th.is-selected {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .table td.is-selected a,
@@ -2338,13 +2338,13 @@ div.icon-text {
   vertical-align: middle;
 }
 .table th {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .table th:not([align]) {
   text-align: left;
 }
 .table tr.is-selected {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .table tr.is-selected a,
@@ -2362,7 +2362,7 @@ div.icon-text {
 .table thead td,
 .table thead th {
   border-width: 0 0 2px;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .table tfoot {
   background-color: transparent;
@@ -2370,7 +2370,7 @@ div.icon-text {
 .table tfoot td,
 .table tfoot th {
   border-width: 2px 0 0;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .table tbody {
   background-color: transparent;
@@ -2391,10 +2391,10 @@ div.icon-text {
   width: 100%;
 }
 .table.is-hoverable tbody tr:not(.is-selected):hover {
-  background-color: #343434;
+  background-color: hsl(0deg, 0%, 98%);
 }
 .table.is-hoverable.is-striped tbody tr:not(.is-selected):hover {
-  background-color: #343434;
+  background-color: hsl(0deg, 0%, 98%);
 }
 .table.is-hoverable.is-striped tbody tr:not(.is-selected):hover:nth-child(even) {
   background-color: hsl(0deg, 0%, 96%);
@@ -2404,7 +2404,7 @@ div.icon-text {
   padding: 0.25em 0.5em;
 }
 .table.is-striped tbody tr:not(.is-selected):nth-child(even) {
-  background-color: #343434;
+  background-color: hsl(0deg, 0%, 98%);
 }
 
 .table-container {
@@ -2471,7 +2471,7 @@ div.icon-text {
   align-items: center;
   background-color: hsl(0deg, 0%, 96%);
   border-radius: 4px;
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   display: inline-flex;
   font-size: 0.75rem;
   height: 2em;
@@ -2498,23 +2498,23 @@ div.icon-text {
   color: rgba(0, 0, 0, 0.7);
 }
 .tag:not(body).is-dark {
-  background-color: #303030;
+  background-color: #3d3d3d;
   color: #fff;
 }
 .tag:not(body).is-primary {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .tag:not(body).is-primary.is-light {
-  background-color: whitesmoke;
-  color: #878787;
+  background-color: #ebfffc;
+  color: #00947e;
 }
 .tag:not(body).is-link {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .tag:not(body).is-link.is-light {
-  background-color: whitesmoke;
+  background-color: white;
   color: #4a4a4a;
 }
 .tag:not(body).is-info {
@@ -2632,7 +2632,7 @@ a.tag:hover {
 }
 
 .title {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   font-size: 2rem;
   font-weight: 600;
   line-height: 1.125;
@@ -2667,13 +2667,13 @@ a.tag:hover {
 }
 
 .subtitle {
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   font-size: 1.25rem;
   font-weight: 400;
   line-height: 1.25;
 }
 .subtitle strong {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   font-weight: 600;
 }
 .subtitle:not(.is-spaced) + .title {
@@ -2726,29 +2726,29 @@ a.tag:hover {
 
 /* Bulma Form */
 .select select, .textarea, .input {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   border-color: hsl(0deg, 0%, 86%);
   border-radius: 4px;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .select select::-moz-placeholder, .textarea::-moz-placeholder, .input::-moz-placeholder {
-  color: rgba(54, 54, 54, 0.3);
+  color: rgba(255, 255, 255, 0.3);
 }
 .select select::-webkit-input-placeholder, .textarea::-webkit-input-placeholder, .input::-webkit-input-placeholder {
-  color: rgba(54, 54, 54, 0.3);
+  color: rgba(255, 255, 255, 0.3);
 }
 .select select:-moz-placeholder, .textarea:-moz-placeholder, .input:-moz-placeholder {
-  color: rgba(54, 54, 54, 0.3);
+  color: rgba(255, 255, 255, 0.3);
 }
 .select select:-ms-input-placeholder, .textarea:-ms-input-placeholder, .input:-ms-input-placeholder {
-  color: rgba(54, 54, 54, 0.3);
+  color: rgba(255, 255, 255, 0.3);
 }
 .select select:hover, .textarea:hover, .input:hover, .select select.is-hovered, .is-hovered.textarea, .is-hovered.input {
   border-color: hsl(0deg, 0%, 71%);
 }
 .select select:focus, .textarea:focus, .input:focus, .select select.is-focused, .is-focused.textarea, .is-focused.input, .select select:active, .textarea:active, .input:active, .select select.is-active, .is-active.textarea, .is-active.input {
-  border-color: #cfcfcf;
-  box-shadow: 0 0 0 0.125em rgba(207, 207, 207, 0.25);
+  border-color: hsl(0deg, 0%, 100%);
+  box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25);
 }
 .select select[disabled], [disabled].textarea, [disabled].input, fieldset[disabled] .select select, .select fieldset[disabled] select, fieldset[disabled] .textarea, fieldset[disabled] .input {
   background-color: hsl(0deg, 0%, 96%);
@@ -2770,7 +2770,7 @@ a.tag:hover {
 }
 
 .textarea, .input {
-  box-shadow: inset 0 0.0625em 0.125em rgba(10, 10, 10, 0.05);
+  box-shadow: inset 0 0.0625em 0.125em rgba(255, 255, 255, 0.05);
   max-width: 100%;
   width: 100%;
 }
@@ -2796,22 +2796,22 @@ a.tag:hover {
   box-shadow: 0 0 0 0.125em rgba(245, 245, 245, 0.25);
 }
 .is-dark.textarea, .is-dark.input {
-  border-color: #303030;
+  border-color: #3d3d3d;
 }
 .is-dark.textarea:focus, .is-dark.input:focus, .is-dark.is-focused.textarea, .is-dark.is-focused.input, .is-dark.textarea:active, .is-dark.input:active, .is-dark.is-active.textarea, .is-dark.is-active.input {
-  box-shadow: 0 0 0 0.125em rgba(48, 48, 48, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(61, 61, 61, 0.25);
 }
 .is-primary.textarea, .is-primary.input {
-  border-color: #3b3b3b;
+  border-color: hsl(171deg, 100%, 41%);
 }
 .is-primary.textarea:focus, .is-primary.input:focus, .is-primary.is-focused.textarea, .is-primary.is-focused.input, .is-primary.textarea:active, .is-primary.input:active, .is-primary.is-active.textarea, .is-primary.is-active.input {
-  box-shadow: 0 0 0 0.125em rgba(59, 59, 59, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(0, 209, 178, 0.25);
 }
 .is-link.textarea, .is-link.input {
-  border-color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
 }
 .is-link.textarea:focus, .is-link.input:focus, .is-link.is-focused.textarea, .is-link.is-focused.input, .is-link.textarea:active, .is-link.input:active, .is-link.is-active.textarea, .is-link.is-active.input {
-  box-shadow: 0 0 0 0.125em rgba(207, 207, 207, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25);
 }
 .is-info.textarea, .is-info.input {
   border-color: hsl(207deg, 61%, 53%);
@@ -2897,7 +2897,7 @@ a.tag:hover {
   cursor: pointer;
 }
 .radio:hover, .checkbox:hover {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 [disabled].radio, [disabled].checkbox, fieldset[disabled] .radio, fieldset[disabled] .checkbox,
 .radio input[disabled],
@@ -2920,7 +2920,7 @@ a.tag:hover {
   height: 2.5em;
 }
 .select:not(.is-multiple):not(.is-loading)::after {
-  border-color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
   right: 1.125em;
   z-index: 4;
 }
@@ -2952,7 +2952,7 @@ a.tag:hover {
   padding: 0.5em 1em;
 }
 .select:not(.is-multiple):not(.is-loading):hover::after {
-  border-color: hsl(0deg, 0%, 21%);
+  border-color: hsl(0deg, 0%, 100%);
 }
 .select.is-white:not(:hover)::after {
   border-color: hsl(0deg, 0%, 100%);
@@ -2991,40 +2991,40 @@ a.tag:hover {
   box-shadow: 0 0 0 0.125em rgba(245, 245, 245, 0.25);
 }
 .select.is-dark:not(:hover)::after {
-  border-color: #303030;
+  border-color: #3d3d3d;
 }
 .select.is-dark select {
-  border-color: #303030;
+  border-color: #3d3d3d;
 }
 .select.is-dark select:hover, .select.is-dark select.is-hovered {
-  border-color: #232323;
+  border-color: #303030;
 }
 .select.is-dark select:focus, .select.is-dark select.is-focused, .select.is-dark select:active, .select.is-dark select.is-active {
-  box-shadow: 0 0 0 0.125em rgba(48, 48, 48, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(61, 61, 61, 0.25);
 }
 .select.is-primary:not(:hover)::after {
-  border-color: #3b3b3b;
+  border-color: hsl(171deg, 100%, 41%);
 }
 .select.is-primary select {
-  border-color: #3b3b3b;
+  border-color: hsl(171deg, 100%, 41%);
 }
 .select.is-primary select:hover, .select.is-primary select.is-hovered {
-  border-color: #2e2e2e;
+  border-color: #00b89c;
 }
 .select.is-primary select:focus, .select.is-primary select.is-focused, .select.is-primary select:active, .select.is-primary select.is-active {
-  box-shadow: 0 0 0 0.125em rgba(59, 59, 59, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(0, 209, 178, 0.25);
 }
 .select.is-link:not(:hover)::after {
-  border-color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
 }
 .select.is-link select {
-  border-color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
 }
 .select.is-link select:hover, .select.is-link select.is-hovered {
-  border-color: #c2c2c2;
+  border-color: #f2f2f2;
 }
 .select.is-link select:focus, .select.is-link select.is-focused, .select.is-link select:active, .select.is-link select.is-active {
-  box-shadow: 0 0 0 0.125em rgba(207, 207, 207, 0.25);
+  box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.25);
 }
 .select.is-info:not(:hover)::after {
   border-color: hsl(207deg, 61%, 53%);
@@ -3178,62 +3178,62 @@ a.tag:hover {
   color: rgba(0, 0, 0, 0.7);
 }
 .file.is-dark .file-cta {
-  background-color: #303030;
+  background-color: #3d3d3d;
   border-color: transparent;
   color: #fff;
 }
 .file.is-dark:hover .file-cta, .file.is-dark.is-hovered .file-cta {
-  background-color: #2a2a2a;
+  background-color: #373737;
   border-color: transparent;
   color: #fff;
 }
 .file.is-dark:focus .file-cta, .file.is-dark.is-focused .file-cta {
   border-color: transparent;
-  box-shadow: 0 0 0.5em rgba(48, 48, 48, 0.25);
+  box-shadow: 0 0 0.5em rgba(61, 61, 61, 0.25);
   color: #fff;
 }
 .file.is-dark:active .file-cta, .file.is-dark.is-active .file-cta {
-  background-color: #232323;
+  background-color: #303030;
   border-color: transparent;
   color: #fff;
 }
 .file.is-primary .file-cta {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   border-color: transparent;
   color: #fff;
 }
 .file.is-primary:hover .file-cta, .file.is-primary.is-hovered .file-cta {
-  background-color: #353535;
+  background-color: #00c4a7;
   border-color: transparent;
   color: #fff;
 }
 .file.is-primary:focus .file-cta, .file.is-primary.is-focused .file-cta {
   border-color: transparent;
-  box-shadow: 0 0 0.5em rgba(59, 59, 59, 0.25);
+  box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
   color: #fff;
 }
 .file.is-primary:active .file-cta, .file.is-primary.is-active .file-cta {
-  background-color: #2e2e2e;
+  background-color: #00b89c;
   border-color: transparent;
   color: #fff;
 }
 .file.is-link .file-cta {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   border-color: transparent;
   color: rgba(0, 0, 0, 0.7);
 }
 .file.is-link:hover .file-cta, .file.is-link.is-hovered .file-cta {
-  background-color: #c9c9c9;
+  background-color: #f9f9f9;
   border-color: transparent;
   color: rgba(0, 0, 0, 0.7);
 }
 .file.is-link:focus .file-cta, .file.is-link.is-focused .file-cta {
   border-color: transparent;
-  box-shadow: 0 0 0.5em rgba(207, 207, 207, 0.25);
+  box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
   color: rgba(0, 0, 0, 0.7);
 }
 .file.is-link:active .file-cta, .file.is-link.is-active .file-cta {
-  background-color: #c2c2c2;
+  background-color: #f2f2f2;
   border-color: transparent;
   color: rgba(0, 0, 0, 0.7);
 }
@@ -3415,14 +3415,14 @@ a.tag:hover {
 }
 .file-label:hover .file-cta {
   background-color: #eeeeee;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .file-label:hover .file-name {
   border-color: #d5d5d5;
 }
 .file-label:active .file-cta {
   background-color: #e8e8e8;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .file-label:active .file-name {
   border-color: #cfcfcf;
@@ -3450,7 +3450,7 @@ a.tag:hover {
 
 .file-cta {
   background-color: hsl(0deg, 0%, 96%);
-  color: white;
+  color: hsl(0deg, 0%, 100%);
 }
 
 .file-name {
@@ -3477,7 +3477,7 @@ a.tag:hover {
 }
 
 .label {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   display: block;
   font-size: 1rem;
   font-weight: 700;
@@ -3510,13 +3510,13 @@ a.tag:hover {
   color: hsl(0deg, 0%, 96%);
 }
 .help.is-dark {
-  color: #303030;
+  color: #3d3d3d;
 }
 .help.is-primary {
-  color: #3b3b3b;
+  color: hsl(171deg, 100%, 41%);
 }
 .help.is-link {
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .help.is-info {
   color: hsl(207deg, 61%, 53%);
@@ -3707,7 +3707,7 @@ a.tag:hover {
 .control.has-icons-left .input:focus ~ .icon,
 .control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon,
 .control.has-icons-right .select:focus ~ .icon {
-  color: white;
+  color: hsl(0deg, 0%, 100%);
 }
 .control.has-icons-left .input.is-small ~ .icon,
 .control.has-icons-left .select.is-small ~ .icon, .control.has-icons-right .input.is-small ~ .icon,
@@ -3770,13 +3770,13 @@ a.tag:hover {
 }
 .breadcrumb a {
   align-items: center;
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
   display: flex;
   justify-content: center;
   padding: 0 0.75em;
 }
 .breadcrumb a:hover {
-  color: #ffffff;
+  color: hsl(0deg, 0%, 100%);
 }
 .breadcrumb li {
   align-items: center;
@@ -3786,7 +3786,7 @@ a.tag:hover {
   padding-left: 0;
 }
 .breadcrumb li.is-active a {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   cursor: default;
   pointer-events: none;
 }
@@ -3838,10 +3838,10 @@ a.tag:hover {
 }
 
 .card {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   border-radius: 0.25rem;
-  box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
-  color: white;
+  box-shadow: 0 0.5em 1em -0.125em rgba(255, 255, 255, 0.1), 0 0px 0 1px rgba(255, 255, 255, 0.02);
+  color: hsl(0deg, 0%, 100%);
   max-width: 100%;
   position: relative;
 }
@@ -3858,13 +3858,13 @@ a.tag:hover {
 .card-header {
   background-color: transparent;
   align-items: stretch;
-  box-shadow: 0 0.125em 0.25em rgba(10, 10, 10, 0.1);
+  box-shadow: 0 0.125em 0.25em rgba(255, 255, 255, 0.1);
   display: flex;
 }
 
 .card-header-title {
   align-items: center;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   display: flex;
   flex-grow: 1;
   font-weight: 700;
@@ -3964,15 +3964,15 @@ a.tag:hover {
 }
 
 .dropdown-content {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   border-radius: 4px;
-  box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
+  box-shadow: 0 0.5em 1em -0.125em rgba(255, 255, 255, 0.1), 0 0px 0 1px rgba(255, 255, 255, 0.02);
   padding-bottom: 0.5rem;
   padding-top: 0.5rem;
 }
 
 .dropdown-item {
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   display: block;
   font-size: 0.875rem;
   line-height: 1.5;
@@ -3990,11 +3990,11 @@ button.dropdown-item {
 a.dropdown-item:hover,
 button.dropdown-item:hover {
   background-color: hsl(0deg, 0%, 96%);
-  color: hsl(0deg, 0%, 4%);
+  color: hsl(0deg, 0%, 100%);
 }
 a.dropdown-item.is-active,
 button.dropdown-item.is-active {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 
@@ -4181,16 +4181,16 @@ button.dropdown-item.is-active {
 }
 .menu-list a {
   border-radius: 2px;
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   display: block;
   padding: 0.5em 0.75em;
 }
 .menu-list a:hover {
   background-color: hsl(0deg, 0%, 96%);
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
 }
 .menu-list a.is-active {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .menu-list li ul {
@@ -4267,32 +4267,32 @@ button.dropdown-item.is-active {
   background-color: #fafafa;
 }
 .message.is-dark .message-header {
-  background-color: #303030;
+  background-color: #3d3d3d;
   color: #fff;
 }
 .message.is-dark .message-body {
-  border-color: #303030;
+  border-color: #3d3d3d;
 }
 .message.is-primary {
-  background-color: whitesmoke;
+  background-color: #ebfffc;
 }
 .message.is-primary .message-header {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .message.is-primary .message-body {
-  border-color: #3b3b3b;
-  color: #878787;
+  border-color: hsl(171deg, 100%, 41%);
+  color: #00947e;
 }
 .message.is-link {
-  background-color: whitesmoke;
+  background-color: white;
 }
 .message.is-link .message-header {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .message.is-link .message-body {
-  border-color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
   color: #4a4a4a;
 }
 .message.is-info {
@@ -4342,7 +4342,7 @@ button.dropdown-item.is-active {
 
 .message-header {
   align-items: center;
-  background-color: white;
+  background-color: hsl(0deg, 0%, 100%);
   border-radius: 4px 4px 0 0;
   color: rgba(0, 0, 0, 0.7);
   display: flex;
@@ -4368,12 +4368,12 @@ button.dropdown-item.is-active {
   border-radius: 4px;
   border-style: solid;
   border-width: 0 0 0 4px;
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   padding: 1.25em 1.5em;
 }
 .message-body code,
 .message-body pre {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
 }
 .message-body pre code {
   background-color: transparent;
@@ -4393,7 +4393,7 @@ button.dropdown-item.is-active {
 }
 
 .modal-background {
-  background-color: rgba(10, 10, 10, 0.86);
+  background-color: rgba(255, 255, 255, 0.86);
 }
 
 .modal-content,
@@ -4448,7 +4448,7 @@ button.dropdown-item.is-active {
 }
 
 .modal-card-title {
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   flex-grow: 1;
   flex-shrink: 0;
   font-size: 1.5rem;
@@ -4466,7 +4466,7 @@ button.dropdown-item.is-active {
 
 .modal-card-body {
   -webkit-overflow-scrolling: touch;
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   flex-grow: 1;
   flex-shrink: 1;
   overflow: auto;
@@ -4474,7 +4474,7 @@ button.dropdown-item.is-active {
 }
 
 .navbar {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   min-height: 3.25rem;
   position: relative;
   z-index: 30;
@@ -4648,7 +4648,7 @@ button.dropdown-item.is-active {
   }
 }
 .navbar.is-dark {
-  background-color: #303030;
+  background-color: #3d3d3d;
   color: #fff;
 }
 .navbar.is-dark .navbar-brand > .navbar-item,
@@ -4659,7 +4659,7 @@ button.dropdown-item.is-active {
 .navbar.is-dark .navbar-brand .navbar-link:focus,
 .navbar.is-dark .navbar-brand .navbar-link:hover,
 .navbar.is-dark .navbar-brand .navbar-link.is-active {
-  background-color: #232323;
+  background-color: #303030;
   color: #fff;
 }
 .navbar.is-dark .navbar-brand .navbar-link::after {
@@ -4685,7 +4685,7 @@ button.dropdown-item.is-active {
 .navbar.is-dark .navbar-end .navbar-link:focus,
 .navbar.is-dark .navbar-end .navbar-link:hover,
 .navbar.is-dark .navbar-end .navbar-link.is-active {
-    background-color: #232323;
+    background-color: #303030;
     color: #fff;
   }
   .navbar.is-dark .navbar-start .navbar-link::after,
@@ -4695,16 +4695,16 @@ button.dropdown-item.is-active {
   .navbar.is-dark .navbar-item.has-dropdown:focus .navbar-link,
 .navbar.is-dark .navbar-item.has-dropdown:hover .navbar-link,
 .navbar.is-dark .navbar-item.has-dropdown.is-active .navbar-link {
-    background-color: #232323;
+    background-color: #303030;
     color: #fff;
   }
   .navbar.is-dark .navbar-dropdown a.navbar-item.is-active {
-    background-color: #303030;
+    background-color: #3d3d3d;
     color: #fff;
   }
 }
 .navbar.is-primary {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .navbar.is-primary .navbar-brand > .navbar-item,
@@ -4715,7 +4715,7 @@ button.dropdown-item.is-active {
 .navbar.is-primary .navbar-brand .navbar-link:focus,
 .navbar.is-primary .navbar-brand .navbar-link:hover,
 .navbar.is-primary .navbar-brand .navbar-link.is-active {
-  background-color: #2e2e2e;
+  background-color: #00b89c;
   color: #fff;
 }
 .navbar.is-primary .navbar-brand .navbar-link::after {
@@ -4741,7 +4741,7 @@ button.dropdown-item.is-active {
 .navbar.is-primary .navbar-end .navbar-link:focus,
 .navbar.is-primary .navbar-end .navbar-link:hover,
 .navbar.is-primary .navbar-end .navbar-link.is-active {
-    background-color: #2e2e2e;
+    background-color: #00b89c;
     color: #fff;
   }
   .navbar.is-primary .navbar-start .navbar-link::after,
@@ -4751,16 +4751,16 @@ button.dropdown-item.is-active {
   .navbar.is-primary .navbar-item.has-dropdown:focus .navbar-link,
 .navbar.is-primary .navbar-item.has-dropdown:hover .navbar-link,
 .navbar.is-primary .navbar-item.has-dropdown.is-active .navbar-link {
-    background-color: #2e2e2e;
+    background-color: #00b89c;
     color: #fff;
   }
   .navbar.is-primary .navbar-dropdown a.navbar-item.is-active {
-    background-color: #3b3b3b;
+    background-color: hsl(171deg, 100%, 41%);
     color: #fff;
   }
 }
 .navbar.is-link {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .navbar.is-link .navbar-brand > .navbar-item,
@@ -4771,7 +4771,7 @@ button.dropdown-item.is-active {
 .navbar.is-link .navbar-brand .navbar-link:focus,
 .navbar.is-link .navbar-brand .navbar-link:hover,
 .navbar.is-link .navbar-brand .navbar-link.is-active {
-  background-color: #c2c2c2;
+  background-color: #f2f2f2;
   color: rgba(0, 0, 0, 0.7);
 }
 .navbar.is-link .navbar-brand .navbar-link::after {
@@ -4797,7 +4797,7 @@ button.dropdown-item.is-active {
 .navbar.is-link .navbar-end .navbar-link:focus,
 .navbar.is-link .navbar-end .navbar-link:hover,
 .navbar.is-link .navbar-end .navbar-link.is-active {
-    background-color: #c2c2c2;
+    background-color: #f2f2f2;
     color: rgba(0, 0, 0, 0.7);
   }
   .navbar.is-link .navbar-start .navbar-link::after,
@@ -4807,11 +4807,11 @@ button.dropdown-item.is-active {
   .navbar.is-link .navbar-item.has-dropdown:focus .navbar-link,
 .navbar.is-link .navbar-item.has-dropdown:hover .navbar-link,
 .navbar.is-link .navbar-item.has-dropdown.is-active .navbar-link {
-    background-color: #c2c2c2;
+    background-color: #f2f2f2;
     color: rgba(0, 0, 0, 0.7);
   }
   .navbar.is-link .navbar-dropdown a.navbar-item.is-active {
-    background-color: #cfcfcf;
+    background-color: hsl(0deg, 0%, 100%);
     color: rgba(0, 0, 0, 0.7);
   }
 }
@@ -5093,7 +5093,7 @@ body.has-navbar-fixed-bottom {
 }
 
 .navbar-burger {
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   -moz-appearance: none;
   -webkit-appearance: none;
   appearance: none;
@@ -5146,7 +5146,7 @@ body.has-navbar-fixed-bottom {
 
 .navbar-item,
 .navbar-link {
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   display: block;
   line-height: 1.5;
   padding: 0.5rem 0.75rem;
@@ -5167,8 +5167,8 @@ a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover, a.navbar-i
 .navbar-link:focus-within,
 .navbar-link:hover,
 .navbar-link.is-active {
-  background-color: #343434;
-  color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 98%);
+  color: hsl(0deg, 0%, 100%);
 }
 
 .navbar-item {
@@ -5192,14 +5192,14 @@ a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover, a.navbar-i
 }
 .navbar-item.is-tab:focus, .navbar-item.is-tab:hover {
   background-color: transparent;
-  border-bottom-color: #cfcfcf;
+  border-bottom-color: hsl(0deg, 0%, 100%);
 }
 .navbar-item.is-tab.is-active {
   background-color: transparent;
-  border-bottom-color: #cfcfcf;
+  border-bottom-color: hsl(0deg, 0%, 100%);
   border-bottom-style: solid;
   border-bottom-width: 3px;
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
   padding-bottom: calc(0.5rem - 3px);
 }
 
@@ -5212,7 +5212,7 @@ a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover, a.navbar-i
   padding-right: 2.5em;
 }
 .navbar-link:not(.is-arrowless)::after {
-  border-color: #cfcfcf;
+  border-color: hsl(0deg, 0%, 100%);
   margin-top: -0.375em;
   right: 1.125em;
 }
@@ -5248,8 +5248,8 @@ a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover, a.navbar-i
     display: none;
   }
   .navbar-menu {
-    background-color: #3b3b3b;
-    box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
+    background-color: #3d3d3d;
+    box-shadow: 0 8px 16px rgba(255, 255, 255, 0.1);
     padding: 0.5rem 0;
   }
   .navbar-menu.is-active {
@@ -5265,7 +5265,7 @@ a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover, a.navbar-i
     bottom: 0;
   }
   .navbar.is-fixed-bottom-touch.has-shadow {
-    box-shadow: 0 -2px 3px rgba(10, 10, 10, 0.1);
+    box-shadow: 0 -2px 3px rgba(255, 255, 255, 0.1);
   }
   .navbar.is-fixed-top-touch {
     top: 0;
@@ -5317,11 +5317,11 @@ body.has-navbar-fixed-bottom-touch {
   }
   .navbar.is-transparent .navbar-dropdown a.navbar-item:focus, .navbar.is-transparent .navbar-dropdown a.navbar-item:hover {
     background-color: hsl(0deg, 0%, 96%);
-    color: hsl(0deg, 0%, 4%);
+    color: hsl(0deg, 0%, 100%);
   }
   .navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {
     background-color: hsl(0deg, 0%, 96%);
-    color: #cfcfcf;
+    color: hsl(0deg, 0%, 100%);
   }
   .navbar-burger {
     display: none;
@@ -5342,7 +5342,7 @@ body.has-navbar-fixed-bottom-touch {
     border-radius: 6px 6px 0 0;
     border-top: none;
     bottom: 100%;
-    box-shadow: 0 -8px 8px rgba(10, 10, 10, 0.1);
+    box-shadow: 0 -8px 8px rgba(255, 255, 255, 0.1);
     top: auto;
   }
   .navbar-item.is-active .navbar-dropdown, .navbar-item.is-hoverable:focus .navbar-dropdown, .navbar-item.is-hoverable:focus-within .navbar-dropdown, .navbar-item.is-hoverable:hover .navbar-dropdown {
@@ -5366,11 +5366,11 @@ body.has-navbar-fixed-bottom-touch {
     margin-left: auto;
   }
   .navbar-dropdown {
-    background-color: #3b3b3b;
+    background-color: #3d3d3d;
     border-bottom-left-radius: 6px;
     border-bottom-right-radius: 6px;
     border-top: 2px solid hsl(0deg, 0%, 86%);
-    box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
+    box-shadow: 0 8px 8px rgba(255, 255, 255, 0.1);
     display: none;
     font-size: 0.875rem;
     left: 0;
@@ -5388,16 +5388,16 @@ body.has-navbar-fixed-bottom-touch {
   }
   .navbar-dropdown a.navbar-item:focus, .navbar-dropdown a.navbar-item:hover {
     background-color: hsl(0deg, 0%, 96%);
-    color: hsl(0deg, 0%, 4%);
+    color: hsl(0deg, 0%, 100%);
   }
   .navbar-dropdown a.navbar-item.is-active {
     background-color: hsl(0deg, 0%, 96%);
-    color: #cfcfcf;
+    color: hsl(0deg, 0%, 100%);
   }
   .navbar.is-spaced .navbar-dropdown, .navbar-dropdown.is-boxed {
     border-radius: 6px;
     border-top: none;
-    box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
+    box-shadow: 0 8px 8px rgba(255, 255, 255, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.1);
     display: block;
     opacity: 0;
     pointer-events: none;
@@ -5431,7 +5431,7 @@ body.has-navbar-fixed-bottom-touch {
     bottom: 0;
   }
   .navbar.is-fixed-bottom-desktop.has-shadow {
-    box-shadow: 0 -2px 3px rgba(10, 10, 10, 0.1);
+    box-shadow: 0 -2px 3px rgba(255, 255, 255, 0.1);
   }
   .navbar.is-fixed-top-desktop {
     top: 0;
@@ -5454,14 +5454,14 @@ body.has-spaced-navbar-fixed-bottom {
   }
   a.navbar-item.is-active,
 .navbar-link.is-active {
-    color: hsl(0deg, 0%, 4%);
+    color: hsl(0deg, 0%, 100%);
   }
   a.navbar-item.is-active:not(:focus):not(:hover),
 .navbar-link.is-active:not(:focus):not(:hover) {
     background-color: transparent;
   }
   .navbar-item.has-dropdown:focus .navbar-link, .navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
-    background-color: #343434;
+    background-color: hsl(0deg, 0%, 98%);
   }
 }
 .hero.is-fullheight-with-navbar {
@@ -5515,14 +5515,14 @@ body.has-spaced-navbar-fixed-bottom {
 .pagination-next,
 .pagination-link {
   border-color: hsl(0deg, 0%, 86%);
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   min-width: 2.5em;
 }
 .pagination-previous:hover,
 .pagination-next:hover,
 .pagination-link:hover {
   border-color: hsl(0deg, 0%, 71%);
-  color: #ffffff;
+  color: hsl(0deg, 0%, 100%);
 }
 .pagination-previous:focus,
 .pagination-next:focus,
@@ -5532,7 +5532,7 @@ body.has-spaced-navbar-fixed-bottom {
 .pagination-previous:active,
 .pagination-next:active,
 .pagination-link:active {
-  box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.2);
+  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.2);
 }
 .pagination-previous[disabled], .pagination-previous.is-disabled,
 .pagination-next[disabled],
@@ -5554,8 +5554,8 @@ body.has-spaced-navbar-fixed-bottom {
 }
 
 .pagination-link.is-current {
-  background-color: #cfcfcf;
-  border-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
+  border-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 
@@ -5633,7 +5633,7 @@ body.has-spaced-navbar-fixed-bottom {
 }
 .panel {
   border-radius: 6px;
-  box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
+  box-shadow: 0 0.5em 1em -0.125em rgba(255, 255, 255, 0.1), 0 0px 0 1px rgba(255, 255, 255, 0.02);
   font-size: 1rem;
 }
 .panel:not(:last-child) {
@@ -5670,34 +5670,34 @@ body.has-spaced-navbar-fixed-bottom {
   color: hsl(0deg, 0%, 96%);
 }
 .panel.is-dark .panel-heading {
-  background-color: #303030;
+  background-color: #3d3d3d;
   color: #fff;
 }
 .panel.is-dark .panel-tabs a.is-active {
-  border-bottom-color: #303030;
+  border-bottom-color: #3d3d3d;
 }
 .panel.is-dark .panel-block.is-active .panel-icon {
-  color: #303030;
+  color: #3d3d3d;
 }
 .panel.is-primary .panel-heading {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .panel.is-primary .panel-tabs a.is-active {
-  border-bottom-color: #3b3b3b;
+  border-bottom-color: hsl(171deg, 100%, 41%);
 }
 .panel.is-primary .panel-block.is-active .panel-icon {
-  color: #3b3b3b;
+  color: hsl(171deg, 100%, 41%);
 }
 .panel.is-link .panel-heading {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .panel.is-link .panel-tabs a.is-active {
-  border-bottom-color: #cfcfcf;
+  border-bottom-color: hsl(0deg, 0%, 100%);
 }
 .panel.is-link .panel-block.is-active .panel-icon {
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .panel.is-info .panel-heading {
   background-color: hsl(207deg, 61%, 53%);
@@ -5748,7 +5748,7 @@ body.has-spaced-navbar-fixed-bottom {
 .panel-heading {
   background-color: hsl(0deg, 0%, 93%);
   border-radius: 6px 6px 0 0;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   font-size: 1.25em;
   font-weight: 700;
   line-height: 1.25;
@@ -5772,15 +5772,15 @@ body.has-spaced-navbar-fixed-bottom {
 }
 
 .panel-list a {
-  color: white;
+  color: hsl(0deg, 0%, 100%);
 }
 .panel-list a:hover {
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 
 .panel-block {
   align-items: center;
-  color: hsl(0deg, 0%, 21%);
+  color: hsl(0deg, 0%, 100%);
   display: flex;
   justify-content: flex-start;
   padding: 0.5em 0.75em;
@@ -5797,11 +5797,11 @@ body.has-spaced-navbar-fixed-bottom {
   flex-wrap: wrap;
 }
 .panel-block.is-active {
-  border-left-color: #cfcfcf;
+  border-left-color: hsl(0deg, 0%, 100%);
   color: hsl(0deg, 0%, 21%);
 }
 .panel-block.is-active .panel-icon {
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .panel-block:last-child {
   border-bottom-left-radius: 6px;
@@ -5848,7 +5848,7 @@ label.panel-block:hover {
   border-bottom-color: hsl(0deg, 0%, 86%);
   border-bottom-style: solid;
   border-bottom-width: 1px;
-  color: white;
+  color: hsl(0deg, 0%, 100%);
   display: flex;
   justify-content: center;
   margin-bottom: -1px;
@@ -5856,15 +5856,15 @@ label.panel-block:hover {
   vertical-align: top;
 }
 .tabs a:hover {
-  border-bottom-color: hsl(0deg, 0%, 21%);
-  color: hsl(0deg, 0%, 21%);
+  border-bottom-color: hsl(0deg, 0%, 100%);
+  color: hsl(0deg, 0%, 100%);
 }
 .tabs li {
   display: block;
 }
 .tabs li.is-active a {
-  border-bottom-color: #cfcfcf;
-  color: #cfcfcf;
+  border-bottom-color: hsl(0deg, 0%, 100%);
+  color: hsl(0deg, 0%, 100%);
 }
 .tabs ul {
   align-items: center;
@@ -5910,7 +5910,7 @@ label.panel-block:hover {
   border-bottom-color: hsl(0deg, 0%, 86%);
 }
 .tabs.is-boxed li.is-active a {
-  background-color: #3b3b3b;
+  background-color: #3d3d3d;
   border-color: hsl(0deg, 0%, 86%);
   border-bottom-color: transparent !important;
 }
@@ -5942,8 +5942,8 @@ label.panel-block:hover {
   border-bottom-right-radius: 4px;
 }
 .tabs.is-toggle li.is-active a {
-  background-color: #cfcfcf;
-  border-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
+  border-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
   z-index: 1;
 }
@@ -7739,75 +7739,75 @@ a.has-text-light:hover, a.has-text-light:focus {
 }
 
 .has-text-dark {
-  color: #303030 !important;
+  color: #3d3d3d !important;
 }
 
 a.has-text-dark:hover, a.has-text-dark:focus {
-  color: #171717 !important;
+  color: #242424 !important;
 }
 
 .has-background-dark {
-  background-color: #303030 !important;
+  background-color: #3d3d3d !important;
 }
 
 .has-text-primary {
-  color: #3b3b3b !important;
+  color: hsl(171deg, 100%, 41%) !important;
 }
 
 a.has-text-primary:hover, a.has-text-primary:focus {
-  color: #222222 !important;
+  color: #009e86 !important;
 }
 
 .has-background-primary {
-  background-color: #3b3b3b !important;
+  background-color: hsl(171deg, 100%, 41%) !important;
 }
 
 .has-text-primary-light {
-  color: whitesmoke !important;
+  color: #ebfffc !important;
 }
 
 a.has-text-primary-light:hover, a.has-text-primary-light:focus {
-  color: #dbdbdb !important;
+  color: #b8fff4 !important;
 }
 
 .has-background-primary-light {
-  background-color: whitesmoke !important;
+  background-color: #ebfffc !important;
 }
 
 .has-text-primary-dark {
-  color: #878787 !important;
+  color: #00947e !important;
 }
 
 a.has-text-primary-dark:hover, a.has-text-primary-dark:focus {
-  color: #a1a1a1 !important;
+  color: #00c7a9 !important;
 }
 
 .has-background-primary-dark {
-  background-color: #878787 !important;
+  background-color: #00947e !important;
 }
 
 .has-text-link {
-  color: #cfcfcf !important;
+  color: hsl(0deg, 0%, 100%) !important;
 }
 
 a.has-text-link:hover, a.has-text-link:focus {
-  color: #b6b6b6 !important;
+  color: #e6e6e6 !important;
 }
 
 .has-background-link {
-  background-color: #cfcfcf !important;
+  background-color: hsl(0deg, 0%, 100%) !important;
 }
 
 .has-text-link-light {
-  color: whitesmoke !important;
+  color: white !important;
 }
 
 a.has-text-link-light:hover, a.has-text-link-light:focus {
-  color: #dbdbdb !important;
+  color: #e6e6e6 !important;
 }
 
 .has-background-link-light {
-  background-color: whitesmoke !important;
+  background-color: white !important;
 }
 
 .has-text-link-dark {
@@ -9614,7 +9614,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   color: hsl(0deg, 0%, 4%);
 }
 .hero.is-white .tabs.is-boxed a:hover, .hero.is-white .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-white .tabs.is-boxed li.is-active a, .hero.is-white .tabs.is-boxed li.is-active a:hover, .hero.is-white .tabs.is-toggle li.is-active a, .hero.is-white .tabs.is-toggle li.is-active a:hover {
   background-color: hsl(0deg, 0%, 4%);
@@ -9677,7 +9677,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   color: hsl(0deg, 0%, 100%);
 }
 .hero.is-black .tabs.is-boxed a:hover, .hero.is-black .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-black .tabs.is-boxed li.is-active a, .hero.is-black .tabs.is-boxed li.is-active a:hover, .hero.is-black .tabs.is-toggle li.is-active a, .hero.is-black .tabs.is-toggle li.is-active a:hover {
   background-color: hsl(0deg, 0%, 100%);
@@ -9740,7 +9740,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   color: rgba(0, 0, 0, 0.7);
 }
 .hero.is-light .tabs.is-boxed a:hover, .hero.is-light .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-light .tabs.is-boxed li.is-active a, .hero.is-light .tabs.is-boxed li.is-active a:hover, .hero.is-light .tabs.is-toggle li.is-active a, .hero.is-light .tabs.is-toggle li.is-active a:hover {
   background-color: rgba(0, 0, 0, 0.7);
@@ -9756,7 +9756,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   }
 }
 .hero.is-dark {
-  background-color: #303030;
+  background-color: #3d3d3d;
   color: #fff;
 }
 .hero.is-dark a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
@@ -9775,7 +9775,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
 }
 @media screen and (max-width: 1023px) {
   .hero.is-dark .navbar-menu {
-    background-color: #303030;
+    background-color: #3d3d3d;
   }
 }
 .hero.is-dark .navbar-item,
@@ -9785,7 +9785,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
 .hero.is-dark a.navbar-item:hover, .hero.is-dark a.navbar-item.is-active,
 .hero.is-dark .navbar-link:hover,
 .hero.is-dark .navbar-link.is-active {
-  background-color: #232323;
+  background-color: #303030;
   color: #fff;
 }
 .hero.is-dark .tabs a {
@@ -9796,30 +9796,30 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   opacity: 1;
 }
 .hero.is-dark .tabs li.is-active a {
-  color: #303030 !important;
+  color: #3d3d3d !important;
   opacity: 1;
 }
 .hero.is-dark .tabs.is-boxed a, .hero.is-dark .tabs.is-toggle a {
   color: #fff;
 }
 .hero.is-dark .tabs.is-boxed a:hover, .hero.is-dark .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-dark .tabs.is-boxed li.is-active a, .hero.is-dark .tabs.is-boxed li.is-active a:hover, .hero.is-dark .tabs.is-toggle li.is-active a, .hero.is-dark .tabs.is-toggle li.is-active a:hover {
   background-color: #fff;
   border-color: #fff;
-  color: #303030;
+  color: #3d3d3d;
 }
 .hero.is-dark.is-bold {
-  background-image: linear-gradient(141deg, #191415 0%, #303030 71%, #403b3a 100%);
+  background-image: linear-gradient(141deg, #272021 0%, #3d3d3d 71%, #4d4746 100%);
 }
 @media screen and (max-width: 768px) {
   .hero.is-dark.is-bold .navbar-menu {
-    background-image: linear-gradient(141deg, #191415 0%, #303030 71%, #403b3a 100%);
+    background-image: linear-gradient(141deg, #272021 0%, #3d3d3d 71%, #4d4746 100%);
   }
 }
 .hero.is-primary {
-  background-color: #3b3b3b;
+  background-color: hsl(171deg, 100%, 41%);
   color: #fff;
 }
 .hero.is-primary a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
@@ -9838,7 +9838,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
 }
 @media screen and (max-width: 1023px) {
   .hero.is-primary .navbar-menu {
-    background-color: #3b3b3b;
+    background-color: hsl(171deg, 100%, 41%);
   }
 }
 .hero.is-primary .navbar-item,
@@ -9848,7 +9848,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
 .hero.is-primary a.navbar-item:hover, .hero.is-primary a.navbar-item.is-active,
 .hero.is-primary .navbar-link:hover,
 .hero.is-primary .navbar-link.is-active {
-  background-color: #2e2e2e;
+  background-color: #00b89c;
   color: #fff;
 }
 .hero.is-primary .tabs a {
@@ -9859,30 +9859,30 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   opacity: 1;
 }
 .hero.is-primary .tabs li.is-active a {
-  color: #3b3b3b !important;
+  color: hsl(171deg, 100%, 41%) !important;
   opacity: 1;
 }
 .hero.is-primary .tabs.is-boxed a, .hero.is-primary .tabs.is-toggle a {
   color: #fff;
 }
 .hero.is-primary .tabs.is-boxed a:hover, .hero.is-primary .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-primary .tabs.is-boxed li.is-active a, .hero.is-primary .tabs.is-boxed li.is-active a:hover, .hero.is-primary .tabs.is-toggle li.is-active a, .hero.is-primary .tabs.is-toggle li.is-active a:hover {
   background-color: #fff;
   border-color: #fff;
-  color: #3b3b3b;
+  color: hsl(171deg, 100%, 41%);
 }
 .hero.is-primary.is-bold {
-  background-image: linear-gradient(141deg, #251e1f 0%, #3b3b3b 71%, #4b4544 100%);
+  background-image: linear-gradient(141deg, #009e6c 0%, hsl(171deg, 100%, 41%) 71%, #00e7eb 100%);
 }
 @media screen and (max-width: 768px) {
   .hero.is-primary.is-bold .navbar-menu {
-    background-image: linear-gradient(141deg, #251e1f 0%, #3b3b3b 71%, #4b4544 100%);
+    background-image: linear-gradient(141deg, #009e6c 0%, hsl(171deg, 100%, 41%) 71%, #00e7eb 100%);
   }
 }
 .hero.is-link {
-  background-color: #cfcfcf;
+  background-color: hsl(0deg, 0%, 100%);
   color: rgba(0, 0, 0, 0.7);
 }
 .hero.is-link a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
@@ -9901,7 +9901,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
 }
 @media screen and (max-width: 1023px) {
   .hero.is-link .navbar-menu {
-    background-color: #cfcfcf;
+    background-color: hsl(0deg, 0%, 100%);
   }
 }
 .hero.is-link .navbar-item,
@@ -9911,7 +9911,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
 .hero.is-link a.navbar-item:hover, .hero.is-link a.navbar-item.is-active,
 .hero.is-link .navbar-link:hover,
 .hero.is-link .navbar-link.is-active {
-  background-color: #c2c2c2;
+  background-color: #f2f2f2;
   color: rgba(0, 0, 0, 0.7);
 }
 .hero.is-link .tabs a {
@@ -9922,26 +9922,26 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   opacity: 1;
 }
 .hero.is-link .tabs li.is-active a {
-  color: #cfcfcf !important;
+  color: hsl(0deg, 0%, 100%) !important;
   opacity: 1;
 }
 .hero.is-link .tabs.is-boxed a, .hero.is-link .tabs.is-toggle a {
   color: rgba(0, 0, 0, 0.7);
 }
 .hero.is-link .tabs.is-boxed a:hover, .hero.is-link .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-link .tabs.is-boxed li.is-active a, .hero.is-link .tabs.is-boxed li.is-active a:hover, .hero.is-link .tabs.is-toggle li.is-active a, .hero.is-link .tabs.is-toggle li.is-active a:hover {
   background-color: rgba(0, 0, 0, 0.7);
   border-color: rgba(0, 0, 0, 0.7);
-  color: #cfcfcf;
+  color: hsl(0deg, 0%, 100%);
 }
 .hero.is-link.is-bold {
-  background-image: linear-gradient(141deg, #bdaeb1 0%, #cfcfcf 71%, #dedbda 100%);
+  background-image: linear-gradient(141deg, #e8e3e4 0%, hsl(0deg, 0%, 100%) 71%, white 100%);
 }
 @media screen and (max-width: 768px) {
   .hero.is-link.is-bold .navbar-menu {
-    background-image: linear-gradient(141deg, #bdaeb1 0%, #cfcfcf 71%, #dedbda 100%);
+    background-image: linear-gradient(141deg, #e8e3e4 0%, hsl(0deg, 0%, 100%) 71%, white 100%);
   }
 }
 .hero.is-info {
@@ -9992,7 +9992,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   color: #fff;
 }
 .hero.is-info .tabs.is-boxed a:hover, .hero.is-info .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-info .tabs.is-boxed li.is-active a, .hero.is-info .tabs.is-boxed li.is-active a:hover, .hero.is-info .tabs.is-toggle li.is-active a, .hero.is-info .tabs.is-toggle li.is-active a:hover {
   background-color: #fff;
@@ -10055,7 +10055,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   color: #fff;
 }
 .hero.is-success .tabs.is-boxed a:hover, .hero.is-success .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-success .tabs.is-boxed li.is-active a, .hero.is-success .tabs.is-boxed li.is-active a:hover, .hero.is-success .tabs.is-toggle li.is-active a, .hero.is-success .tabs.is-toggle li.is-active a:hover {
   background-color: #fff;
@@ -10118,7 +10118,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   color: rgba(0, 0, 0, 0.7);
 }
 .hero.is-warning .tabs.is-boxed a:hover, .hero.is-warning .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-warning .tabs.is-boxed li.is-active a, .hero.is-warning .tabs.is-boxed li.is-active a:hover, .hero.is-warning .tabs.is-toggle li.is-active a, .hero.is-warning .tabs.is-toggle li.is-active a:hover {
   background-color: rgba(0, 0, 0, 0.7);
@@ -10181,7 +10181,7 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
   color: #fff;
 }
 .hero.is-danger .tabs.is-boxed a:hover, .hero.is-danger .tabs.is-toggle a:hover {
-  background-color: rgba(10, 10, 10, 0.1);
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .hero.is-danger .tabs.is-boxed li.is-active a, .hero.is-danger .tabs.is-boxed li.is-active a:hover, .hero.is-danger .tabs.is-toggle li.is-active a, .hero.is-danger .tabs.is-toggle li.is-active a:hover {
   background-color: #fff;
@@ -10298,7 +10298,6 @@ a.has-text-danger-dark:hover, a.has-text-danger-dark:focus {
 }
 
 .footer {
-  background-color: #303030;
+  background-color: #3d3d3d;
   padding: 3rem 1.5rem 6rem;
-  color: true;
 }
diff --git a/img/animelist.jpg b/img/animelist.jpg
new file mode 100644
index 0000000..5e15f47
Binary files /dev/null and b/img/animelist.jpg differ
diff --git a/img/apple.jpg b/img/apple.jpg
new file mode 100644
index 0000000..abb479b
Binary files /dev/null and b/img/apple.jpg differ
diff --git a/img/aws.jpg b/img/aws.jpg
new file mode 100644
index 0000000..2cf18be
Binary files /dev/null and b/img/aws.jpg differ
diff --git a/img/instagram4j.jpg b/img/instagram4j.jpg
new file mode 100644
index 0000000..1ebc065
Binary files /dev/null and b/img/instagram4j.jpg differ
diff --git a/img/psychoswordsman.jpg b/img/psychoswordsman.jpg
new file mode 100644
index 0000000..a25d6ac
Binary files /dev/null and b/img/psychoswordsman.jpg differ
diff --git a/img/rippling.jpg b/img/rippling.jpg
new file mode 100644
index 0000000..d8605eb
Binary files /dev/null and b/img/rippling.jpg differ
diff --git a/index.html b/index.html
index b466ddb..f760803 100644
--- a/index.html
+++ b/index.html
@@ -1,23 +1,25 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Justin Vo</title>
-    <link rel="stylesheet" href="css/main.css">
-    <link rel="stylesheet" href="css/extra.css">
-    <script defer src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/js/all.min.js"></script>
-    <script src="_javascript/jquery-3.5.1.slim.min.js"></script>
-    <script src="_javascript/func.js"></script>
-  </head>
-  <body>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Justin Vo</title>
+  <link rel="stylesheet" href="css/main.css">
+  <link rel="stylesheet" href="css/extra.css">
+  <script defer src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/js/all.min.js"></script>
+  <script src="_javascript/jquery-3.5.1.slim.min.js"></script>
+  <script src="_javascript/func.js"></script>
+</head>
+
+<body class="has-navbar-fixed-top" id="home">
   <!-- NAVIGATION -->
-  <nav class="navbar is-dark" role="navigation" aria-label="main navigation">
+  <nav class="navbar is-dark is-fixed-top" role="navigation" aria-label="main navigation">
     <div class="container">
       <div class="navbar-brand">
-        <div class="navbar-item">
+        <a href="#home" class="navbar-item">
           <b>Justin Vo</b>
-        </div>
+        </a>
         <a href="https://github.com/jvogit/" class="navbar-item">
           <i class="fab fa-github"></i>
         </a>
@@ -32,7 +34,8 @@
       </div>
       <div class="navbar-menu">
         <div class="navbar-start">
-          <a href ="#projects" class="navbar-item">Projects</a>
+          <a href="#work-experience" class="navbar-item">Work</a>
+          <a href="#projects" class="navbar-item">Projects</a>
         </div>
         <div class="navbar-end">
           <div class="navbar-item">
@@ -41,148 +44,228 @@
                 <i style="margin-right: 10px;" class="fa fa-heart"></i>Sponsor
               </a>
             </div>
-          </a>
+            </a>
+          </div>
         </div>
       </div>
-    </div>
   </nav>
   <!-- END NAVIGATION -->
   <!-- START MAIN -->
-  <section class="hero" id="home">
-    <div class="hero-body">
-      <div class="container">
-        <div class="greeting columns is-mobile">
-          <div class="column">
-            <h1 class="title">
+  <section class="section is-medium">
+    <div class="container">
+      <div class="columns is-mobile is-gapless">
+        <div class="column">
+          <div class="block">
+            <h1 class="title is-1">
               Hello, World!
             </h1>
             <p>
-              I'm Justin Vo, a computer science student at UCSB. I'm a very curious person and I'm interested in backend web development, machine learning, cloud infrasturcture/internal tool develpoment/DevOps, and some game development. 
+              I'm Justin Vo, a computer science student at UCSB. I'm a very curious person and I'm interested in backend
+              web development, machine learning, cloud infrasturcture/internal tool develpoment/DevOps, and some game
+              development.
             </p>
-            <div style="margin-top: 24px;">
-              <b>Find me at:</b>
-              <div class="social-bar">
-                <a href="http://github.com/jvogit/" class="button is-black">
-                  <span class="icon">
-                    <i class="fab fa-github"></i>
-                  </span>
-                </a>
-                <a href="https://www.linkedin.com/in/justinnvo/" class="button is-info">
-                  <span class="icon">
-                    <i class="fab fa-linkedin"></i>
-                  </span>
-                </a>
-              </div>
-            </div>
           </div>
-          <div style="display: flex; justify-content: center;" class="column">
-            <img src="img/avatar.jpg" class="avatar-img">
+          <div class="block">
+            <h2 class="title is-6">Find me at:</h2>
+            <div class="block">
+              <a href="http://github.com/jvogit/" class="block button is-black">
+                <span class="icon">
+                  <i class="fab fa-github"></i>
+                </span>
+              </a>
+              <a href="https://www.linkedin.com/in/justinnvo/" class="block button is-info">
+                <span class="icon">
+                  <i class="fab fa-linkedin"></i>
+                </span>
+              </a>
+            </div>
           </div>
         </div>
+        <div style="display: flex; justify-content: center;" class="column">
+          <img src="img/avatar.jpg" class="avatar-img">
+        </div>
       </div>
     </div>
   </section>
+  <!-- END MAIN -->
+  <!-- WORK EXPERIENCE -->
+  <section class="section" id="work-experience">
+    <div class="container">
+      <h1 class="title is-2">Work Experience</h1>
+      <div class="card block">
+        <div class="card-image">
+          <figure class="image is-1235x169">
+            <img src="img/rippling.jpg" alt="Rippling Banner">
+          </figure>
+        </div>
+        <div class="card-content content">
+          <p class="title is-4">Rippling</p>
+          <p class="subtitle is-6">
+            <span>
+              Software Engineer Intern
+            </span>
+            <em>
+              09/2022 - Current
+            </em>
+          </p>
+        </div>
+      </div>
+      <div class="card block">
+        <div class="card-image">
+          <figure class="image is-1235x169">
+            <img src="img/apple.jpg" alt="Apple Banner">
+          </figure>
+        </div>
+        <div class="card-content content">
+          <p class="title is-4">Apple</p>
+          <p class="subtitle is-6">
+            <span>
+              Software Engineer Intern
+            </span>
+            <em>
+              06/2022 - 09/2022
+            </em>
+          </p>
+        </div>
+      </div>
+      <div class="card block">
+        <div class="card-image">
+          <figure class="image is-1235x169">
+            <img src="img/aws.jpg" alt="AWS Banner">
+          </figure>
+        </div>
+        <div class="card-content content">
+          <p class="title is-4">Amazon</p>
+          <p class="subtitle is-6">
+            <span>
+              Software Engineer Intern
+            </span>
+            <em>
+              06/2021 - 09/2021
+            </em>
+          </p>
+        </div>
+      </div>
+    </div>
+  </section>
+  <!-- END WORK EXPERIENCE -->
   <!-- PROJECTS -->
-  <section class="projects" id="projects">
+  <section class="section" id="projects">
     <div class="container">
-      <div class="columns">
-        <div class="column is-full">
-          <h1 class="title">Projects</h1>
-        </div>
-      </div>  
-      <div style="display: block;">
-        <div class="card">
-          <div class="card-content content">
-            <p class="title">
-              instagram4j
-            </p>
-            <p>
-              Reverse engineered Instagram Android internal API. Java based
-              client to interface with Instagram's private API.
-            </p>
-            <ul>
-              <li>Many requests supported</li>
-              <li>Asynchronous execution</li>
-              <li>Custom request and response framework</li>
-            </ul>
+      <h1 class="title is-2">Projects</h1>
+      <div class="card block">
+        <div class="card-image">
+          <figure class="image is-1235x338">
+            <img src="img/animelist.jpg" alt="Anime List Tracker">
+          </figure>
+        </div>
+        <div class="card-content content">
+          <p class="title is-4">
+            Anime List Tracker
+          </p>
+          <div class="block">
+            <span class="tag is-light">React</span>
+            <span class="tag is-light">MongoDB</span>
+            <span class="tag is-light">Springboot</span>
+            <span class="tag is-light">GraphQL</span>
+            <span class="tag is-light">Java</span>
+            <span class="tag is-light">TypeScript</span>
           </div>
-          <footer class="card-footer">
-            <p class="card-footer-item">
-              <span>
-                <a href="https://github.com/instagram4j/instagram4j">View on GitHub</a>
-              </span>
-            </p>
-          </footer>
+          <p class="subtitle is-6">
+            An anime list app that allows better customization for rating your favorite anime in however way you want!
+          </p>
+          <ul>
+            <li>Led a team to build a fullstack web application for anime fans to track and rate anime shows</li>
+            <li>Spearheaded the design and implementation of a customizable rating system with user customizable scoring
+              criteria, score weights, and score labels</li>
+            <li>Utilized React to develop the rating system, user anime list, and profile customization UI features</li>
+            <li>Automated CI/CD pipeline using GitHub actions to test feature PRs and automate production deployment
+            </li>
+          </ul>
         </div>
-        <div class="card">
-          <div class="card-content content">
-            <p class="title">
-              PetDateApp
-            </p>
-            <p>
-              An app for pet enthusiasts! Raising awareness for adoptable pets!
-            </p>
-            <ul>
-              <li>Tinder swipe mechanic</li>
-              <li>Upload and swipe on other people's pets!</li>
-              <li>Learn how to adopt a pet</li>
-            </ul>
+        <footer class="card-footer">
+          <p class="card-footer-item">
+            <span>
+              <a href="https://github.com/jvogit/project-t10-animelist">GitHub</a>
+            </span>
+          </p>
+          <p class="card-footer-item">
+            <span>
+              <a href="https://cs148-t10-animelist.vercel.app/list/61ab1bebe1b7e76ba1261be9">View my list!</a>
+            </span>
+          </p>
+        </footer>
+      </div>
+      <div class="card block">
+        <div class="card-image">
+          <figure class="image is-1235x338">
+            <img src="img/psychoswordsman.jpg" alt="Psycho Swordsman">
+          </figure>
+        </div>
+        <div class="card-content content">
+          <p class="title is-4">
+            Psycho Swordsman
+          </p>
+          <div class="block">
+            <span class="tag is-light">Unity</span>
+            <span class="tag is-light">C#</span>
+            <span class="tag is-light">Game Design</span>
+            <span class="tag is-light">Video Game</span>
           </div>
-          <footer class="card-footer">
-            <p class="card-footer-item">
-              <span>
-                <a href="https://github.com/PetDate/pet-date-app">View on GitHub</a>
-              </span>
-            </p>
-            <p class="card-footer-item">
-              <span>
-                <a href="https://find-a-pet.online/">View website!</a>
-              </span>
-            </p>
-          </footer>
+          <p class="subtitle is-6">
+            Psycho Swordsman has you, a swordsman for your village, defeat invaders and save your village!
+          </p>
+          <ul>
+            <li>Designed, developed, and released an indie action adventure melee combat video game in Unity</li>
+            <li>Implemented a melee sword combat system with precise combos, rolling, and parrying mechanics</li>
+            <li>Utilized state machines to implement fun, complex combat AI for enemies</li>
+          </ul>
         </div>
-        <div class="card">
-          <div class="card-content content">
-            <p class="title">
-              MyEssentials
-            </p>
-            <p>
-              Minecraft plugin with essentials for my private server with friends:
-            </p>
-            <ul>
-              <li>/tpa - teleport requests</li>
-              <li>/home - teleport to bed</li>
-              <li>/back - teleport to last location</li>
-              <li>basic world managment</li>
-              <li>some minecart enhancements</li>
-              <li>/passive - passive mode</li>
-            </ul>
+      </div>
+      <div class="card block">
+        <div class="card-image">
+          <figure class="image is-1235x338">
+            <img src="img/instagram4j.jpg" alt="instagram4j">
+          </figure>
+        </div>
+        <div class="card-content content">
+          <p class="title is-4">
+            instagram4j
+          </p>
+          <div class="block">
+            <span class="tag is-light">Java</span>
+            <span class="tag is-light">Open Source</span>
           </div>
-          <footer class="card-footer">
-            <p class="card-footer-item">
-              <span>
-                <a href="https://github.com/jvogit/MyEssentials/">View on GitHub</a>
-              </span>
-            </p>
-          </footer>
+          <p class="subtitle is-6">
+            Reverse engineered Instagram Android internal API. Java based
+            client to interface with Instagram's private API.
+          </p>
+          <ul>
+            <li>Rewrote 700+ stars open source custom Java client for Instagram's API addressing 200+ issues</li>
+            <li>Reverse engineered Instagram's REST API and MQTT protocol for realtime push notifications</li>
+            <li>Implement a Java custom client for the modified MQTT 3.1.1 light weight messging protocol in Java</li>
+          </ul>
         </div>
+        <footer class="card-footer">
+          <p class="card-footer-item">
+            <span>
+              <a href="https://github.com/instagram4j/instagram4j">GitHub</a>
+            </span>
+          </p>
+        </footer>
       </div>
     </div>
   </section>
   <!-- END PROJECTS -->
   <div style="flex: 1"></div>
   <footer class="footer">
-    <div class="columns">
-      <div class="column">
-        <div class="content has-text-centered">
-          <p>
-            Made with <a href="https://bulma.io/">bulma</a>
-          </p>
-          <p>Copyright © 2021 | All Rights Reserved</p>
-        </div>
-      </div>
+    <div class="container is-flex is-flex-direction-column is-align-items-center">
+      <p>
+        <span>Made with <a href="https://bulma.io/">bulma</a></span>
+      </p>
+      <p>Copyright © 2022 | All Rights Reserved</p>
     </div>
   </footer>
-  <!-- END MAIN -->
-  </body>
+</body>
+
 </html>
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 52a01d0..fd783bc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1073,7 +1073,7 @@
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
+      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
       "dev": true
     },
     "convert-source-map": {
@@ -1091,7 +1091,7 @@
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
+      "integrity": "sha512-3lqz5YjWTYnW6dlDa5TLaTCcShfar1e40rmcJVwCBJC6mWlFuj0eCHIElmG1g5kyuJ/GD+8Wn4FFCcz4gJPfaQ==",
       "dev": true,
       "optional": true
     },
@@ -1192,7 +1192,7 @@
     "escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
       "dev": true
     },
     "esutils": {
@@ -1378,7 +1378,7 @@
     "fs.realpath": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
+      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
       "dev": true
     },
     "fsevents": {
@@ -1579,12 +1579,6 @@
           "dev": true,
           "optional": true
         },
-        "ini": {
-          "version": "1.3.5",
-          "bundled": true,
-          "dev": true,
-          "optional": true
-        },
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "bundled": true,
@@ -2074,7 +2068,7 @@
     "inflight": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
+      "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
       "dev": true,
       "requires": {
         "once": "^1.3.0",
@@ -2087,6 +2081,13 @@
       "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
       "dev": true
     },
+    "ini": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
+      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
+      "dev": true,
+      "optional": true
+    },
     "invariant": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
@@ -2099,7 +2100,7 @@
     "is-arrayish": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
+      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
       "dev": true
     },
     "is-binary-path": {
@@ -2241,14 +2242,14 @@
     "isarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
+      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "dev": true,
       "optional": true
     },
     "isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
       "dev": true
     },
     "isobject": {
@@ -2545,7 +2546,7 @@
     "object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
       "dev": true
     },
     "object-keys": {
@@ -2568,7 +2569,7 @@
     "once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
+      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
       "dev": true,
       "requires": {
         "wrappy": "1"
@@ -2613,7 +2614,7 @@
     "path-is-absolute": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
+      "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==",
       "dev": true
     },
     "path-key": {
@@ -3021,7 +3022,7 @@
     "require-directory": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
       "dev": true
     },
     "resolve": {
@@ -3382,7 +3383,7 @@
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
       "dev": true,
       "optional": true
     },
@@ -3469,7 +3470,7 @@
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
       "dev": true
     },
     "y18n": {