diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue
index f7c3109e1..18144d27e 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue
@@ -71,7 +71,7 @@ export default {
             }
             a[name^="section"] {
                position: absolute;
-               top: -4em;
+               top: -3.5em;  // ref. stickNav
             }
          }
          padding: 0.8em 0em;
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/StickyNav.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/StickyNav.vue
index af8af4bf8..fa462a456 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/StickyNav.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/StickyNav.vue
@@ -2,8 +2,8 @@
    <teleport to="#content_conainter .container.content .container">
       <div id="navmap">
          <nav>
-            <a href="#top">
-               <i class="fa fa-fw fa-square-o"></i>
+            <a class="top" href="#top">
+               <i class="fa fa-fw fa-square"></i>
                <span>{{ $t('nav.top') }}</span>
             </a>
             <item
@@ -12,10 +12,6 @@
                :item="item"
                :step="step">
             </item>
-            <!--a href="#bottom">
-               <i class="fa fa-fw fa-square-o"></i>
-               <span>{{ $t('nav.bottom') }}</span>
-            </a-->
          </nav>
       </div>
    </teleport>
@@ -66,22 +62,20 @@ export default {
          // when mounted ready
          this.container = document.querySelector("#content_conainter .container.content .container");
          this.stickyNav = document.querySelector('#navmap');
-         this.sumBanner = this.header.offsetHeight + this.bannerName.offsetHeight + this.bannerDetails.offsetHeight;
          
+         this.sumBanner = this.header.offsetHeight + this.bannerName.offsetHeight + this.bannerDetails.offsetHeight;
          this.anchorsMap();
          
+         // TODO resizeObserver not supports IE !
+         // Listen when elements change size, then recalculate height sum and anchorsMap
          const resizeObserver = new ResizeObserver(entries => {
             
-            // Listen to elements resize changes, then recalculate height sum and anchorsMap
-            // TODO only FF/Chrome!
-            
             this.sumBanner = this.header.offsetHeight + this.bannerName.offsetHeight + this.bannerDetails.offsetHeight;
             //console.log('calculate sum', this.sumBanner);
-            
             this.items = [];
             this.anchorsMap();
-            
          });
+         
          resizeObserver.observe(this.header);
          resizeObserver.observe(this.bannerName);
          resizeObserver.observe(this.bannerDetails);
@@ -101,15 +95,14 @@ export default {
                name: '#' + anchor.name
             })
          });
-         //console.log('items', this.items);
          
       },
       handleScroll(event) {
          
          let pos = this.findPosition(this.stickyNav);
-         //console.log(window.scrollY); 
-         //console.log('sum2', this.sumBanner);
          let top = this.sumBanner + this.top - window.scrollY;
+         //console.log(window.scrollY); 
+         
          if (top > this.limit) {
             //console.log('absolute', pos['y']);
             this.stickyNav.style.position = 'absolute';
@@ -141,7 +134,7 @@ export default {
       switchActive() {
          
          this.items.forEach((item, i) => {
-            let next = (this.items[i+1]) ? this.items[i+1].pos : '1000000';
+            let next = (this.items[i+1]) ? this.items[i+1].pos : '100000';
             item.active = 
                 (window.scrollY >= item.pos & window.scrollY < next) ? true : false;
          }, this);
@@ -170,6 +163,9 @@ div#navmap {
          box-sizing: border-box;
          margin-bottom: -3px;
          color: #71859669;
+         &.top {
+            color: #718596;
+         }
          span {
             display: none;
          }
@@ -184,7 +180,7 @@ div#navmap {
             color: #718596b5;
          }
          &.active {
-            color: #df6a27; //#e2793d
+            color: #e2793d;
          }
       }
    }