--- a/src/widgets/Tooltip.css	Fri Nov 30 10:49:26 2012 +0100
+++ b/src/widgets/Tooltip.css	Wed Dec 19 19:02:52 2012 +0100
@@ -1,31 +1,119 @@
-/* ToolTip Widget */
+.Ldt-Tooltip {
+    position: absolute;
+    height: 0; width: 0;
+    z-index: 100000;
+}
+
+.Ldt-Tooltip-Main {
+    position: absolute; bottom: 0; left: -96px;
+}
+
+.Ldt-Tooltip-Corner-NW,
+.Ldt-Tooltip-Corner-NE,
+.Ldt-Tooltip-Corner-SW,
+.Ldt-Tooltip-Corner-SE {
+    position: absolute; width: 6px; height: 6px; background: url(img/tooltip-corners.png);
+}
+
+.Ldt-Tooltip-Corner-NW,
+.Ldt-Tooltip-Corner-SW {
+    left: 0;
+}
+
+.Ldt-Tooltip-Corner-NE,
+.Ldt-Tooltip-Corner-SE {
+    right: 0;
+}
+
+.Ldt-Tooltip-Corner-NW,
+.Ldt-Tooltip-Corner-NE {
+    top: 0;
+}
+
+.Ldt-Tooltip-Corner-SW,
+.Ldt-Tooltip-Corner-SE {
+    bottom: 10px;
+}
+
+.Ldt-Tooltip-Corner-NW {
+    background-position: top left;
+}
+
+.Ldt-Tooltip-Corner-NE {
+    background-position: top right;
+}
 
-.Ldt-Tooltip {
-  position: absolute;
-  z-index: 10000000000;
-  background: transparent url("img/white_arrow_long.png");
-  font-size: 12px;
-  padding: 15px 15px 20px;
-  color: black;
-  font-family: Arial, Helvetica, sans-serif;
-  overflow:hidden;
+.Ldt-Tooltip-Corner-SW {
+    background-position: bottom left;
+}
+
+.Ldt-Tooltip-Corner-SE {
+    background-position: bottom right;
+}
+
+.Ldt-Tooltip-Border-Top,
+.Ldt-Tooltip-Border-SW,
+.Ldt-Tooltip-Border-SE {
+    position: absolute; height: 6px; background: url(img/tooltip-h-borders.png);
+}
+
+.Ldt-Tooltip-Border-Top {
+    left: 6px; right: 6px;
+}
+
+.Ldt-Tooltip-Border-SW,
+.Ldt-Tooltip-Border-SE {
+    bottom: 10px; background-position: bottom;
+}
+
+.Ldt-Tooltip-Border-SW {
+    left: 6px;
+}
+
+.Ldt-Tooltip-Border-SE {
+    right: 6px;
+}
+
+.Ldt-Tooltip-Tip {
+    position: absolute; height: 16px; width: 22px;
+    background: url(img/tooltip-tip.png);
+    bottom: 0;
+}
+
+.Ldt-Tooltip-Border-Left,
+.Ldt-Tooltip-Border-Right {
+    position: absolute; width: 6px; background: url(img/tooltip-v-borders.png);
+    top: 6px; bottom: 16px;
+}
+
+.Ldt-Tooltip-Border-Left {
+    left: 0; background-position: left;
+}
+
+.Ldt-Tooltip-Border-Right {
+    right: 0; background-position: right;
 }
 
 .Ldt-Tooltip-Inner {
-    height: 115px;
+    min-height: 30px;
+    max-height: 140px;
     width: 180px;
     overflow: hidden;
+    margin: 6px 6px 16px;
+    background: url(img/tooltip-gradient.png) bottom;
 }
 
+
 .Ldt-Tooltip-Color {
-    float: left; margin: 2px 4px 2px 0; width: 10px; height: 10px;
+    float: left; margin: 8px 2px 2px 8px; width: 10px; height: 10px;
 }
 
 .Ldt-Tooltip img {
-    max-width: 140px; max-height: 70px; margin: 0 20px;
+    max-width: 140px; max-height: 80px; margin: 2px 20px;
 }
 
 .Ldt-Tooltip p {
-    margin: 2px 0;
-  font-size: 12px;
-}
+    margin: 6px 8px;
+    font-size: 12px;
+    line-height: 14px;
+}
\ No newline at end of file