diff --git a/assets/css/_bs-colors.scss b/assets/css/_bs-colors.scss
index 0fdcded..af40eb1 100644
--- a/assets/css/_bs-colors.scss
+++ b/assets/css/_bs-colors.scss
@@ -1,30 +1,32 @@
 // Colors
-// -- now defined in bs-custom --
-// $primary: #e48663;
-// $secondary: #00b0b0;
-// $success: #99c24d;
-// $info: #b489c7;
-// $warning: #f4d35e;
+// now defined in bs-custom
+// $primary: #51A39F;
+// // $secondary: #9883E5;
+// $secondary: #955E42;
+// $success: #37B800;
+// $info: #0075F2;
+// $warning: #F9E900;
+// $danger: #DD1C1A;
 
-// gray scale based off 'pale silver' #bebfb0 which was text color in Lester's original design
-// however, i think a lighter text is more readable, going 1 lighter for this design
+// define black, white, gray
 $white: #fff;
-$gray-010: #e3dfdd;
-$gray-100: #d1cac7;
-$gray-200: #beb5b0;
-$gray-300: #aca09a;
-$gray-400: #9a8b84;
-$gray-500: #87776e;
-$gray-600: #70635c;
-$gray-700: #5a4f49;
-$gray-750: #4f4540;
-$gray-800: #433b37;
-$gray-900: #2d2825;
 $black: #000;
+$gray: #7d756c; // 6c757d 7d756c
+
+// define gray scale
+$gray-100: tint-color($gray, 80%);
+$gray-200: tint-color($gray, 60%);
+$gray-300: tint-color($gray, 40%);
+$gray-400: tint-color($gray, 20%);
+$gray-500: $gray;
+$gray-600: shade-color($gray, 20%);
+$gray-700: shade-color($gray, 40%);
+$gray-750: shade-color($gray, 50%);
+$gray-800: shade-color($gray, 60%);
+$gray-900: shade-color($gray, 80%);
 
 // spaceblue is based on coolors.co 'space cadet' #212c40 which was bg color in Lester's original design
 // background will be spaceblue-800
-
 $spaceblue-100: #aebcd5;
 $spaceblue-200: #93a6c8;
 $spaceblue-300: #788fba;
@@ -37,9 +39,6 @@ $spaceblue-800: #212c40;
 $spaceblue-850: #1c2536;
 $spaceblue-900: #151c28;
 
