diff --git a/boostlook.css b/boostlook.css
index ed04d64..30ef5c1 100644
--- a/boostlook.css
+++ b/boostlook.css
@@ -35,32 +35,50 @@
 /*----------------- Root Variables - Start -----------------*/
 
 :root {
+  --bl-primary-color: rgb(255, 159, 0);
+  --bl-header-height: 2.5rem;
+
+  /* Light Theme Variables */
+  --light-bl-background: rgb(255, 255, 255);
+  --light-bl-caret-svg: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20height='24px'%20viewBox='0%20-960%20960%20960'%20width='24px'%20fill='%23000000'%3E%3Cpath%20d='M320-200v-560l440%20280-440%20280Z'/%3E%3C/svg%3E");
+  --light-bl-card-background-color: rgb(255, 255, 255);
+  --light-bl-code-background: rgb(255, 255, 255);
+  --light-bl-code-border-color: rgb(220, 220, 220);
+  --light-bl-code-text-color: inherit;
+  --light-bl-link-color: rgb(0, 90, 156);
+  --light-bl-link-hover-color: rgba(0, 90, 156, 0.7);
+  --light-bl-hljs-attribute-color: rgb(70, 130, 180);
+  --light-bl-hljs-doctag-color: rgb(221, 17, 68);
+  --light-bl-hljs-keyword-color: rgb(51, 51, 51);
+  --light-bl-hljs-number-color: rgb(0, 128, 128);
+  --light-bl-hljs-section-color: rgb(153, 0, 0);
+  --light-bl-nav-link-color: rgb(0, 0, 0);
   --light-bl-pasteboard-color: rgb(209, 213, 219);
   --light-bl-pre-background: rgb(248, 248, 248);
+  --light-bl-primary-color: rgb(255, 159, 0);
+  --light-bl-quote-background: rgb(255, 255, 255);
   --light-bl-table-border-color: rgb(232, 232, 232);
   --light-bl-table-head-background: rgb(248, 248, 248);
-  --light-bl-background: rgb(255, 255, 255);
-  --light-bl-card-background-color: rgb(255, 255, 255);
-  --light-bl-cyan-color: rgb(0, 90, 156);
-  --light-bl-quote-background: rgb(250, 250, 250);
-  --light-bl-quote-background: rgb(255, 255, 255);
-  --light-bl-code-background: rgb(255, 255, 255);
-  --light-bl-code-border-color: rgb(220 220 220);
-  --light-bl-code-text-color: inherit;
-  --dark-bl-quote-background: rgb(11, 59, 82);
+
+  /* Dark Theme Variables */
   --dark-bl-border-color: rgb(209, 228, 242);
-  --dark-bl-text-color: rgb(209, 228, 242);
-  --dark-bl-quote-word-color: rgb(209, 228, 242);
-  --dark-bl-tabpanel-background: rgb(28, 50, 59);
-  --dark-bl-hljs-keyword-color: rgb(173, 216, 230);
-  --dark-bl-hljs-number-color: rgb(72, 209, 204);
-  --dark-bl-hljs-doctag-color: rgb(255, 99, 132);
-  --dark-bl-hljs-section-color: rgb(255, 69, 58);
-  --dark-bl-hljs-attribute-color: rgb(70, 130, 180);
-  --dark-bl-pagination-color: rgb(200, 200, 200);
+  --dark-bl-caret-svg: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20height='24px'%20viewBox='0%20-960%20960%20960'%20width='24px'%20fill='%23ccc'%3E%3Cpath%20d='M320-200v-560l440%20280-440%20280Z'/%3E%3C/svg%3E");
   --dark-bl-code-background: rgb(20, 20, 20);
   --dark-bl-code-border-color: transparent;
   --dark-bl-code-text-color: rgb(255, 255, 255);
+  --dark-bl-link-color: rgb(125 211 252);
+  --dark-bl-link-hover-color: rgb(100, 160, 210);
+  --dark-bl-hljs-attribute-color: rgb(70, 130, 180);
+  --dark-bl-hljs-doctag-color: rgb(255, 99, 132);
+  --dark-bl-hljs-keyword-color: rgb(173, 216, 230);
+  --dark-bl-hljs-number-color: rgb(72, 209, 204);
+  --dark-bl-hljs-section-color: rgb(255, 69, 58);
+  --dark-bl-nav-link-color: rgb(0, 0, 0);
+  --dark-bl-pagination-color: rgb(200, 200, 200);
+  --dark-bl-quote-background: rgb(11, 59, 82);
+  --dark-bl-quote-word-color: rgb(209, 228, 242);
+  --dark-bl-tabpanel-background: rgb(28, 50, 59);
+  --dark-bl-text-color: rgb(209, 228, 242);
 }
 
 /*----------------- Root Variables - End -----------------*/
