diff --git a/views/ngXosViews/diagnostic/src/css/serviceTopology.css b/views/ngXosViews/diagnostic/src/css/serviceTopology.css
index 8c2bd42..8b615ec 100644
--- a/views/ngXosViews/diagnostic/src/css/serviceTopology.css
+++ b/views/ngXosViews/diagnostic/src/css/serviceTopology.css
@@ -42,6 +42,34 @@
     stroke-width: 1px;
 }
 
+logic-topology > svg {
+    position: absolute;
+    top: 0;
+}
+
+/* STATS */
+
+logic-topology > .instances-stats {
+    position: absolute;
+    top: 0;
+    z-index: 2;
+    width: 100%;
+}
+
+logic-topology > .instances-stats ul.list-group {
+    font-size: 10px !important;
+}
+
+logic-topology > .instances-stats ul.list-group li{
+    padding: 3px 15px;
+}
+
+logic-topology > .instances-stats ul.list-group .badge {
+    font-size: 8px;
+}
+
+/* CLOUDS */
+
 logic-topology .network .cloud {
     fill: #fff;
     stroke: green;
@@ -195,30 +223,14 @@
     }
 }
 
-@keyframes bounceInLeft {
-    from, 60%, 75%, 90%, to {
-        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-    }
+@keyframes bounceOutRight {
+  20% {
+    opacity: 1;
+    transform: translate3d(-20px, 0, 0);
+  }
 
-    0% {
-        opacity: 0;
-        transform: translate3d(-3000px, 0, 0);
-    }
-
-    60% {
-        opacity: 1;
-        transform: translate3d(25px, 0, 0);
-    }
-
-    75% {
-        transform: translate3d(-10px, 0, 0);
-    }
-
-    90% {
-        transform: translate3d(5px, 0, 0);
-    }
-
-    to {
-        transform: none;
-    }
+  to {
+    opacity: 0;
+    transform: translate3d(2000px, 0, 0);
+  }
 }
\ No newline at end of file
diff --git a/views/ngXosViews/diagnostic/src/js/logicTopology.js b/views/ngXosViews/diagnostic/src/js/logicTopology.js
index 9181e56..da2fef6 100644
--- a/views/ngXosViews/diagnostic/src/js/logicTopology.js
+++ b/views/ngXosViews/diagnostic/src/js/logicTopology.js
@@ -10,12 +10,13 @@
       },
       bindToController: true,
       controllerAs: 'vm',
-      template: '',
-      controller: function($element, $log, $scope, $rootScope, d3, LogicTopologyHelper, Node, Tenant, Ceilometer){
+      templateUrl: 'templates/logicTopology.tpl.html',
+      controller: function($element, $log, $scope, $rootScope, $timeout, d3, LogicTopologyHelper, Node, Tenant, Ceilometer){
         $log.info('Logic Plane');
 
         var svg;
-
+        this.selectedInstances = [];
+        this.hideInstanceStats = true;
 
         const handleSvg = (el) => {
 
@@ -45,9 +46,16 @@
           }
         });
 
