diff --git a/.gitignore b/.gitignore
index c0b5a6a..99d84ed 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,4 @@
 .DS_Store
 node_modules
 bower_components
-/out
+/dist
diff --git a/README.md b/README.md
index 3b07132..6e09bb0 100644
--- a/README.md
+++ b/README.md
@@ -108,7 +108,7 @@ First of all, please check if the container element meets the
 requirements.
 
 ```html
-<link rel='stylesheet' href='out/css/perfect-scrollbar.css' />
+<link rel='stylesheet' href='dist/css/perfect-scrollbar.css' />
 <style>
   #container {
     position: relative;
@@ -128,7 +128,7 @@ var Ps = require('perfect-scrollbar');
 Or you can just load the script file as usual.
 
 ```html
-<script src='out/js/perfect-scrollbar.js'></script>
+<script src='dist/js/perfect-scrollbar.js'></script>
 ```
 
 To initialise the plugin, `Ps.initialize` is used.
@@ -187,7 +187,7 @@ require('perfect-scrollbar/jquery')($);
 For sure, you can just import a built script.
 
 ```html
-<script src='out/js/perfect-scrollbar.jquery.js'></script>
+<script src='dist/js/perfect-scrollbar.jquery.js'></script>
 ```
 
 After importing it, you can use the plugin in the usual way.
diff --git a/bower.json b/bower.json
index e7a1c1e..27dd81d 100644
--- a/bower.json
+++ b/bower.json
@@ -7,8 +7,8 @@
   ],
   "description": "Tiny but perfect jQuery scrollbar plugin",
   "main": [
-    "out/css/perfect-scrollbar.css",
-    "out/js/perfect-scrollbar.js"
+    "dist/css/perfect-scrollbar.css",
+    "dist/js/perfect-scrollbar.js"
   ],
   "license": "MIT",
   "ignore": [
diff --git a/examples/always-visible.html b/examples/always-visible.html
index 7e0852d..0a86603 100644
--- a/examples/always-visible.html
+++ b/examples/always-visible.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       h1 { text-align: center; }
       .container { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
diff --git a/examples/iframe-content.html b/examples/iframe-content.html
index 8595da8..3b6ff21 100644
--- a/examples/iframe-content.html
+++ b/examples/iframe-content.html
@@ -3,7 +3,7 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-      <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
+      <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
       <style>
         .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
         .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/iframe.html b/examples/iframe.html
index c797bf5..38402e6 100644
--- a/examples/iframe.html
+++ b/examples/iframe.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       #iframe { width: 100%; min-height: 450px; border: 0; }
       html { direction: rtl; }
diff --git a/examples/jquery.html b/examples/jquery.html
index cf5911c..3badd6a 100644
--- a/examples/jquery.html
+++ b/examples/jquery.html
@@ -3,9 +3,9 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
-    <script src="../out/js/perfect-scrollbar.jquery.js"></script>
+    <script src="../dist/js/perfect-scrollbar.jquery.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/options-default.html b/examples/options-default.html
index 188d3a9..96e6853 100644
--- a/examples/options-default.html
+++ b/examples/options-default.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/options-minScrollbarLength.html b/examples/options-minScrollbarLength.html
index 07ec578..3c73ca1 100644
--- a/examples/options-minScrollbarLength.html
+++ b/examples/options-minScrollbarLength.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 12800px; height: 7200px; }
diff --git a/examples/options-suppressScrollAxis.html b/examples/options-suppressScrollAxis.html
index d8cf7b7..bd55d80 100644
--- a/examples/options-suppressScrollAxis.html
+++ b/examples/options-suppressScrollAxis.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/options-useBothWheelAxes.html b/examples/options-useBothWheelAxes.html
index 3c2db25..3a5e340 100644
--- a/examples/options-useBothWheelAxes.html
+++ b/examples/options-useBothWheelAxes.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: hidden; }
       .contentHolder .content-x { background-image: url('./azusa.jpg'); width: 1920px; height: 360px; }
diff --git a/examples/options-wheelPropagation.html b/examples/options-wheelPropagation.html
index 4a394d4..13d0d89 100644
--- a/examples/options-wheelPropagation.html
+++ b/examples/options-wheelPropagation.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/options-wheelSpeed.html b/examples/options-wheelSpeed.html
index a9d916f..6baab00 100644
--- a/examples/options-wheelSpeed.html
+++ b/examples/options-wheelSpeed.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/reach-the-end-callback.html b/examples/reach-the-end-callback.html
index a6b7783..eff99a3 100644
--- a/examples/reach-the-end-callback.html
+++ b/examples/reach-the-end-callback.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       #description {
         border: 1px solid gray;
diff --git a/examples/removable-list-element.html b/examples/removable-list-element.html
index 36ffdfd..c749f45 100644
--- a/examples/removable-list-element.html
+++ b/examples/removable-list-element.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       #test {
         border: 1px solid gray;
diff --git a/examples/rtl.html b/examples/rtl.html
index 8cdde24..390bf92 100644
--- a/examples/rtl.html
+++ b/examples/rtl.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/scrollbars-on-the-opposite-side.html b/examples/scrollbars-on-the-opposite-side.html
index ed466f9..f75cf81 100644
--- a/examples/scrollbars-on-the-opposite-side.html
+++ b/examples/scrollbars-on-the-opposite-side.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/scrollbars-with-margin.html b/examples/scrollbars-with-margin.html
index 1445023..848ece1 100644
--- a/examples/scrollbars-with-margin.html
+++ b/examples/scrollbars-with-margin.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
diff --git a/examples/table-content.html b/examples/table-content.html
index 893906d..9b3564d 100644
--- a/examples/table-content.html
+++ b/examples/table-content.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       #table {
         font-size: 20px;
diff --git a/examples/text-content.html b/examples/text-content.html
index 6b7b2a9..619c973 100644
--- a/examples/text-content.html
+++ b/examples/text-content.html
@@ -3,8 +3,8 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <title>perfect-scrollbar example</title>
-    <link href="../out/css/perfect-scrollbar.css" rel="stylesheet">
-    <script src="../out/js/perfect-scrollbar.global.js"></script>
+    <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
+    <script src="../dist/js/perfect-scrollbar.global.js"></script>
     <style>
       #description {
         border: 1px solid gray;
diff --git a/gulpfile.js b/gulpfile.js
index d7678cb..a630ba6 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -20,12 +20,12 @@ gulp.task('lint', function () {
 });
 
 gulp.task('clean:js', function () {
-  return gulp.src('./out/js/*.js', {read: false})
+  return gulp.src('./dist/js/*.js', {read: false})
     .pipe(rimraf());
 });
 
 gulp.task('clean:js:min', function () {
-  return gulp.src('./out/js/min/*.js', {read: false})
+  return gulp.src('./dist/js/min/*.js', {read: false})
     .pipe(rimraf());
 });
 
@@ -46,7 +46,7 @@ gulp.task('js', ['clean:js'], function () {
         path.basename = 'perfect-scrollbar.' + path.basename;
       }
     }))
-    .pipe(gulp.dest('./out/js'))
+    .pipe(gulp.dest('./dist/js'))
     .pipe(connect.reload());
 });
 
@@ -61,16 +61,16 @@ gulp.task('js:min', ['clean:js:min'], function () {
         path.basename = 'perfect-scrollbar.' + path.basename + '.min';
       }
     }))
-    .pipe(gulp.dest('./out/js/min'));
+    .pipe(gulp.dest('./dist/js/min'));
 });
 
 gulp.task('clean:css', function () {
-  return gulp.src('./out/css/perfect-scrollbar.css', {read: false})
+  return gulp.src('./dist/css/perfect-scrollbar.css', {read: false})
     .pipe(rimraf());
 });
 
 gulp.task('clean:css:min', function () {
-  return gulp.src('./out/css/perfect-scrollbar.min.css', {read: false})
+  return gulp.src('./dist/css/perfect-scrollbar.min.css', {read: false})
     .pipe(rimraf());
 });
 
@@ -78,7 +78,7 @@ gulp.task('sass', ['clean:css'], function () {
   return gulp.src('./src/css/main.scss')
     .pipe(sass())
     .pipe(rename('perfect-scrollbar.css'))
-    .pipe(gulp.dest('./out/css'))
+    .pipe(gulp.dest('./dist/css'))
     .pipe(connect.reload());
 });
 
@@ -86,7 +86,7 @@ gulp.task('sass:min', ['clean:css:min'], function () {
   return gulp.src('./src/css/main.scss')
     .pipe(sass({outputStyle: 'compressed'}))
     .pipe(rename('perfect-scrollbar.min.css'))
-    .pipe(gulp.dest('./out/css'));
+    .pipe(gulp.dest('./dist/css'));
 });
 
 function bumpType() {
@@ -124,9 +124,9 @@ gulp.task('watch', function () {
 gulp.task('serve', ['connect', 'watch']);
 
 gulp.task('compress', function () {
-  return gulp.src('./out/**')
+  return gulp.src('./dist/**')
     .pipe(zip('perfect-scrollbar.zip'))
-    .pipe(gulp.dest('./out'));
+    .pipe(gulp.dest('./dist'));
 });
 
 gulp.task('default', ['lint', 'build']);
