diff --git a/README.md b/README.md
index 5ffc69f..313bec1 100644
--- a/README.md
+++ b/README.md
@@ -1,26 +1,170 @@
 # Zepto Range
 
-http://jcemer.com/zepto-range
+Input range slider to work with touch using Zepto
 
-Input range implementation to works with touch using Zepto
+http://stormtek.github.io/zepto-range/
+
+----------------------------------------------------------
+### File imports to add to header of html
+
+``` html
+<link rel="stylesheet" href="zepto-range.css"/>
+<script src="zepto.js"></script>
+<script src="zepto-range.js"></script>
+```
+
+**Tip:** For quicker load times use ```zepto.min.js``` rather than ```zepto.js``` as it is the minified version of the javascript for the main zepto library. Both files are included in this repository for your convenience. If you are building ```zepto.js``` and ```zepto.min.js``` from the source make sure to include the touch module if you are planning on supporting mobile / tablets.
+
+**Note:** If performance (loading time) is a big issue then feel free to place the ```<script>``` tags for the javascript at the end of the body, rather than in the header. Just make sure that they are above the javascript that sets up the sliders.
+
+----------------------------------------------------------
+### Input fields that the slider is built around
 
 ``` html
-<input type="range" min="0" max="4" value="0">
+<input type="range" min="0" max="4">
 <input type="range" class="inside" min="-5" max="5" value="0">
+<input type="range" min="0" max="2" width="300">
+```
+
+#### Required Parameters
+
+- type="range"
+ - Identifies this as a range slider
+- min="some_integer"
+ - The minimum value this slider has
+- max="some_integer_greater_than_min"
+ - The maximum value this slider has
+
+**Note:** The number of integers between min and max determine the number of options that the slider has.
+
+#### Optional Parameters
+
+- value="some_integer_between_min_and_max"
+ - The initial value that is set for the slider
+ - This will default to min if it is not set
+ - **Note:** This is not an index point but one of the values that lies between max and min
+- width="some_integer"
+ - The width that you want the slider to be
+- class="inside" or class="normal"
+ - This determines whether the outside option lines sit inside the slider or even with the visible ends of the slider
+ - If nothing is specified then this defaults to class="normal"
+- showEmptyLabels="true" or showEmptyLabels="false"
+ - By setting this to false you can choose to show nothing for those empty labels, hiding them from the user
+ - If nothing is specified then this defaults to showEmptyLabels="true"
+- fillColor="desired_colour"
+ - The color that you want the fill bar to be
+ - If nothing is specified then this defaults to the predefined color
+ - This takes a css color property (either a hex value or an acceptable color name)
+- showFill="true" or showFill="false"
+ - By setting this to false you can choose to hide the coloured fill element of the slider
+ - If nothing is specified then this defaults to showing the coloured fill element
+- rtl="true" or rtl="false"
+ - By setting this to true you can choose to use an RTL layout for the slider. This reverses the order of the labels that have been specified (or auto-generated) and fills from right to left rather than left to right. This is useful when using the slider with an RTL language such as Arabic or Hebrew.
+
+**Note:** If a width is not specified then the width of an ancestor object will be grabbed. If no ancestor has it's width specified then this will end up being the width of the page. To guarantee that width and layout work correctly it is recommended to specify a width for the input field. One thing to note is that if the width you specify for the slider is greater than the width of a wrapping container then the slider is likely to have issues displaying correctly - the options will probably wrap in strange ways.
+
+**Tip:** If you use a large number of values (e.g. min="0", max="200") and hide the labels (using showEmptyLabels="false") then it is possible to simulate a smooth continuous slider.
+
+**Note:** The combination of width of the slider and number of options that the slider has is used to calculate the width that each label should be. The slider does it's best to make sure that the labels are evenly spaced between min and max, but this gets difficult with high numbers of values - particularly with a smaller width. This is because we are needing to handle the case where the width of an individual label is less than 1 pixel. If the labels are not quite lining up, try fiddling with the width of the slider and the min / max values to alleviate the problem. The layout should work well in most scenarios, but there are unfortunately no guarantees for extreme cases (100's of options with a width of only a few hundred pixels is likely to look a little weird).
+
+----------------------------------------------------------
+### Gaining access to the input field
+
+``` javascript
+$('#wrapper_id input[type="range"]')
+$('#input_field_id')
+$('input[type="range"]')
 ```
 
+- The parameter to $() is a DOM selector for the input field
+- The first example will return all input fields inside the field with #wrapper_id
+- The second example will return the field with the specified id (it is up to you to make sure that this is actually an input field, not something like a div)
+- The final example will return all input fields on the page (useful if you want to construct all sliders at once with default labels)
+
+**Tip:** The safest option is to wrap each input field in a div which has an id set on it. That way you can use the first example selector and know that you are interacting with a slider.
+
+----------------------------------------------------------
+### Javascript call to construct slider
+
+This needs to be added inside script tags at the end of the html. This guarantees that all the html is added to the DOM correctly before we start modifying it.
+
 ``` javascript
-$('input[type="range"]').range();
-$('input[type="range"]').range('worst', 'best');
+$('dom_selector').range();
+$('dom_selector').range('worst', 'best');
+$('dom_selector').range(['1', '2', '3']);
 ```
 
-## Modes
+- The function range() can take 3 types of parameter (as shown above):
+ 1. No parameters (the min and max values set on the input field will be shown)
+ 2. A list of strings to be shown as options
+ 3. An array of strings to be shown as options
 
-* `normal`
-* `inside`
+- If there is less than a one-to-one mapping of parameters to options then gaps will be added intelligently
+ - 1 parameter will cause things to break
+ - 2 parameters will map to the first and last option
+ - 3 parameters will map to the first, middle, and last option (provided there are an odd number of options ...)
+ - If equal sized gaps cannot be made then it will default back to simply showing lines
+ - Things work best for gaps if there are an odd number of options
 
-## Events
+----------------------------------------------------------
+### Javascript calls to interact with value
+
+``` javascript
+$('dom_selector').setValue(3);
+```
+
+- Make sure that the value passed in is an integer that is between min and max
+ - min <= x <= max
+
+``` javascript
+$('#wrapper_id input[type="range"]').getValue();
+```
+
+- This returns the current value that the slider has set
+
+----------------------------------------------------------
+### Javascript calls to modify fill colour
+
+``` javascript
+$('dom_selector').setFillColor('#332299');
+$('dom_selector').setFillColor('blue');
+```
+
+- This needs to be passed a valid css color
+ - It can be either a hex value or a predefined color
+
+``` javascript
+$('dom_selector').resetFillColor();
+```
+
+- This will reset the fill colour to the default value specified in the css
+
+----------------------------------------------------------
+### Javascript call to adjust width of slider
+
+``` javascript
+$('dom_selector').setWidth(300);
+```
+
+- This function expects an integer value for the width you want
+
+----------------------------------------------------------
+### Events
+
+- `init`
+- `move`
+- `change`
+
+You can set up a listener for any of these events using the javascript below
+
+``` javascript
+$('dom_selector').on('change', function(event, current, range) {
+//handle event here
+});
+```
 
-* `init`
-* `move`
-* `change`
\ No newline at end of file
+- 'event' is the name of the event that trigged the handler
+- 'current' is the current **index** the slider has set, rather than the current **value**
+- 'range' is the slider itself
+- To get the current value the slider has set use range.input[0].value
+ - For some reason range.getValue() does not work inside the event handler
diff --git a/index.html b/index.html
index b5a4987..cad719f 100644
--- a/index.html
+++ b/index.html
@@ -4,52 +4,122 @@
     <meta charset="UTF-8">
     <title>Zepto Range</title>
     <meta name="viewport" content="width=600">
-    <link rel="stylesheet" href="styles.css">
-    <link href="//fonts.googleapis.com/css?family=Ubuntu:300,700" rel="stylesheet" type="text/css">
+    <link rel="stylesheet" href="styles.css"/>
+    <link rel="stylesheet" href="zepto-range.css"/>
+    <link href="//fonts.googleapis.com/css?family=Ubuntu:300,700" rel="stylesheet" type="text/css"/>
+    <script src="zepto.min.js"></script>
+    <script src="zepto-range.js"></script>
 </head>
 <body>
-    <div id="main">
-        <div class="wrapper">
-            <h1>Zepto Range</h1>
-            <p>Input range implementation to works with touch using Zepto.</p> 
-            <p><a href="//github.com/jcemer/zepto-range">github.com/jcemer/zepto-range</a></p>
-            
-            <div id="samples-01">
-                <input type="range" min="0" max="4" value="0">
-                <input type="range" class="inside" min="0" max="4" value="0">
-            </div>
+    <div class="wrapper">
+        <h1>Zepto Range</h1>
+        <p>Input range implementation to works with touch using Zepto.</p> 
+        <p><a href="https://github.com/stormtek/zepto-range">github.com/stormtek/zepto-range</a></p>
+        <br/><br/>
+        <!-- two sliders nested inside the same div -->
+        <!-- one uses 'inside' mode to contrast the two -->
+        <div id="samples">
+        	<h2>Normal mode</h2>
+            <input type="range" min="0" max="600" value="0" showemptylabels="false">
+            <h2>Inside mode</h2>
+            <input type="range" class="inside" min="0" max="4">
+        </div>
             
