diff --git a/css/area_main-sidebar.less b/css/area_main-sidebar.less
new file mode 100644
index 0000000..f661324
--- /dev/null
+++ b/css/area_main-sidebar.less
@@ -0,0 +1,121 @@
+/**
+ * This file provides the design styles for the sidebar (navmain).
+ *
+ * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
+ */
+
+
+#dokuwiki__aside.main-sidebar {
+
+/* + + + + +  nav main  + + + + + */
+    .nav-main {
+        > ul {
+            @icon-size: 2rem;
+
+            margin: 0;
+            padding: 0;
+
+            ul {
+                margin-left: (@icon-size + .5);
+            }
+
+            li {
+                color: @color-nav;
+
+                &:first-of-type {
+                    padding-top: .3rem;
+                }
+            }
+
+            .li {
+                color: @color-nav;
+
+                a {
+                    color: inherit;
+                }
+            }
+
+
+/* + + +  first level  + + + */
+            > li {
+                list-style-type: none;
+                border-bottom: solid 1px @color-border;
+                margin: 0;
+                padding: 0 0 .3rem 0;
+
+                > .li { //background-color: pink;// hier activ !!!
+                    position: relative;
+                    padding: .5rem 0 .5rem (@icon-size + 1);
+
+                    &::before {                        background-color: gold;// test
+                        content: '?';
+                        position: absolute;
+                        top: 0;
+                        left: 0;
+                        display: flex;
+                        display: -webkit-flex;
+                        flex-direction: column;
+                        -webkit-flex-direction: column;
+                        justify-content: center;
+                        -webkit-justify-content: center;
+                        height: 100%;
+                        width: @icon-size;
+                        overflow: hidden;
+                        text-align: center;
+                        margin-top: auto;
+                        margin-bottom: auto;
+                    }
+
+                    &::after {
+                        content: '';
+                        position: absolute;
+                        top: 15%;
+                        bottom: 15%;
+                        width: 1px;
+                        left: (@icon-size + .5);
+                        background-color: @color-border;
+                        transition: @transition background-color;
+                    }
+                }
+            }
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* min-width: 1440px */
+
+@media @screen_min-xlg {
+    #dokuwiki__aside.main-sidebar {
+        .nav-main {
+            .li {
+                font-size: .88rem;
+                padding: .1rem 0;
+
+                > * {
+                    font-size: .88rem;
+                }
+            }
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* max-width: 1199px */
+
+@media @screen_max-xlg {
+    #dokuwiki__aside.main-sidebar {
+        .nav-main {
+            .li {
+                font-size: 1rem;
+                padding: .15rem .25rem;
+
+                > * {
+                    font-size: 1rem;
+                }
+            }
+        }
+    }
+}
diff --git a/css/area_sidetools.less b/css/area_sidetools.less
new file mode 100644
index 0000000..657c333
--- /dev/null
+++ b/css/area_sidetools.less
@@ -0,0 +1,109 @@
+/**
+ * This file provides the design styles for the sitetools (nav).
+ *
+ * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
+ */
+
+
+#dokuwiki__sitetools.nav-sitetools {
+    @icon-size: 2rem;
+
+    h6 { //background-color: pink;// hier activ !!!
+        position: relative;
+        width: auto;
+        height: auto;
+        color: @color-nav;
+        font-size: .88rem;
+        font-weight: normal;
+        margin: 0;
+        padding: .5rem 0 .5rem (@icon-size + 1);
+
+        &::before {
+            background-color: gold;
+            content: '?';
+            position: absolute;
+            top: 0;
+            left: 0;
+            display: flex;
+            display: -webkit-flex;
+            flex-direction: column;
+            -webkit-flex-direction: column;
+            justify-content: center;
+            -webkit-justify-content: center;
+            height: 100%;
+            width: @icon-size;
+            overflow: hidden;
+            text-align: center;
+            margin-top: auto;
+            margin-bottom: auto;
+        }
+
+        &::after {
+            content: '';
+            position: absolute;
+            top: 15%;
+            bottom: 15%;
+            width: 1px;
+            left: (@icon-size + .5);
+            background-color: @color-border;
+            transition: @transition background-color;
+        }
+    }
+
+/* + + +  linklist  + + + */
+    ul {
+        padding-left: (@icon-size + .5);
+    }
+
+    li {
+        color: @color-nav;
+
+        a {
+            color: inherit;
+        }
+
+        &:first-of-type {
+            padding-top: .3rem;
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* min-width: 1440px */
+
+@media @screen_min-xlg {
+    #dokuwiki__sitetools.nav-sitetools {
+        li {
+            font-size: 100%;
+            padding-top: .1rem;
+            padding-bottom: .1rem;
+
+            > * {
+                font-size: .88rem;
+            }
+        }
+    }
+}
+
+
+/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
+/* max-width: 1199px */
+
+@media @screen_max-xlg {
+    #dokuwiki__sitetools.nav-sitetools {
+        h6 {
+            font-size: 1rem;
+        }
+
+        li {
+            font-size: 1rem;
+            padding-top: .15rem;
+            padding-bottom: .15rem;
+
+            > * {
+                font-size: 1rem;
+            }
+        }
+    }
+}
diff --git a/style.ini b/style.ini
index 1a54be5..64ea103 100755
--- a/style.ini
+++ b/style.ini
@@ -69,6 +69,8 @@ css/area_nav-breadcrumb.less          = all
 css/area_nav-usertools.less           = all
 css/area_sidebar-search.less          = all
 css/area_nav-pagetools.less           = all
+css/area_main-sidebar.less            = all
+css/area_sidetools.less               = all
 
 
 ; _____________  plugin styles _____________