diff --git a/404.html b/404.html
index 8c19ae2a92..455d1696ce 100644
--- a/404.html
+++ b/404.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>404 Page not found :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
     <style>
       p, li, ul {
         text-align: center
diff --git a/basics/changelog/index.html b/basics/changelog/index.html
index f80c7b0abe..073feffa66 100644
--- a/basics/changelog/index.html
+++ b/basics/changelog/index.html
@@ -9,22 +9,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title> :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/changelog/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -709,18 +704,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/basics/configuration/index.html b/basics/configuration/index.html
index bb1fcd3f79..6ff4fb6ecf 100644
--- a/basics/configuration/index.html
+++ b/basics/configuration/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Configuration :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/basics/configuration/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/configuration/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -371,18 +366,18 @@ default values:</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/basics/customization/index.html b/basics/customization/index.html
index 7cc8bab750..865dd95973 100644
--- a/basics/customization/index.html
+++ b/basics/customization/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Customization :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/basics/customization/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/customization/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -378,18 +373,18 @@ You could use an <code>img</code> HTML tag and reference an image created under
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/basics/history/index.html b/basics/history/index.html
index ee5fd36bdb..ffc33e522c 100644
--- a/basics/history/index.html
+++ b/basics/history/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>History :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/basics/history/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/history/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -711,18 +706,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/basics/index.html b/basics/index.html
index a1ab7f2273..77b952f395 100644
--- a/basics/index.html
+++ b/basics/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Basics :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/basics/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -258,18 +253,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/basics/installation/index.html b/basics/installation/index.html
index 2392930af4..1ce758884b 100644
--- a/basics/installation/index.html
+++ b/basics/installation/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Installation :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/basics/installation/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/installation/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -324,18 +319,18 @@ hugo new basics/second-content/_index.md
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/basics/migration/index.html b/basics/migration/index.html
index 446d4ce1ef..69bff1ddda 100644
--- a/basics/migration/index.html
+++ b/basics/migration/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>What&#39;s new :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/basics/migration/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/migration/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -475,18 +470,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/basics/requirements/index.html b/basics/requirements/index.html
index fce6c50781..472efd500c 100644
--- a/basics/requirements/index.html
+++ b/basics/requirements/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Requirements :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/basics/requirements/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/basics/requirements/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -258,18 +253,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/categories/index.html b/categories/index.html
index a64ebc210a..050a14bca0 100644
--- a/categories/index.html
+++ b/categories/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Categories :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/categories/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/categories/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -253,18 +248,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/archetypes/index.html b/cont/archetypes/index.html
index 68c7942142..ee8d89799f 100644
--- a/cont/archetypes/index.html
+++ b/cont/archetypes/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Archetypes :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/archetypes/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -295,18 +290,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/i18n/index.html b/cont/i18n/index.html
index 85f9dccd6d..35e9d064ba 100644
--- a/cont/i18n/index.html
+++ b/cont/i18n/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Multilingual and i18n :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/cont/i18n/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/i18n/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -325,18 +320,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/icons/index.html b/cont/icons/index.html
index 9fea0124e2..191e9b80c0 100644
--- a/cont/icons/index.html
+++ b/cont/icons/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Icons and logos :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/icons/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -286,18 +281,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/index.html b/cont/index.html
index 6469699646..47a136f08d 100644
--- a/cont/index.html
+++ b/cont/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Content :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/cont/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -258,18 +253,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/markdown/index.html b/cont/markdown/index.html
index 7135d1c766..c2e0ba45e1 100644
--- a/cont/markdown/index.html
+++ b/cont/markdown/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Markdown syntax :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/markdown/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -805,18 +800,18 @@ grunt.initConfig({
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/menushortcuts/index.html b/cont/menushortcuts/index.html
index 11c890cbc0..a137c93136 100644
--- a/cont/menushortcuts/index.html
+++ b/cont/menushortcuts/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Menu extra shortcuts :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/menushortcuts/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -373,18 +368,18 @@ However, if you want to keep the title but change its value, it can be overriden
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/pages/index.html b/cont/pages/index.html
index 3becc94996..4bfbb7da73 100644
--- a/cont/pages/index.html
+++ b/cont/pages/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Pages organization :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/cont/pages/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/pages/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -404,18 +399,18 @@ We&rsquo;ve added the <code>menuTitle</code> parameter for that purpose:</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/syntaxhighlight/index.html b/cont/syntaxhighlight/index.html
index 0a4e5c86e0..6cca4e1111 100644
--- a/cont/syntaxhighlight/index.html
+++ b/cont/syntaxhighlight/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Code highlighting :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/syntaxhighlight/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -311,18 +306,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/cont/tags/index.html b/cont/tags/index.html
index cac4164395..ab979cdc13 100644
--- a/cont/tags/index.html
+++ b/cont/tags/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Tags :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/cont/tags/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -287,18 +282,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/credits/index.html b/credits/index.html
index 575dbd3c8e..b17b4c18c1 100644
--- a/credits/index.html
+++ b/credits/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Credits :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/credits/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/index.html b/index.html
index cf0aabdaef..49ffd9930c 100644
--- a/index.html
+++ b/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Relearn Theme for Hugo :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -273,18 +268,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/pir/404.html b/pir/404.html
index 1fee6de77a..ef6fd9a3c6 100644
--- a/pir/404.html
+++ b/pir/404.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>404 Page not found :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715833" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715833" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715833" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715833" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715833" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715833" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715833" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715833" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715833" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715833" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715833"></script>
     <style>
       p, li, ul {
         text-align: center
diff --git a/pir/basics/configuration/index.html b/pir/basics/configuration/index.html
index 91cf34c5a0..3780e0c548 100644
--- a/pir/basics/configuration/index.html
+++ b/pir/basics/configuration/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Configurrrat&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/basics/configuration/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/basics/configuration/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -370,18 +365,18 @@ default values:</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/basics/customization/index.html b/pir/basics/customization/index.html
index 998516df88..bc01c7b737 100644
--- a/pir/basics/customization/index.html
+++ b/pir/basics/customization/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Customizat&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/basics/customization/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/basics/customization/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -370,18 +365,18 @@ Ye could use an <code>img</code> HTML tag an' reference an image created under t
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/basics/history/index.html b/pir/basics/history/index.html
index ad955dc2fa..17cac8105c 100644
--- a/pir/basics/history/index.html
+++ b/pir/basics/history/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Historrry :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/basics/history/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/basics/history/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -560,18 +555,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/basics/index.html b/pir/basics/index.html
index 1685ff272e..2b10dda172 100644
--- a/pir/basics/index.html
+++ b/pir/basics/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Basics :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/basics/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/basics/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -265,18 +260,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/basics/installation/index.html b/pir/basics/installation/index.html
index 46fa48d21f..703e337bf2 100644
--- a/pir/basics/installation/index.html
+++ b/pir/basics/installation/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Installat&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/basics/installation/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/basics/installation/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -321,18 +316,18 @@ hugo new basics/second-content/_index.md
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/basics/migration/index.html b/pir/basics/migration/index.html
index 5bf03b37e3..49edd85adc 100644
--- a/pir/basics/migration/index.html
+++ b/pir/basics/migration/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Migrrrat&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/basics/migration/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/basics/migration/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -467,18 +462,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/basics/requirements/index.html b/pir/basics/requirements/index.html
index 8134289ae4..54521dc96e 100644
--- a/pir/basics/requirements/index.html
+++ b/pir/basics/requirements/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Requirrrements :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/basics/requirements/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/basics/requirements/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -265,18 +260,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/categories/index.html b/pir/categories/index.html
index c83d46a5fd..d0e312fb63 100644
--- a/pir/categories/index.html
+++ b/pir/categories/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Categories :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/categories/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/categories/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -253,18 +248,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/archetypes/index.html b/pir/cont/archetypes/index.html
index 27d9349fc5..22275ac388 100644
--- a/pir/cont/archetypes/index.html
+++ b/pir/cont/archetypes/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Arrrchetypes :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/archetypes/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -297,18 +292,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/i18n/index.html b/pir/cont/i18n/index.html
index 340db14373..c143ddfb66 100644
--- a/pir/cont/i18n/index.html
+++ b/pir/cont/i18n/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Multilingual an&#39; i18n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/cont/i18n/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/i18n/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -326,18 +321,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/icons/index.html b/pir/cont/icons/index.html
index e7ede1d6f4..a7e3506290 100644
--- a/pir/cont/icons/index.html
+++ b/pir/cont/icons/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Ay&#39;cons an&#39; logos :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/icons/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -287,18 +282,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/index.html b/pir/cont/index.html
index 0c5653782c..79ff87e9fa 100644
--- a/pir/cont/index.html
+++ b/pir/cont/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Rambl&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/cont/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -265,18 +260,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/markdown/index.html b/pir/cont/markdown/index.html
index 5fc1b0dcac..a8a36f1727 100644
--- a/pir/cont/markdown/index.html
+++ b/pir/cont/markdown/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Marrrkdown rules :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/markdown/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -756,18 +751,18 @@ grunt.initConfig({
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/menushortcuts/index.html b/pir/cont/menushortcuts/index.html
index 79fa410fc4..abd9c061b5 100644
--- a/pir/cont/menushortcuts/index.html
+++ b/pir/cont/menushortcuts/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Menu extrrra shorrrtcuts :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/menushortcuts/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -375,18 +370,18 @@ However, if ye want t' keep th' title but change its value, it can be overriden
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/pages/index.html b/pir/cont/pages/index.html
index 35a06690c0..a5742dd8d5 100644
--- a/pir/cont/pages/index.html
+++ b/pir/cont/pages/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Planks orrrganizat&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/cont/pages/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/pages/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -396,18 +391,18 @@ We&rsquo;ve added th' <code>menuTitle</code> parameter fer that purpose:</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/syntaxhighlight/index.html b/pir/cont/syntaxhighlight/index.html
index 1b7d11018f..40d6d155fe 100644
--- a/pir/cont/syntaxhighlight/index.html
+++ b/pir/cont/syntaxhighlight/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Code highlight&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/syntaxhighlight/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -312,18 +307,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/cont/tags/index.html b/pir/cont/tags/index.html
index 5535653e4d..b3e45fa55b 100644
--- a/pir/cont/tags/index.html
+++ b/pir/cont/tags/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Tags :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/cont/tags/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -288,18 +283,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/credits/index.html b/pir/credits/index.html
index d2350f2db4..c137801ff6 100644
--- a/pir/credits/index.html
+++ b/pir/credits/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Crrredits :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/credits/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -278,18 +273,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/index.html b/pir/index.html
index ec29c1aa7b..a52627c446 100644
--- a/pir/index.html
+++ b/pir/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Relearrrn Theme fer Cap&#39;n Hugo :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -280,18 +275,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/attachments/index.html b/pir/shortcodes/attachments/index.html
index 3f775b17ea..294cd1462d 100644
--- a/pir/shortcodes/attachments/index.html
+++ b/pir/shortcodes/attachments/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Attachments :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/attachments/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -448,18 +443,18 @@ Currently, it support two implementat'ns fer planks</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/button/index.html b/pir/shortcodes/button/index.html
index 416f5942ba..84c6e75891 100644
--- a/pir/shortcodes/button/index.html
+++ b/pir/shortcodes/button/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Button :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/button/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -288,18 +283,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html
index 73b22d98a2..754f54c7ca 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-1-1-1-1 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -192,6 +186,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -283,18 +278,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html
index c0361e3b79..8c9d768c7f 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-1-1-1 (hidden) :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -192,6 +186,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -288,18 +283,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html
index 4befa84df7..e24ed57e88 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-1-1 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -190,6 +184,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -285,18 +280,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html
index 667206fb38..d88a4297be 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-1 (hidden) :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -190,6 +184,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -284,18 +279,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html
index bf4fd2057e..926bcb0f60 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-2-1 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -277,18 +272,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html
index e998e8b0ac..3775129bfc 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-2-2 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -277,18 +272,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html
index 5bc47a7e73..1fecb5f298 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-2 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -283,18 +278,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html b/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html
index bc1846fb12..736dabfaec 100644
--- a/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1-3 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -276,18 +271,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/children-1-1/index.html b/pir/shortcodes/children/children-1/children-1-1/index.html
index 1f00a9a8a4..3e1b394057 100644
--- a/pir/shortcodes/children/children-1/children-1-1/index.html
+++ b/pir/shortcodes/children/children-1/children-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1-1 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -283,18 +278,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-1/index.html b/pir/shortcodes/children/children-1/index.html
index 0067f9f7d5..f94e1c9f0c 100644
--- a/pir/shortcodes/children/children-1/index.html
+++ b/pir/shortcodes/children/children-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 1 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -280,18 +275,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-2/index.html b/pir/shortcodes/children/children-2/index.html
index 3b6d7c6781..1663a5fcc7 100644
--- a/pir/shortcodes/children/children-2/index.html
+++ b/pir/shortcodes/children/children-2/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 2 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-2/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -275,18 +270,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-3/index.html b/pir/shortcodes/children/children-3/index.html
index e4e5ff8e39..b7f3357e5f 100644
--- a/pir/shortcodes/children/children-3/index.html
+++ b/pir/shortcodes/children/children-3/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 3 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-3/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -280,18 +275,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-3/test3/index.html b/pir/shortcodes/children/children-3/test3/index.html
index 421f34ef22..5b75180fca 100644
--- a/pir/shortcodes/children/children-3/test3/index.html
+++ b/pir/shortcodes/children/children-3/test3/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Plank 3-1 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-3/test3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -274,18 +269,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/children-4/index.html b/pir/shortcodes/children/children-4/index.html
index 16311e4ca2..91da6a5462 100644
--- a/pir/shortcodes/children/children-4/index.html
+++ b/pir/shortcodes/children/children-4/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Plank 4 (hidden) :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/children-4/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/children-4/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -189,6 +183,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -275,18 +270,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/index.html b/pir/shortcodes/children/index.html
index ce646d087c..31f7be5e3a 100644
--- a/pir/shortcodes/children/index.html
+++ b/pir/shortcodes/children/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Children :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/children/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -417,18 +412,18 @@ So its rrrambl'n be used as descript'n.</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/children/test/index.html b/pir/shortcodes/children/test/index.html
index 779f591a72..61f28f11b5 100644
--- a/pir/shortcodes/children/test/index.html
+++ b/pir/shortcodes/children/test/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Plank X :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/children/test/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -269,18 +264,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/expand/index.html b/pir/shortcodes/expand/index.html
index d423bf6e74..bb301b629f 100644
--- a/pir/shortcodes/expand/index.html
+++ b/pir/shortcodes/expand/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Expand :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/expand/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -396,18 +391,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/include/index.html b/pir/shortcodes/include/index.html
index de6c24a08b..cf54a639ab 100644
--- a/pir/shortcodes/include/index.html
+++ b/pir/shortcodes/include/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Include :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/include/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -299,18 +294,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/index.html b/pir/shortcodes/index.html
index ee32a60d77..e488c47a6b 100644
--- a/pir/shortcodes/index.html
+++ b/pir/shortcodes/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Shorrrtcodes :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/shortcodes/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -308,18 +303,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/mermaid/index.html b/pir/shortcodes/mermaid/index.html
index 55614cffb9..b21a33fc09 100644
--- a/pir/shortcodes/mermaid/index.html
+++ b/pir/shortcodes/mermaid/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Merrrmaid :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/mermaid/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -493,18 +488,18 @@ classDiagram
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/notice/index.html b/pir/shortcodes/notice/index.html
index 54ec2e688b..1ecb2a5e40 100644
--- a/pir/shortcodes/notice/index.html
+++ b/pir/shortcodes/notice/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Notice :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/notice/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -488,18 +483,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/siteparam/index.html b/pir/shortcodes/siteparam/index.html
index 85a025783e..6c09bec6a6 100644
--- a/pir/shortcodes/siteparam/index.html
+++ b/pir/shortcodes/siteparam/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Ship param :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/siteparam/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -279,18 +274,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/shortcodes/tabs/index.html b/pir/shortcodes/tabs/index.html
index 6020c35f30..8e51dfd753 100644
--- a/pir/shortcodes/tabs/index.html
+++ b/pir/shortcodes/tabs/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Tabbed views :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/shortcodes/tabs/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -434,18 +429,18 @@ from th' <code>'default'</code> group on a different plank then all tabs will be
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/showcase/index.html b/pir/showcase/index.html
index 5b72820f72..e00dba0926 100644
--- a/pir/showcase/index.html
+++ b/pir/showcase/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Showcase :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/showcase/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -261,18 +256,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/tags/children/index.html b/pir/tags/children/index.html
index 7b52164cf7..15d599755a 100644
--- a/pir/tags/children/index.html
+++ b/pir/tags/children/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>children :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/tags/children/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/tags/children/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -268,18 +263,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/tags/documentatn/index.html b/pir/tags/documentatn/index.html
index 86520ce47f..844be45bb7 100644
--- a/pir/tags/documentatn/index.html
+++ b/pir/tags/documentatn/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>documentat&#39;n :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/tags/documentatn/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/tags/documentatn/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -254,18 +249,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/tags/hidden/index.html b/pir/tags/hidden/index.html
index cf18c50cbf..270d5eac84 100644
--- a/pir/tags/hidden/index.html
+++ b/pir/tags/hidden/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>hidden :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/tags/hidden/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/tags/hidden/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -259,18 +254,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/tags/index.html b/pir/tags/index.html
index dff717eb6e..a5baf0bbc1 100644
--- a/pir/tags/index.html
+++ b/pir/tags/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Tags :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/tags/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/tags/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -258,18 +253,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/tags/non-hidden/index.html b/pir/tags/non-hidden/index.html
index c647588a39..2da9bfe549 100644
--- a/pir/tags/non-hidden/index.html
+++ b/pir/tags/non-hidden/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>non-hidden :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/tags/non-hidden/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/tags/non-hidden/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -263,18 +258,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/tags/tutorrrial/index.html b/pir/tags/tutorrrial/index.html
index 740db38004..368a00dc33 100644
--- a/pir/tags/tutorrrial/index.html
+++ b/pir/tags/tutorrrial/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>tutorrrial :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/tags/tutorrrial/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/tags/tutorrrial/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -254,18 +249,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/1/index.html b/pir/yours/1/index.html
index 359b60ad91..d3ad3bb38c 100644
--- a/pir/yours/1/index.html
+++ b/pir/yours/1/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>1 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/10/index.html b/pir/yours/10/index.html
index f4f44c54b5..23b0b5bb2e 100644
--- a/pir/yours/10/index.html
+++ b/pir/yours/10/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>11 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/10/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/2/index.html b/pir/yours/2/index.html
index bf7a9692a4..0ed5af7234 100644
--- a/pir/yours/2/index.html
+++ b/pir/yours/2/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>2 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/3/index.html b/pir/yours/3/index.html
index 61ceb9e4dd..73b451fd32 100644
--- a/pir/yours/3/index.html
+++ b/pir/yours/3/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>3 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/4/index.html b/pir/yours/4/index.html
index 4a6e0d3d2e..f078cd923c 100644
--- a/pir/yours/4/index.html
+++ b/pir/yours/4/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>4 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/4/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/5/index.html b/pir/yours/5/index.html
index a34f3cccf9..00c2e25441 100644
--- a/pir/yours/5/index.html
+++ b/pir/yours/5/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>5 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/5/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/6/index.html b/pir/yours/6/index.html
index 369eac5df2..fd1f650697 100644
--- a/pir/yours/6/index.html
+++ b/pir/yours/6/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>6 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/6/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/7/index.html b/pir/yours/7/index.html
index 23497ad271..6b92bd397e 100644
--- a/pir/yours/7/index.html
+++ b/pir/yours/7/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>7 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/7/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/8/index.html b/pir/yours/8/index.html
index b1789938c4..e07b4c7c3c 100644
--- a/pir/yours/8/index.html
+++ b/pir/yours/8/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>8 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/8/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -271,18 +266,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/9/index.html b/pir/yours/9/index.html
index 22b339447e..e70a0cd754 100644
--- a/pir/yours/9/index.html
+++ b/pir/yours/9/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>9 :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/9/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -198,6 +192,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -270,18 +265,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/children-1/index.html b/pir/yours/children-1/index.html
index 914401dfdf..0d2c201f83 100644
--- a/pir/yours/children-1/index.html
+++ b/pir/yours/children-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Th&#39; one an&#39; only hidden child :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/yours/children-1/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/children-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -200,6 +194,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -280,18 +275,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/pir/yours/index.html b/pir/yours/index.html
index 2631a5915f..7bba4a4ab0 100644
--- a/pir/yours/index.html
+++ b/pir/yours/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>This could be yers :: Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/pir/yours/index.xml" title="Documentat&#39;n fer Cap&#39;n Hugo Relearrrn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714711" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714711" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714711" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714711" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715832" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715832" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715832" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715832" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715832"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/pir/yours/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Searrrch...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714711"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714711"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715832"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715832"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -199,6 +193,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -276,18 +271,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714711"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715832"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715832"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714711"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715832"></script>
   </body>
 </html>
diff --git a/shortcodes/attachments/index.html b/shortcodes/attachments/index.html
index 7d3b7ee5af..6a7f43f149 100644
--- a/shortcodes/attachments/index.html
+++ b/shortcodes/attachments/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="The Attachments shortcode displays a list of files attached to a page">
     <meta name="author" content="Sören Weber">
     <title>Attachments :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/attachments/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -442,18 +437,18 @@ Currently, it support two implementations for pages</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/button/index.html b/shortcodes/button/index.html
index 0152f9598b..7e8fd50da8 100644
--- a/shortcodes/button/index.html
+++ b/shortcodes/button/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Nice buttons on your page">
     <meta name="author" content="Sören Weber">
     <title>Button :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/button/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -281,18 +276,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html
index d2f553a052..ea8981383c 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-1-1-1-1 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/children-1-1-1-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -192,6 +186,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -276,18 +271,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html
index 509b4b7167..e1496524d9 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-1-1-1 (hidden) :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/children-1-1-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -192,6 +186,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -285,18 +280,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html
index 5d0446cb15..7e72d43cdd 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-1-1 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/children-1-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -190,6 +184,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -282,18 +277,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html
index 19f0705c2c..97d5d2026b 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-1 (hidden) :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -190,6 +184,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -281,18 +276,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html
index f8bf6659ef..09f647cf2a 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-2-1 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -270,18 +265,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html
index e8a1dcc42e..66c7c63fb0 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-2-2 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -270,18 +265,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html
index 7f827ba46f..52e0380769 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-2/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-2 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-2/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -280,18 +275,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html b/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html
index df5d21b737..9322e8dfe1 100644
--- a/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html
+++ b/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1-3 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-3/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/children-1-1-3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -269,18 +264,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/children-1-1/index.html b/shortcodes/children/children-1/children-1-1/index.html
index 0a6aa9ad6e..2f2b080e03 100644
--- a/shortcodes/children/children-1/children-1-1/index.html
+++ b/shortcodes/children/children-1/children-1-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1-1 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/children-1-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -280,18 +275,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-1/index.html b/shortcodes/children/children-1/index.html
index 6bcecb716d..563cab0823 100644
--- a/shortcodes/children/children-1/index.html
+++ b/shortcodes/children/children-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 1 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -277,18 +272,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-2/index.html b/shortcodes/children/children-2/index.html
index 79ff7f845e..33eea01d6e 100644
--- a/shortcodes/children/children-2/index.html
+++ b/shortcodes/children/children-2/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 2 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-2/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -268,18 +263,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-3/index.html b/shortcodes/children/children-3/index.html
index 00f1c4d942..4b392e79ff 100644
--- a/shortcodes/children/children-3/index.html
+++ b/shortcodes/children/children-3/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 3 :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-3/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -277,18 +272,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-3/test3/index.html b/shortcodes/children/children-3/test3/index.html
index 1e1709f88f..ae95ab121b 100644
--- a/shortcodes/children/children-3/test3/index.html
+++ b/shortcodes/children/children-3/test3/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="This is a plain page test nested in a parent">
     <meta name="author" content="Sören Weber">
     <title>page 3-1 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-3/test3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -267,18 +262,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/children-4/index.html b/shortcodes/children/children-4/index.html
index ba6a80b2eb..081546ec49 100644
--- a/shortcodes/children/children-4/index.html
+++ b/shortcodes/children/children-4/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>page 4 (hidden) :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/children-4/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/children-4/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -189,6 +183,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -268,18 +263,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/index.html b/shortcodes/children/index.html
index 589f50b863..6a34ba4e48 100644
--- a/shortcodes/children/index.html
+++ b/shortcodes/children/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Children :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/children/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -415,18 +410,18 @@ So its content is used as description.</p>
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/children/test/index.html b/shortcodes/children/test/index.html
index bbc9930ae0..cdf29db6d4 100644
--- a/shortcodes/children/test/index.html
+++ b/shortcodes/children/test/index.html
@@ -9,22 +9,31 @@
 ">
     <meta name="author" content="Sören Weber">
     <title>page X :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/children/test/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -263,18 +258,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/expand/index.html b/shortcodes/expand/index.html
index 24bea6d5f6..decc50cd41 100644
--- a/shortcodes/expand/index.html
+++ b/shortcodes/expand/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Displays an expandable/collapsible section of text on your page">
     <meta name="author" content="Sören Weber">
     <title>Expand :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/expand/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -400,18 +395,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/include/index.html b/shortcodes/include/index.html
index e55c35ef51..7b8d71ee78 100644
--- a/shortcodes/include/index.html
+++ b/shortcodes/include/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Displays content from other Markdown files">
     <meta name="author" content="Sören Weber">
     <title>Include :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/include/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -301,18 +296,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/include_me/index.html b/shortcodes/include_me/index.html
index 5d4f57049f..b205fdb0a6 100644
--- a/shortcodes/include_me/index.html
+++ b/shortcodes/include_me/index.html
@@ -9,22 +9,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title> :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/include_me/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -274,18 +269,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/index.html b/shortcodes/index.html
index fef1925c1c..73be535041 100644
--- a/shortcodes/index.html
+++ b/shortcodes/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Shortcodes :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/shortcodes/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -301,18 +296,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/mermaid/index.html b/shortcodes/mermaid/index.html
index 77413fcd38..db801c866a 100644
--- a/shortcodes/mermaid/index.html
+++ b/shortcodes/mermaid/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Generation of diagram and flowchart from text in a similar manner as Markdown">
     <meta name="author" content="Sören Weber">
     <title>Mermaid :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/mermaid/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -504,18 +499,18 @@ classDiagram
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/notice/index.html b/shortcodes/notice/index.html
index e3929ca97f..2c4070ce7e 100644
--- a/shortcodes/notice/index.html
+++ b/shortcodes/notice/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Disclaimers to help you structure your page">
     <meta name="author" content="Sören Weber">
     <title>Notice :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/notice/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -494,18 +489,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/siteparam/index.html b/shortcodes/siteparam/index.html
index 678cac895f..3de6edcfe8 100644
--- a/shortcodes/siteparam/index.html
+++ b/shortcodes/siteparam/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Get value of site params variables in your page">
     <meta name="author" content="Sören Weber">
     <title>Site param :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/siteparam/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -277,18 +272,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/shortcodes/tabs/index.html b/shortcodes/tabs/index.html
index fdca5cf606..cc15a808a6 100644
--- a/shortcodes/tabs/index.html
+++ b/shortcodes/tabs/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Synchronize selection of content in different tabbed views">
     <meta name="author" content="Sören Weber">
     <title>Tabbed views :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/shortcodes/tabs/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -432,18 +427,18 @@ from the <code>'default'</code> group on a different page then all tabs will be
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/showcase/index.html b/showcase/index.html
index 0f309ae834..5bd14142d5 100644
--- a/showcase/index.html
+++ b/showcase/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>Showcase :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/showcase/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -254,18 +249,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/tags/children/index.html b/tags/children/index.html
index e61b79ba88..6a47379b24 100644
--- a/tags/children/index.html
+++ b/tags/children/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>children :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/tags/children/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/tags/children/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -268,18 +263,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/tags/documentation/index.html b/tags/documentation/index.html
index 0253ba0846..3385408daf 100644
--- a/tags/documentation/index.html
+++ b/tags/documentation/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>documentation :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/tags/documentation/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/tags/documentation/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -254,18 +249,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/tags/hidden/index.html b/tags/hidden/index.html
index 89dee68516..a6060b4c76 100644
--- a/tags/hidden/index.html
+++ b/tags/hidden/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>hidden :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/tags/hidden/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/tags/hidden/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -259,18 +254,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/tags/index.html b/tags/index.html
index 3fb470766c..c6b72cf614 100644
--- a/tags/index.html
+++ b/tags/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>Tags :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/tags/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/tags/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -258,18 +253,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/tags/non-hidden/index.html b/tags/non-hidden/index.html
index 7a51956dc9..e8d8a30732 100644
--- a/tags/non-hidden/index.html
+++ b/tags/non-hidden/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>non-hidden :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/tags/non-hidden/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/tags/non-hidden/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -188,6 +182,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -263,18 +258,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/tags/tutorial/index.html b/tags/tutorial/index.html
index f81d60ef76..2da48aaf13 100644
--- a/tags/tutorial/index.html
+++ b/tags/tutorial/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>tutorial :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/tags/tutorial/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/tags/tutorial/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -187,6 +181,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -254,18 +249,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/1/index.html b/yours/1/index.html
index c6a296d4ec..95072a92e1 100644
--- a/yours/1/index.html
+++ b/yours/1/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>1 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/10/index.html b/yours/10/index.html
index e7855f32e8..3618677b77 100644
--- a/yours/10/index.html
+++ b/yours/10/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>10 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/10/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/11.de/index.html b/yours/11.de/index.html
index d304614b5c..6887b3ba89 100644
--- a/yours/11.de/index.html
+++ b/yours/11.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>11 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/11.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/12.de/index.html b/yours/12.de/index.html
index 1dd649bfa3..6a0f42e9b2 100644
--- a/yours/12.de/index.html
+++ b/yours/12.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>12 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/12.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/13.de/index.html b/yours/13.de/index.html
index d04e0e4551..c946b6fcec 100644
--- a/yours/13.de/index.html
+++ b/yours/13.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>13 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/13.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/14.de/index.html b/yours/14.de/index.html
index 2334fa6c5f..60615da1b2 100644
--- a/yours/14.de/index.html
+++ b/yours/14.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>14 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/14.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/15.de/index.html b/yours/15.de/index.html
index cabcf7c328..de5a3fb463 100644
--- a/yours/15.de/index.html
+++ b/yours/15.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>15 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/15.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/16.de/index.html b/yours/16.de/index.html
index 1dfa6d98bc..c0d8410a6b 100644
--- a/yours/16.de/index.html
+++ b/yours/16.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>16 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/16.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/17.de/index.html b/yours/17.de/index.html
index fc13aa567d..01456f9e60 100644
--- a/yours/17.de/index.html
+++ b/yours/17.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>17 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/17.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/18.de/index.html b/yours/18.de/index.html
index ff60503e22..54400852dc 100644
--- a/yours/18.de/index.html
+++ b/yours/18.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>18 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714709" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714709" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714709" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714709" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/18.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714709"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714709"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714709"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714709"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/19.de/index.html b/yours/19.de/index.html
index 1ec14c17b9..211e9d92ff 100644
--- a/yours/19.de/index.html
+++ b/yours/19.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>19 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/19.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/2/index.html b/yours/2/index.html
index 9dcacd26bb..ad23db8fb8 100644
--- a/yours/2/index.html
+++ b/yours/2/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>2 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/2/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/20.de/index.html b/yours/20.de/index.html
index d746e3012c..6f8aa336c3 100644
--- a/yours/20.de/index.html
+++ b/yours/20.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>20 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/20.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/21.de/index.html b/yours/21.de/index.html
index 180e18ea3f..7bc9c0c993 100644
--- a/yours/21.de/index.html
+++ b/yours/21.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>21 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/21.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/22.de/index.html b/yours/22.de/index.html
index d691951eeb..de3deff5a9 100644
--- a/yours/22.de/index.html
+++ b/yours/22.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>22 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/22.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/23.de/index.html b/yours/23.de/index.html
index 63044b8fc1..b0790258f7 100644
--- a/yours/23.de/index.html
+++ b/yours/23.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>23 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/23.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/24.de/index.html b/yours/24.de/index.html
index 0189b18bd7..fe012569e0 100644
--- a/yours/24.de/index.html
+++ b/yours/24.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>24 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/24.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/25.de/index.html b/yours/25.de/index.html
index 4bb4618b28..f588b1e6e0 100644
--- a/yours/25.de/index.html
+++ b/yours/25.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>25 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/25.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/26.de/index.html b/yours/26.de/index.html
index 6073951cf9..f4ee00a460 100644
--- a/yours/26.de/index.html
+++ b/yours/26.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>26 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/26.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/27.de/index.html b/yours/27.de/index.html
index 43a2f35b9c..1be3359921 100644
--- a/yours/27.de/index.html
+++ b/yours/27.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>27 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/27.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/28.de/index.html b/yours/28.de/index.html
index a6a69082f3..fe997620e9 100644
--- a/yours/28.de/index.html
+++ b/yours/28.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>28 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/28.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/29.de/index.html b/yours/29.de/index.html
index b3557a9d83..a2c9ff0c77 100644
--- a/yours/29.de/index.html
+++ b/yours/29.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>29 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/29.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/3/index.html b/yours/3/index.html
index a3ca2b6e6d..fa32f587e2 100644
--- a/yours/3/index.html
+++ b/yours/3/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>3 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/3/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/30.de/index.html b/yours/30.de/index.html
index e8c8dbe569..980241790c 100644
--- a/yours/30.de/index.html
+++ b/yours/30.de/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>30 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/30.de/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -217,6 +211,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/4/index.html b/yours/4/index.html
index db21de0b67..3cde02e9aa 100644
--- a/yours/4/index.html
+++ b/yours/4/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>4 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/4/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/5/index.html b/yours/5/index.html
index 9ec44fa9a2..1c23f70ecb 100644
--- a/yours/5/index.html
+++ b/yours/5/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>5 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/5/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/6/index.html b/yours/6/index.html
index 2ac3e3bdeb..0f9eb663c4 100644
--- a/yours/6/index.html
+++ b/yours/6/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>6 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/6/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/7/index.html b/yours/7/index.html
index 66bbb9e8ca..db2f9675f0 100644
--- a/yours/7/index.html
+++ b/yours/7/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>7 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/7/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/8/index.html b/yours/8/index.html
index af9b3ed6bf..77af974e25 100644
--- a/yours/8/index.html
+++ b/yours/8/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>8 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/8/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -291,18 +286,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/9/index.html b/yours/9/index.html
index 2f1e448b64..c128ef0902 100644
--- a/yours/9/index.html
+++ b/yours/9/index.html
@@ -8,22 +8,31 @@
     <meta name="description" content="Documentation for Hugo Relearn Theme">
     <meta name="author" content="Sören Weber">
     <title>9 :: Documentation for Hugo Relearn Theme</title>
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -32,24 +41,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -64,7 +58,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/9/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -107,9 +101,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -218,6 +212,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -290,18 +285,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/children-1/index.html b/yours/children-1/index.html
index 17af6a7493..0c2caf6f6d 100644
--- a/yours/children-1/index.html
+++ b/yours/children-1/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>The one and only hidden child :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/yours/children-1/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/children-1/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -220,6 +214,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -293,18 +288,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>
diff --git a/yours/index.html b/yours/index.html
index 77e022d9e0..0adda2bf54 100644
--- a/yours/index.html
+++ b/yours/index.html
@@ -9,22 +9,31 @@
     <meta name="author" content="Sören Weber">
     <title>This could be yours :: Documentation for Hugo Relearn Theme</title>
     <link rel="alternate" type="application/rss&#43;xml" href="/hugo-theme-relearn/yours/index.xml" title="Documentation for Hugo Relearn Theme" />
-    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644714710" type="image/svg+xml">
-    <link href="/hugo-theme-relearn/css/nucleus.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/auto-complete.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/theme.css?1644714710" rel="stylesheet">
-    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/variant.css?1644714710" rel="stylesheet">
-    <link href="/hugo-theme-relearn/css/print.css?1644714710" rel="stylesheet" media="print">
+    <link rel="icon" href="/hugo-theme-relearn/images/logo.svg?1644715831" type="image/svg+xml">
+    <link href="/hugo-theme-relearn/css/nucleus.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/featherlight.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/auto-complete.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/theme.css?1644715831" rel="stylesheet">
+    <link id="variant-style" href="/hugo-theme-relearn/css/theme-relearn-light.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/variant.css?1644715831" rel="stylesheet">
+    <link href="/hugo-theme-relearn/css/print.css?1644715831" rel="stylesheet" media="print">
     <script>
       
       
       var theme = window.localStorage.getItem( 'theme' );
-      changeTheme( theme, true );
-
+      changeTheme( theme );
+      function getTheme(){
+        var link = document.querySelector( '#variant-style' );
+        var path = link.getAttribute( 'href' );
+        var theme = path.match(/^.*\/theme-(.*?)\.css.*$/)[ 1 ];
+        return theme;
+      }
+      function markTheme( theme ){
+        var select = document.querySelector( '#select-theme' );
+        select.value = theme;
+      }
       function changeTheme( theme, noanimation ){
         if( !theme ){
           return;
@@ -33,24 +42,9 @@
         var old_path = link.getAttribute( 'href' );
         var new_path = old_path.replace( /^(.*\/theme-).*?(\.css.*)$/, '$1' + theme + '$2' );
         if( old_path != new_path ){
-          var animations = document.querySelectorAll( '.default-animation' );
-          if( noanimation ){
-            animations.forEach( function( e ){
-              e.classList.remove( 'default-animation' );
-            });
-          }
           window.localStorage.setItem( 'theme', theme );
           link.setAttribute( 'href', new_path );
-          var select = document.querySelector( '#select-theme' );
-          select.value = theme;
-          
-          if( noanimation ){
-            setTimeout( function(){
-              animations.forEach( function( e ){
-                e.classList.add( 'default-animation' );
-              });
-            }, 525 );
-          }
+          markTheme( theme );
           
           
           
@@ -65,7 +59,7 @@
         display:none !important;
       }
     </style>
-    <script src="/hugo-theme-relearn/js/jquery.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/jquery.min.js?1644715831"></script>
   </head>
   <body class="" data-url="/hugo-theme-relearn/yours/">
     <!-- hack to let hugo tell us how to get to the root when using relativeURLs, it needs to be called *url= for it to do its magic: -->
@@ -108,9 +102,9 @@
           <input data-search-input id="search-by" type="search" placeholder="Search...">
           <span data-search-clear=""><i class="fas fa-times"></i></span>
         </div>
-        <script src="/hugo-theme-relearn/js/lunr.min.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/auto-complete.js?1644714710"></script>
-        <script src="/hugo-theme-relearn/js/search.js?1644714710"></script>
+        <script src="/hugo-theme-relearn/js/lunr.min.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/auto-complete.js?1644715831"></script>
+        <script src="/hugo-theme-relearn/js/search.js?1644715831"></script>
       </div>
       <div class="highlightable">
         <ul class="topics">
@@ -219,6 +213,7 @@
                     <option id="green" value="green">green</option>
                     <option id="red" value="red">red</option>
                   </select>
+                  <script>markTheme( getTheme() );</script>
                 </div>
               </a>
             </li>
@@ -289,18 +284,18 @@
     <div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
       <div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
     </div>
-    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644714710"></script>
-    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/clipboard.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/perfect-scrollbar.jquery.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/jquery.svg.pan.zoom.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/featherlight.min.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/modernizr.custom-3.6.0.js?1644715831"></script>
+    <script src="/hugo-theme-relearn/js/mermaid.min.js?1644715831"></script>
     <script>
       if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
         mermaid.mermaidAPI.initialize( Object.assign( { "securityLevel": "antiscript" }, JSON.parse("{ \"startOnLoad\": true }"), { startOnLoad: false } ) );
       }
     </script>
-    <script src="/hugo-theme-relearn/js/relearn.js?1644714710"></script>
+    <script src="/hugo-theme-relearn/js/relearn.js?1644715831"></script>
   </body>
 </html>