Index: lams_monitoring/web/css/timer.scss
===================================================================
diff -u -ra14a32057cf83e427491328fb3105324d4a9c7c6 -rfda3ec8df53318805f4ca0fae87d9a6d6fdd8453
--- lams_monitoring/web/css/timer.scss	(.../timer.scss)	(revision a14a32057cf83e427491328fb3105324d4a9c7c6)
+++ lams_monitoring/web/css/timer.scss	(.../timer.scss)	(revision fda3ec8df53318805f4ca0fae87d9a6d6fdd8453)
@@ -8,26 +8,30 @@
 	width: 80px;
 	font-size: $font-size-base;
 }	
-}
-
 #hours, #minutes, #seconds {
 	width:70px;
 }
+}
 
 @media (min-width: 501px) {
 * {
-	font-size: x-large;
+	font-size: xx-large;
 }
 
 .fixed-button-width {
 	 width: 120px;
-	font-size: large;
+	font-size: x-large;
 }	
+#hours, #minutes, #seconds {
+	width:auto;
+	font-size: x-large;
 }
 
+}
+
 .is-countdown {
 	border: none;
-    background-color: inherit;
+    background-color: $body-bg;
 }
 
 .countdown-row-replacement-text, .countdown-row {
@@ -50,4 +54,71 @@
 
 #progressBarDiv #nprogress .bar{
 	height:10px;
-}
\ No newline at end of file
+}
+
+@mixin fullPageContentDivDefn() {
+	width: 100%;
+	height: 100vh;
+	background-color: $body-bg;
+	display: flex;
+	align-items: center;
+}
+
+@mixin flexDivDefn() {
+    margin-left: 5%;
+    margin-right: 5%;
+    display: block;
+}
+
+@mixin mainDivDefn() {
+	width: 90vw;
+}
+
+#fullPageContentDiv:-webkit-full-screen {
+  @include fullPageContentDivDefn;
+}
+
+#fullPageContentDiv:-webkit-full-screen #flexDiv {
+  @include flexDivDefn;
+}
+
+#fullPageContentDiv:-webkit-full-screen #mainDiv {
+  @include mainDivDefn;
+}
+
+#fullPageContentDiv:-moz-full-screen {
+  @include fullPageContentDivDefn;
+}
+
+#fullPageContentDiv:-moz-full-screen  #flexDiv {
+  @include flexDivDefn;
+}
+
+#fullPageContentDiv:-moz-full-screen #mainDiv {
+  @include mainDivDefn;
+}
+
+#fullPageContentDiv:-ms-fullscreen {
+  @include fullPageContentDivDefn;
+}
+
+#fullPageContentDiv:-ms-fullscreen  #flexDiv {
+  @include flexDivDefn;
+}
+
+#fullPageContentDiv:-ms-full-screen #mainDiv {
+  @include mainDivDefn;
+}
+
+#fullPageContentDiv:fullscreen {
+  @include fullPageContentDivDefn;
+}
+
+#fullPageContentDiv:fullscreen #flexDiv {
+  @include flexDivDefn;
+}
+
+#fullPageContentDiv:fullscreen #mainDiv {
+  @include mainDivDefn;
+}
+
Index: lams_monitoring/web/timer.jsp
===================================================================
diff -u -ra14a32057cf83e427491328fb3105324d4a9c7c6 -rfda3ec8df53318805f4ca0fae87d9a6d6fdd8453
--- lams_monitoring/web/timer.jsp	(.../timer.jsp)	(revision a14a32057cf83e427491328fb3105324d4a9c7c6)
+++ lams_monitoring/web/timer.jsp	(.../timer.jsp)	(revision fda3ec8df53318805f4ca0fae87d9a6d6fdd8453)
@@ -26,19 +26,22 @@
 	var haveClickedReset = false;
 	var isCounting = false;
 	var audioElement = null;
+	var fullscreenEnabled = false;
 	
 	$(document).ready(function(){
 		$(".setup").show();
 		$(".timer").hide();
 		$("#resume").hide();
-		
+
+		// progress bar
 		NProgress.configure({
 			showSpinner: false,
 			trickle: false,
 			parent: '#progressBarDiv',
 			minimum: 0.02
 		});
- 
+		
+		setupFullScreenEvents();
 	});
 
 	function toggleBell() {
@@ -175,14 +178,66 @@
 	    $('#countdownTarget').countdown('destroy'); 
 	}
 	 
