diff --git a/Client/WebServer/css/docs.css b/Client/WebServer/css/docs.css
index 0c5bd066d..b3de80043 100644
--- a/Client/WebServer/css/docs.css
+++ b/Client/WebServer/css/docs.css
@@ -17,6 +17,18 @@
     line-height: 150%;
   }
 
+  .docs-titleTable {
+    vertical-align: middle;
+    width: 100%;
+    min-width: 95px;
+    margin: auto;
+    margin-bottom: 5px;
+    margin-top: 5px;
+    margin-right: 20px;
+    border: 0px solid #dedede;
+    padding: 5px;
+  }
+  
   .docs-definitionTable {
     background-color: #f9f9f9;
     vertical-align: middle;
@@ -93,7 +105,7 @@
 
   .docs-h1 {font-size:210%; margin-top: 40px; padding-bottom: 5px;}
 
-  .docs-h2 {font-weight:700; font-size:170%; margin-top: 60px; padding-bottom: 5px; overflow:hidden;}
+  .docs-h2 {font-weight:700; font-size:170%; margin-top: 30px; padding-bottom: 5px; overflow:hidden;}
 
   .docs-h2::after{
   content:'';
diff --git a/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js b/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js
index c87286ca7..d880c8bbe 100644
--- a/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js
+++ b/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js
@@ -423,7 +423,7 @@ function newSuperalgosDocSpace() {
             HTML = HTML + '<div id="context-menu-clickable-div" class="docs-node-html-page-container">' // Container Starts
 
             /* Title */
-            HTML = HTML + '<div><h2 class="docs-h2" id="' + renderingNode.type.toLowerCase().replace(' ', '-') + '" > ' + renderingNode.project + ' / ' + renderingNode.type + '</h2></div>'
+            HTML = HTML + '<div><table class="docs-titleTable"><tr><td width="50px"><div id="projectImageDiv" class="docs-image-container"/></td><td><h2 class="docs-h2" id="' + renderingNode.type.toLowerCase().replace(' ', '-') + '" > ' + renderingNode.project + ' / ' + renderingNode.type + '</h2></td></tr></table></div>'
 
             /* We start with the Definition Table */
             if (nodeDocsDefinition.definition !== undefined) {
@@ -531,6 +531,8 @@ function newSuperalgosDocSpace() {
             let docsAppDiv = document.getElementById('docsDiv')
             docsAppDiv.innerHTML = HTML + addFooter()
 
+            addProjectImage(project)
+
             if (nodeDocsDefinition.definition !== undefined) {
                 addDefinitionImage(nodeAppDefinition, renderingNode.project)
             }
@@ -566,7 +568,7 @@ function newSuperalgosDocSpace() {
 
     function addDefinitionImage(nodeAppDefinition, project) {
         if (nodeAppDefinition.icon === undefined) {
-            imageName = nodeAppDefinition.type.toLowerCase().replace(' ', '-')
+            imageName = nodeAppDefinition.type.toLowerCase().replace(' ', '-').replace(' ', '-').replace(' ', '-').replace(' ', '-').replace(' ', '-')
         }
         let htmlImage = document.createElement("IMG")
         let webParam = 'Icons/' + project + '/' + imageName + '.png'
@@ -579,6 +581,20 @@ function newSuperalgosDocSpace() {
         definitionImageDiv.appendChild(htmlImage)
     }
 
+    function addProjectImage(project) {
+        imageName = project.toLowerCase().replace(' ', '-').replace(' ', '-').replace(' ', '-').replace(' ', '-').replace(' ', '-')
+
+        let htmlImage = document.createElement("IMG")
+        let webParam = 'Icons/' + project + '/' + imageName + '.png'
+
+        htmlImage.src = webParam
+        htmlImage.width = "50"
+        htmlImage.height = "50"
+
+        let projectImageDiv = document.getElementById('projectImageDiv')
+        projectImageDiv.appendChild(htmlImage)
+    }
+
     function addToolTips(node, text) {
 
         const TOOL_TIP_HTML = '<div class="docs-tooltip">NODE_TYPE<span class="docs-tooltiptext">NODE_DEFINITION</span></div>'