diff --git a/java/com.sap.sailing.gwt.ui/RaceBoard.html b/java/com.sap.sailing.gwt.ui/RaceBoard.html
index 86a762d2895..becc8bade88 100644
--- a/java/com.sap.sailing.gwt.ui/RaceBoard.html
+++ b/java/com.sap.sailing.gwt.ui/RaceBoard.html
@@ -4,6 +4,11 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
     <title>SAP Sailing Analytics Race Board</title>
+    <meta name="viewport" content="width=device-width" />
+    <meta content='yes' name='apple-mobile-web-app-capable'>
+    <meta content='black' name='apple-mobile-web-app-status-bar-style'>
+    <!-- <link href='iphone-splash-screen.png' rel='apple-touch-startup-image'> -->
+    <link href='images/sap-sailing-app-icon.png' rel='apple-touch-icon-precomposed'>
 	<link href='http://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic' rel='stylesheet' type='text/css'>
 
     <script id="sap-ui-bootstrap"
diff --git a/java/com.sap.sailing.gwt.ui/Spectator.css b/java/com.sap.sailing.gwt.ui/Spectator.css
index 20dcfa2dfa8..850e22ec6f0 100644
--- a/java/com.sap.sailing.gwt.ui/Spectator.css
+++ b/java/com.sap.sailing.gwt.ui/Spectator.css
@@ -8,7 +8,7 @@
       clear: both;
       visibility: hidden;
 */
