diff --git a/Client/WebServer/css/docs.css b/Client/WebServer/css/docs.css
index 97721d83d..3e415e7b8 100644
--- a/Client/WebServer/css/docs.css
+++ b/Client/WebServer/css/docs.css
@@ -325,16 +325,16 @@ box-sizing: border-box;
 }
 
 .docs-topic-index h2 {
-  font-size: 170%;
+  font-size: 130%;
   font-weight: 300;
-  margin: 20px -5px;
+  margin: 10px 0 35 -5;
   padding: 0px;
 }
 
 .docs-topic-index h3 {
   font-size: 150%;
   font-weight: 300;
-  margin: 20px 0;
+  margin: 25px 0;
   padding: 0px;
 }
 
@@ -428,7 +428,7 @@ width: 100%;
   display: table;
   width: 100%;
   vertical-align: middle;
-  margin: 60px 0 0 0;
+  margin: 80px 0 0 0;
   /* 
   border-top: 1px solid rgba(54, 85, 88, .3);
   margin: 60px 0 0 0;
diff --git a/Projects/Superalgos/UI/Spaces/Docs-Space/DocumentPage.js b/Projects/Superalgos/UI/Spaces/Docs-Space/DocumentPage.js
index f815fc56e..f8ca1a236 100644
--- a/Projects/Superalgos/UI/Spaces/Docs-Space/DocumentPage.js
+++ b/Projects/Superalgos/UI/Spaces/Docs-Space/DocumentPage.js
@@ -181,9 +181,9 @@ function newSuperalgosDocsDocumentPage() {
 
                 HTML = HTML = HTML + '<div class="docs-topic-index">' // Container for Topic Navigation including buttons, title and index
 
-                HTML = HTML + '<h3 class="docs-h3">' + thisObject.docsSchemaDocument.topic + ' Table of Contents</h3>'
+                HTML = HTML + '<h3 class="docs-h3">' + thisObject.docsSchemaDocument.topic + ' &mdash; TOC</h3>'
 
-                HTML = HTML + '<p style="margin-bottom: 15px;">You just read page <strong>' + thisObject.docsSchemaDocument.pageNumber + '</strong> in the series.</p>'
+                HTML = HTML + '<p style="margin-bottom: 15px;">You just read page <strong>' + thisObject.docsSchemaDocument.pageNumber + '</strong> in the topic.</p>'
 
                 generateTopicMultiPageIndex()
 
@@ -194,17 +194,18 @@ function newSuperalgosDocsDocumentPage() {
 
                 buildOrderedTutorialPageIndex(thisObject.docsSchemaDocument.tutorial)
 
-                HTML = HTML = HTML + '<div class="docs-topic-index">' // Container for Topic Navigation including buttons, title and index
-
-                /* Tutorial Title */
+                /* Tutorial Title 
                 titleLabel = thisObject.docsSchemaDocument.tutorial + ' Tutorial Navigation'
                 HTML = HTML + '<div id="docs-main-title-div" class="docs-title-table"><div class="docs-table-cell"><h2 class="docs-h2" id="' + UI.projects.superalgos.spaces.docsSpace.currentDocumentBeingRendered.type.toLowerCase().replace(' ', '-') + '" > ' + titleLabel + '</h2></div><div id="projectImageDiv" class="docs-image-container"/></div></div>'
-
+                */
+                
                 generateTutorialPreviousAndNextPageNavigation()
 
-                /* TOC*/
+                HTML = HTML = HTML + '<div class="docs-topic-index">' // Container for Tutorial Navigation including buttons, title and index
 
-                HTML = HTML + '<h3 class="docs-h3"> Table of Contents</h3>'
+                HTML = HTML + '<h3 class="docs-h3">' + thisObject.docsSchemaDocument.tutorial + ' &mdash; TOC</h3>'
+
+                HTML = HTML + '<p style="margin-bottom: 15px;">You just did step <strong>' + thisObject.docsSchemaDocument.pageNumber + '</strong> in the tutorial.</p>'
 
                 generateTutorialMultiPageIndex()
 