-        $rootScope.$on('instance.detail', (evt, service) => {
+        $rootScope.$on('instance.detail.hide', () => {
+          this.hideInstanceStats = true;
+          $timeout(() => {
+            this.selectedInstances = [];
+            LogicTopologyHelper.getInstanceStatus([]);
+            LogicTopologyHelper.updateTree(svg);
+          }, 500);
+        });
 
-          $log.info(`Highlight instance`, service)
+        $rootScope.$on('instance.detail', (evt, service) => {
 
           let param = {
             'service_vsg': {kind: 'vCPE'},
@@ -57,14 +65,24 @@
 
           Tenant.queryVsgInstances(param[service.name]).$promise
           .then((instances) => {
-            console.log(instances);
-            LogicTopologyHelper.getInstanceStatus(instances);
-            LogicTopologyHelper.updateTree(svg);
 
             return Ceilometer.getInstancesStats(instances);
           })
-          .then((stats) => {
-            console.log('stats', stats);
+          .then((instances) => {
+            this.hideInstanceStats = false;
+            // HACK if array is empty wait for animation
+            if(instances.length === 0){
+              this.hideInstanceStats = true;
+              $timeout(() => {
+                this.selectedInstances = instances;
+              }, 500);
+            }
+            else{
+              this.selectedInstances = instances;
+            }
+            
+            LogicTopologyHelper.getInstanceStatus(instances);
+            LogicTopologyHelper.updateTree(svg);
           })
           .catch((e) => {
             throw new Error(e);
diff --git a/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js b/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js
index f9c0850..3be26c5 100644
--- a/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js
+++ b/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js
@@ -223,13 +223,13 @@
         });
       });
 
-      lodash.forEach(instances, (id) => {
+      lodash.forEach(instances, (instance) => {
         computeNodes.map((node) => {
-          node.instances.map((instance) => {
-            if(instance.id === id){
-              instance.selected = true;
+          node.instances.map((d3instance) => {
+            if(d3instance.id === instance.id){
+              d3instance.selected = true;
             }
-            return instance;
+            return d3instance;
           });
         });
       });
diff --git a/views/ngXosViews/diagnostic/src/js/nodeDrawer.js b/views/ngXosViews/diagnostic/src/js/nodeDrawer.js
index 128848d..62e2cdf 100644
--- a/views/ngXosViews/diagnostic/src/js/nodeDrawer.js
+++ b/views/ngXosViews/diagnostic/src/js/nodeDrawer.js
@@ -155,6 +155,8 @@
 
     this.drawInstances = (container, instances) => {
       
+      // TODO check for stats field in instance and draw popup
+
       let {width, height} = container.node().getBoundingClientRect();
 
       let elements = container.selectAll('.instances')
diff --git a/views/ngXosViews/diagnostic/src/js/rest_services.js b/views/ngXosViews/diagnostic/src/js/rest_services.js
index 733a690..885b3de 100644
--- a/views/ngXosViews/diagnostic/src/js/rest_services.js
+++ b/views/ngXosViews/diagnostic/src/js/rest_services.js
@@ -39,7 +39,7 @@
     this.getInstanceStats = (instanceUuid) => {
       let deferred = $q.defer();
 
-      $http.get('/xoslib/meterstatistics', {resource: instanceUuid})
+      $http.get('/xoslib/meterstatistics', {params:{resource: instanceUuid}})
       .then((res) => {
         deferred.resolve(res.data);
       })
diff --git a/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js b/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js
index 2b92ba5..817e79e 100644
--- a/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js
+++ b/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js
@@ -219,6 +219,13 @@
 
     const serviceClick = function(d) {
 
+      // if was selected
+      if(d.selected){
+        d.selected = !d.selected;
+        $rootScope.$emit('instance.detail.hide', {});
+        return updateTree(_svg, _layout, _source);
+      }
+
       $rootScope.$emit('instance.detail', {name: d.humanReadableName});
 
       // unselect all
@@ -226,15 +233,9 @@
       .each(d => d.selected = false);
 
       // toggling selected status
+      console.log(d.selected);
       d.selected = !d.selected;
 
-      var selectedNode = d3.select(this);
-
-      selectedNode
-        .transition()
-        .duration(serviceTopologyConfig.duration)
-        .attr('r', serviceTopologyConfig.circle.selectedRadius);
-
       updateTree(_svg, _layout, _source);
     };
 
diff --git a/views/ngXosViews/diagnostic/src/templates/logicTopology.tpl.html b/views/ngXosViews/diagnostic/src/templates/logicTopology.tpl.html
new file mode 100644
index 0000000..9bd0551
--- /dev/null
+++ b/views/ngXosViews/diagnostic/src/templates/logicTopology.tpl.html
@@ -0,0 +1,22 @@
+<div class="instances-stats animate" ng-hide="vm.hideInstanceStats">
+  <div class="row">
+    <div class="col-sm-3 col-sm-offset-8">
+      <div class="panel panel-primary" ng-repeat="instance in vm.selectedInstances">
+        <div class="panel-heading">
+          {{instance.humanReadableName}}
+        </div>
+          <ul class="list-group">
+            <li class="list-group-item">Backend Status: {{instance.backend_status}}</li>
+            <li class="list-group-item">IP Address: {{instance.ip}}</li>
+          </ul>
+          <ul class="list-group">
+            <li class="list-group-item" ng-repeat="stat in instance.stats">
+              <span class="badge">{{stat.value}}</span>
+              {{stat.meter}}
+            </li>
+          </ul>
+        </div>
+      </div>  
+    </div>
+  </div>
+</div>
\ No newline at end of file