-.clear {
+.clearafter {
 	clear: both;
 	font-size: 1px;
 	height: 0px;
@@ -24,14 +24,21 @@
 	top: -1000px;
 }
 
+
 body {
-	background: #ebebeb;
+	background: url(images/spectatorview-bg.png) no-repeat left top fixed #ebebeb;
 	font-family: 'Ubuntu', 'Terminal Dosis', sans-serif;
 	line-height: 1;
 	font-size: 14px;
 	font-weight: 400;
 	padding: 85px 0 120px 0;
 	margin: 0;
+	color: #3b3b3b;
+}
+
+a {
+	color: #2968c0;
+	text-decoration: underline;
 }
 
 table td,select,button {
@@ -248,8 +255,22 @@ input.magnifier {
 	clear: left;
 }
 
-.leaderboardGroupPanel-ActiveLeaderboard{
-	
+.leaderboardGroupPanel-ActiveRace, .leaderboardGroupPanel-ActiveLeaderboard {
+	padding: 5px 8px;
+	display: block;
+	float: left;
+	margin: 5px 5px 5px 0;
+	border-radius: 4px;
+	background: #e7e7e7;
+	text-decoration: none;
+	color: #3b3b3b;
+  border: 1px solid #a6a6a6;
+}
+
+.leaderboardGroupPanel-ActiveRace:hover, .leaderboardGroupPanel-ActiveLeaderboard:hover {
+	text-decoration: none;
+	color: #3b3b3b;
+  background: #f1af10;
 }
 
 .leaderboardGroupPanel-ActiveRace {
@@ -264,6 +285,7 @@ input.magnifier {
 	float: right;
 	width: 485px;	
 	color: #3e3e3e;
+}
 .welcomeWidget-WelcomePanelWrapper {
 	
 }
@@ -294,3 +316,5 @@ input.magnifier {
 .breadcrumbPanel-InactiveBreadcrumb {
 	
 }
+
+
diff --git a/java/com.sap.sailing.gwt.ui/Spectator.html b/java/com.sap.sailing.gwt.ui/Spectator.html
index 40be4f43ec8..0915fc6d9bf 100644
--- a/java/com.sap.sailing.gwt.ui/Spectator.html
+++ b/java/com.sap.sailing.gwt.ui/Spectator.html
@@ -9,6 +9,11 @@
   <head>
     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
     <meta name="viewport" content="width=device-width" />
+    <meta content='yes' name='apple-mobile-web-app-capable'>
+    <meta content='black' name='apple-mobile-web-app-status-bar-style'>
+    <!-- <link href='iphone-splash-screen.png' rel='apple-touch-startup-image'> -->
+    <link href='images/sap-sailing-app-icon.png' rel='apple-touch-icon-precomposed'>
+    
 	<link href='http://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700,300italic,400italic,500italic,700italic' rel='stylesheet' type='text/css'>
     <!--                                                               -->
     <!-- Consider inlining CSS to reduce the number of requested files -->
diff --git a/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/spectator/LeaderboardGroupFullTable.css b/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/spectator/LeaderboardGroupFullTable.css
index cde8bfab732..648292fc915 100644
--- a/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/spectator/LeaderboardGroupFullTable.css
+++ b/java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/ui/spectator/LeaderboardGroupFullTable.css
@@ -1,135 +1,97 @@
 @CHARSET "ISO-8859-1";
 
 .cellTableWidget {
-	border-left: 1px solid #c9caca;
-	border-top: 1px solid #c9caca;
+
 }
 
 /** v-align images in the table header
  * grey background for table header
  */
 .cellTableHeader {
-	position: relative;
-    vertical-align: middle;
-	background-color: #e5e5e5;
-	border-right: 1px solid #ffffff !important;
-	border-top: none !important;
-	border-bottom: 1px solid #c9caca !important;
-	padding: 3px 12px;
-	text-align: center;
+	background: none;
+	border: 1px solid red;
+	text-transform: uppercase;
+	font-weight: 600;
 }
 
 .cellTableFirstColumnHeader {
-	position: relative;
-    vertical-align: middle;
-	background-color: #e5e5e5;
-	border-left: none !important;
-	border-right: 1px solid #ffffff !important;
-	border-top: none !important;
-	border-bottom: 1px solid #c9caca !important;
-	padding: 3px 12px;
-	text-align: center;
+	background: none;
+	border: none;
 }
 
 .cellTableLastColumnHeader {
-	position: relative;
-    vertical-align: middle;
-	background-color: #e5e5e5;
-	border-right: 1px solid #c9caca !important;
-	border-top: none !important;
-	border-bottom: 1px solid #c9caca !important;
-	padding: 3px 12px;
-	text-align: center;
-}
-
-.cellTableHeader > span > img:first-child {
-	position: relative;
-    vertical-align: middle;
+	background: none;
+	border: none;
 }
 
 .cellTableEvenRow {
-	border-bottom: 1px solid #e5e5e5;
-	background-color: rgba(255,255,255,0.5);
+	background: none;
+	border: none;
 }
 
 .cellTableEvenRowCell {
-	border-right: 1px solid #c9caca !important;
-	border-left: none;
-	border-top: none !important;
-	border-bottom: 1px solid #c9caca !important;
-	padding: 5px 17px 5px !important;
-	white-space: nowrap;
+	background: none;
+	border: none;
 }
 
 .cellTableOddRow {
-	border-bottom: 1px solid #e5e5e5;
-	background-color: rgba(242,242,242,0.5);
+	background: none;
+	border: none;
 }
 
 .cellTableOddRowCell {
-	border-left: none !important;
-	border-right: 1px solid #c9caca !important;
-	border-top: none !important;
-	border-bottom: 1px solid #c9caca !important;
-	padding: 5px 17px 5px !important;
-	white-space: nowrap;
+	background: none;
+	border: none;
 }
 
 .cellTableHoveredRow {
-	background-color: rgba(229,242,249,0.5);
-	border-bottom: 1px solid #e5e5e5;
+	background: none;
+	border: none;
 }
 
 .cellTableSelectedRow {
-	color: #000000;
-	background-color: rgba(229,242,249,0.5);
-	border-right: 2px solid #21a0e4 !important;
-	border-left: 2px solid #21a0e4 !important;
-	border: 2px solid #21a0e4;
+	background: none;
+	border: none;
 }
 
-.cellTableSelectedRow > td:FIRST-CHILD {
-	border-left: 2px solid rgba(33,160,228,0.5) !important;
-}
-
-.cellTableSelectedRow > td:LAST-CHILD {
-	border-right: 2px solid rgba(33,160,228,0.5) !important;
-}
 
 .cellTableSelectedRowCell {
-	border-left: none;
-	border-right: 1px solid #e5e5e5;
-	border-top: 2px solid #21a0e4 !important;
-	border-bottom: 2px solid #21a0e4 !important;
+	background: none;
+	border: none;
 }
 
 .cellTableRaceColumnHeader {
-	background-color: #e0e0e0;
-	padding: 3px 12px;
+	background: none;
+	border: none;
 }
 
 .cellTableLegColumnHeader {
-	background-color: #efefef;
-	padding: 3px 12px;
+	background: none;
+	border: none;
 }
 
 .cellTableLegDetailColumnHeader {
-	background-color: #f4f5f6;
-	padding: 3px 12px;
+	background: none;
+	border: none;
 }
 
 .cellTableRaceColumn {
-	background-color: #e0e0e0 !important;
+		background: none;
+	border: none;
 }
 
 .cellTableLegColumn {
-	background-color: #efefef !important;
+		background: none;
+	border: none;
 }
 
 .cellTableLegDetailColumn {
-	background-color: #ffffff !important;
+		background: none;
+	border: none;
 }
 
 .cellTableTotalColumn {
-	background-color: #e0e0e0 !important;
-}
\ No newline at end of file
+		background: none;
+	border: none;
+}
+
