diff --git a/assets/scss/_kerberos-config.scss b/assets/scss/_kerberos-config.scss
index 04834c4..dc34f32 100644
--- a/assets/scss/_kerberos-config.scss
+++ b/assets/scss/_kerberos-config.scss
@@ -1,9 +1,3 @@
-/*
-  Override SASS' handling of HSL(a) color functions, don't touch it and let CSS handle it itself.
-  This will enable the trick with variable alpha channels for CSS color variables (see below).
-*/
-@function hsla($args...) { @return #{'hsla(#{$args})'}; }
-
 
 // ----- Mixins ----- //
 
@@ -14,15 +8,6 @@ $desktop:	992px;
 $widescreen: 1200px;
 $fullhd: 1400px;
 
-/*
-  Function for defining (not only) vertical rhythm by multiplies of 12px
-    Examples:
-    width: size(2); (equals to "width: 24px;")
-    line-height: size(3); (equals to "line-height: 36px;")
-*/
-@function size($multiplier) {
-  @return $multiplier * 12px;
-}
 
 // Responsive mixin (Bulma's)
 @mixin break($media) {
diff --git a/assets/scss/_kerberos.scss b/assets/scss/_kerberos.scss
index 0a4d1e0..ba3eeb6 100644
--- a/assets/scss/_kerberos.scss
+++ b/assets/scss/_kerberos.scss
@@ -57,7 +57,7 @@ p, li:not(.nav-item) {
   line-height: size(2);
   margin: 0 0 size(1);
   @include break(w) {
-    font-size: 18px;
+    font-size: 16px;
     line-height: size(2.5);
   }
   &.lead {
@@ -102,4 +102,5 @@ img {
       margin-right: 1rem;
     }
   }
+  li { margin-bottom: 0; }
 }
\ No newline at end of file
diff --git a/assets/scss/common/_global.scss b/assets/scss/common/_global.scss
index a98cb42..0d1341e 100644
--- a/assets/scss/common/_global.scss
+++ b/assets/scss/common/_global.scss
@@ -97,7 +97,7 @@ body {
 @include media-breakpoint-up(lg) {
   .docs-sidebar {
     order: 0;
-    border-right: 2px solid var(--bg-muted);
+    //border-right: 2px solid var(--bg-muted);
   }
 
   @supports ((position:-webkit-sticky) or (position:sticky)) {
@@ -156,6 +156,9 @@ body {
 .docs-content {
   padding-bottom: 3rem;
   order: 1;
+  a {
+    font-weight: 500;
+  }
 }
 
 .docs-navigation {
diff --git a/assets/scss/common/_variables.scss b/assets/scss/common/_variables.scss
index 4bb8fc4..8b604f5 100644
--- a/assets/scss/common/_variables.scss
+++ b/assets/scss/common/_variables.scss
@@ -1,3 +1,19 @@
+/*
+  Override SASS' handling of HSL(a) color functions, don't touch it and let CSS handle it itself.
+  This will enable the trick with variable alpha channels for CSS color variables (see below).
+*/
+@function hsla($args...) { @return #{'hsla(#{$args})'}; }
+
+/*
+  Function for defining (not only) vertical rhythm by multiplies of 12px
+    Examples:
+    width: size(2); (equals to "width: 24px;")
+    line-height: size(3); (equals to "line-height: 36px;")
+*/
+@function size($multiplier) {
+  @return $multiplier * 12px;
+}
+
 // Color system
 
 $white:    #fff;
diff --git a/assets/scss/layouts/_sidebar.scss b/assets/scss/layouts/_sidebar.scss
index 76e24e5..89b2d6b 100644
--- a/assets/scss/layouts/_sidebar.scss
+++ b/assets/scss/layouts/_sidebar.scss
@@ -3,6 +3,12 @@
   @extend %tfx;
   scrollbar-width: thin;
   scrollbar-color: var(--bg) var(--bg);
+  ul {
+    li { // sidebar & TOC links
+      margin: 0;
+      line-height: 24px;
+    }
+  }
 }
 
 .docs-links::-webkit-scrollbar,
@@ -56,25 +62,55 @@
   border-top: 2px solid var(--bg-muted);
 }
 
-a.docs-link {
-  color: $body-color;
+a.docs-link,
+.page-links a {
+  @extend %tfx;
+  color: var(--text-muted);
   display: block;
-  padding: 0.125rem 0;
+  padding: size(0.5) size(1); //0.125rem 0;
+  margin: 0 size(2) 0 0;
   font-size: $font-size-base;
+  line-height: size(2);
+  border-radius: var(--radius);
+  &:hover {
+    color: var(--text);
+    background: var(--bg-muted);
+    text-decoration: none;
+  }
+  &.active {
+    text-decoration: none;
+    color: var(--hub);
+    font-weight: 500;
+    background: hsla(var(--hub-hsl), 0.1);
+  }
 }
 
-.page-links li {
-  margin-top: 0.375rem;
-  padding-top: 0.375rem;
+.page-links { // TOC
+  a {
+    margin: 0;
+    font-size: 0.9em;
+    font-weight: 500;
+    color: var(--text);
+  }
+  li {
+    margin-top: 0.375rem;
+    padding-top: 0.375rem;
+    ul {
+      li {
+        padding-left: 1rem;
+        margin-top: 0.125rem;
+        padding-top: 0.125rem;
+        a {
+          font-weight: 400;
+          color: var(--text-muted);
+        }
+      }
+    }
+  }
 }
 
-.page-links li ul li {
-  border-top: none;
-  padding-left: 1rem;
-  margin-top: 0.125rem;
-  padding-top: 0.125rem;
-}
 
+/*
 .page-links li:not(:first-child) {
   border-top: 1px dashed $gray-200;
 }
@@ -92,6 +128,7 @@ a.docs-link {
   text-decoration: none;
   color: $link-color;
 }
+*/
 
 .docs-links h3.sidebar-link,
 .page-links h3.sidebar-link {
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 54e581b..27fc11e 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,20 +1,25 @@
 {{ define "main" }}
+
 	<div class="row flex-xl-nowrap">
+
 		<div class="col-lg-5 col-xl-4 docs-sidebar">
 			<nav class="docs-links" aria-label="Main navigation">
 				{{ partial "sidebar/docs-menu.html" . }}
 			</nav>
 		</div>
+
 		{{ if ne .Params.toc false -}}
-		<nav class="docs-toc d-none d-xl-block col-xl-3" aria-label="Secondary navigation">
+		<nav class="docs-toc d-none d-xl-block col-xl-4" aria-label="Secondary navigation"><!-- col-xl-3 -->
 			{{ partial "sidebar/docs-toc.html" . }}
 		</nav>
 		{{ end -}}
+
 		{{ if .Params.toc -}}
-		<main class="docs-content col-lg-11 col-xl-9">
+		<main class="docs-content col-lg-11 col-xl-8"><!-- col-xl-9 -->
 		{{ else -}}
 		<main class="docs-content col-lg-11 col-xl-9 mx-xl-auto">
 		{{ end -}}
+
 			{{ if .Site.Params.options.breadCrumb -}}
 				<!-- https://discourse.gohugo.io/t/breadcrumb-navigation-for-highly-nested-content/27359/6 -->
 				<nav aria-label="breadcrumb">
@@ -24,6 +29,7 @@
 					</ol>
 				</nav>
 			{{ end }}
+
 			<h1>{{ .Title }}</h1>
 			<p class="lead">{{ .Params.lead | safeHTML }}</p>
 			{{ partial "main/headline-hash.html" .Content }}
@@ -31,6 +37,8 @@
 				{{ partial "main/edit-page.html" . }}
 			{{ end -}}
 			{{ partial "main/docs-navigation.html" . }}
+
 		</main>
 	</div>
+
 {{ end }}
\ No newline at end of file
diff --git a/layouts/index.html b/layouts/index.html
index 86a5be6..443cbc4 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,36 +1,44 @@
 {{ define "main" }}
+
 <div class="row flex-xl-nowrap">
+
   <div class="col-lg-5 col-xl-4 docs-sidebar">
     <nav class="docs-links" aria-label="Main navigation">
       {{ partial "sidebar/docs-menu.html" . }}
     </nav>
   </div>
+
   {{ if ne .Params.toc false -}}
-  <nav class="docs-toc d-none d-xl-block col-xl-3" aria-label="Secondary navigation">
+  <nav class="docs-toc d-none d-xl-block col-xl-4" aria-label="Secondary navigation"><!-- col-xl-3 -->
     {{ partial "sidebar/docs-toc.html" . }}
   </nav>
   {{ end -}}
+
   {{ if .Params.toc -}}
-  <main class="docs-content col-lg-11 col-xl-9">
-    {{ else -}}
-    <main class="docs-content col-lg-11 col-xl-9 mx-xl-auto">
-      {{ end -}}
-      {{ if .Site.Params.options.breadCrumb -}}
-      <!-- https://discourse.gohugo.io/t/breadcrumb-navigation-for-highly-nested-content/27359/6 -->
-      <nav aria-label="breadcrumb">
-        <ol class="breadcrumb">
-          {{ partial "main/breadcrumb" . -}}
-          <li class="breadcrumb-item active" aria-current="page">{{ .Title }}</li>
-        </ol>
-      </nav>
-      {{ end }}
-      <h1>{{ .Title }}</h1>
-      <p class="lead">{{ .Params.lead | safeHTML }}</p>
-      {{ partial "main/headline-hash.html" .Content }}
-      {{ if .Site.Params.editPage -}}
-      {{ partial "main/edit-page.html" . }}
-      {{ end -}}
-      {{ partial "main/docs-navigation.html" . }}
-    </main>
+  <main class="docs-content col-lg-11 col-xl-8"><!-- col-xl-9 -->
+  {{ else -}}
+  <main class="docs-content col-lg-11 col-xl-9 mx-xl-auto">
+  {{ end -}}
+
+    {{ if .Site.Params.options.breadCrumb -}}
+    <!-- https://discourse.gohugo.io/t/breadcrumb-navigation-for-highly-nested-content/27359/6 -->
+    <nav aria-label="breadcrumb">
+      <ol class="breadcrumb">
+        {{ partial "main/breadcrumb" . -}}
+        <li class="breadcrumb-item active" aria-current="page">{{ .Title }}</li>
+      </ol>
+    </nav>
+    {{ end }}
+
+    <h1>{{ .Title }}</h1>
+    <p class="lead">{{ .Params.lead | safeHTML }}</p>
+    {{ partial "main/headline-hash.html" .Content }}
+    {{ if .Site.Params.editPage -}}
+    {{ partial "main/edit-page.html" . }}
+    {{ end -}}
+    {{ partial "main/docs-navigation.html" . }}
+
+  </main>
 </div>
+
 {{ end }}
\ No newline at end of file
diff --git a/resources/_gen/assets/scss/scss/app.scss_1920d2ec1ff1120c91690141d2072447.content b/resources/_gen/assets/scss/scss/app.scss_1920d2ec1ff1120c91690141d2072447.content
index cb8682c..ca235e3 100644
--- a/resources/_gen/assets/scss/scss/app.scss_1920d2ec1ff1120c91690141d2072447.content
+++ b/resources/_gen/assets/scss/scss/app.scss_1920d2ec1ff1120c91690141d2072447.content
@@ -1,6 +1,16 @@
 @charset "UTF-8";
 /** Import Bootstrap functions */
 /** Import theme variables */
+/*
+  Override SASS' handling of HSL(a) color functions, don't touch it and let CSS handle it itself.
+  This will enable the trick with variable alpha channels for CSS color variables (see below).
+*/
+/*
+  Function for defining (not only) vertical rhythm by multiplies of 12px
+    Examples:
+    width: size(2); (equals to "width: 24px;")
+    line-height: size(3); (equals to "line-height: 36px;")
+*/
 /** Bootstrap navbar fix (https://git.io/fADqW) */
 /** Import Bootstrap */
 /*!
@@ -8414,8 +8424,7 @@ body {
 
 @media (min-width: 992px) {
   .docs-sidebar {
-    order: 0;
-    border-right: 2px solid var(--bg-muted); }
+    order: 0; }
   @supports (position: -webkit-sticky) or (position: sticky) {
     .docs-sidebar {
       position: -webkit-sticky;
@@ -8458,6 +8467,8 @@ body {
 .docs-content {
   padding-bottom: 3rem;
   order: 1; }
+  .docs-content a {
+    font-weight: 500; }
 
 .docs-navigation {
   border-top: 1px solid #e9ecef;
@@ -9461,6 +9472,10 @@ p.meta {
 .docs-toc {
   scrollbar-width: thin;
   scrollbar-color: var(--bg) var(--bg); }
+  .docs-links ul li,
+  .docs-toc ul li {
+    margin: 0;
+    line-height: 24px; }
 
 .docs-links::-webkit-scrollbar,
 .docs-toc::-webkit-scrollbar {
@@ -9505,37 +9520,63 @@ p.meta {
 .docs-links h3:not(:first-child), .docs-links .h3:not(:first-child) {
   border-top: 2px solid var(--bg-muted); }
 
-a.docs-link {
-  color: #1d2d35;
+a.docs-link,
+.page-links a {
+  color: var(--text-muted);
   display: block;
-  padding: 0.125rem 0;
-  font-size: 1rem; }
+  padding: 6px 12px;
+  margin: 0 24px 0 0;
+  font-size: 1rem;
+  line-height: 24px;
+  border-radius: var(--radius); }
+  a.docs-link:hover,
+  .page-links a:hover {
+    color: var(--text);
+    background: var(--bg-muted);
+    text-decoration: none; }
+  a.docs-link.active,
+  .page-links a.active {
+    text-decoration: none;
+    color: var(--hub);
+    font-weight: 500;
+    background: hsla(var(--hub-hsl), 0.1); }
+
+.page-links a {
+  margin: 0;
+  font-size: 0.9em;
+  font-weight: 500;
+  color: var(--text); }
 
 .page-links li {
   margin-top: 0.375rem;
   padding-top: 0.375rem; }
+  .page-links li ul li {
+    padding-left: 1rem;
+    margin-top: 0.125rem;
+    padding-top: 0.125rem; }
+    .page-links li ul li a {
+      font-weight: 400;
+      color: var(--text-muted); }
 
-.page-links li ul li {
-  border-top: none;
-  padding-left: 1rem;
-  margin-top: 0.125rem;
-  padding-top: 0.125rem; }
-
+/*
 .page-links li:not(:first-child) {
-  border-top: 1px dashed #e9ecef; }
+  border-top: 1px dashed $gray-200;
+}
 
 .page-links a {
-  color: #1d2d35;
+  color: $body-color;
   display: block;
   padding: 0.125rem 0;
-  font-size: 0.9375rem; }
+  font-size: $font-size-base * 0.9375;
+}
 
 .docs-link:hover,
 .docs-link.active,
 .page-links a:hover {
   text-decoration: none;
-  color: #5d2f86; }
-
+  color: $link-color;
+}
+*/
 .docs-links h3.sidebar-link, .docs-links .sidebar-link.h3,
 .page-links h3.sidebar-link,
 .page-links .sidebar-link.h3 {
@@ -9554,16 +9595,6 @@ a.docs-link {
   text-decoration: underline; }
 
 /* Kerberos tweaks & branding */
-/*
-  Override SASS' handling of HSL(a) color functions, don't touch it and let CSS handle it itself.
-  This will enable the trick with variable alpha channels for CSS color variables (see below).
-*/
-/*
-  Function for defining (not only) vertical rhythm by multiplies of 12px
-    Examples:
-    width: size(2); (equals to "width: 24px;")
-    line-height: size(3); (equals to "line-height: 36px;")
-*/
 :root {
   /*
     Usage:
@@ -9634,11 +9665,13 @@ a.docs-link {
   border-radius: var(--radius); }
 
 .docs-links,
-.docs-toc {
+.docs-toc, a.docs-link,
+.page-links a {
   transition: all 0.15s; }
   @media (prefers-reduced-motion) {
     .docs-links,
-    .docs-toc {
+    .docs-toc, a.docs-link,
+    .page-links a {
       transition: none; } }
 /*! doc.kerberos.io v2.0.0 | MIT License */
 body {
@@ -9692,7 +9725,7 @@ p, li:not(.nav-item) {
   margin: 0 0 12px; }
   @media only screen and (min-width: 1200px) {
     p, li:not(.nav-item) {
-      font-size: 18px;
+      font-size: 16px;
       line-height: 30px; } }
   p.lead, li.lead:not(.nav-item) {
     color: var(--text-light);
@@ -9723,5 +9756,7 @@ img {
         margin: 0; } }
     .footer .navbar-nav .copyright {
       margin-right: 1rem; }
+  .footer li {
+    margin-bottom: 0; }
 
 /*# sourceMappingURL=main.css.map */
\ No newline at end of file