diff --git a/openlp/core/lib/__init__.py b/openlp/core/lib/__init__.py
index 84cde2006..de9e72863 100644
--- a/openlp/core/lib/__init__.py
+++ b/openlp/core/lib/__init__.py
@@ -382,11 +382,11 @@ def expand_and_align_chords_in_line(match):
         if '_' in whitespaces:
             ws_length = len(whitespaces)
             if ws_length == 1:
-                whitespaces = '-'
+                whitespaces = '–'
             else:
                 wsl_mod = ws_length // 2
                 ws_right = ws_left = ' ' * wsl_mod
-                whitespaces = ws_left + '-' + ws_right
+                whitespaces = ws_left + '–' + ws_right
         whitespaces = '<span class="ws">' + whitespaces + '</span>'
     return '<span class="chord"><span><strong>' + chord + '</strong></span></span>' + tail + whitespaces + remainder
 
diff --git a/openlp/plugins/remotes/html/chords.html b/openlp/plugins/remotes/html/chords.html
index 520354861..4abafbca3 100644
--- a/openlp/plugins/remotes/html/chords.html
+++ b/openlp/plugins/remotes/html/chords.html
@@ -4,7 +4,7 @@
 ###############################################################################
 # OpenLP - Open Source Lyrics Projection                                      #
 # --------------------------------------------------------------------------- #
-# Copyright (c) 2008-2016 OpenLP Developers                                   #
+# Copyright (c) 2008-2017 OpenLP Developers                                   #
 # --------------------------------------------------------------------------- #
 # This program is free software; you can redistribute it and/or modify it     #
 # under the terms of the GNU General Public License as published by the Free  #
@@ -33,7 +33,7 @@
 <input type="hidden" id="next-text" value="${next}" />
 <div id="right">
   <div id="clock"></div>
-  <div id="chords">Toggle Chords</div>
+  <div id="chords" class="button">Toggle Chords</div>
   <div id="notes"></div>
 </div>
 <div id="header">
diff --git a/openlp/plugins/remotes/html/css/chords.css b/openlp/plugins/remotes/html/css/chords.css
index 4b6427e8d..b77006770 100644
--- a/openlp/plugins/remotes/html/css/chords.css
+++ b/openlp/plugins/remotes/html/css/chords.css
@@ -1,7 +1,7 @@
 /******************************************************************************
 * OpenLP - Open Source Lyrics Projection                                      *
 * --------------------------------------------------------------------------- *
-* Copyright (c) 2008-2016 OpenLP Developers                                   *
+* Copyright (c) 2008-2017 OpenLP Developers                                   *
 * --------------------------------------------------------------------------- *
 * This program is free software; you can redistribute it and/or modify it     *
 * under the terms of the GNU General Public License as published by the Free  *
@@ -17,17 +17,8 @@
 * Temple Place, Suite 330, Boston, MA 02111-1307 USA                          *
 ******************************************************************************/
 
-#chords {
-  font-size: 20pt;
-  color: gray;
-  background-color: gray;
-  color: white;
-  cursor: pointer;
-}
-
 #header {
   padding-bottom: 1em;
-
 }
 
 #transpose,
@@ -39,29 +30,35 @@
   vertical-align: middle;
 }
 
-#header .button,
-#plus,
-#minus {
+.button {
   display: inline-block;
-  width: 1.2em;
+  box-sizing: border-box;
+  border: 1px solid gray;
+  border-radius: .3em;
+  padding: 0 .2em;
+  min-width: 1.2em;
   line-height: 1.2em;
-  vertical-align: middle;
-  color: white;
-  background-color: gray;
-  font-size: 30pt;
+  font-size: 25pt;
+  font-weight: bold;
   text-align: center;
-  cursor: pointer;
-}
-
-#chords {
-  line-height: 1.2em;
-  color: gray;
+  text-decoration: none;
+  text-shadow: 0px 1px 0px white;
+  color: black;
+  background: linear-gradient(to bottom, white 5%, gray 100%);
   background-color: gray;
-  color: white;
   cursor: pointer;
 }
+.button:hover {
+  background: linear-gradient(to bottom, white 10%, gray 150%);
+  color: darkslategray ;
+  background-color: gray;
+}
+.button:active {
+  position:relative;
+  top:1px;
+}
 
-/* Extending exiting definition in stage.css */
+/* Extending existing definition in stage.css */
 #verseorder {
   line-height: 1.5;
   display: inline-block;
@@ -92,6 +89,7 @@
 
 .ws {
   white-space: pre-wrap;
+  font-family: monospace;
 }
 
 #nextslide .chordline span.chord span strong {
diff --git a/openlp/plugins/remotes/html/css/stage.css b/openlp/plugins/remotes/html/css/stage.css
index c18242b02..2a78b249c 100644
--- a/openlp/plugins/remotes/html/css/stage.css
+++ b/openlp/plugins/remotes/html/css/stage.css
@@ -21,6 +21,10 @@ body {
   background-color: black;
   font-family: sans-serif;
   overflow: hidden;
+  -webkit-user-select: none; /* Chrome/Safari */
+  -moz-user-select: none;    /* Firefox */
+  -ms-user-select: none;     /* IE 10+ */
+  user-select: none;         /* Future */
 }
 
 #currentslide {
diff --git a/openlp/plugins/remotes/html/js/chords.js b/openlp/plugins/remotes/html/js/chords.js
index 0de2edf5a..39b92d2e4 100644
--- a/openlp/plugins/remotes/html/js/chords.js
+++ b/openlp/plugins/remotes/html/js/chords.js
@@ -1,7 +1,7 @@
 /******************************************************************************
  * OpenLP - Open Source Lyrics Projection                                      *
  * --------------------------------------------------------------------------- *
- * Copyright (c) 2008-2016 OpenLP Developers                                   *
+ * Copyright (c) 2008-2017 OpenLP Developers                                   *
  * --------------------------------------------------------------------------- *
  * This program is free software; you can redistribute it and/or modify it     *
  * under the terms of the GNU General Public License as published by the Free  *
@@ -73,7 +73,7 @@ function transposeChord(chord, transposeValue, notation) {
         rest = "";
       }
       notenumber = (notesSharp.indexOf(note) === -1 ? notesFlat.indexOf(note) : notesSharp.indexOf(note));
-      notenumber -= parseInt(transposeValue);
+      notenumber += parseInt(transposeValue);
       while (notenumber > 11) {
         notenumber -= 12;
       }
@@ -213,11 +213,11 @@ window.OpenLP = {
         if (w[0] == '_') {
           ws_length = w.length;
           if (ws_length==1) {
-            w = '-';
+            w = '&ndash;';
           } else {
             wsl_mod = Math.floor(ws_length / 2);
             ws_right = ws_left = new Array(wsl_mod +1).join(' ');
-            w = ws_left + '-' + ws_right;
+            w = ws_left + '&ndash;' + ws_right;
           }
         }
         w='<span class="ws">' + w + '</span>';
@@ -328,6 +328,5 @@ $(document).ready(function() {
   $('#chords').click(function () {
     OpenLP.showchords = OpenLP.showchords ? false : true;
     OpenLP.loadSlides();
-    $
   });
 });