Fix slide nav positioning on [dir='rtl']

Author: Andrés González

src/less/Variables.less

@@ -103,6 +103,8 @@
 @opacity-slide-nav-title:		15;
 @opacity-slide-nav-desc:		 0;
 @opacity-slide-nav-desc-hover:  50;
+@width-slide-nav:				100px;
+@margin-slide-nav:				10px;
 
 /* Animation
 ================================================== */

src/less/slider/TL.SlideNav.less

@@ -19,7 +19,7 @@
     font-weight: inherit;
 
     .tl-slidenav-content-container {
-		width:100px;
+		width:@width-slide-nav;
 		position:absolute;
 	}
 	.tl-slidenav-title, .tl-slidenav-description {
@@ -102,8 +102,8 @@
 
 .tl-slidenav-next {
 	text-align: right;
-	margin-right:10px;
-    right: 100px;
+	margin-right:@margin-slide-nav;
+    right: @width-slide-nav;
 	.tl-slidenav-title, .tl-slidenav-description {
 		margin-left:20px;
 	}
@@ -116,7 +116,7 @@
 }
 .tl-slidenav-previous {
 	text-align: left;
-	margin-left:10px;
+	margin-left:@margin-slide-nav;
 	.tl-slidenav-icon {
 		margin-left: 0px;
 	}
@@ -125,6 +125,22 @@
 	}
 }
 
+// Fixes usage of browsers default setting of `direction: rtl`
+[dir="rtl"] {
+	.tl-slidenav-previous {
+		left: @width-slide-nav;
+		// due to the &nbsp, we need to tweak this margin
+		margin-left: -(@margin-slide-nav/2);
+	}
+	.tl-slidenav-next {
+		right: @margin-slide-nav;
+		margin-right: 0;
+		&:hover .tl-slidenav-icon {
+			margin-right: -4px;
+		}
+	}
+}
+
 
 
 /* NAVIGATION HOVER