-            <div id="samples-02">
-                <input type="range" class="inside" min="0" max="6" value="0">
-            </div>
+        <h2>Some Labels</h2>
+        <div id="some-labels">
+    		<button onclick="changeWidth('some-labels', 300)">Set width to 300px</button>
+    		<button onclick="changeWidth('some-labels', 700)">Set width to 700px</button>
+            <input type="range" class="inside" min="-4" max="4" value="-2" showEmptyLabels="false">
+        </div>
             
-            <div id="samples-03">
-                <input type="range" min="-4" max="4" value="0">
-            </div>
+        <h2>First and Last Label</h2>
+        <div id="first-and-last">
+            <input type="range" min="0" max="14" value="0">
+        </div>
             
-            <div id="samples-04">
-                <h2>Events</h2>
-                <input type="range" class="inside" min="0" max="2" value="1">
-            </div>
-
-            <script src="zepto.js"></script>
-            <script src="zepto-range.js"></script>
-            <script>
-                $('#samples-01 input[type="range"]').range();
-                $('#samples-02 input[type="range"]').range('0', '3', '6');
-                $('#samples-03 input[type="range"]').range('worst', 'best');
-                
-                // SAMPLE 04
-                var sample04 = $('#samples-04 input[type="range"]');
-                sample04.on('change init', function (event, current, range) {
-                    var labels = range.legend.children();
-                    labels.removeClass('active');
-                    labels.eq(current).addClass('active');
-                });
-                sample04.range('worst', 'normal', 'best');
-            </script>
+        <div id="user-defined-color">
+            <h2>User Defined Fill Color</h2>
+            <input type="range" class="inside" min="0" max="2" value="1" fillColor="#339922">
+        </div>
+        
+        <!-- Free standing input field -->
+        <h2>Free standing</h2>
+        <button onclick="changeFreestandingValue()">Set value to 2</button>
+        <button onclick="getFreestandingValue()">Set Output to Current Value</button>
+        <div>
+        	<p>Current Value: <span id="freestandingValue">Unknown</span></p>
+        	<p>Output: <span id="freestandingOutput">Unknown</span></p>
         </div>
-        <a href="//github.com/jcemer/zepto-range"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png" alt="Fork me on GitHub"></a>
+        <button onclick="changeFreestandingColor()">Set colour to blue</button>
+        <button onclick="resetFreestandingColor()">Reset colour</button>
+        <input id="freestanding" class="inside" type="range" min="-5" max="3" value="0" width="300">
+
     </div>
