diff --git a/css/reveal.css b/css/reveal.css
index 2b0486e9..df406a8f 100644
--- a/css/reveal.css
+++ b/css/reveal.css
@@ -1094,7 +1094,7 @@ body {
 .reveal .playback {
   position: fixed;
   left: 15px;
-  bottom: 15px;
+  bottom: 20px;
   z-index: 30;
   cursor: pointer;
   -webkit-transition: all 400ms ease;
@@ -1168,12 +1168,11 @@ body {
   width: 70%;
   max-height: 15%;
   left: 15%;
-  bottom: 5%;
+  bottom: 26px;
   padding: 10px;
   z-index: 1;
   font-size: 18px;
   line-height: 1.4;
-  border: 2px solid #fff;
   color: #fff;
   background-color: rgba(0, 0, 0, 0.5);
   overflow: auto;
@@ -1185,12 +1184,14 @@ body {
 .reveal .speaker-notes.visible:not(:empty) {
   display: block; }
 
-@media screen and (max-width: 800px) {
+@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%;
-    bottom: 5%;
-    font-size: 14px; } }
+    left: 5%; } }
 
 /*********************************************
  * ZOOM PLUGIN
diff --git a/css/reveal.scss b/css/reveal.scss
index f9e2facc..bcc69f8f 100644
--- a/css/reveal.scss
+++ b/css/reveal.scss
@@ -1229,7 +1229,7 @@ body {
 .reveal .playback {
 	position: fixed;
 	left: 15px;
-	bottom: 15px;
+	bottom: 20px;
 	z-index: 30;
 	cursor: pointer;
 	transition: all 400ms ease;
@@ -1304,12 +1304,11 @@ body {
 	width: 70%;
 	max-height: 15%;
 	left: 15%;
-	bottom: 5%;
+	bottom: 26px;
 	padding: 10px;
 	z-index: 1;
 	font-size: 18px;
 	line-height: 1.4;
-	border: 2px solid #fff;
 	color: #fff;
 	background-color: rgba(0,0,0,0.5);
 	overflow: auto;
@@ -1322,12 +1321,16 @@ body {
 	display: block;
 }
 
-@media screen and (max-width: 800px) {
+@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%;
-		bottom: 5%;
-		font-size: 14px;
 	}
 }