diff --git a/css/style.css b/css/style.css
index 731a225..4be1b4b 100644
--- a/css/style.css
+++ b/css/style.css
@@ -18,30 +18,37 @@
 
 .split-panes.horizontal > .split-handler
 {
-  width: 4px;
+  width: 15px;
   top: 0px; 
-  left: 50%;
+  //left: 50%;
   bottom: 0px;
   cursor: ew-resize;
+
+    background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAMCAYAAABIvGxUAAADHmlDQ1BJQ0MgUHJvZmlsZQAAeAGFVN9r01AU/tplnbDhizpnEQk+aJFuZFN0Q5y2a1e6zVrqNrchSJumbVyaxiTtfrAH2YtvOsV38Qc++QcM2YNve5INxhRh+KyIIkz2IrOemzRNJ1MDufe73/nuOSfn5F6g+XFa0xQvDxRVU0/FwvzE5BTf8gFeHEMr/GhNi4YWSiZHQA/Tsnnvs/MOHsZsdO5v36v+Y9WalQwR8BwgvpQ1xCLhWaBpXNR0E+DWie+dMTXCzUxzWKcECR9nOG9jgeGMjSOWZjQ1QJoJwgfFQjpLuEA4mGng8w3YzoEU5CcmqZIuizyrRVIv5WRFsgz28B9zg/JfsKiU6Zut5xCNbZoZTtF8it4fOX1wjOYA1cE/Xxi9QbidcFg246M1fkLNJK4RJr3n7nRpmO1lmpdZKRIlHCS8YlSuM2xp5gsDiZrm0+30UJKwnzS/NDNZ8+PtUJUE6zHF9fZLRvS6vdfbkZMH4zU+pynWf0D+vff1corleZLw67QejdX0W5I6Vtvb5M2mI8PEd1E/A0hCgo4cZCjgkUIMYZpjxKr4TBYZIkqk0ml0VHmyONY7KJOW7RxHeMlfDrheFvVbsrj24Pue3SXXjrwVhcW3o9hR7bWB6bqyE5obf3VhpaNu4Te55ZsbbasLCFH+iuWxSF5lyk+CUdd1NuaQU5f8dQvPMpTuJXYSWAy6rPBe+CpsCk+FF8KXv9TIzt6tEcuAcSw+q55TzcbsJdJM0utkuL+K9ULGGPmQMUNanb4kTZyKOfLaUAsnBneC6+biXC/XB567zF3h+rkIrS5yI47CF/VFfCHwvjO+Pl+3b4hhp9u+02TrozFa67vTkbqisXqUj9sn9j2OqhMZsrG+sX5WCCu0omNqSrN0TwADJW1Ol/MFk+8RhAt8iK4tiY+rYleQTysKb5kMXpcMSa9I2S6wO4/tA7ZT1l3maV9zOfMqcOkb/cPrLjdVBl4ZwNFzLhegM3XkCbB8XizrFdsfPJ63gJE722OtPW1huos+VqvbdC5bHgG7D6vVn8+q1d3n5H8LeKP8BqkjCtbCoV8yAAAACXBIWXMAAAsSAAALEgHS3X78AAABZ2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNC40LjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wOkNyZWF0b3JUb29sPkFkb2JlIEZpcmV3b3JrcyBDUzY8L3htcDpDcmVhdG9yVG9vbD4KICAgICAgPC9yZGY6RGVzY3JpcHRpb24+CiAgIDwvcmRmOlJERj4KPC94OnhtcG1ldGE+CsO3s+UAAAAsSURBVAgdY7x69ep/BgaGRpZNmzYBaQYGxv//QQIMDExgEpnBcu3aNQoUAwChKRhfrNwRnQAAAABJRU5ErkJggg==");
+    background-position: 50% 55%;
+    background-repeat: no-repeat;
+    cursor: col-resize;
 }
 
 .split-panes.horizontal > .split-pane1,
 .split-panes.horizontal > .split-pane2
 {
   position: absolute;
-  height: 100%;
+  /*height: 100%;*/  
 }
 
 .split-panes.horizontal > .split-pane1
 {
-  width: 50%; 
+  //width: 50%; 
 }
 
 .split-panes.horizontal > .split-pane2
 {
-  left: 50%;
+  //left: 50%;
   right: 0px;
-  border-left: 1px solid #aaa;
+  top: 12px;
+  margin-left: 6px;
+  //border-left: 1px solid #aaa;
 }
 
 
@@ -73,4 +80,4 @@
   top: 50%;
   bottom: 0px;
   border-top: 1px solid #aaa;
-}
\ No newline at end of file
+}
diff --git a/js/splitter.js b/js/splitter.js
index 8d30154..19560e8 100644
--- a/js/splitter.js
+++ b/js/splitter.js
@@ -59,6 +59,8 @@ angular.module('bgDirectives', [])
             pane1.elem.css('width', pos + 'px');
             pane2.elem.css('left', pos + 'px');
           }
+          
+          scope.$emit('splitterResized');
         });
     
         handler.bind('mousedown', function (ev) { 
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..621e3e6
--- /dev/null
+++ b/package.json
@@ -0,0 +1,10 @@
+{
+  "name": "bg-splitter",
+  "version": "0.1.0",
+  "main": "js/splitter.js",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/swimlane/bg-splitter.git"
+  },
+  "license": "MIT"
+}