+    <h2>Outside Wrapper div</h2>
+    <div id="outside">
+    	<input class="inside" type="range" min="-2" max="1" value="0">
+	</div>
+    
+    <a href="https://github.com/stormtek/zepto-range">
+    	<img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png" alt="Fork me on GitHub">
+    </a>
+    <!--
+		This script call needs to happen after the input fields have been added to
+		the html. If not then the addition of the slider divs does not happen.
+	-->
+    <script>
+        // No values to be shown
+        $('#samples input[type="range"]').range();
+        // Show value value for first, middle, last
+        $('#some-labels input[type="range"]').range('10', '3', '26');
+        // Show first and last values, sent through as an array
+        $('#first-and-last input[type="range"]').range(['worst', 'best']);
+                
+        // Custom styling on the active label
+        var userDefinedColor = $('#user-defined-color input[type="range"]');
+        userDefinedColor.on('change init', function (event, current, range) {
+            var labels = range.legend.children();
+            labels.removeClass('active');
+            labels.eq(current).addClass('active');
+        });
+        userDefinedColor.range('worst', 'normal', 'best');
+        
+        // This entry is outside the wrapper div, it deduces the width it should have
+        $('#outside input[type="range"]').range();
+        
+        // This entry is not wrapped by a div
+        // it also has a lot of interactions defined based on button clicks
+        var freestanding = $('#freestanding');
+        freestanding.on('init change', function(event, current, range) {
+        	$('#freestandingValue')[0].innerHTML = range.input[0].value;
+        });
+        freestanding.range();
+        
+        function setFreestandingOutput(value) {
+        	$('#freestandingOutput')[0].innerHTML = value;
+        }
+        
+        // Methods to interact with sliders
+        function changeFreestandingValue() {
+        	freestanding.setValue(2);
+        }
+        
+        function getFreestandingValue() {
+        	var value = freestanding.getValue();
+        	setFreestandingOutput(value);
+        }
+        
+        function changeFreestandingColor() {
+        	freestanding.setFillColor('blue');
+        }
+        
+        function resetFreestandingColor() {
+        	freestanding.resetFillColor();
+        }
+        
+        function changeWidth(id, newWidth) {
+        	$('#' + id + ' input[type="range"]').setWidth(newWidth);
+        }
+    </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/styles.css b/styles.css
index dafc824..9e1678a 100644
--- a/styles.css
+++ b/styles.css
@@ -1,32 +1,10 @@
 html, body {
-    height: 100%;
     margin: 0;
     padding: 0;
-}
-
-#main {
-    position: relative;
-    background-color: #141414;
-    background-image: -webkit-linear-gradient(top, #CCC, #EEE 100%);
-    background-image:    -moz-linear-gradient(top, #CCC, #EEE 100%);
-    background-image:     -ms-linear-gradient(top, #CCC, #EEE 100%);
-    background-image:      -o-linear-gradient(top, #CCC, #EEE 100%);
-    background-image:         linear-gradient(top, #CCC, #EEE 100%);
-    height: 100%;
-    min-height: 800px;
+    background-color: #ccc;
     color: #333;
     font: 300 15px/1 Verdana;
 }
-#main:before {
-    background-image: -webkit-radial-gradient(center, circle, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 100%);
-    background-image:    -moz-radial-gradient(center, circle, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 100%);
-    background-image:     -ms-radial-gradient(center, circle, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 100%);
-    background-image:      -o-radial-gradient(center, circle, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 100%);
-    background-image:         radial-gradient(center, circle, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 100%);
-    position: absolute;
-    content: '';
-    top: 0; right: 0; bottom: 0; left: 0;
-}
 
 /* -.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-. */
 
@@ -35,13 +13,10 @@ body {
 }
 
 .wrapper {
+    width: 600px;
     position: relative;
-    width: 500px;
-    height: 900px;
-    position: absolute;
-    top: 50%; left: 50%;
-    margin-left: -250px;
-    margin-top: -450px;
+    left: 50%;
+    margin-left: -300px; /* half the width */
 }
 
 h1, h2 {
@@ -54,161 +29,4 @@ h2 {
     font-size: 30px;
     letter-spacing: -2px;
     text-shadow: 1px 2px 3px #DDD, 0 0 0 #222, 1px 2px 3px #DDD;
-}
-
-/* -.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-. */
-
-input[type="range"] {
-    width: 100%;
-}
-
-.range {
-    position: relative;
-}
-.range input {
-    position: absolute;
-    text-align: left;
-    direction: ltr;
-    left: -9999px;
-}
-
-/* legend */
-.range .legend {
-    font-size: 16px;
-    position: absolute;
-    top: -25px;
-    left: 0;
-    right: 0;
-    z-index: 1;
-}
-.range .legend .label {
-    padding-top: 55px;
-    float: left;
-    text-align: center;
-    height: 30px;
-    line-height: 30px;
-}
-.range .legend .label:first-child {
-    text-align: left;
-}
-.range .legend .label:last-child {
-    text-align: right;
-}
-
-.range .legend .label:empty {
-    position: relative;
-}
-.range .legend .label:empty:before {
-    content: '';
-    position: absolute;
-    width: 1px;
-    top: 62px; left: 50%; bottom: 7px;
-    background: #CCC;
-    border-left: 1px solid white;
-}
-.range .legend .label:empty:first-child:before {
-    left: 20px; /* btn half size */
-}
-.range .legend .label:empty:last-child:before {
-    left: auto;
-    right: 20px; /* btn half size */
-}
-
-.range .legend .label.active {
-    -webkit-transition: 0.2s all ease-out;
-       -moz-transition: 0.2s all ease-out;
-         -o-transition: 0.2s all ease-out;
-            transition: 0.2s all ease-out;
-
-    color: #8D8DAC;
-    text-shadow: 1px 1px 1px #CCC;
-}
-
-/* bar, fill, btn */
-.range .bar,
-.range .fill {
-    -webkit-border-radius: 4px;
-       -moz-border-radius: 4px;
-            border-radius: 4px;
-    height: 10px;
-}
-.range .bar {
-    position: relative;
-    margin-top: 50px;
-    margin-bottom: 100px;
-    margin-left: 20px; /* btn half size  */
-    margin-right: 20px; /* btn half size */
-    background: #999;
-    border-bottom: 1px solid rgba(255, 255, 255, .9);
-    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
-       -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
-         -o-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
-            box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
-}
-.range .fill {
-    background: rgba(100, 100, 255, .2);
-    position: absolute;
-    top: 0; left: 0;
-}
-.range .btn {
-    margin-top: -16px;
-    position: absolute;
-    top: 0; left: -20px; /* btn half size */
-    width: 38px;
-    height: 38px;
-    z-index: 2;
-
-    -webkit-border-radius: 50%;
-       -moz-border-radius: 50%;
-            border-radius: 50%;
-
-    border: 2px solid rgba(255, 255, 255, .8);
-
-    background-image: -webkit-radial-gradient(10px 10px, circle cover, #FFF, #DDD);
-    background-image:    -moz-radial-gradient(10px 10px, circle cover, #FFF, #DDD);
-    background-image:      -o-radial-gradient(10px 10px, circle cover, #FFF, #DDD);
-    background-image:         radial-gradient(10px 10px, circle cover, #FFF, #DDD);
-    
-    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
-       -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
-         -o-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
-            box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
-}
-.range .btn:active {
-    border-color: rgba(255, 255, 255, .5);
-    top: 1px;
-    -webkit-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
-       -moz-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
-         -o-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
-            box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
-}
-
-/* -.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-. */
-
-.range.inside .bar{
-    margin-left: 0;
-    margin-right: 0;
-}
-.range.inside .btn {
-    left: 0;
-}
-.range.inside .fill {
-    padding-right: 20px; /* btn half size */
-}
-
-/* -.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-. */
-
-.range .fill,
-.range .btn {
-    -webkit-transition: 0.2s all ease-out;
-       -moz-transition: 0.2s all ease-out;
-         -o-transition: 0.2s all ease-out;
-            transition: 0.2s all ease-out;
-}
-.range.moving .fill,
-.range.moving .btn {
-    -webkit-transition: none;
-       -moz-transition: none;
-         -o-transition: none;
-            transition: none;
-}
+}
\ No newline at end of file
diff --git a/zepto-range.css b/zepto-range.css
new file mode 100644
index 0000000..ad5d5f4
--- /dev/null
+++ b/zepto-range.css
@@ -0,0 +1,181 @@
+/* makes sure width works if not specified on input */
+input[type="range"] {
+    width: 95%;
+}
+
+.range {
+    position: relative;
+    padding: 0px 20px;
+}
+/* hide the input value offscreen */
+.range input {
+    display: none;
+}
+
+/* legend */
+.range .legend {
+    font-size: 16px;
+    position: absolute;
+    top: -25px;
+    right: 0;
+    z-index: 1;
+    /* position tweak to allow us to click just off each end of the slider */
+    left: 20px;
+    margin-left: -20px;
+    padding-left: 20px;
+}
+
+.range .legend .label {
+    padding-top: 55px;
+    float: left;
+    text-align: center;
+    height: 30px;
+    line-height: 30px;
+    
+}
+.range .legend .label:first-child {
+    text-align: left;
+}
+.range .legend .label:last-child {
+    text-align: right;
+}
+
+.range .legend .label-last-child {
+	margin-left: -30px;
+}
+
+.range .legend .singleCharLabel:first-child {
+	position: relative;
+	left: 15px; /* 3/8 btn size */
+}
+.range .legend .singleCharLabel:last-child {
+	position: relative;
+	left: 15px; /* 3/8 btn size */
+}
+
+.range .legend .doubleCharLabel:first-child {
+	position: relative;
+	left: 10px; /* 1/4 btn size */
+}
+.range .legend .doubleCharLabel:last-child {
+	position: relative;
+	left: 20px; /* 1/2 btn size */
+}
+
+.range .legend .label-empty {
+    position: relative;
+}
+.range .legend .label-empty:before {
+    content: '';
+    position: absolute;
+    width: 1px;
+    top: 62px; left: 50%; bottom: 7px;
+    background: #CCC;
+    border-left: 1px solid white;
+}
+.range .legend .label-empty:first-child:before {
+    left: 20px; /* btn half size */
+}
+.range .legend .label-empty:last-child:before {
+    left: auto;
+    right: 20px; /* btn half size */
+}
+
+.range .legend .label.active {
+    -webkit-transition: 0.2s all ease-out;
+       -moz-transition: 0.2s all ease-out;
+         -o-transition: 0.2s all ease-out;
+            transition: 0.2s all ease-out;
+
+    color: #8D8DAC;
+    text-shadow: 1px 1px 1px #CCC;
+}
+
+/* bar, fill, btn */
+.range .bar,
+.range .fill {
+    -webkit-border-radius: 4px;
+       -moz-border-radius: 4px;
+            border-radius: 4px;
+    height: 10px;
+}
+.range .bar {
+    position: relative;
+    margin-top: 50px;
+    margin-bottom: 100px;
+    margin-left: 20px; /* btn half size  */
+    margin-right: 20px; /* btn half size */
+    background: #999;
+    border-bottom: 1px solid rgba(255, 255, 255, .9);
+    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
+       -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
+         -o-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
+            box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.05);
+}
+.range .fill {
+    background: #60B9B4;
+    position: absolute;
+    top: 0; left: 0;
+}
+.range .btn {
+    margin-top: -16px;
+    position: absolute;
+    top: 0; left: -20px; /* btn half size */
+    width: 38px;
+    height: 38px;
+    z-index: 2;
+
+    -webkit-border-radius: 50%;
+       -moz-border-radius: 50%;
+            border-radius: 50%;
+
+    border: 2px solid rgba(255, 255, 255, .8);
+
+    background-image: -webkit-radial-gradient(10px 10px, circle cover, #FFF, #DDD);
+    background-image:    -moz-radial-gradient(10px 10px, circle cover, #FFF, #DDD);
+    background-image:      -o-radial-gradient(10px 10px, circle cover, #FFF, #DDD);
+    background-image:         radial-gradient(10px 10px, circle cover, #FFF, #DDD);
+    
+    -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
+       -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
+         -o-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
+            box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1), 0 2px 5px rgba(0, 0, 0, 0.3);
+}
+.range .btn:active {
+    border-color: rgba(255, 255, 255, .5);
+    top: 1px;
+    -webkit-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
+       -moz-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
+         -o-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
+            box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.1), 0px 1px 4px rgba(0, 0, 0, 0.3);
+}
+
+/* -.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-. */
+
+.range.inside .bar{
+    margin-left: 0;
+    margin-right: 0;
+}
+.range.inside .btn {
+    left: 0;
+}
+.range.inside .fill {
+    padding-right: 20px; /* btn half size */
+}
+
+/* -.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-. */
+
+.range .fill,
+.range .btn {
+    -webkit-transition: 0.2s all ease-out;
+       -moz-transition: 0.2s all ease-out;
+         -o-transition: 0.2s all ease-out;
+            transition: 0.2s all ease-out;
+}
+.range.moving .fill,
+.range.moving .btn {
+    -webkit-transition: none;
+       -moz-transition: none;
+         -o-transition: none;
+            transition: none;
+}
diff --git a/zepto-range.js b/zepto-range.js
index cfaa1bb..2773272 100644
--- a/zepto-range.js
+++ b/zepto-range.js
@@ -64,26 +64,54 @@
 
     function Range(input, labels) {
         this.input = $(input);
-        this.container = this.input.wrap('<div>').parent();
-        this.container.addClass(defaults.name + ' ' + this.input[0].className);
+        this.labels = labels;
 
         // number
         this.min = parseInt(this.input.attr('min'), 10);
         this.max = parseInt(this.input.attr('max'), 10);
         this.amount = (this.max - this.min) + 1;
-        this.current = parseInt(this.input.val(), 10) - this.min;
+        var initValue = parseInt(this.input.val(), 10);
+        if(isNaN(initValue)) this.current = this.min;
+        else this.current = initValue - this.min;
+        
+        // default behaviour is to show lines for empty labels
+        var showEmptyLabels = this.input.attr('showEmptyLabels');
+        if(showEmptyLabels == 'false') this.showEmptyLabels = false;
+        else this.showEmptyLabels = true;
+
+	// find a user defined color for the fill
+	var fillColor = this.input.attr('fillColor');
+	var showFill = this.input.attr('showFill');
+	
+	//check for rtl layout
+	var rtl = this.input.attr('rtl');
+	if(rtl == "True" || rtl == "true") this.rtl = true;
+	else this.rtl = false;
 
         // html
         this.btn = $('<div class="btn">');
-        this.fill = $('<div class="fill">');
+        if(showFill == "False" || showFill == "false") this.fill = $('<div class="fill" style="background: none;">');
+        else if(fillColor != undefined) this.fill = $('<div class="fill" style="background: ' + fillColor + '">');
+        else this.fill = $('<div class="fill">');
         this.bar = $('<div class="bar">').append(this.btn, this.fill);
+        this.btn.size = this.btn.width();
+        
+        var setWidthValue = parseInt(this.input.attr('width'), 10);
+        if(isNaN(setWidthValue) || setWidthValue <= 0) setWidthValue = this.input.width();
+        var width =  setWidthValue - this.btn.size;
+        this.container = this.input.wrap('<div style="width: ' + width + 'px">').parent();
+        this.container.addClass(defaults.name + ' ' + this.input[0].className);
         this.container.append(this.bar);
 
-        this.btn.size = this.btn.width();
-        this.size = this.input.width() - this.btn.size;
+        this.size = width;
         this.gap = this.size / (this.amount - 1);
 
         // legend
+        if(!labels.length) {
+            labels = new Array(2);
+            labels[0] = this.min + "";
+            labels[1] = this.max + "";
+        }
         this.legend = legend(labels, this);
         this.container.append(this.legend);
 
@@ -95,7 +123,7 @@
     function legend(labels, range) {
         var diff = range.amount - labels.length,
             gaps = labels.length - 1,
-            size = Math.floor(range.size / (range.amount - 1)),
+            size = (range.size - labels.length) / (range.amount - 1),
             container, tmp, i;
 
         // labels
@@ -111,18 +139,91 @@
                 }
             }
         }
+        
+        // reverse labels if using an rtl layout
+        if(range.rtl) {
+        	var numberOfLabels = labels.length;
+        	var reverse = new Array(numberOfLabels);
+        	for(var i=0; i<numberOfLabels; i++) {
+        		reverse[numberOfLabels - i - 1] = labels[i];
+        	}
+        	labels = reverse;
+        }
 
         // html
         container = $('<div class="legend" aria-hidden="true">');
         container.append($.map(labels, function(item) {
-            return $('<div class="label">').text(item == undefined ? '' : item);
+        	var classes = "label";
+        	if(item == undefined && range.showEmptyLabels) {
+        		classes += " label-empty";
+            }
+            return $('<div class="' + classes + '">').text(item == undefined ? '' : item);
         }));
 
-        container.children().width(size);
-        container.find(':first-child, :last-child').width(size / 2 + range.btn.size / 2);
+	// set size of labels
+	setLabelWidths(container, size, range.amount);
+        container.find(':first-child, :last-child').width(Math.ceil(size / 2 + range.btn.size / 2));
+        
+        // adjust first label styling if necessary
+        var firstLabel = labels[0];
+        if(firstLabel != null) {
+        	if(firstLabel.length == 1) container.find(':first-child').addClass('singleCharLabel');
+        	else if(firstLabel.length == 2) container.find(':first-child').addClass('doubleCharLabel');
+        }
+        // adjust last label styling if necessary
+        var lastLabel = labels[labels.length-1];
+        if(lastLabel) {
+        	var lastChild = container.find(':last-child');
+        	if(lastLabel.length == 1) lastChild.addClass('singleCharLabel');
+        	else if(lastLabel.length == 2) lastChild.addClass('doubleCharLabel');
+        	if(labels.length > 15 || lastLabel.length < 3) lastChild.addClass('label-last-child');
+        }
 
         return container;
     }
+    
+    function setLabelWidths(container, size, numValues) {
+		// special care is needed to handle sub pixel widths ...
+		// we do not want to rely on a browser to guess at how it should be done
+		// this was a particular issue with safari which rounds all values down
+		var numDp = 2;
+		var value = getDecimalPart(size, numDp);
+		var baseDenominator = Math.pow(10, numDp);
+		var gcf = greatestCommonFactor(value, baseDenominator);
+		// we use these values to determine how many values should be rounded up and
+		// how many values should be rounded down
+		var loopLength = baseDenominator / gcf;
+		var numToScaleUp = value / gcf;
+		var numToScaleDown = loopLength - numToScaleUp;
+		// we use these values to interleave up and down values evenly
+		var percentUp = numToScaleUp / loopLength;
+		var percentDown = numToScaleDown / loopLength;
+		var count = 0;
+		// actually set the widths on the labels
+		for(var i=0; i<loopLength; i++) {
+			var labelSize = Math.floor(size);
+			if(count > percentDown) {
+				labelSize = Math.ceil(size);
+				count -= percentDown;
+			} else count += percentUp;
+			// the css selector is forming the inner loop and setting widths
+			// on the appropriate elements
+			container.children('*:nth-child(' + loopLength + 'n+' + i + ')').width(labelSize);
+		}
+    }
+    
+    function greatestCommonFactor(a, b) {
+    	if(b==0) return a;
+    	return greatestCommonFactor(b, a%b);
+    }
+    
+    function getDecimalPart(number, numDp) {
+    	var scale = Math.pow(10, numDp + 1);
+    	var scaled = number * scale;
+    	var bigPart = scaled % scale;
+    	var smallPart = scaled % 10;
+    	return (bigPart - smallPart) / 10;
+    }
 
     $.extend(Range.prototype, {
         pos: function () {
@@ -133,14 +234,29 @@
         },
         move: function(to) {
             var pos = to * this.gap;
+            var btnWidth = this.btn.width();
+            if(to > 0) {
+            	if(to == this.amount - 1) pos -= btnWidth;
+            	else pos -= btnWidth / 2;
+            }
+            // make sure we stay inside the bounds of the slider
+            if(pos < 0) pos = 0;
+            var max = ((this.amount - 1) * this.gap) - btnWidth;
+            if(pos > max) pos = max;
+            //shift the handle to the appropriate position
             $.translateX(this.btn[0], pos);
-            this.fill.width(pos);
+            // adjust the fill width
+            if(this.rtl) {
+            	this.fill.width = (max - pos + btnWidth / 4);
+            	$.translateX(this.fill[0], pos + btnWidth / 4);
+            } else {
+            	this.fill.width(pos);
+            }
             this.input.trigger('move', [to, this]);
         },
         change: function(to) {
             to = Math.round(to);
             this.move(to);
-
             this.current = to;
             this.input.val(this.current + this.min);
             this.input.trigger('change', [to, this]);
@@ -150,7 +266,8 @@
     function events() {
         // singleton pattern
         var doc = $(document),
-            className = '.' + defaults.name;
+            className = '.' + defaults.name,
+            touches = {x: 0, y: 0};
 
         doc.on(defaults.startGesture, className + ' .btn', function (event) {
             var range = getRange(this),
@@ -182,6 +299,29 @@
         doc.on(defaults.tapGesture, className + ' .label', function (event) {
             (getRange(this)).change($(this).index());
         });
+        doc.on(defaults.tapGesture, className + ' .legend', function(event) {
+        	if(event.target==this) {
+        		// if the user clicks near the end of the legend we want to move
+        		// the slider to the min or max value, esp if on a touch device
+        		// - this will be a click on the legend rather than a label
+        		var clickX = touches.x;
+        		if(event.pageX) clickX = event.pageX;
+        		var range = getRange(this);
+        		var legend = $(this);
+        		var legendPos = legend.offset();
+        		var start = legendPos.left;
+        		var end = legendPos.left + legendPos.width;
+        		var adjustment = range.btn.width();
+        		if(clickX < (start + adjustment)) range.change(0);
+        		else if(clickX > (end - adjustment)) range.change(range.amount-1);
+        	}
+        });
+        doc.on(defaults.startGesture, className + ' .legend', function (event) {
+        	if(event.originalEvent.touches) {
+	        	touches.x = event.originalEvent.touches[0].pageX;
+	        	touches.y = event.originalEvent.touches[0].pageY;
+	        }
+        });
         
         events = function() {};
     }
@@ -199,15 +339,69 @@
         var element = $(item).closest('.' + defaults.name);
         return store[element.data(defaults.name + '-store')];
     }
+    
+    function removeRange(range) {
+    	var index = -1;
+    	for(var i=0; i<store.length; i++) {
+    		if(store[i] == range) {
+    			index = i;
+    		}
+    	}
+    	if(index >= 0) {
+    		// if we remove this from the store we break the indices of other sliders
+    		// so we set the entry to null instead
+    		store[index] = null;
+    		var parent = range.container.parent();
+    		range.container.remove();
+    		parent.append(range.input[0]);
+    	}
+    }
 
     // plugin
     $.fn.range = function() {
         var labels;
         events();
         labels = Array.prototype.slice.call(arguments);
+        // detects if the args were an array rather than a list
+        if(labels.length==1 && labels instanceof Array) {
+            labels = labels[0];
+        }
         return this.each(function() {
             createRange(this, labels);
         });
     };
+    
+    $.fn.setValue = function(value) {
+    	var range = getRange(this);
+    	value -= range.min;
+    	range.change(value);
+    };
+    
+    $.fn.getValue = function() {
+    	return getRange(this).input[0].value;
+    };
+    
+    $.fn.setFillColor = function(color) {
+    	getRange(this).fill[0].style['background'] = color;
+    }
+    
+    $.fn.resetFillColor = function() {
+    	getRange(this).fill[0].style['background'] = '';
+    }
+    
+    $.fn.setWidth = function(newWidth) {
+    	// we need to remove the existing range from the DOM
+    	// update the width value for the input field
+    	// and then create the range again
+    	// this is the easiest way to guarantee that layout for legend
+    	// remains consistent with the new width
+    	var range = getRange(this);
+    	if(range) {
+			var labels = range.labels;
+   			removeRange(range);
+   			this.attr('width', newWidth);
+   			createRange(this, labels);
+    	}
+    }
 
-})(Zepto);
\ No newline at end of file
+})(Zepto);
diff --git a/zepto.min.js b/zepto.min.js
new file mode 100644
index 0000000..4e1c093
--- /dev/null
+++ b/zepto.min.js
@@ -0,0 +1,2 @@
+/* Zepto v1.0-4-gf975db7 - polyfill zepto detect event ajax form fx touch - zeptojs.com/license */
+(function(a){String.prototype.trim===a&&(String.prototype.trim=function(){return this.replace(/^\s+|\s+$/g,"")}),Array.prototype.reduce===a&&(Array.prototype.reduce=function(b){if(this===void 0||this===null)throw new TypeError;var c=Object(this),d=c.length>>>0,e=0,f;if(typeof b!="function")throw new TypeError;if(d==0&&arguments.length==1)throw new TypeError;if(arguments.length>=2)f=arguments[1];else do{if(e in c){f=c[e++];break}if(++e>=d)throw new TypeError}while(!0);while(e<d)e in c&&(f=b.call(a,f,c[e],e,c)),e++;return f})})();var Zepto=function(){function E(a){return a==null?String(a):y[z.call(a)]||"object"}function F(a){return E(a)=="function"}function G(a){return a!=null&&a==a.window}function H(a){return a!=null&&a.nodeType==a.DOCUMENT_NODE}function I(a){return E(a)=="object"}function J(a){return I(a)&&!G(a)&&a.__proto__==Object.prototype}function K(a){return a instanceof Array}function L(a){return typeof a.length=="number"}function M(a){return g.call(a,function(a){return a!=null})}function N(a){return a.length>0?c.fn.concat.apply([],a):a}function O(a){return a.replace(/::/g,"/").replace(/([A-Z]+)([A-Z][a-z])/g,"$1_$2").replace(/([a-z\d])([A-Z])/g,"$1_$2").replace(/_/g,"-").toLowerCase()}function P(a){return a in j?j[a]:j[a]=new RegExp("(^|\\s)"+a+"(\\s|$)")}function Q(a,b){return typeof b=="number"&&!l[O(a)]?b+"px":b}function R(a){var b,c;return i[a]||(b=h.createElement(a),h.body.appendChild(b),c=k(b,"").getPropertyValue("display"),b.parentNode.removeChild(b),c=="none"&&(c="block"),i[a]=c),i[a]}function S(a){return"children"in a?f.call(a.children):c.map(a.childNodes,function(a){if(a.nodeType==1)return a})}function T(c,d,e){for(b in d)e&&(J(d[b])||K(d[b]))?(J(d[b])&&!J(c[b])&&(c[b]={}),K(d[b])&&!K(c[b])&&(c[b]=[]),T(c[b],d[b],e)):d[b]!==a&&(c[b]=d[b])}function U(a,b){return b==null?c(a):c(a).filter(b)}function V(a,b,c,d){return F(b)?b.call(a,c,d):b}function W(a,b,c){c==null?a.removeAttribute(b):a.setAttribute(b,c)}function X(b,c){var d=b.className,e=d&&d.baseVal!==a;if(c===a)return e?d.baseVal:d;e?d.baseVal=c:b.className=c}function Y(a){var b;try{return a?a=="true"||(a=="false"?!1:a=="null"?null:isNaN(b=Number(a))?/^[\[\{]/.test(a)?c.parseJSON(a):a:b):a}catch(d){return a}}function Z(a,b){b(a);for(var c in a.childNodes)Z(a.childNodes[c],b)}var a,b,c,d,e=[],f=e.slice,g=e.filter,h=window.document,i={},j={},k=h.defaultView.getComputedStyle,l={"column-count":1,columns:1,"font-weight":1,"line-height":1,opacity:1,"z-index":1,zoom:1},m=/^\s*<(\w+|!)[^>]*>/,n=/<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/ig,o=/^(?:body|html)$/i,p=["val","css","html","text","data","width","height","offset"],q=["after","prepend","before","append"],r=h.createElement("table"),s=h.createElement("tr"),t={tr:h.createElement("tbody"),tbody:r,thead:r,tfoot:r,td:s,th:s,"*":h.createElement("div")},u=/complete|loaded|interactive/,v=/^\.([\w-]+)$/,w=/^#([\w-]*)$/,x=/^[\w-]+$/,y={},z=y.toString,A={},B,C,D=h.createElement("div");return A.matches=function(a,b){if(!a||a.nodeType!==1)return!1;var c=a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.matchesSelector;if(c)return c.call(a,b);var d,e=a.parentNode,f=!e;return f&&(e=D).appendChild(a),d=~A.qsa(e,b).indexOf(a),f&&D.removeChild(a),d},B=function(a){return a.replace(/-+(.)?/g,function(a,b){return b?b.toUpperCase():""})},C=function(a){return g.call(a,function(b,c){return a.indexOf(b)==c})},A.fragment=function(b,d,e){b.replace&&(b=b.replace(n,"<$1></$2>")),d===a&&(d=m.test(b)&&RegExp.$1),d in t||(d="*");var g,h,i=t[d];return i.innerHTML=""+b,h=c.each(f.call(i.childNodes),function(){i.removeChild(this)}),J(e)&&(g=c(h),c.each(e,function(a,b){p.indexOf(a)>-1?g[a](b):g.attr(a,b)})),h},A.Z=function(a,b){return a=a||[],a.__proto__=c.fn,a.selector=b||"",a},A.isZ=function(a){return a instanceof A.Z},A.init=function(b,d){if(!b)return A.Z();if(F(b))return c(h).ready(b);if(A.isZ(b))return b;var e;if(K(b))e=M(b);else if(I(b))e=[J(b)?c.extend({},b):b],b=null;else if(m.test(b))e=A.fragment(b.trim(),RegExp.$1,d),b=null;else{if(d!==a)return c(d).find(b);e=A.qsa(h,b)}return A.Z(e,b)},c=function(a,b){return A.init(a,b)},c.extend=function(a){var b,c=f.call(arguments,1);return typeof a=="boolean"&&(b=a,a=c.shift()),c.forEach(function(c){T(a,c,b)}),a},A.qsa=function(a,b){var c;return H(a)&&w.test(b)?(c=a.getElementById(RegExp.$1))?[c]:[]:a.nodeType!==1&&a.nodeType!==9?[]:f.call(v.test(b)?a.getElementsByClassName(RegExp.$1):x.test(b)?a.getElementsByTagName(b):a.querySelectorAll(b))},c.contains=function(a,b){return a!==b&&a.contains(b)},c.type=E,c.isFunction=F,c.isWindow=G,c.isArray=K,c.isPlainObject=J,c.isEmptyObject=function(a){var b;for(b in a)return!1;return!0},c.inArray=function(a,b,c){return e.indexOf.call(b,a,c)},c.camelCase=B,c.trim=function(a){return a.trim()},c.uuid=0,c.support={},c.expr={},c.map=function(a,b){var c,d=[],e,f;if(L(a))for(e=0;e<a.length;e++)c=b(a[e],e),c!=null&&d.push(c);else for(f in a)c=b(a[f],f),c!=null&&d.push(c);return N(d)},c.each=function(a,b){var c,d;if(L(a)){for(c=0;c<a.length;c++)if(b.call(a[c],c,a[c])===!1)return a}else for(d in a)if(b.call(a[d],d,a[d])===!1)return a;return a},c.grep=function(a,b){return g.call(a,b)},window.JSON&&(c.parseJSON=JSON.parse),c.each("Boolean Number String Function Array Date RegExp Object Error".split(" "),function(a,b){y["[object "+b+"]"]=b.toLowerCase()}),c.fn={forEach:e.forEach,reduce:e.reduce,push:e.push,sort:e.sort,indexOf:e.indexOf,concat:e.concat,map:function(a){return c(c.map(this,function(b,c){return a.call(b,c,b)}))},slice:function(){return c(f.apply(this,arguments))},ready:function(a){return u.test(h.readyState)?a(c):h.addEventListener("DOMContentLoaded",function(){a(c)},!1),this},get:function(b){return b===a?f.call(this):this[b>=0?b:b+this.length]},toArray:function(){return this.get()},size:function(){return this.length},remove:function(){return this.each(function(){this.parentNode!=null&&this.parentNode.removeChild(this)})},each:function(a){return e.every.call(this,function(b,c){return a.call(b,c,b)!==!1}),this},filter:function(a){return F(a)?this.not(this.not(a)):c(g.call(this,function(b){return A.matches(b,a)}))},add:function(a,b){return c(C(this.concat(c(a,b))))},is:function(a){return this.length>0&&A.matches(this[0],a)},not:function(b){var d=[];if(F(b)&&b.call!==a)this.each(function(a){b.call(this,a)||d.push(this)});else{var e=typeof b=="string"?this.filter(b):L(b)&&F(b.item)?f.call(b):c(b);this.forEach(function(a){e.indexOf(a)<0&&d.push(a)})}return c(d)},has:function(a){return this.filter(function(){return I(a)?c.contains(this,a):c(this).find(a).size()})},eq:function(a){return a===-1?this.slice(a):this.slice(a,+a+1)},first:function(){var a=this[0];return a&&!I(a)?a:c(a)},last:function(){var a=this[this.length-1];return a&&!I(a)?a:c(a)},find:function(a){var b,d=this;return typeof a=="object"?b=c(a).filter(function(){var a=this;return e.some.call(d,function(b){return c.contains(b,a)})}):this.length==1?b=c(A.qsa(this[0],a)):b=this.map(function(){return A.qsa(this,a)}),b},closest:function(a,b){var d=this[0],e=!1;typeof a=="object"&&(e=c(a));while(d&&!(e?e.indexOf(d)>=0:A.matches(d,a)))d=d!==b&&!H(d)&&d.parentNode;return c(d)},parents:function(a){var b=[],d=this;while(d.length>0)d=c.map(d,function(a){if((a=a.parentNode)&&!H(a)&&b.indexOf(a)<0)return b.push(a),a});return U(b,a)},parent:function(a){return U(C(this.pluck("parentNode")),a)},children:function(a){return U(this.map(function(){return S(this)}),a)},contents:function(){return this.map(function(){return f.call(this.childNodes)})},siblings:function(a){return U(this.map(function(a,b){return g.call(S(b.parentNode),function(a){return a!==b})}),a)},empty:function(){return this.each(function(){this.innerHTML=""})},pluck:function(a){return c.map(this,function(b){return b[a]})},show:function(){return this.each(function(){this.style.display=="none"&&(this.style.display=null),k(this,"").getPropertyValue("display")=="none"&&(this.style.display=R(this.nodeName))})},replaceWith:function(a){return this.before(a).remove()},wrap:function(a){var b=F(a);if(this[0]&&!b)var d=c(a).get(0),e=d.parentNode||this.length>1;return this.each(function(f){c(this).wrapAll(b?a.call(this,f):e?d.cloneNode(!0):d)})},wrapAll:function(a){if(this[0]){c(this[0]).before(a=c(a));var b;while((b=a.children()).length)a=b.first();c(a).append(this)}return this},wrapInner:function(a){var b=F(a);return this.each(function(d){var e=c(this),f=e.contents(),g=b?a.call(this,d):a;f.length?f.wrapAll(g):e.append(g)})},unwrap:function(){return this.parent().each(function(){c(this).replaceWith(c(this).children())}),this},clone:function(){return this.map(function(){return this.cloneNode(!0)})},hide:function(){return this.css("display","none")},toggle:function(b){return this.each(function(){var d=c(this);(b===a?d.css("display")=="none":b)?d.show():d.hide()})},prev:function(a){return c(this.pluck("previousElementSibling")).filter(a||"*")},next:function(a){return c(this.pluck("nextElementSibling")).filter(a||"*")},html:function(b){return b===a?this.length>0?this[0].innerHTML:null:this.each(function(a){var d=this.innerHTML;c(this).empty().append(V(this,b,a,d))})},text:function(b){return b===a?this.length>0?this[0].textContent:null:this.each(function(){this.textContent=b})},attr:function(c,d){var e;return typeof c=="string"&&d===a?this.length==0||this[0].nodeType!==1?a:c=="value"&&this[0].nodeName=="INPUT"?this.val():!(e=this[0].getAttribute(c))&&c in this[0]?this[0][c]:e:this.each(function(a){if(this.nodeType!==1)return;if(I(c))for(b in c)W(this,b,c[b]);else W(this,c,V(this,d,a,this.getAttribute(c)))})},removeAttr:function(a){return this.each(function(){this.nodeType===1&&W(this,a)})},prop:function(b,c){return c===a?this[0]&&this[0][b]:this.each(function(a){this[b]=V(this,c,a,this[b])})},data:function(b,c){var d=this.attr("data-"+O(b),c);return d!==null?Y(d):a},val:function(b){return b===a?this[0]&&(this[0].multiple?c(this[0]).find("option").filter(function(a){return this.selected}).pluck("value"):this[0].value):this.each(function(a){this.value=V(this,b,a,this.value)})},offset:function(a){if(a)return this.each(function(b){var d=c(this),e=V(this,a,b,d.offset()),f=d.offsetParent().offset(),g={top:e.top-f.top,left:e.left-f.left};d.css("position")=="static"&&(g.position="relative"),d.css(g)});if(this.length==0)return null;var b=this[0].getBoundingClientRect();return{left:b.left+window.pageXOffset,top:b.top+window.pageYOffset,width:Math.round(b.width),height:Math.round(b.height)}},css:function(a,c){if(arguments.length<2&&typeof a=="string")return this[0]&&(this[0].style[B(a)]||k(this[0],"").getPropertyValue(a));var d="";if(E(a)=="string")!c&&c!==0?this.each(function(){this.style.removeProperty(O(a))}):d=O(a)+":"+Q(a,c);else for(b in a)!a[b]&&a[b]!==0?this.each(function(){this.style.removeProperty(O(b))}):d+=O(b)+":"+Q(b,a[b])+";";return this.each(function(){this.style.cssText+=";"+d})},index:function(a){return a?this.indexOf(c(a)[0]):this.parent().children().indexOf(this[0])},hasClass:function(a){return e.some.call(this,function(a){return this.test(X(a))},P(a))},addClass:function(a){return this.each(function(b){d=[];var e=X(this),f=V(this,a,b,e);f.split(/\s+/g).forEach(function(a){c(this).hasClass(a)||d.push(a)},this),d.length&&X(this,e+(e?" ":"")+d.join(" "))})},removeClass:function(b){return this.each(function(c){if(b===a)return X(this,"");d=X(this),V(this,b,c,d).split(/\s+/g).forEach(function(a){d=d.replace(P(a)," ")}),X(this,d.trim())})},toggleClass:function(b,d){return this.each(function(e){var f=c(this),g=V(this,b,e,X(this));g.split(/\s+/g).forEach(function(b){(d===a?!f.hasClass(b):d)?f.addClass(b):f.removeClass(b)})})},scrollTop:function(){if(!this.length)return;return"scrollTop"in this[0]?this[0].scrollTop:this[0].scrollY},position:function(){if(!this.length)return;var a=this[0],b=this.offsetParent(),d=this.offset(),e=o.test(b[0].nodeName)?{top:0,left:0}:b.offset();return d.top-=parseFloat(c(a).css("margin-top"))||0,d.left-=parseFloat(c(a).css("margin-left"))||0,e.top+=parseFloat(c(b[0]).css("border-top-width"))||0,e.left+=parseFloat(c(b[0]).css("border-left-width"))||0,{top:d.top-e.top,left:d.left-e.left}},offsetParent:function(){return this.map(function(){var a=this.offsetParent||h.body;while(a&&!o.test(a.nodeName)&&c(a).css("position")=="static")a=a.offsetParent;return a})}},c.fn.detach=c.fn.remove,["width","height"].forEach(function(b){c.fn[b]=function(d){var e,f=this[0],g=b.replace(/./,function(a){return a[0].toUpperCase()});return d===a?G(f)?f["inner"+g]:H(f)?f.documentElement["offset"+g]:(e=this.offset())&&e[b]:this.each(function(a){f=c(this),f.css(b,V(this,d,a,f[b]()))})}}),q.forEach(function(a,b){var d=b%2;c.fn[a]=function(){var a,e=c.map(arguments,function(b){return a=E(b),a=="object"||a=="array"||b==null?b:A.fragment(b)}),f,g=this.length>1;return e.length<1?this:this.each(function(a,h){f=d?h:h.parentNode,h=b==0?h.nextSibling:b==1?h.firstChild:b==2?h:null,e.forEach(function(a){if(g)a=a.cloneNode(!0);else if(!f)return c(a).remove();Z(f.insertBefore(a,h),function(a){a.nodeName!=null&&a.nodeName.toUpperCase()==="SCRIPT"&&(!a.type||a.type==="text/javascript")&&!a.src&&window.eval.call(window,a.innerHTML)})})})},c.fn[d?a+"To":"insert"+(b?"Before":"After")]=function(b){return c(b)[a](this),this}}),A.Z.prototype=c.fn,A.uniq=C,A.deserializeValue=Y,c.zepto=A,c}();window.Zepto=Zepto,"$"in window||(window.$=Zepto),function(a){function b(a){var b=this.os={},c=this.browser={},d=a.match(/WebKit\/([\d.]+)/),e=a.match(/(Android)\s+([\d.]+)/),f=a.match(/(iPad).*OS\s([\d_]+)/),g=!f&&a.match(/(iPhone\sOS)\s([\d_]+)/),h=a.match(/(webOS|hpwOS)[\s\/]([\d.]+)/),i=h&&a.match(/TouchPad/),j=a.match(/Kindle\/([\d.]+)/),k=a.match(/Silk\/([\d._]+)/),l=a.match(/(BlackBerry).*Version\/([\d.]+)/),m=a.match(/(BB10).*Version\/([\d.]+)/),n=a.match(/(RIM\sTablet\sOS)\s([\d.]+)/),o=a.match(/PlayBook/),p=a.match(/Chrome\/([\d.]+)/)||a.match(/CriOS\/([\d.]+)/),q=a.match(/Firefox\/([\d.]+)/);if(c.webkit=!!d)c.version=d[1];e&&(b.android=!0,b.version=e[2]),g&&(b.ios=b.iphone=!0,b.version=g[2].replace(/_/g,".")),f&&(b.ios=b.ipad=!0,b.version=f[2].replace(/_/g,".")),h&&(b.webos=!0,b.version=h[2]),i&&(b.touchpad=!0),l&&(b.blackberry=!0,b.version=l[2]),m&&(b.bb10=!0,b.version=m[2]),n&&(b.rimtabletos=!0,b.version=n[2]),o&&(c.playbook=!0),j&&(b.kindle=!0,b.version=j[1]),k&&(c.silk=!0,c.version=k[1]),!k&&b.android&&a.match(/Kindle Fire/)&&(c.silk=!0),p&&(c.chrome=!0,c.version=p[1]),q&&(c.firefox=!0,c.version=q[1]),b.tablet=!!(f||o||e&&!a.match(/Mobile/)||q&&a.match(/Tablet/)),b.phone=!b.tablet&&!!(e||g||h||l||m||p&&a.match(/Android/)||p&&a.match(/CriOS\/([\d.]+)/)||q&&a.match(/Mobile/))}b.call(a,navigator.userAgent),a.__detect=b}(Zepto),function(a){function g(a){return a._zid||(a._zid=d++)}function h(a,b,d,e){b=i(b);if(b.ns)var f=j(b.ns);return(c[g(a)]||[]).filter(function(a){return a&&(!b.e||a.e==b.e)&&(!b.ns||f.test(a.ns))&&(!d||g(a.fn)===g(d))&&(!e||a.sel==e)})}function i(a){var b=(""+a).split(".");return{e:b[0],ns:b.slice(1).sort().join(" ")}}function j(a){return new RegExp("(?:^| )"+a.replace(" "," .* ?")+"(?: |$)")}function k(b,c,d){a.type(b)!="string"?a.each(b,d):b.split(/\s/).forEach(function(a){d(a,c)})}function l(a,b){return a.del&&(a.e=="focus"||a.e=="blur")||!!b}function m(a){return f[a]||a}function n(b,d,e,h,j,n){var o=g(b),p=c[o]||(c[o]=[]);k(d,e,function(c,d){var e=i(c);e.fn=d,e.sel=h,e.e in f&&(d=function(b){var c=b.relatedTarget;if(!c||c!==this&&!a.contains(this,c))return e.fn.apply(this,arguments)}),e.del=j&&j(d,c);var g=e.del||d;e.proxy=function(a){var c=g.apply(b,[a].concat(a.data));return c===!1&&(a.preventDefault(),a.stopPropagation()),c},e.i=p.length,p.push(e),b.addEventListener(m(e.e),e.proxy,l(e,n))})}function o(a,b,d,e,f){var i=g(a);k(b||"",d,function(b,d){h(a,b,d,e).forEach(function(b){delete c[i][b.i],a.removeEventListener(m(b.e),b.proxy,l(b,f))})})}function t(b){var c,d={originalEvent:b};for(c in b)!r.test(c)&&b[c]!==undefined&&(d[c]=b[c]);return a.each(s,function(a,c){d[a]=function(){return this[c]=p,b[a].apply(b,arguments)},d[c]=q}),d}function u(a){if(!("defaultPrevented"in a)){a.defaultPrevented=!1;var b=a.preventDefault;a.preventDefault=function(){this.defaultPrevented=!0,b.call(this)}}}var b=a.zepto.qsa,c={},d=1,e={},f={mouseenter:"mouseover",mouseleave:"mouseout"};e.click=e.mousedown=e.mouseup=e.mousemove="MouseEvents",a.event={add:n,remove:o},a.proxy=function(b,c){if(a.isFunction(b)){var d=function(){return b.apply(c,arguments)};return d._zid=g(b),d}if(typeof c=="string")return a.proxy(b[c],b);throw new TypeError("expected function")},a.fn.bind=function(a,b){return this.each(function(){n(this,a,b)})},a.fn.unbind=function(a,b){return this.each(function(){o(this,a,b)})},a.fn.one=function(a,b){return this.each(function(c,d){n(this,a,b,null,function(a,b){return function(){var c=a.apply(d,arguments);return o(d,b,a),c}})})};var p=function(){return!0},q=function(){return!1},r=/^([A-Z]|layer[XY]$)/,s={preventDefault:"isDefaultPrevented",stopImmediatePropagation:"isImmediatePropagationStopped",stopPropagation:"isPropagationStopped"};a.fn.delegate=function(b,c,d){return this.each(function(e,f){n(f,c,d,b,function(c){return function(d){var e,g=a(d.target).closest(b,f).get(0);if(g)return e=a.extend(t(d),{currentTarget:g,liveFired:f}),c.apply(g,[e].concat([].slice.call(arguments,1)))}})})},a.fn.undelegate=function(a,b,c){return this.each(function(){o(this,b,c,a)})},a.fn.live=function(b,c){return a(document.body).delegate(this.selector,b,c),this},a.fn.die=function(b,c){return a(document.body).undelegate(this.selector,b,c),this},a.fn.on=function(b,c,d){return!c||a.isFunction(c)?this.bind(b,c||d):this.delegate(c,b,d)},a.fn.off=function(b,c,d){return!c||a.isFunction(c)?this.unbind(b,c||d):this.undelegate(c,b,d)},a.fn.trigger=function(b,c){if(typeof b=="string"||a.isPlainObject(b))b=a.Event(b);return u(b),b.data=c,this.each(function(){"dispatchEvent"in this&&this.dispatchEvent(b)})},a.fn.triggerHandler=function(b,c){var d,e;return this.each(function(f,g){d=t(typeof b=="string"?a.Event(b):b),d.data=c,d.target=g,a.each(h(g,b.type||b),function(a,b){e=b.proxy(d);if(d.isImmediatePropagationStopped())return!1})}),e},"focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select keydown keypress keyup error".split(" ").forEach(function(b){a.fn[b]=function(a){return a?this.bind(b,a):this.trigger(b)}}),["focus","blur"].forEach(function(b){a.fn[b]=function(a){return a?this.bind(b,a):this.each(function(){try{this[b]()}catch(a){}}),this}}),a.Event=function(a,b){typeof a!="string"&&(b=a,a=b.type);var c=document.createEvent(e[a]||"Events"),d=!0;if(b)for(var f in b)f=="bubbles"?d=!!b[f]:c[f]=b[f];return c.initEvent(a,d,!0,null,null,null,null,null,null,null,null,null,null,null,null),c.isDefaultPrevented=function(){return this.defaultPrevented},c}}(Zepto),function($){function triggerAndReturn(a,b,c){var d=$.Event(b);return $(a).trigger(d,c),!d.defaultPrevented}function triggerGlobal(a,b,c,d){if(a.global)return triggerAndReturn(b||document,c,d)}function ajaxStart(a){a.global&&$.active++===0&&triggerGlobal(a,null,"ajaxStart")}function ajaxStop(a){a.global&&!--$.active&&triggerGlobal(a,null,"ajaxStop")}function ajaxBeforeSend(a,b){var c=b.context;if(b.beforeSend.call(c,a,b)===!1||triggerGlobal(b,c,"ajaxBeforeSend",[a,b])===!1)return!1;triggerGlobal(b,c,"ajaxSend",[a,b])}function ajaxSuccess(a,b,c){var d=c.context,e="success";c.success.call(d,a,e,b),triggerGlobal(c,d,"ajaxSuccess",[b,c,a]),ajaxComplete(e,b,c)}function ajaxError(a,b,c,d){var e=d.context;d.error.call(e,c,b,a),triggerGlobal(d,e,"ajaxError",[c,d,a]),ajaxComplete(b,c,d)}function ajaxComplete(a,b,c){var d=c.context;c.complete.call(d,b,a),triggerGlobal(c,d,"ajaxComplete",[b,c]),ajaxStop(c)}function empty(){}function mimeToDataType(a){return a&&(a=a.split(";",2)[0]),a&&(a==htmlType?"html":a==jsonType?"json":scriptTypeRE.test(a)?"script":xmlTypeRE.test(a)&&"xml")||"text"}function appendQuery(a,b){return(a+"&"+b).replace(/[&?]{1,2}/,"?")}function serializeData(a){a.processData&&a.data&&$.type(a.data)!="string"&&(a.data=$.param(a.data,a.traditional)),a.data&&(!a.type||a.type.toUpperCase()=="GET")&&(a.url=appendQuery(a.url,a.data))}function parseArguments(a,b,c,d){var e=!$.isFunction(b);return{url:a,data:e?b:undefined,success:e?$.isFunction(c)?c:undefined:b,dataType:e?d||c:c}}function serialize(a,b,c,d){var e,f=$.isArray(b);$.each(b,function(b,g){e=$.type(g),d&&(b=c?d:d+"["+(f?"":b)+"]"),!d&&f?a.add(g.name,g.value):e=="array"||!c&&e=="object"?serialize(a,g,c,b):a.add(b,g)})}var jsonpID=0,document=window.document,key,name,rscript=/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi,scriptTypeRE=/^(?:text|application)\/javascript/i,xmlTypeRE=/^(?:text|application)\/xml/i,jsonType="application/json",htmlType="text/html",blankRE=/^\s*$/;$.active=0,$.ajaxJSONP=function(a){if("type"in a){var b="jsonp"+ ++jsonpID,c=document.createElement("script"),d=function(){clearTimeout(g),$(c).remove(),delete window[b]},e=function(c){d();if(!c||c=="timeout")window[b]=empty;ajaxError(null,c||"abort",f,a)},f={abort:e},g;return ajaxBeforeSend(f,a)===!1?(e("abort"),!1):(window[b]=function(b){d(),ajaxSuccess(b,f,a)},c.onerror=function(){e("error")},c.src=a.url.replace(/=\?/,"="+b),$("head").append(c),a.timeout>0&&(g=setTimeout(function(){e("timeout")},a.timeout)),f)}return $.ajax(a)},$.ajaxSettings={type:"GET",beforeSend:empty,success:empty,error:empty,complete:empty,context:null,global:!0,xhr:function(){return new window.XMLHttpRequest},accepts:{script:"text/javascript, application/javascript",json:jsonType,xml:"application/xml, text/xml",html:htmlType,text:"text/plain"},crossDomain:!1,timeout:0,processData:!0,cache:!0},$.ajax=function(options){var settings=$.extend({},options||{});for(key in $.ajaxSettings)settings[key]===undefined&&(settings[key]=$.ajaxSettings[key]);ajaxStart(settings),settings.crossDomain||(settings.crossDomain=/^([\w-]+:)?\/\/([^\/]+)/.test(settings.url)&&RegExp.$2!=window.location.host),settings.url||(settings.url=window.location.toString()),serializeData(settings),settings.cache===!1&&(settings.url=appendQuery(settings.url,"_="+Date.now()));var dataType=settings.dataType,hasPlaceholder=/=\?/.test(settings.url);if(dataType=="jsonp"||hasPlaceholder)return hasPlaceholder||(settings.url=appendQuery(settings.url,"callback=?")),$.ajaxJSONP(settings);var mime=settings.accepts[dataType],baseHeaders={},protocol=/^([\w-]+:)\/\//.test(settings.url)?RegExp.$1:window.location.protocol,xhr=settings.xhr(),abortTimeout;settings.crossDomain||(baseHeaders["X-Requested-With"]="XMLHttpRequest"),mime&&(baseHeaders.Accept=mime,mime.indexOf(",")>-1&&(mime=mime.split(",",2)[0]),xhr.overrideMimeType&&xhr.overrideMimeType(mime));if(settings.contentType||settings.contentType!==!1&&settings.data&&settings.type.toUpperCase()!="GET")baseHeaders["Content-Type"]=settings.contentType||"application/x-www-form-urlencoded";settings.headers=$.extend(baseHeaders,settings.headers||{}),xhr.onreadystatechange=function(){if(xhr.readyState==4){xhr.onreadystatechange=empty,clearTimeout(abortTimeout);var result,error=!1;if(xhr.status>=200&&xhr.status<300||xhr.status==304||xhr.status==0&&protocol=="file:"){dataType=dataType||mimeToDataType(xhr.getResponseHeader("content-type")),result=xhr.responseText;try{dataType=="script"?(1,eval)(result):dataType=="xml"?result=xhr.responseXML:dataType=="json"&&(result=blankRE.test(result)?null:$.parseJSON(result))}catch(e){error=e}error?ajaxError(error,"parsererror",xhr,settings):ajaxSuccess(result,xhr,settings)}else ajaxError(null,xhr.status?"error":"abort",xhr,settings)}};var async="async"in settings?settings.async:!0;xhr.open(settings.type,settings.url,async);for(name in settings.headers)xhr.setRequestHeader(name,settings.headers[name]);return ajaxBeforeSend(xhr,settings)===!1?(xhr.abort(),!1):(settings.timeout>0&&(abortTimeout=setTimeout(function(){xhr.onreadystatechange=empty,xhr.abort(),ajaxError(null,"timeout",xhr,settings)},settings.timeout)),xhr.send(settings.data?settings.data:null),xhr)},$.get=function(a,b,c,d){return $.ajax(parseArguments.apply(null,arguments))},$.post=function(a,b,c,d){var e=parseArguments.apply(null,arguments);return e.type="POST",$.ajax(e)},$.getJSON=function(a,b,c){var d=parseArguments.apply(null,arguments);return d.dataType="json",$.ajax(d)},$.fn.load=function(a,b,c){if(!this.length)return this;var d=this,e=a.split(/\s/),f,g=parseArguments(a,b,c),h=g.success;return e.length>1&&(g.url=e[0],f=e[1]),g.success=function(a){d.html(f?$("<div>").html(a.replace(rscript,"")).find(f):a),h&&h.apply(d,arguments)},$.ajax(g),this};var escape=encodeURIComponent;$.param=function(a,b){var c=[];return c.add=function(a,b){this.push(escape(a)+"="+escape(b))},serialize(c,a,b),c.join("&").replace(/%20/g,"+")}}(Zepto),function(a){a.fn.serializeArray=function(){var b=[],c;return a(Array.prototype.slice.call(this.get(0).elements)).each(function(){c=a(this);var d=c.attr("type");this.nodeName.toLowerCase()!="fieldset"&&!this.disabled&&d!="submit"&&d!="reset"&&d!="button"&&(d!="radio"&&d!="checkbox"||this.checked)&&b.push({name:c.attr("name"),value:c.val()})}),b},a.fn.serialize=function(){var a=[];return this.serializeArray().forEach(function(b){a.push(encodeURIComponent(b.name)+"="+encodeURIComponent(b.value))}),a.join("&")},a.fn.submit=function(b){if(b)this.bind("submit",b);else if(this.length){var c=a.Event("submit");this.eq(0).trigger(c),c.defaultPrevented||this.get(0).submit()}return this}}(Zepto),function(a,b){function s(a){return t(a.replace(/([a-z])([A-Z])/,"$1-$2"))}function t(a){return a.toLowerCase()}function u(a){return d?d+a:t(a)}var c="",d,e,f,g={Webkit:"webkit",Moz:"",O:"o",ms:"MS"},h=window.document,i=h.createElement("div"),j=/^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i,k,l,m,n,o,p,q,r={};a.each(g,function(a,e){if(i.style[a+"TransitionProperty"]!==b)return c="-"+t(a)+"-",d=e,!1}),k=c+"transform",r[l=c+"transition-property"]=r[m=c+"transition-duration"]=r[n=c+"transition-timing-function"]=r[o=c+"animation-name"]=r[p=c+"animation-duration"]=r[q=c+"animation-timing-function"]="",a.fx={off:d===b&&i.style.transitionProperty===b,speeds:{_default:400,fast:200,slow:600},cssPrefix:c,transitionEnd:u("TransitionEnd"),animationEnd:u("AnimationEnd")},a.fn.animate=function(b,c,d,e){return a.isPlainObject(c)&&(d=c.easing,e=c.complete,c=c.duration),c&&(c=(typeof c=="number"?c:a.fx.speeds[c]||a.fx.speeds._default)/1e3),this.anim(b,c,d,e)},a.fn.anim=function(c,d,e,f){var g,h={},i,t="",u=this,v,w=a.fx.transitionEnd;d===b&&(d=.4),a.fx.off&&(d=0);if(typeof c=="string")h[o]=c,h[p]=d+"s",h[q]=e||"linear",w=a.fx.animationEnd;else{i=[];for(g in c)j.test(g)?t+=g+"("+c[g]+") ":(h[g]=c[g],i.push(s(g)));t&&(h[k]=t,i.push(k)),d>0&&typeof c=="object"&&(h[l]=i.join(", "),h[m]=d+"s",h[n]=e||"linear")}return v=function(b){if(typeof b!="undefined"){if(b.target!==b.currentTarget)return;a(b.target).unbind(w,v)}a(this).css(r),f&&f.call(this)},d>0&&this.bind(w,v),this.size()&&this.get(0).clientLeft,this.css(h),d<=0&&setTimeout(function(){u.each(function(){v.call(this)})},0),this},i=null}(Zepto),function(a){function h(a){return"tagName"in a?a:a.parentNode}function i(a,b,c,d){var e=Math.abs(a-b),f=Math.abs(c-d);return e>=f?a-b>0?"Left":"Right":c-d>0?"Up":"Down"}function j(){g=null,b.last&&(b.el.trigger("longTap"),b={})}function k(){g&&clearTimeout(g),g=null}function l(){c&&clearTimeout(c),d&&clearTimeout(d),e&&clearTimeout(e),g&&clearTimeout(g),c=d=e=g=null,b={}}var b={},c,d,e,f=750,g;a(document).ready(function(){var m,n;a(document.body).bind("touchstart",function(d){m=Date.now(),n=m-(b.last||m),b.el=a(h(d.touches[0].target)),c&&clearTimeout(c),b.x1=d.touches[0].pageX,b.y1=d.touches[0].pageY,n>0&&n<=250&&(b.isDoubleTap=!0),b.last=m,g=setTimeout(j,f)}).bind("touchmove",function(a){k(),b.x2=a.touches[0].pageX,b.y2=a.touches[0].pageY,Math.abs(b.x1-b.x2)>10&&a.preventDefault()}).bind("touchend",function(f){k(),b.x2&&Math.abs(b.x1-b.x2)>30||b.y2&&Math.abs(b.y1-b.y2)>30?e=setTimeout(function(){b.el.trigger("swipe"),b.el.trigger("swipe"+i(b.x1,b.x2,b.y1,b.y2)),b={}},0):"last"in b&&(d=setTimeout(function(){var d=a.Event("tap");d.cancelTouch=l,b.el.trigger(d),b.isDoubleTap?(b.el.trigger("doubleTap"),b={}):c=setTimeout(function(){c=null,b.el.trigger("singleTap"),b={}},250)},0))}).bind("touchcancel",l),a(window).bind("scroll",l)}),["swipe","swipeLeft","swipeRight","swipeUp","swipeDown","doubleTap","tap","singleTap","longTap"].forEach(function(b){a.fn[b]=function(a){return this.bind(b,a)}})}(Zepto)
\ No newline at end of file