@@ -68,37 +86,48 @@
 /*----------------- HTML Variables - Start -----------------*/
 
 html {
-  --bl-quote-background: var(--light-bl-quote-background);
-  --bl-code-background: var(--light-bl-code-background);
-  --bl-code-border-color: var(--light-bl-code-border-color);
-  --bl-quote-background: var(--light-bl-quote-background);
+  --bl-background: var(--light-bl-background);
+  --bl-caret-svg: var(--light-bl-caret-svg);
+  --bl-card-background-color: var(--light-bl-card-background-color);
   --bl-code-background: var(--light-bl-code-background);
   --bl-code-border-color: var(--light-bl-code-border-color);
+  --bl-code-text-color: var(--light-bl-code-text-color);
+  --bl-hljs-doctag-color: var(--light-bl-hljs-doctag-color);
+  --bl-hljs-attribute-color: var(--light-bl-hljs-attribute-color);
+  --bl-hljs-keyword-color: var(--light-bl-hljs-keyword-color);
+  --bl-hljs-number-color: var(--light-bl-hljs-number-color);
+  --bl-hljs-section-color: var(--light-bl-hljs-section-color);
+  --bl-link-color: var(--light-bl-link-color);
+  --bl-link-hover-color: var(--light-bl-link-hover-color);
+  --bl-nav-link-color: var(--light-bl-nav-link-color);
   --bl-pasteboard-color: var(--light-bl-pasteboard-color);
   --bl-pre-background: var(--light-bl-pre-background);
+  --bl-quote-background: var(--light-bl-quote-background);
   --bl-table-border-color: var(--light-bl-table-border-color);
   --bl-table-head-background: var(--light-bl-table-head-background);
-  --bl-background: var(--light-bl-background);
-  --bl-card-background-color: var(--light-bl-card-background-color);
-  --bl-link-color: var(--light-bl-cyan-color);
-  --bl-code-text-color: var(--light-bl-code-text-color);
+  
 }
 
 html.dark {
-  --bl-quote-background: var(--dark-bl-quote-background);
+  --bl-border-color: var(--dark-bl-border-color);
+  --bl-caret-svg: var(--dark-bl-caret-svg);
   --bl-code-background: var(--dark-bl-code-background);
   --bl-code-border-color: var(--dark-bl-code-border-color);
-  --bl-border-color: var(--dark-bl-border-color);
-  --bl-text-color: var(--dark-bl-text-color);
-  --bl-quote-word-color: var(--dark-bl-quote-word-color);
-  --bl-tabpanel-background: var(--dark-bl-tabpanel-background);
+  --bl-code-text-color: var(--dark-bl-code-text-color);
+  --bl-hljs-attribute-color: var(--dark-bl-hljs-attribute-color);
+  --bl-hljs-doctag-color: var(--dark-bl-hljs-doctag-color);
   --bl-hljs-keyword-color: var(--dark-bl-hljs-keyword-color);
   --bl-hljs-number-color: var(--dark-bl-hljs-number-color);
-  --bl-hljs-doctag-color: var(--dark-bl-hljs-doctag-color);
   --bl-hljs-section-color: var(--dark-bl-hljs-section-color);
-  --bl-hljs-attribute-color: var(--dark-bl-hljs-attribute-color);
+  --bl-link-color: var(--dark-bl-link-color);
+  --bl-link-hover-color: var(--dark-bl-link-hover-color);
+  --bl-nav-link-color: var(--dark-bl-nav-link-color);
   --bl-pagination-color: var(--dark-bl-pagination-color);
-  --bl-code-text-color: var(--dark-bl-code-text-color);
+  --bl-quote-background: var(--dark-bl-quote-background);
+  --bl-quote-word-color: var(--dark-bl-quote-word-color);
+  --bl-tabpanel-background: var(--dark-bl-tabpanel-background);
+  --bl-text-color: var(--dark-bl-text-color);
+
 }
 
 /*----------------- HTML Variables - End -----------------*/
