diff --git a/jekyll-assets/_layouts/docs.html b/jekyll-assets/_layouts/docs.html
index 2627c2f52..64d3237b0 100644
--- a/jekyll-assets/_layouts/docs.html
+++ b/jekyll-assets/_layouts/docs.html
@@ -18,12 +18,7 @@ <h1 id="docs-header-title">
                 </a>
               </h1>
               <label class="mobile-menu-toggle" for="mobile-toggle">
-                <svg width="35px" height="30px" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
-                <rect x="0" fill="none" width="20" height="20"/>
-                <g>
-                <path fill="var(--textcolor)" d="M20 5V2H0v3h20zm0 6V8H0v3h20zm0 6v-3H0v3h20z"/>
-                </g>
-                </svg>
+                <div class="mobile-menu-toggle-inner"></div>
               </label>
               {% include theme.html %}
             </div>
diff --git a/jekyll-assets/css/style.css b/jekyll-assets/css/style.css
index d344807a6..72223128f 100644
--- a/jekyll-assets/css/style.css
+++ b/jekyll-assets/css/style.css
@@ -20,6 +20,7 @@
   --textcolor: white;
   --subtle-text: #CCC;
   --theme-toggle-label: url("data:image/svg+xml;utf8,<svg width=\'30px\' height=\'30px\' viewBox=\'0 0 16 16\' fill=\'none\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M7 3V0H9V3H7Z\' fill=\'%23FFF\'/><path d=\'M9 13V16H7V13H9Z\' fill=\'%23FFF\'/><path d=\'M11 8C11 9.65685 9.65685 11 8 11C6.34315 11 5 9.65685 5 8C5 6.34315 6.34315 5 8 5C9.65685 5 11 6.34315 11 8Z\' fill=\'%23FFF\'/><path d=\'M0 9H3V7H0V9Z\' fill=\'%23FFF\'/><path d=\'M16 7H13V9H16V7Z\' fill=\'%23FFF\'/><path d=\'M3.75735 5.17157L1.63603 3.05025L3.05025 1.63603L5.17157 3.75735L3.75735 5.17157Z\' fill=\'%23FFF\'/><path d=\'M12.2426 10.8284L14.364 12.9497L12.9497 14.364L10.8284 12.2426L12.2426 10.8284Z\' fill=\'%23FFF\'/><path d=\'M3.05025 14.364L5.17157 12.2426L3.75735 10.8284L1.63603 12.9498L3.05025 14.364Z\' fill=\'%23FFF\'/><path d=\'M12.9497 1.63604L10.8284 3.75736L12.2426 5.17158L14.364 3.05026L12.9497 1.63604Z\' fill=\'%23FFF\'/></svg>");
+  --mobile-menu-label: url("data:image/svg+xml,%3Csvg width='30px' height='40px' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0' fill='none' width='20' height='20'/%3E%3Cg%3E%3Cpath fill='%23FFF' d='M20 5V2H0v3h20zm0 6V8H0v3h20zm0 6v-3H0v3h20z'/%3E%3C/g%3E%3C/svg%3E");
 
   /* header and footer styling */
   --rptl-header-background-color: var(--bg);
@@ -59,6 +60,7 @@
   --textcolor: black;
   --subtle-text: #444;
   --theme-toggle-label: url("data:image/svg+xml;utf8,<svg width=\'30px\' height=\'30px\' viewBox=\'0 0 24 24\' fill=\'none\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M3.32031 11.6835C3.32031 16.6541 7.34975 20.6835 12.3203 20.6835C16.1075 20.6835 19.3483 18.3443 20.6768 15.032C19.6402 15.4486 18.5059 15.6834 17.3203 15.6834C12.3497 15.6834 8.32031 11.654 8.32031 6.68342C8.32031 5.50338 8.55165 4.36259 8.96453 3.32996C5.65605 4.66028 3.32031 7.89912 3.32031 11.6835Z\' stroke=\'%23000\' stroke-width=\'2\' stroke-linecap=\'round\' stroke-linejoin=\'round\'/></svg>");
+  --mobile-menu-label: url("data:image/svg+xml,%3Csvg width='30px' height='40px' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0' fill='none' width='20' height='20'/%3E%3Cg%3E%3Cpath fill='var(--textcolor)' d='M20 5V2H0v3h20zm0 6V8H0v3h20zm0 6v-3H0v3h20z'/%3E%3C/g%3E%3C/svg%3E");
 
   /* header and footer styling */
   --rptl-header-background-color: var(--bg);
@@ -127,7 +129,7 @@ code {
   margin-bottom: 0px;
   top: 0;
   z-index: 99;
-  background-color: var(--bg);
+  background-color: var(--code-bg-colour);
 }
 
 .toptitle h1 {
@@ -138,7 +140,7 @@ code {
   position: relative;
   margin-top: 0px;
   text-align: center;
-  margin-top: 10px;
+  padding-top: 10px;
   margin-left: 10px;
   flex-grow: 1;
 }
@@ -176,7 +178,7 @@ div.subtitle p {
 }
 
 #docs-header a:hover {
-  color: var(--brand-colour);
+  color: var(--accent);
   text-decoration: none;
   background-color: var(--toc-hover-colour);
 }
@@ -304,6 +306,7 @@ pre {
 #theme-toggle-container {
   align-self: center;
   align-items: start;
+  display: block;
 }
 
 #docsearch {
@@ -1386,6 +1389,11 @@ footer {
 
 .mobile-menu-toggle {
   display: none;
+  align-self: baseline;
+}
+
+.mobile-menu-toggle-inner {
+  content: var(--mobile-menu-label);
 }
 
 #mobile-toggle {
@@ -1415,7 +1423,7 @@ input:not(:checked) ~ li ~ .itemcontents .sectlevel1 {
 }
 
 .toc {
-  overflow-y: scroll;
+  overflow-y: auto;
   height: 90vh;
   background-color: var(--code-bg-colour);
   max-width: 25vw;
@@ -1426,6 +1434,7 @@ input:not(:checked) ~ li ~ .itemcontents .sectlevel1 {
   position: sticky;
   background-color: var(--code-bg-colour);
   z-index: 102;
+  padding-bottom: 10px;
   box-shadow: var(--code-bg-colour-transparent) 0px 10px 15px -5px, var(--code-bg-colour-transparent) 0px 10px 10px -5px;
 }
 
@@ -1464,6 +1473,7 @@ input:not(:checked) ~ li ~ .itemcontents .sectlevel1 {
   /* no need for box shadow in mobile mode */
   #toc-inner {
     box-shadow: var(--code-bg-colour-transparent) 0px;
+    padding-bottom: 0px;
   }
 
   #mobile-toggle:checked ~ .legal {
@@ -1488,23 +1498,23 @@ input:not(:checked) ~ li ~ .itemcontents .sectlevel1 {
   }
 
   .mobile-menu-toggle {
-    font-size: 3em;
     display: block;
     padding-left: 5px;
     padding-right: 5px;
   }
 
-  .toc {
-    height: auto;
+  #theme-toggle-container {
+    display: block;
+    padding-left: 5px;
+    padding-right: 5px;
   }
 
-  .mobile-menu-toggle div {
-    transform: translateY(-3px);
+  .toc {
+    height: auto;
   }
 
   .mobile-menu-toggle:hover {
-    color: var(--brand-colour);
-    text-decoration: none;
+    border-radius: 3px;
     background-color: var(--toc-hover-colour);
   }