diff --git a/app/components/architecture-viewer.js b/app/components/architecture-viewer.js
index 060be555e146119134109cc03e5897abd3450d61..6a50ce45e13997ce33499bb996949c22afb1f08a 100644
--- a/app/components/architecture-viewer.js
+++ b/app/components/architecture-viewer.js
@@ -9,7 +9,7 @@ export default Ember.Component.extend({
     themes: Object.keys(Themes),
     layoutAlgorithms: [
         'cose',
-        //'cose-bilkent', // broken - see https://github.com/cytoscape/cytoscape.js-cose-bilkent/issues/18
+        // 'cose-bilkent', // broken - see https://github.com/cytoscape/cytoscape.js-cose-bilkent/issues/18
         'cola',
         'grid',
         'concentric',
diff --git a/app/components/architecture-visualisation-cytoscape/style.js b/app/components/architecture-visualisation-cytoscape/style.js
index 0d8ddbac55090918f557e62e686ed0ad4eadb7db..5f674cc2ced7be3e730f6819d3c53d4882bd9e27 100644
--- a/app/components/architecture-visualisation-cytoscape/style.js
+++ b/app/components/architecture-visualisation-cytoscape/style.js
@@ -42,6 +42,7 @@ $node > node { /* compounds. "Nodes" in meta model. $ selects the parent node th
     color: ${theme.nodeTextColor};
     border-color: ${theme.nodeBorderColor};
     font-weight: bold;
+    z-index: 100;
 
 }
 
@@ -64,6 +65,7 @@ $node > node { /* compounds. "Nodes" in meta model. $ selects the parent node th
     line-color: ${theme.arrowColor};
     target-arrow-color: ${theme.arrowColor};
     text-background-color: ${theme.arrowLineColor};
+    text-outline-color:${theme.arrowLineColor};
     text-background-opacity: 1;
     text-background-shape: roundrectangle;
     font-size: 12pt;
@@ -76,6 +78,7 @@ $node > node { /* compounds. "Nodes" in meta model. $ selects the parent node th
     border-color: ${theme.nodeGroupBorderColor};
     border-width: 2px;
     font-weight: bold;
+    z-index: 100;
 }
 
 edge {
@@ -83,7 +86,11 @@ edge {
     color: ${theme.arrowLabelColor};
     font-weight: bold;
     target-arrow-shape: triangle-backcurve;
-    curve-style: bezier; /* supports arrows */
+    curve-style: bezier;/* supports arrow heads*/
+    edge-distances: node-position;
+    z-index: 0;
+
+
     width: data(workload);
 
 }
diff --git a/app/components/entity-details.js b/app/components/entity-details.js
index bd26aa6bbfa3ca677fd826a0fdcb3a4a73d4a953..d62d94fbb2b9e2a6d2b961286d38f35f526ad6e7 100644
--- a/app/components/entity-details.js
+++ b/app/components/entity-details.js
@@ -1,5 +1,20 @@
 import Ember from 'ember';
 
 export default Ember.Component.extend({
-    entity: null
+    entity: null,
+
+    filteredProperties: function(){
+        this.debug('entity', this.get('entity'));
+        const properties = [];
+        const entity = this.get('entity');
+        this.get('entity').eachAttribute(
+            (property) => {
+                if(!(property.indexOf('Id') >= 0)){
+                    properties.push({key: property, value: entity.get(property)});
+                }
+                });
+        this.debug('properties', properties);
+        return properties;
+    }.property('entity')
+
 });
diff --git a/app/templates/architectures/single/details.hbs b/app/templates/architectures/single/details.hbs
index f4b648a85bdddd471fd7e449de5d4f548ac23f0a..d82cf8bbe866b587fe42b3e24fe46786399fb3b4 100644
--- a/app/templates/architectures/single/details.hbs
+++ b/app/templates/architectures/single/details.hbs
@@ -1,2 +1 @@
-Hello Subroute!
-{{entity-details entity=model}}
\ No newline at end of file
+{{entity-details entity=model}}
diff --git a/app/templates/components/entity-details.hbs b/app/templates/components/entity-details.hbs
index 541c63a0d49277e8f3861e17c5c3ed1736393a38..cd49255ba4d2e40c7450944afdd6bef50b6d01d1 100644
--- a/app/templates/components/entity-details.hbs
+++ b/app/templates/components/entity-details.hbs
@@ -1,6 +1,21 @@
-id: {{entity.id}}
-name: {{entity.name}}
-type: {{entity.type}}
-systemId: {{entity.systemId}}
 
-{{log 'entity-details' entity}}
+<table class="table table-hover table-striped">
+  <thead>
+    <tr>
+      <th>Property</th>
+      <th>Value</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+        <td>id</td>
+        <td>{{entity.id}}</td>
+    </tr>
+    {{#each filteredProperties as |property|}}
+    <tr>
+      <td>{{property.key}}</td>
+      <td>{{property.value}}</td>
+    </tr>
+    {{/each}}
+  </tbody>
+</table>