-$light: $spaceblue-200;
-$dark: $spaceblue-800;
-
 
 // Create your own map
 $custom-colors: (
@@ -51,8 +50,8 @@ $custom-colors: (
   "danger": $danger,
   "light": $light,
   "dark": $dark,
-  "gray": $gray-600,
-  "gray-dark": $gray-800,
+  "gray":       $gray-600,
+  "gray-dark":  $gray-800
 );
 
 // Merge the maps
diff --git a/assets/css/_bs-custom.scss b/assets/css/_bs-custom.scss
index ed210d7..0fbae16 100644
--- a/assets/css/_bs-custom.scss
+++ b/assets/css/_bs-custom.scss
@@ -1,4 +1,12 @@
 /* Bootstrap custom variable overrides */
+// Colors
+$primary: #51A39F;
+// $secondary: #9883E5;
+$secondary: #955E42;
+$success: #37B800;
+$info: #0075F2;
+$warning: #F9E900;
+$danger: #DD1C1A;
 
 // Typography
 $font-size-base: 1.125rem;
@@ -38,12 +46,3 @@ $font-family-base: $font-family-sans-serif;
 // Features
 $enable-shadows: true;
 $enable-negative-margins: true;
-
-// init colors for some vars
-$primary: #51A39F;
-// $secondary: #9883E5;
-$secondary: #955E42;
-$success: #37B800;
-$info: #0075F2;
-$warning: #F9E900;
-$danger: #DD1C1A
\ No newline at end of file
diff --git a/assets/css/_layout-top-navbar-main.scss b/assets/css/_layout-top-navbar-main.scss
index ef3c4fc..ecce183 100644
--- a/assets/css/_layout-top-navbar-main.scss
+++ b/assets/css/_layout-top-navbar-main.scss
@@ -12,15 +12,11 @@
       padding-left: var(--bs-gutter-x, 4rem);
     }
     @include media-breakpoint-up(xxl) {
-      // min-width: 1400px;
       max-width: 1400px;
     }
   }
 }
 .container-lg {
-  // @include media-breakpoint-up(lg) {
-  //   min-width: 960px;
-  // }
   @include media-breakpoint-up(xl) {
     max-width: 960px;
   }
@@ -63,16 +59,6 @@ nav#top-navbar-grid-outer {
   @include media-breakpoint-up(xxl) {
     margin-bottom: 4rem !important;
   }
-  // @include media-breakpoint-up(xxl) {
-  //   margin-bottom: 5rem !important;
-  // }
-  // @include media-breakpoint-up(md) {
-  //   padding-right: var(--bs-gutter-x, 1.25rem);
-  //   padding-left: var(--bs-gutter-x, 1.25rem);
-  // }
-  // @extend .px-3;
-  // @extend .px-sm-4;
-  // @extend .px-md-5;
   @extend .d-grid;
   grid-template-columns: auto minmax(0, 1fr);
   grid-template-rows: calc(4.3rem / 2) calc(4.3rem / 2) auto;
@@ -200,12 +186,15 @@ nav#top-navbar-grid-outer {
           @extend .text-decoration-none;
           color: $gray-300;
           &:hover {
-            @extend .text-decoration-underline;
-            text-decoration-color: $primary !important;
-            color: $gray-300;
+            @extend .text-decoration-none;
+            color: $primary;
           }
           &.active {
-            color: $primary;
+            opacity: 0.5;
+            &:hover {
+              @extend .text-decoration-none;
+              color: $gray-300;
+            }
           }
         }
         .dropdown-toggle {
@@ -220,7 +209,8 @@ nav#top-navbar-grid-outer {
             }
           }
           &.show {
-            color: $primary;
+            // color: $primary;
+            opacity: 0.5;
             &:hover {
               @extend .text-decoration-none;
             }
@@ -234,7 +224,7 @@ nav#top-navbar-grid-outer {
           }
         }
         .dropdown-menu.dropdown-menu-dark {
-          background-color: shade-color($gray-800, 50%);
+          background-color: $spaceblue-900;
           li.menu-item {
             .dropdown-item.top-navbar-grid-main-menu-item-link {
               @extend .fw-normal;
@@ -242,18 +232,14 @@ nav#top-navbar-grid-outer {
               text-transform: inherit !important;
               &:hover {
                 @extend .text-decoration-none;
-                color: $gray-900;
+                color: $spaceblue-800;
                 background-color: $primary;
               }
             }
             &.active {
               .dropdown-item.top-navbar-grid-main-menu-item-link {
-                color: $gray-900;
-                background-color: shade-color($primary, 25%);
-                &:hover {
-                  @extend .text-decoration-none;
-                  background-color: $primary;
-                }
+                color: $spaceblue-100;
+                background-color: $spaceblue-600;
               }
             }
           }
diff --git a/assets/css/app.scss b/assets/css/app.scss
index e411269..35849a1 100644
--- a/assets/css/app.scss
+++ b/assets/css/app.scss
@@ -16,17 +16,19 @@
 /* main */
 html,
 body {
-  color: $gray-100;
+  color: $gray-200;
   background-color: $spaceblue-800;
   height: 100%;
 }
 
 /* links */
 a {
-  @extend .text-decoration-none;
+  // @extend .text-decoration-none;
+  color: $gray-200;
   &:hover {
-    @extend .text-decoration-underline;
+    // @extend .text-decoration-underline;
     color: $primary;
+    text-decoration-color: $gray-200 !important;
   }
 }
 
@@ -36,25 +38,25 @@ a {
   font-family: $font-family-handbrush;
 }
 .text-gray-100 {
-  color: $gray-100;
+  color: $gray-100 !important;
 }
 .text-gray-200 {
-  color: $gray-200;
+  color: $gray-200 !important;
 }
 .text-gray-300 {
-  color: $gray-300;
+  color: $gray-300 !important;
 }
 .text-gray-400 {
-  color: $gray-400;
+  color: $gray-400 !important;
 }
 .text-gray-500 {
-  color: $gray-500;
+  color: $gray-500 !important;
 }
 .text-gray-600 {
-  color: $gray-600;
+  color: $gray-600 !important;
 }
 .text-gray-700 {
-  color: $gray-700;
+  color: $gray-700 !important;
 }
 .fs-larger {
   font-size: larger;
@@ -88,12 +90,27 @@ a {
   &.border-gray-700 {
     border-bottom-color: $gray-700 !important;
   }
-  &.border-gray-750 {
-    border-bottom-color: $gray-750 !important;
-  }
   &.border-gray-800 {
     border-bottom-color: $gray-800 !important;
   }
+  &.border-spaceblue-300 {
+    border-bottom-color: $spaceblue-300 !important;
+  }
+  &.border-spaceblue-400 {
+    border-bottom-color: $spaceblue-400 !important;
+  }
+  &.border-spaceblue-500 {
+    border-bottom-color: $spaceblue-500 !important;
+  }
+  &.border-spaceblue-600 {
+    border-bottom-color: $spaceblue-600 !important;
+  }
+  &.border-spaceblue-700 {
+    border-bottom-color: $spaceblue-700 !important;
+  }
+  &.border-spaceblue-800 {
+    border-bottom-color: $spaceblue-800 !important;
+  }
 }
 
 /* post styling */
@@ -135,56 +152,6 @@ article.post.sticky {
   }
 }
 
-// a {
-//   color: rgba($white, 0.75);
-//   // border-bottom: $gray-600 2px solid;
-//   // text-decoration: none;
-//   text-decoration-color: $gray-600;
-//   &.navbar-brand,
-//   &.nav-link {
-//     border-bottom: none;
-//   }
-//   &:visited {
-//     color: $info;
-//     .post-title & {
-//       color: $gray-100;
-//     }
-//   }
-//   &:hover {
-//     color: $primary;
-//     // text-decoration: none;
-//     // border-bottom: $secondary 3px solid;
-//     text-decoration-color: $secondary;
-//     &.navbar-brand {
-//       border-bottom: none;
-//     }
-//   }
-// }
-// .wp-block-separator {
-//   border-top: none !important;
-//   border-bottom: none !important;
-// }
-
-// /* more */
-// .border-gray-900 {
-//   border-color: $gray-900 !important;
-// }
-// .border-10 {
-//   border-width: 10px !important;
-// }
-// .border-20 {
-//   border-width: 20px !important;
-// }
-// .font-handbrush {
-//   font-family: $font-family-handbrush;
-// }
-// .fw-500 {
-//   font-weight: 500;
-// }
-// .fw-600 {
-//   font-weight: 600;
-// }
-
 
 /* blockquote handling */
 blockquote,
@@ -213,7 +180,7 @@ blockquote.wp-block-quote {
   }
   cite {
     @extend .blockquote-footer;
-    @extend .text-gray-300;
+    color: $gray-300;
     @extend .my-0;
     @extend .py-0;
     font-size: 0.85em;
@@ -249,7 +216,10 @@ figure.wp-block-pullquote {
 }
 
 /* other wp styling */
-.wp-block-image.alignfull img, .wp-block-image.alignwide img, .wp-block-image img {
+.wp-block-image.alignfull img,
+.wp-block-image.alignwide img,
+.wp-block-image img,
+.wp-block-media-text__media img {
   height: auto;
 }
 .btn-primary {
@@ -281,33 +251,49 @@ figure.wp-block-pullquote {
     @extend .text-end;
   }
 }
-table {
+
+table,
+.wp-block-table table,
+.wp-block-calendar table {
   @extend .table;
   @extend .table-dark;
-}
-.wp-block-table {
-  table {
-    @extend .table;
-    @extend .table-dark;
+  caption {
+    @extend .text-gray-400;
   }
-  &.is-style-stripes {
-    table {
-      @extend .table-striped;
+  thead th,
+  tbody td {
+    border: none !important;
+  }
+  thead tr {
+    border-bottom: 1px solid $gray-600;
+  }
+  tbody tr {
+    border-bottom: 1px solid $gray-800;
+    &:last-child {
+      border-bottom: none !important;
     }
   }
 }
+.wp-block-calendar table,
+.wp-block-table.is-style-stripes table {
+  @extend .table-striped;
+}
+
 .post-page-numbers {
+  @extend .text-decoration-none;
   @extend .page-item;
   &.current {
     @extend .active;
     & .page-link {
-      background-color: shade-color($primary, 25%) !important;
-      border-color: shade-color($primary, 25%) !important;
-      color: $gray-100;
+      @extend .text-decoration-none;
+      color: $spaceblue-100 !important;
+      background-color: $spaceblue-600 !important;
+      border-color: $spaceblue-600 !important;
       &:hover {
-        background-color: shade-color($primary, 25%) !important;
-        border-color: shade-color($primary, 25%) !important;
-        color: $gray-100;
+        @extend .text-decoration-none;
+        color: $spaceblue-100 !important;
+        background-color: $spaceblue-600 !important;
+        border-color: $spaceblue-600 !important;
       }
     }
   }
@@ -315,77 +301,23 @@ table {
     @extend .text-decoration-none;
   }
   & .page-link {
-    border: 1px solid shade-color($primary, 25%);
+    @extend .text-decoration-none;
+    color: $gray-200;
     background-color: inherit !important;
+    border: 1px solid $spaceblue-600;
     &:hover {
-      border: 1px solid #51A39F;
-      background-color: #51A39F !important;
       color: $spaceblue-800;
+      background-color: $primary !important;
+      border: 1px solid $spaceblue-600;
     }
   }
 }
 
-// &:not(.is-style-outline) {
-    //   @extend .btn-primary;
-    // }
-    // &.is-style-outline {
-    //   @extend .btn-outline-primary;
-    // }
 
-// /* blog */
-// .post-title a {
-//   color: $gray-100;
-//   text-decoration: none;
-//   border-bottom: none;
-//   &:hover {
-//     color: $primary;
-//     // border-bottom: $secondary 3px solid;
-//     text-decoration: underline;
-//     text-decoration-color: $secondary;
-//   }
-// }
-// .post-lede,
-// .post-body {
-//   h2, h3, h4, h5, h6 {
-//     color: $gray-200;
-//     margin-top: 2rem;
-//   }
-// }
-// .post li {
-//   line-height: 1.75rem;
-// }
-// .more-link {
-//   @extend .fs-6;
-// }
-
-// /* widget styling */
-// #footer-widgets {
-//   background-color: $gray-750;
-//   border-radius: .5em;
-//   .widgettitle {
-//     @extend .fs-4;
-//   }
-//   .wp-block-group {
-//     @extend .px-3;
-//     @extend .py-3;
-//     max-width: 25rem;
-//   }
-//   ul {
-//     padding-inline-start: 2rem;
-//   }
-//   .wp-block-loginout {
-//     display: list-item;
-//     margin-left: 2rem;
-//     list-style-type: disc;
-//   }
-// }
-// .wp-block-tag-cloud {
-//   @extend .mb-0;
-// }
 
 /* search form */
 .form-control {
-  color: $gray-100 !important;
+  color: $gray-200;
   background-color: $spaceblue-900 !important;
   border-color: $spaceblue-600;
 }
@@ -397,24 +329,24 @@ input.form-control::-ms-clear,
 .form-control::-ms-reveal,
 input.form-control::-ms-reveal { display: none; }
 .form-control::-webkit-input-placeholder { /* WebKit, Blink, Edge */
-  color:    $gray-750    !important;
+  color:    $spaceblue-700    !important;
 }
 .form-control:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
-  color:    $gray-750    !important;
+  color:    $spaceblue-700    !important;
   opacity:  1;
 }
 .form-control::-moz-placeholder { /* Mozilla Firefox 19+ */
-  color:    $gray-750    !important;
+  color:    $spaceblue-700    !important;
   opacity:  1;
 }
 .form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
-  color:    $gray-750    !important;
+  color:    $spaceblue-700    !important;
 }
 .form-control::-ms-input-placeholder { /* Microsoft Edge */
-  color:    $gray-750    !important;
+  color:    $spaceblue-700    !important;
 }
 .form-control::placeholder { /* Most modern browsers support this now. */
-  color:    $gray-750    !important;
+  color:    $spaceblue-700    !important;
 }
 
 
@@ -431,24 +363,24 @@ form input {
   &::-ms-clear
   &::-ms-reveal { display: none; }
   &::-webkit-input-placeholder { /* WebKit, Blink, Edge */
-    color:    $gray-750    !important;
+    color:    $spaceblue-700    !important;
   }
   &:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
-    color:    $gray-750    !important;
+    color:    $spaceblue-700    !important;
     opacity:  1;
   }
   &::-moz-placeholder { /* Mozilla Firefox 19+ */
-    color:    $gray-750    !important;
+    color:    $spaceblue-700    !important;
     opacity:  1;
   }
   &:-ms-input-placeholder { /* Internet Explorer 10-11 */
-    color:    $gray-750    !important;
+    color:    $spaceblue-700    !important;
   }
   &::-ms-input-placeholder { /* Microsoft Edge */
-    color:    $gray-750    !important;
+    color:    $spaceblue-700    !important;
   }
   &::placeholder { /* Most modern browsers support this now. */
-    color:    $gray-750    !important;
+    color:    $spaceblue-700    !important;
   }
 }
 button,
diff --git a/content-templates/content-article.php b/content-templates/content-article.php
index 6a2a48a..9e5e244 100644
--- a/content-templates/content-article.php
+++ b/content-templates/content-article.php
@@ -12,13 +12,13 @@ namespace WP_RDNYC;
 <article
   <?php
     $extra_post_class = is_singular() ? '' : ' mb-two-rem';
-    echo post_class( 'post border-bottom border-gray-750 pb-4' . $extra_post_class );
+    echo post_class( 'post border-bottom border-spaceblue-700 pb-4' . $extra_post_class );
   ?>
   itemscope itemtype="https://schema.org/CreativeWork">
 
   <header class="post-header">
     <?php
-      echo (is_page() ? '<h1 class="post-title fw-light text-gray-300 mb-4 border-bottom border-dashed border-gray-600">'
+      echo (is_page() ? '<h1 class="post-title fw-light text-gray-300 mb-4 border-bottom border-dashed border-spaceblue-600">'
         : '<h2 class="post-title fs-2 fw-600 mb-2">');
 
       if ( is_archive() || is_search() || is_home() ) :
diff --git a/index.php b/index.php
index 946cba8..81556af 100644
--- a/index.php
+++ b/index.php
@@ -13,7 +13,7 @@ get_header(); ?>
 
   <div class="content">
     <?php if (!is_singular()) : ?>
-      <h1 class="fw-light text-gray-300 mb-4 border-bottom border-dashed border-gray-600">
+      <h1 class="fw-light text-gray-300 mb-4 border-bottom border-dashed border-spaceblue-600">
       <?php if (is_archive()) : get_the_archive_title();
           else : single_post_title();
           endif;