+	// Increase to full screen - find the right method, call on correct element
+	function launchIntoFullscreen() {
+		var element = document.getElementById("fullPageContentDiv");		
+		if(element.requestFullscreen) {
+			element.requestFullscreen();
+		} else if(element.mozRequestFullScreen) {
+			element.mozRequestFullScreen();
+		} else if(element.webkitRequestFullscreen) {
+			element.webkitRequestFullscreen();
+		} else if(element.msRequestFullscreen) {
+			element.msRequestFullscreen();
+		}
+	}
 
+	// Reduce full screen back to normal screen
+	function exitFullscreen() {
+	  if(document.exitFullscreen) {
+	    document.exitFullscreen();
+	  } else if(document.mozCancelFullScreen) {
+	    document.mozCancelFullScreen();
+	  } else if(document.webkitExitFullscreen) {
+	    document.webkitExitFullscreen();
+	  }
+	}
+	
+	
+	// Detect when screen changes and update buttons
+	function setupFullScreenEvents() {
+		fullscreenEnabled = document.fullscreenEnabled || document.mozFullScreenEnabled || document.webkitFullscreenEnabled;
+		if ( fullscreenEnabled ) {
+			document.addEventListener("fullscreenchange", fullScreenChanged);
+			document.addEventListener("mozfullscreenchange", fullScreenChanged);
+			document.addEventListener("webkitfullscreenchange", fullScreenChanged);
+			document.addEventListener("msfullscreenchange", fullScreenChanged);
+		} else {
+ 			$("#shrink").hide();
+			$("#expand").hide();
+ 		}
+	}
+	
+	function fullScreenChanged( event ) {
+		var fullscreenElement = document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement;
+		console.log("fullscreenElement: "+fullscreenElement);
+		if ( fullscreenElement && fullscreenElement != null ) {
+			$("#expand").hide();
+			$("#shrink").show();
+	    } else {
+			$("#shrink").hide();
+			$("#expand").show();
+	    }
+	}
 </script>
 						
 </lams:head>
 
 <body class="stripes">
 
 	<lams:Page title="${title}" type="monitoring">
+	<div id="fullPageContentDiv">
+	<div id="flexDiv">
 
 	<div id="mainDiv" class="panel panel-default">
 	<div class="panel-body">
@@ -220,12 +275,16 @@
 		<a href="#" class="btn btn-default btn-primary fixed-button-width timer" id="resume" onclick="javascript:resume()" ><fmt:message key="label.resume"/></a>
 		<a href="#" class="btn btn-default loffset10 fixed-button-width timer" id="reset" onclick="javascript:reset()"><fmt:message key="label.reset"/></a>
 
+        <a href="#" class="btn btn-default loffset10 fixed-button-width pull-right" id="expand" onclick="javascript:launchIntoFullscreen()"><i class="fa fa-arrows-alt" aria-hidden="true"></i></a> 
+        <a href="#" class="btn btn-default loffset10 fixed-button-width pull-right" id="shrink" onclick="javascript:exitFullscreen()" style="display: none;"><i class="fa fa-compress" aria-hidden="true"></i></a> 
 		<a href="#" class="btn btn-default loffset10 fixed-button-width pull-right" id="bellOn" onclick="javascript:toggleBell()"><i class="fa fa-volume-up" aria-hidden="true"></i></a>
 		<a href="#" class="btn btn-default loffset10 fixed-button-width pull-right" id="bellOff" onclick="javascript:toggleBell()" style="padding-top: 0px; padding-bottom: 0px; display: none;">
         <span class="fa fa-stack"><i class="fa fa-volume-up" aria-hidden="true"></i><i class="fa fa-ban fa-stack-2x text-danger" aria-hidden="true"></i>
 		</span></a>
 	</div>
-	
+
+	</div>
+	</div>	
 	</lams:Page>
 </body>
-</lams:html>
\ No newline at end of file
+</lams:html>