@@ -106,7 +135,7 @@ html.dark {
 /*----------------- Font-Face Declarations start -----------------*/
 
 @font-face {
-  font-family: "Noto Sans";
+  font-family: "Noto Sans Display";
   font-style: normal;
   font-weight: normal;
   font-stretch: semi-condensed;
@@ -117,7 +146,7 @@ html.dark {
 }
 
 @font-face {
-  font-family: "Noto Sans";
+  font-family: "Noto Sans Italic";
   font-style: italic;
   font-weight: normal;
   font-stretch: semi-condensed;
@@ -171,7 +200,8 @@ p, h1, h2, h3, h4, h5, h6 {
 /*----------------- Global Styles for .boostlook start -----------------*/
 
 .boostlook {
-  font-family: "Noto Sans" !important;
+  font-family: "Noto Sans Display" !important;
+  font-stretch: condensed;
 }
 
 .boostlook h1,
@@ -197,13 +227,20 @@ p, h1, h2, h3, h4, h5, h6 {
   font-size: 1rem;
   margin: 1em 0em; 
 }
-.boostlook a {
+
+.boostlook a, 
+.boostlook .doc a {
   color: var(--bl-link-color);
   text-decoration: none;
 }
-.boostlook a:hover {
-  text-decoration: underline;
+
+.boostlook a:hover,
+.boostlook .doc a:hover {
+  color: var(--bl-link-hover-color);
+  cursor: pointer;
+  text-decoration: none;
 }
+
 .boostlook code {
   font-family: "Noto Sans Mono", monospace;
 }
@@ -267,7 +304,6 @@ p, h1, h2, h3, h4, h5, h6 {
   color: var(--bl-hljs-section-color);
 }
 
-.boostlook p a:link,
 .boostlook p a:visited,
 .boostlook table a,
 .boostlook .pagination a {
@@ -284,7 +320,6 @@ p, h1, h2, h3, h4, h5, h6 {
   color: var(--bl-pagination-color);
 }
 
-
 /*----------------- Global Styles for .boostlook end -----------------*/
 
 /*----------------- Styles specific to AsciiDoctor content start -----------------*/
@@ -451,10 +486,31 @@ html.toc-hidden .boostlook:not(:has(.doc)) {
 
 /*----------------- Styles specific to Antora Templates start -----------------*/
 
+/* Typography */
+.boostlook .doc,
+.boostlook .doc i {
+  font-family: "Noto Sans Display";
+}
+
 .boostlook .nav-menu .title {
   font-size: 1.5rem;
 }
 
+.boostlook .breadcrumbs ul li {
+  font-size: 0.875rem !important;
+}
+
+/* Navigation Menu */
+
+
+.boostlook .nav-panel-menu {
+  overflow: visible;
+}
+
+.boostlook .nav-menu {
+  padding-left: 1rem;
+}
+
 .boostlook .nav-menu > .nav-list > .nav-list {
   margin-left: 0;
 }
@@ -467,13 +523,44 @@ html.toc-hidden .boostlook:not(:has(.doc)) {
   line-height: 1.5;
 }
 
-.boostlook .breadcrumbs ul li {
-  font-size: 0.875rem !important;
+.boostlook .nav-link,
+.boostlook .nav-menu a{
+  cursor: pointer;
+  color: var(--bl-nav-link-color);
+  margin-right: -0.5rem;
 }
 
+.boostlook .nav-link:hover,
+.boostlook .nav-menu a:hover {
+  color: var(--bl-link-hover-color);
+}
+
+.boostlook .nav-text { 
+  color: #828282;
+}
+
+/* Active Page Indicator */
+.boostlook .nav-list .is-current-page.is-active {
+  position: relative;
+}
+
+.boostlook .is-current-page.is-active::before {
+  content: "";
+  position: absolute;
+  top: 38%;
+  width: 16px;
+  height: 16px;
+  margin-left: -1rem;
+  background-image: var(--bl-caret-svg);
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-size: 16px;
+}
+
+/* Code Block */
 .boostlook .doc .content pre code {
-  background-color: var(--bl-code-background) !important;
-  border-color: var(--bl-code-border-color) !important;
+  background-color: var(--bl-code-background);
+  border-color: var(--bl-code-border-color);
 }
 
 /*----------------- Styles specific to Antora Templates end -----------------*/
\ No newline at end of file