diff --git a/public/heatmap.js b/public/heatmap.js
index a1d2a7f..ca1bb54 100644
--- a/public/heatmap.js
+++ b/public/heatmap.js
@@ -1,13 +1,14 @@
 require('plugins/heatmap/heatmap.less');
-require('plugins/heatmap/heatmap_tooltip.css');
+require('plugins/heatmap/heatmap_tooltip.less');
 require('plugins/heatmap/color_directive.js');
 require('plugins/heatmap/lib/heatmap_controller.js');
 require('plugins/heatmap/lib/heatmap_directive.js');
 require('plugins/heatmap/heatmap_tooltip_directive.js');
 
+
 function HeatmapProvider(Private) {
-  var TemplateVisType = Private(require('ui/template_vis_type/template_vis_type'));
-  var Schemas = Private(require('ui/vis/schemas'));
+  var TemplateVisType = Private(require('ui/template_vis_type/TemplateVisType'));
+  var Schemas = Private(require('ui/Vis/Schemas'));
   var colors = require('plugins/heatmap/colors.js');
 
   return new TemplateVisType({
diff --git a/public/heatmap_tooltip.css b/public/heatmap_tooltip.less
similarity index 51%
rename from public/heatmap_tooltip.css
rename to public/heatmap_tooltip.less
index 81163d8..29a9c23 100644
--- a/public/heatmap_tooltip.css
+++ b/public/heatmap_tooltip.less
@@ -1,15 +1,19 @@
+@import (reference) "~ui/styles/variables";
+
 .heatmap-tooltip {
   position: absolute;
   width: auto;
-  background-color: #222222;
-  -webkit-border-radius: 10px;
-  -moz-border-radius: 10px;
-  border-radius: 10px;
+  padding: 5px !important;
+  background: fadeout(@gray-darker, 7%);
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
   -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
-  -mox-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
+  -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
   box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
   pointer-events: none;
-  white-space: nowrap;
+  white-space: nowrap;  
+  color: #ecf0f1 !important;   
 }
 
 .heatmap-tooltip-list {
@@ -21,4 +25,4 @@
 }
 .heatmap-tooltip-list span.key{
   font-weight: bold;
-}
+}
\ No newline at end of file