diff --git a/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js b/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js
index 528733a62..660bd152a 100644
--- a/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js
+++ b/Projects/Superalgos/UI/Spaces/Docs-Space/DocsSpace.js
@@ -561,7 +561,7 @@ function newSuperalgosDocSpace() {
                 }
                 addMenuItemsImages()
                 addChildrenNodesPropertiesImages()
-                addAttachingRulesImages()
+                addAttachingAndReferencingRulesImages()
 
                 function addDefinitionImage(project) {
                     let imageElement
@@ -639,8 +639,8 @@ function newSuperalgosDocSpace() {
                     }
                 }
 
-                function addAttachingRulesImages() {
-                    if (nodeAppDefinition === undefined || (nodeAppDefinition.attachingRules === undefined && nodeAppDefinition.referencingRules === undefined)) { return }
+                function addAttachingAndReferencingRulesImages() {
+                    if (nodeAppDefinition === undefined) { return }
 
                     if (nodeAppDefinition.attachingRules !== undefined) {
                         if (nodeAppDefinition.attachingRules.compatibleTypes !== undefined) {
@@ -652,6 +652,16 @@ function newSuperalgosDocSpace() {
                             imageForTheseNodes(splittedTypes, 'attaching-rules-incompatible-types')
                         }
                     }
+                    if (nodeAppDefinition.referencingRules !== undefined) {
+                        if (nodeAppDefinition.referencingRules.compatibleTypes !== undefined) {
+                            let splittedTypes = nodeAppDefinition.referencingRules.compatibleTypes.split('->')
+                            imageForTheseNodes(splittedTypes, 'referencing-rules-compatible-types')
+                        }
+                        if (nodeAppDefinition.referencingRules.incompatibleTypes !== undefined) {
+                            let splittedTypes = nodeAppDefinition.referencingRules.incompatibleTypes.split('->')
+                            imageForTheseNodes(splittedTypes, 'referencing-rules-incompatible-types')
+                        }
+                    }
 
                     function imageForTheseNodes(nodeList, additionToKey) {
                         for (let i = 0; i < nodeList.length; i++) {
@@ -686,7 +696,8 @@ function newSuperalgosDocSpace() {
             function autoGeneratedHtml() {
                 generateMenuItems()
                 generateChildrenNodesProperties()
-                generateAttachRules()
+                generateAttachingRules()
+                generateReferencingRules()
 
                 function generateMenuItems() {
                     /* 
@@ -757,7 +768,7 @@ function newSuperalgosDocSpace() {
                     paragraphIndex++
                     paragraph = {
                         style: "Text",
-                        text: "Each type of node might have children. If they do, a reference to the children will be present at run-time at one or more properties of the node object. There is no generic childrenNodes property with an array of children nodes. Instead what we can find is that each node definition defines which properties will hold those children references. The property names that will be used for that are the ones listed here. The " + nodeAppDefinition.type + " node has the following children nodes properties:"
+                        text: "Each type of node might have children. If they do, a reference to the children will be present at runtime at one or more properties of the node object. There is no generic childrenNodes property with an array of children nodes. Instead what we can find is that each node definition defines which properties will hold those children references. The property names that will be used for that are the ones listed here. The " + nodeAppDefinition.type + " node has the following children nodes properties:"
                     }
                     renderParagraph(paragraph, key)
                     paragraphIndex++
@@ -789,7 +800,7 @@ function newSuperalgosDocSpace() {
                     }
                 }
 
-                function generateAttachRules() {
+                function generateAttachingRules() {
                     /* 
                     Attaching Rules
                     */
@@ -805,7 +816,7 @@ function newSuperalgosDocSpace() {
                     paragraphIndex++
                     paragraph = {
                         style: "Text",
-                        text: "Each type of node, might have a set of rules that defines to which nodes it can be attached to. Usually the nodes it can attach to have listed at their own definitions " + nodeAppDefinition.type + " as one of its potential children. That does not mean that " + nodeAppDefinition.type + " can be created at those parents; only if there is a menu item for adding it, then it will be possible, otherwise it might be created at some other node and later attached to one of the nodes defined in these rules. The following are the rules that govern the attacment of  " + nodeAppDefinition.type + " with other nodes:"
+                        text: "Each type of node, might have a set of rules that defines to which nodes it can be attached to. Usually the nodes it can attach to have listed at their own definitions " + nodeAppDefinition.type + " as one of its potential children. That does not mean that " + nodeAppDefinition.type + " can be created at those parents; only if there is a menu item for adding it, then it will be possible, otherwise it might be created at some other node and later attached to one of the nodes defined in these rules. At runtime, the node that a node is attached to, we call it Parent Node. The following are the rules that govern the attacment of  " + nodeAppDefinition.type + " with other nodes:"
                     }
                     renderParagraph(paragraph, key)
                     paragraphIndex++
@@ -843,6 +854,61 @@ function newSuperalgosDocSpace() {
                         }
                     }
                 }
+
+                function generateReferencingRules() {
+                    /* 
+                    Referencing Rules
+                    */
+                    let paragraph
+                    let key = 'auto-generated-paragraph-' + paragraphIndex
+                    if (nodeAppDefinition === undefined || (nodeAppDefinition.referencingRules === undefined && nodeAppDefinition.referencingRules === undefined)) { return }
+
+                    paragraph = {
+                        style: "Title",
+                        text: "" + nodeAppDefinition.type + " Referencing Rules"
+                    }
+                    renderParagraph(paragraph, key)
+                    paragraphIndex++
+                    paragraph = {
+                        style: "Text",
+                        text: "Each type of node, might have a set of rules that defines to which node it can stablish a reference to. At runtime once a reference is stablished, we call the referenced node the Reference Parent. The following are the rules that govern the referencing of  " + nodeAppDefinition.type + " with other nodes:"
+                    }
+                    renderParagraph(paragraph, key)
+                    paragraphIndex++
+
+                    if (nodeAppDefinition.referencingRules !== undefined) {
+                        if (nodeAppDefinition.referencingRules.compatibleTypes !== undefined) {
+                            paragraph = {
+                                style: "Subtitle",
+                                text: "Compatible Types:"
+                            }
+                            renderParagraph(paragraph, key)
+                            paragraphIndex++
+
+                            let splittedTypes = nodeAppDefinition.referencingRules.compatibleTypes.split('->')
+                            listAllTheseNodes(splittedTypes, 'referencing-rules-compatible-types')
+                        }
+                        if (nodeAppDefinition.referencingRules.incompatibleTypes !== undefined) {
+                            paragraph = {
+                                style: "Subtitle",
+                                text: "Incompatible Types:"
+                            }
+                            renderParagraph(paragraph, key)
+                            paragraphIndex++
+
+                            let splittedTypes = nodeAppDefinition.referencingRules.incompatibleTypes.split('->')
+                            listAllTheseNodes(splittedTypes, 'referencing-rules-incompatible-types')
+                        }
+                    }
+
+                    function listAllTheseNodes(nodeList, additionToKey) {
+                        for (let i = 0; i < nodeList.length; i++) {
+                            let listItem = nodeList[i]
+                            if (listItem === "") { continue }
+                            HTML = HTML + '<button id="docs-' + additionToKey + '-' + i + '" type="button" class="docs-non-collapsible-element"><img>' + addToolTips(listItem) + '</button>'
+                        }
+                    }
+                }
             }
 
             function renderParagraph(paragraph, key) {