1 files changed, 58 insertions, 15 deletions

diff --git a/css/reveal.scss b/css/reveal.scss
index 3321c98..330551b 100644
--- a/css/reveal.scss
+++ b/css/reveal.scss
@@ -121,6 +121,7 @@ body {
 
 .reveal .slides section .fragment.strike {
 	opacity: 1;
+	visibility: visible;
 
 	&.visible {
 		text-decoration: line-through;
@@ -214,66 +215,68 @@ body {
 	-webkit-user-select: none;
 }
 
-.reveal .controls div {
+.reveal .controls button {
+	padding: 0;
 	position: absolute;
 	opacity: 0.05;
 	width: 0;
 	height: 0;
+	background-color: transparent;
 	border: 12px solid transparent;
 	transform: scale(.9999);
 	transition: all 0.2s ease;
-
+	-webkit-appearance: none;
 	-webkit-tap-highlight-color: rgba( 0, 0, 0, 0 );
 }
 
-.reveal .controls div.enabled {
+.reveal .controls .enabled {
 	opacity: 0.7;
 	cursor: pointer;
 }
 
-.reveal .controls div.enabled:active {
+.reveal .controls .enabled:active {
 	margin-top: 1px;
 }
 
-	.reveal .controls div.navigate-left {
+	.reveal .controls .navigate-left {
 		top: 42px;
 
 		border-right-width: 22px;
 		border-right-color: #000;
 	}
-		.reveal .controls div.navigate-left.fragmented {
+		.reveal .controls .navigate-left.fragmented {
 			opacity: 0.3;
 		}
 
-	.reveal .controls div.navigate-right {
+	.reveal .controls .navigate-right {
 		left: 74px;
 		top: 42px;
 
 		border-left-width: 22px;
 		border-left-color: #000;
 	}
-		.reveal .controls div.navigate-right.fragmented {
+		.reveal .controls .navigate-right.fragmented {
 			opacity: 0.3;
 		}
 
-	.reveal .controls div.navigate-up {
+	.reveal .controls .navigate-up {
 		left: 42px;
 
 		border-bottom-width: 22px;
 		border-bottom-color: #000;
 	}
-		.reveal .controls div.navigate-up.fragmented {
+		.reveal .controls .navigate-up.fragmented {
 			opacity: 0.3;
 		}
 
-	.reveal .controls div.navigate-down {
+	.reveal .controls .navigate-down {
 		left: 42px;
 		top: 74px;
 
 		border-top-width: 22px;
 		border-top-color: #000;
 	}
-		.reveal .controls div.navigate-down.fragmented {
+		.reveal .controls .navigate-down.fragmented {
 			opacity: 0.3;
 		}
 
@@ -432,8 +435,8 @@ body {
  *********************************************/
 
 @mixin transition-global($style) {
-	.reveal .slides>section[data-transition=#{$style}],
-	.reveal.#{$style} .slides>section:not([data-transition]) {
+	.reveal .slides section[data-transition=#{$style}],
+	.reveal.#{$style} .slides section:not([data-transition]) {
 		@content;
 	}
 }
@@ -1226,7 +1229,7 @@ body {
 .reveal .playback {
 	position: fixed;
 	left: 15px;
-	bottom: 15px;
+	bottom: 20px;
 	z-index: 30;
 	cursor: pointer;
 	transition: all 400ms ease;
@@ -1288,10 +1291,50 @@ body {
  * SPEAKER NOTES
  *********************************************/
 
+// Hide on-page notes
 .reveal aside.notes {
 	display: none;
 }
 
+// An interface element that can optionally be used to show the
+// speaker notes to all viewers, on top of the presentation
+.reveal .speaker-notes {
+	display: none;
+	position: absolute;
+	width: 70%;
+	max-height: 15%;
+	left: 15%;
+	bottom: 26px;
+	padding: 10px;
+	z-index: 1;
+	font-size: 18px;
+	line-height: 1.4;
+	color: #fff;
+	background-color: rgba(0,0,0,0.5);
+	overflow: auto;
+	box-sizing: border-box;
+	text-align: left;
+	font-family: Helvetica, sans-serif;
+	-webkit-overflow-scrolling: touch;
+}
+
+.reveal .speaker-notes.visible:not(:empty) {
+	display: block;
+}
+
+@media screen and (max-width: 1024px) {
+	.reveal .speaker-notes {
+		font-size: 14px;
+	}
+}
+
+@media screen and (max-width: 600px) {
+	.reveal .speaker-notes {
+		width: 90%;
+		left: 5%;
+	}
+}
+
 
 /*********************************************
  * ZOOM PLUGIN