@@ -388,13 +389,13 @@ function newSuperalgosDocsDocumentPage() {
                         previousPage = orderedTutorialPageIndexArray[i - 1]
                         nextPage = orderedTutorialPageIndexArray[i + 1]
 
-                        HTML = HTML + '<div class="docs-tutorial-navigation"><div>'
+                        HTML = HTML + '<div class="docs-topic-navigation"><div>'
                         if (previousPage !== undefined) {
-                            HTML = HTML + '<span" onClick="UI.projects.superalgos.spaces.docsSpace.navigateTo(\'' + UI.projects.superalgos.spaces.docsSpace.currentDocumentBeingRendered.project + '\', \'' + 'Tutorial' + '\', \'' + previousPage.type.replace(/'/g, 'AMPERSAND') + '\')"><button>' + previousPage.type + '</button></span>'
+                            HTML = HTML + '<span" onClick="UI.projects.superalgos.spaces.docsSpace.navigateTo(\'' + UI.projects.superalgos.spaces.docsSpace.currentDocumentBeingRendered.project + '\', \'' + 'Tutorial' + '\', \'' + previousPage.type.replace(/'/g, 'AMPERSAND') + '\')"><button> &#8592; Previous </button></span><br/>'+ previousPage.type
                         }
-                        HTML = HTML + '</div><div> << Current Page: ' + thisObject.docsSchemaDocument.pageNumber + ' >> </div><div>'
+                        HTML = HTML + '</div><div>'
                         if (nextPage !== undefined) {
-                            HTML = HTML + '<span" onClick="UI.projects.superalgos.spaces.docsSpace.navigateTo(\'' + UI.projects.superalgos.spaces.docsSpace.currentDocumentBeingRendered.project + '\', \'' + 'Tutorial' + '\', \'' + nextPage.type.replace(/'/g, 'AMPERSAND') + '\')"><button>' + nextPage.type + '</button></span>'
+                            HTML = HTML + '<span" onClick="UI.projects.superalgos.spaces.docsSpace.navigateTo(\'' + UI.projects.superalgos.spaces.docsSpace.currentDocumentBeingRendered.project + '\', \'' + 'Tutorial' + '\', \'' + nextPage.type.replace(/'/g, 'AMPERSAND') + '\')"><button> Next &#8594;</button></span><br/>' + nextPage.type
                         }
                         HTML = HTML + '</div></div>'
                         return
@@ -419,7 +420,7 @@ function newSuperalgosDocsDocumentPage() {
                         text: "" + arrayItem.type + ""
                     }
                     autoGeneratedParagraphIndex++
-                    HTML = HTML + '<p>' + arrayItem.pageNumber + '. ' + '<a class="docs-link" onClick="UI.projects.superalgos.spaces.docsSpace.navigateTo(\'' + UI.projects.superalgos.spaces.docsSpace.currentDocumentBeingRendered.project + '\', \'' + 'Tutorial' + '\', \'' + arrayItem.type.replace(/'/g, 'AMPERSAND') + '\')">' + paragraph.text + '</a></p>'
+                    HTML = HTML + '<p>' + arrayItem.pageNumber + '. ' + '<a onClick="UI.projects.superalgos.spaces.docsSpace.navigateTo(\'' + UI.projects.superalgos.spaces.docsSpace.currentDocumentBeingRendered.project + '\', \'' + 'Tutorial' + '\', \'' + arrayItem.type.replace(/'/g, 'AMPERSAND') + '\')">' + paragraph.text + '</a></p>'
                 }
             }
 
@@ -570,6 +571,8 @@ function newSuperalgosDocsDocumentPage() {
                     let chapterName = splittedChapterText[3]
                     let introText = splittedChapterText[4]
 
+
+
                     if (project === undefined || category === undefined || chapterNumber === undefined || chapterName === undefined) {
                         return 'Chapter paragraph style Syntax Error. Some of the required parameters are undefined. Check the Docs Chapter Style Syntax. This error message will dissapear as soon as you fix the problem.'
                     }
@@ -577,7 +580,7 @@ function newSuperalgosDocsDocumentPage() {
                     if (SCHEMAS_BY_PROJECT.get(project) === undefined) {
                         return 'Chapter paragraph style Syntax Error. The Project <i>' + project + '</i> could not be found. Check the Docs Chapter Style Syntax. This error message will dissapear as soon as you fix the problem.'
                     }
-
+                    
                     if (category !== 'Topic' && category !== 'Tutorial') {
                         return 'Category must be either Topic or Tutorial. Found: <i>' + category + '</i>'
                     }
@@ -601,13 +604,18 @@ function newSuperalgosDocsDocumentPage() {
                         }
                     }
 
+                    HTML = HTML = HTML + '<div class="docs-topic-index">' // Container for Topic Index 
+
                     let key = 'auto-generated-paragraph-' + autoGeneratedParagraphIndex
                     paragraph = {
                         style: "Title",
                         text: 'Chapter ' + chapterNumber + ' - ' + chapterName
                     }
+
+                    HTML = HTML + '<h2>'
                     renderParagraph(paragraph, key)
                     autoGeneratedParagraphIndex++
+                    HTML = HTML + '</h2>'
 
                     if (introText !== undefined) {
                         let key = 'auto-generated-paragraph-' + autoGeneratedParagraphIndex
@@ -615,11 +623,13 @@ function newSuperalgosDocsDocumentPage() {
                             style: "Text",
                             text: introText
                         }
+                        HTML = HTML + '<p><strong>'
                         renderParagraph(paragraph, key)
                         autoGeneratedParagraphIndex++
+                        HTML = HTML + '</strong></p>'
                     }
 
-                    HTML = HTML = HTML + '<div class="docs-topic-index">' // Container for Topic Index
+                    HTML = HTML + '<h3>Table of Contents</h3>'
 
                     switch (category) {
                         case 'Topic': {
@@ -632,7 +642,7 @@ function newSuperalgosDocsDocumentPage() {
                         }
                     }
 
-                    HTML = HTML = HTML + '</div>' // Container for whole Topic Index
+                    HTML = HTML = HTML + '</div>'  // Container for Topic Index 
                 }
             }