2 files changed, 17 insertions, 15 deletions

diff --git a/css/reveal.css b/css/reveal.css
index 8a4f579..db18bb0 100644
--- a/css/reveal.css
+++ b/css/reveal.css
@@ -251,21 +251,21 @@ body {
             transform: translateX(10.5px) translateY(23px) rotate(-36deg); }
   .reveal .controls .navigate-left {
     top: 50%;
-    left: 20px;
+    left: 8px;
     -webkit-transform: translateY(-50%);
             transform: translateY(-50%); }
   .reveal .controls .navigate-right {
     top: 50%;
-    right: 20px;
+    right: 8px;
     -webkit-transform: translateY(-50%) rotate(180deg);
             transform: translateY(-50%) rotate(180deg); }
   .reveal .controls .navigate-up {
-    top: 20px;
+    top: 8px;
     left: 50%;
     -webkit-transform: translateX(-50%) rotate(90deg);
             transform: translateX(-50%) rotate(90deg); }
   .reveal .controls .navigate-down {
-    bottom: 20px;
+    bottom: 8px;
     left: 50%;
     -webkit-transform: translateX(-50%) rotate(-90deg);
             transform: translateX(-50%) rotate(-90deg); }
@@ -290,8 +290,8 @@ body {
     opacity: 1; }
   .reveal .controls[data-controls-layout="bottom-right"] {
     top: auto;
-    bottom: 20px;
-    right: 20px;
+    bottom: 8px;
+    right: 8px;
     left: auto;
     -webkit-transform: scale(0.85);
             transform: scale(0.85);
@@ -318,8 +318,8 @@ body {
   @media screen and (max-width: 500px) {
     .reveal .controls {
       top: auto;
-      bottom: 20px;
-      right: 20px;
+      bottom: 8px;
+      right: 8px;
       left: auto;
       -webkit-transform: scale(0.85);
               transform: scale(0.85);
diff --git a/css/reveal.scss b/css/reveal.scss
index d2945ec..4a3c1a9 100644
--- a/css/reveal.scss
+++ b/css/reveal.scss
@@ -238,7 +238,7 @@ body {
 .reveal .controls {
 	$size: 52px;
 	$length: floor($size * 0.6);
-	$spacing: 20px;
+	$spacing: 8px;
 	$thickness: 6px;
 	$angle: 44deg;
 	$angleHover: 40deg;
@@ -374,6 +374,8 @@ body {
 	}
 
 	@mixin bottom-right-controls() {
+		$innerSpacing: 20px;
+
 		& {
 			top: auto;
 			bottom: $spacing;
@@ -392,19 +394,19 @@ body {
 		}
 
 		.navigate-left {
-			right: $size + $spacing*2;
-			bottom: $spacing;
+			right: $size + $innerSpacing*2;
+			bottom: $innerSpacing;
 		}
 		.navigate-right {
 			right: 0;
-			bottom: $spacing;
+			bottom: $innerSpacing;
 		}
 		.navigate-up {
-			right: $spacing;
-			bottom: $size + $spacing*2;
+			right: $innerSpacing;
+			bottom: $size + $innerSpacing*2;
 		}
 		.navigate-down {
-			right: $spacing;
+			right: $innerSpacing;
 			bottom: 0;
 		}
 	}