sfi_demo: fix toc method and some styling changes

sfi_demo/static/sfi_demo/css/bootstrap-toc.css

+/*!
+ * Bootstrap Table of Contents v1.0.1 (http://afeld.github.io/bootstrap-toc/)
+ * Copyright 2015 Aidan Feldman
+ * Licensed under MIT (https://github.com/afeld/bootstrap-toc/blob/gh-pages/LICENSE.md) */
+nav[data-toggle=toc] .nav>li>a {
+    display: block;
+    padding: 4px 20px;
+    font-size: 13px;
+    font-weight: 500;
+    color: #767676
+}
+
+nav[data-toggle=toc] .nav>li>a:focus,
+nav[data-toggle=toc] .nav>li>a:hover {
+    padding-left: 19px;
+    color: #563d7c;
+    text-decoration: none;
+    background-color: transparent;
+    border-left: 1px solid #563d7c
+}
+
+nav[data-toggle=toc] .nav-link.active,
+nav[data-toggle=toc] .nav-link.active:focus,
+nav[data-toggle=toc] .nav-link.active:hover {
+    padding-left: 18px;
+    font-weight: 700;
+    color: #563d7c;
+    background-color: transparent;
+    border-left: 2px solid #563d7c
+}
+
+nav[data-toggle=toc] .nav-link+ul {
+    display: none;
+    padding-bottom: 10px
+}
+
+nav[data-toggle=toc] .nav .nav>li>a {
+    padding-top: 1px;
+    padding-bottom: 1px;
+    padding-left: 30px;
+    font-size: 12px;
+    font-weight: 400
+}
+
+nav[data-toggle=toc] .nav .nav>li>a:focus,
+nav[data-toggle=toc] .nav .nav>li>a:hover {
+    padding-left: 29px
+}
+
+nav[data-toggle=toc] .nav .nav>li>.active,
+nav[data-toggle=toc] .nav .nav>li>.active:focus,
+nav[data-toggle=toc] .nav .nav>li>.active:hover {
+    padding-left: 28px;
+    font-weight: 500
+}
+
+nav[data-toggle=toc] .nav-link.active+ul {
+    display: block
+}
+
+/* custom TOC styling */
+@supports ((position: -webkit-sticky) or (position: sticky)) {
+    .sticky-top {
+      position: -webkit-sticky;
+      position: sticky;
+      top: 165px;
+      z-index: 1019;
+    }
+  }
+nav#toc>ul>li{
+    width: 100%;
+}
+nav#toc *{
+    --bs-gutter-x: 0;
+}
+nav#toc .nav > li >a {
+    padding-top: 0;
+    padding-bottom: .8em;
+}
+nav#toc .nav > li {
+    padding: 0;
+}
\ No newline at end of file

sfi_demo/static/sfi_demo/css/bootstrap-toc.min.css

+/*!
+ * Bootstrap Table of Contents v1.0.1 (http://afeld.github.io/bootstrap-toc/)
+ * Copyright 2015 Aidan Feldman
+ * Licensed under MIT (https://github.com/afeld/bootstrap-toc/blob/gh-pages/LICENSE.md) */nav[data-toggle=toc] .nav>li>a{display:block;padding:4px 20px;font-size:13px;font-weight:500;color:#767676}nav[data-toggle=toc] .nav>li>a:focus,nav[data-toggle=toc] .nav>li>a:hover{padding-left:19px;color:#563d7c;text-decoration:none;background-color:transparent;border-left:1px solid #563d7c}nav[data-toggle=toc] .nav-link.active,nav[data-toggle=toc] .nav-link.active:focus,nav[data-toggle=toc] .nav-link.active:hover{padding-left:18px;font-weight:700;color:#563d7c;background-color:transparent;border-left:2px solid #563d7c}nav[data-toggle=toc] .nav-link+ul{display:none;padding-bottom:10px}nav[data-toggle=toc] .nav .nav>li>a{padding-top:1px;padding-bottom:1px;padding-left:30px;font-size:12px;font-weight:400}nav[data-toggle=toc] .nav .nav>li>a:focus,nav[data-toggle=toc] .nav .nav>li>a:hover{padding-left:29px}nav[data-toggle=toc] .nav .nav>li>.active,nav[data-toggle=toc] .nav .nav>li>.active:focus,nav[data-toggle=toc] .nav .nav>li>.active:hover{padding-left:28px;font-weight:500}nav[data-toggle=toc] .nav-link.active+ul{display:block}@supports ((position:-webkit-sticky) or (position:sticky)){.sticky-top{position:-webkit-sticky;position:sticky;top:165px;z-index:1019}}nav#toc>ul>li{width:100%}nav#toc *{--bs-gutter-x:0}nav#toc .nav>li>a{padding-top:0;padding-bottom:.8em}nav#toc .nav>li{padding:0}
\ No newline at end of file

sfi_demo/templates/sfi_demo/home.html

@@ -28,7 +28,7 @@
     <a href="https://www.bmbf-wax.de/" target="_blank" rel="noopener noreferrer">
       <img src="{% static "sfi_demo/img/WAX.png" %}" alt="WAX - Logo" >
     </a>
-    <a href="https://www.bmbf.de/SharedDocs/Publikationen/DE/7/31660_Wasser_N.html" target="_blank" rel="noopener noreferrer">
+    <a href="https://www.bmbf.de/SharedDocs/Publikationen/DE/7/31660_Wasser_N.html" target="_blank" rel="noopener noreferrer" class="ms-auto">
       <img src="{% static "sfi_demo/img/Wasser_N.png" %}" alt="Wasser:N - Logo"  style="height: 150px">
     </a>
     <a href="https://www.fona.de/de/" target="_blank" rel="noopener noreferrer">
@@ -42,7 +42,7 @@
   <style>
     div.logos {
       display: flex;
-      justify-content: space-around;
+      justify-content: start;
       align-items: center;
       flex-wrap: wrap;
     }