Index: lams_monitoring/web/emailnotifications/additionalSettings.jsp
===================================================================
diff -u -r1af4378c901cea902392d4ef17f9d990f25e16f3 -rd5e8a64224177deb3036042f0cb36fc5a892ae23
--- lams_monitoring/web/emailnotifications/additionalSettings.jsp	(.../additionalSettings.jsp)	(revision 1af4378c901cea902392d4ef17f9d990f25e16f3)
+++ lams_monitoring/web/emailnotifications/additionalSettings.jsp	(.../additionalSettings.jsp)	(revision d5e8a64224177deb3036042f0cb36fc5a892ae23)
@@ -6,21 +6,21 @@
 <%@ taglib uri="tags-function" prefix="fn"%>
 
 <div id="accordion">
-	<h3 id="nowHeader">
+	<h4 id="nowHeader">
 		<a href="#"><fmt:message key="email.notifications.table.now" /></a>
-	</h3>
+	</h4>
 	<div id="nowDiv">
 		<table id="list3"></table>
 		<div id="pager3"></div>
 	</div>
 			
-	<h3 id="scheduleHeader">
+	<h4 id="scheduleHeader">
 		<a href="#"><fmt:message key="email.notifications.table.schedule" /></a>
-	</h3>
+	</h4>
 	<div>
-		<div>
+		<p class="body">
 			<fmt:message key="email.notifications.schedule.description" />
-		</div>
+		</p>
 	
 		<div id="datePickerDiv">
 			<span>
@@ -38,7 +38,7 @@
 				<c:set var="additionalParams">organisationID=${org.organisationId}</c:set>
 			</c:otherwise>
 		</c:choose>
-		<a href="<c:url value='/emailNotifications.do'/>?method=showScheduledEmails&${additionalParams}" id="listEmailsHref">
+		<a href="<c:url value='/emailNotifications.do'/>?method=showScheduledEmails&${additionalParams}" id="listEmailsHref" class="btn btn-default btn-sm">
 			<fmt:message key="email.notifications.scheduled.messages.list" />
 		</a>				
 	</div>
Index: lams_monitoring/web/emailnotifications/courseNotifications.jsp
===================================================================
diff -u -r2ef18e4c87e2e7929950dbeb990c6715ef16c0c2 -rd5e8a64224177deb3036042f0cb36fc5a892ae23
--- lams_monitoring/web/emailnotifications/courseNotifications.jsp	(.../courseNotifications.jsp)	(revision 2ef18e4c87e2e7929950dbeb990c6715ef16c0c2)
+++ lams_monitoring/web/emailnotifications/courseNotifications.jsp	(.../courseNotifications.jsp)	(revision d5e8a64224177deb3036042f0cb36fc5a892ae23)
@@ -14,9 +14,9 @@
 	<link rel="shortcut icon" href="<lams:LAMSURL/>/favicon.ico" type="image/x-icon" />
 	<title><fmt:message key="${title}"/></title>
 	
-	<lams:css style="learner"/>
-	<link type="text/css" href="<lams:LAMSURL/>css/jquery-ui-redmond-theme.css" rel="stylesheet">
-	<link rel="stylesheet" type="text/css" href="<lams:LAMSURL/>/css/jquery.jqGrid.css" />	
+	<lams:css/>
+ 	<link type="text/css" href="<lams:LAMSURL/>css/jquery-ui-smoothness-theme.css" rel="stylesheet">
+ 	<link rel="stylesheet" type="text/css" href="<lams:LAMSURL/>/css/jquery.jqGrid.css" />	
 	<style media="screen,projection" type="text/css">
 		div#content {min-height: 250px; }
 		#emailTextareaDiv {float: right;}
@@ -25,20 +25,18 @@
 		#lessonsDiv {display: none;}
 		#lessonDiv { padding-bottom: 20px;}
 		#pager3_right table{float:right !important; }
-		#datePickerDiv {margin: 10px 0 50px;}
+		#datePickerDiv {margin: 10px 0 10px;}
 		
 		/* Accordion */
 		.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited, .ui-state-active a:hover  {
-		    color: #47bc23 !important;
 		    background-image: none;
 		    background-color: transparent ;
 		}
 		#nowDiv{padding-left: 10px;}
 		.ui-jqgrid-hbox {padding-left: 0;}
 		#accordion {width: 325px;}
 		#accordion h3 a {border-bottom: 0;}
-		#accordion p {text-align: center; padding-bottom: 0px; margin-bottom: 0xp;}
-		#listEmailsHref {border-bottom: 1px dotted #47BC23;color: #47BC23;text-decoration: none;}
+		#accordion p {text-align: center; padding-bottom: 0px; margin-bottom: 0xp; font-size:12px;}
 	</style>	
 	
 	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.js"></script>
@@ -78,21 +76,23 @@
     			dateFormat: 'dd/mm/yy',
     			minDate: 1
     		});
-    		
+
+			debugger;
     		//initialize accordion
     		$( "#accordion" ).accordion({
     			create: function(event, ui) {
     				// accordion probably sets its height based on empty grid
     				// once it is loaded, it needs to be adjusted
+    				debugger;
     				$('div.ui-accordion-content').css('height', '100%');
     			},
-    			change: function(event, ui) {
+    			activate: function(event, ui) {
     				if ($('#accordion').accordion('option', 'active') == 0) {
     					$("#emailButton").attr('value', '<fmt:message key="email.notifications.send"/>');
     				} else {
     					$("#emailButton").attr('value', '<fmt:message key="email.notifications.button.schedule"/>');
     				}
-    			}
+    		    }
     		});
 			
 			jQuery("#lessonsTable").jqGrid({
@@ -122,6 +122,7 @@
 			
     		$('#emailButton').click(function() {
     			
+    			debugger;
     			var isInstantEmailing = ($('#accordion').accordion('option', 'active') == 0);
     			var ids = jQuery("#list3").getGridParam('selarrrow');
     			var params = "";
@@ -218,20 +219,19 @@
 </lams:head>
     
 <body class="stripes">
-<div id="page">
-	<div id="content">
 
-		<h2><fmt:message key="email.notifications.notify.sudents.that"/></h2>
+	<lams:Page title="${title}" type="admin">
+		<h4><fmt:message key="email.notifications.notify.sudents.that"/></h4>
 		
 		<form action="<c:url value="/emailNotifications.do"/>?method=emailUsers" method="post" id="emailNotificationsForm" >	
 		
 		<div id="emailTextareaDiv">
 		
 			<c:set var="emailBody"><fmt:message key="email.notifications.course.email.body.header"/><br/><br/><fmt:message key="email.notifications.course.email.body.msg"/><br/><br/><br/>
 			</c:set>
-			<textarea rows="8" name="emailBody" id="emailBody" cols="43" >${fn:replace(emailBody, '<br/>', newLineChar)}</textarea>
-			<br/><br/>
-			<input class="button" type="button" id="emailButton" value="<fmt:message key="email.notifications.send"/>" />
+			<textarea rows="8" name="emailBody" id="emailBody" cols="43" class="form-control form-control-inline" >${fn:replace(emailBody, '<br/>', newLineChar)}</textarea>
+			<br/>
+			<input class="btn btn-primary btn-sm" type="button" id="emailButton" value="<fmt:message key="email.notifications.send"/>" />
 			
 		</div>
 		
@@ -248,9 +248,9 @@
 		
 		<div id="additionalParameters">
 			<div id="lessonDiv">
-				<h3>
+				<h4>
 					<fmt:message key="email.notifications.lesson" />
-				</h3>
+				</h4>
 				<select id="lessonId" onchange="getUsers();">
 					<c:forEach var="lesson" items="${lessons}">
 						<option <c:if test="${lesson.lessonId==firstLesson.lessonId}">selected="selected"</c:if> value="${lesson.lessonId}">${fn:escapeXml(lesson.lessonName)}</option>
@@ -259,20 +259,18 @@
 			</div>
 			
 			<div id="lessonsDiv">
-				<h3>
+				<h4>
 					<fmt:message key="email.notifications.lessons" />
-				</h3>
+				</h4>
 				
 				<table id="lessonsTable"></table>
-				<br/>
-				<input style="margin-left: 230px;" class="button small-space-bottom" type="button" value="<fmt:message key="button.ok"/>" onclick="getUsers();"  />			
+				<input style="margin-left: 230px;" class="btn btn-default btn-sm" type="button" value="<fmt:message key="button.ok"/>" onclick="getUsers();"  />			
 			</div>
 		</div>
 
 		<%@ include file="additionalSettings.jsp"%>
 
 		</form>
-	</div>
-</div>
+	</lams:Page>
 </body>
 </lams:html>
Index: lams_monitoring/web/emailnotifications/lessonNotifications.jsp
===================================================================
diff -u -r2ef18e4c87e2e7929950dbeb990c6715ef16c0c2 -rd5e8a64224177deb3036042f0cb36fc5a892ae23
--- lams_monitoring/web/emailnotifications/lessonNotifications.jsp	(.../lessonNotifications.jsp)	(revision 2ef18e4c87e2e7929950dbeb990c6715ef16c0c2)
+++ lams_monitoring/web/emailnotifications/lessonNotifications.jsp	(.../lessonNotifications.jsp)	(revision d5e8a64224177deb3036042f0cb36fc5a892ae23)
@@ -14,8 +14,8 @@
 	<link rel="shortcut icon" href="<lams:LAMSURL/>/favicon.ico" type="image/x-icon" />
 	<title><fmt:message key="${fn:escapeXml(title)}"/></title>
 	
-	<lams:css style="learner"/>
-	<link type="text/css" href="<lams:LAMSURL/>css/jquery-ui-redmond-theme.css" rel="stylesheet">
+	<lams:css/>
+	<link type="text/css" href="<lams:LAMSURL/>css/jquery-ui-smoothness-theme.css" rel="stylesheet">
 	<link rel="stylesheet" type="text/css" href="<lams:LAMSURL/>/css/jquery.jqGrid.css" />
 	
 	<style media="screen,projection" type="text/css">
@@ -25,20 +25,18 @@
 		#additionalParameters {min-height: 50px;}
 		#activityDiv, #daysToDeadlineDiv {display: none;}
 		#pager3_right table{float:right !important; }
-		#datePickerDiv {margin: 10px 0 50px;}
+		#datePickerDiv {margin: 10px 0 10px;}
 		
 		/* Accordion */
 		.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited, .ui-state-active a:hover  {
-		    color: #47bc23 !important;
 		    background-image: none;
 		    background-color: transparent ;
 		}
 		#nowDiv{padding-left: 10px;}
 		.ui-jqgrid-hbox {padding-left: 0;}
 		#accordion {width: 325px;}
 		#accordion h3 a {border-bottom: 0;}
-		#accordion p {text-align: center; padding-bottom: 0px; margin-bottom: 0xp;}
-		#listEmailsHref {border-bottom: 1px dotted #47BC23;color: #47BC23;text-decoration: none;}
+		#accordion p {text-align: center; padding-bottom: 0px; margin-bottom: 0xp; font-size:12px;}
 	</style>	
 	
 	<script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.js"></script>
@@ -89,7 +87,7 @@
     				// once it is loaded, it needs to be adjusted
     				$('div.ui-accordion-content').css('height', '100%');
     			},
-    			change: function(event, ui) {
+    			activate: function(event, ui) {
     				if ($('#accordion').accordion('option', 'active') == 0) {
     					$("#emailButton").attr('value', '<fmt:message key="email.notifications.send"/>');
     				} else {
@@ -188,19 +186,18 @@
 </lams:head>
     
 <body class="stripes">
-<div id="page">
-	<div id="content">
 
-		<h2><fmt:message key="email.notifications.notify.sudents.that"/></h2>
+	<lams:Page title="${title}" type="admin">
+		<h4><fmt:message key="email.notifications.notify.sudents.that"/></h4>
 		
 		<form action="<c:url value="/emailNotifications.do"/>?method=emailUsers" method="post" id="emailNotificationsForm" >	
 		
 		<div id="emailTextareaDiv">
 			<c:set var="emailBody"><fmt:message key="email.notifications.lesson.email.body.header"/><br/><br/><fmt:message key="email.notifications.lesson.email.body.msg"/><br/><br/><br/><fmt:message key="email.notifications.lesson.email.body.footer" ><fmt:param>${lesson.lessonName}</fmt:param><fmt:param><lams:LAMSURL/>home.do?method=learner&lessonID=${lesson.lessonId}</fmt:param></fmt:message>
 			</c:set>
-			<textarea rows="8" name="emailBody" id="emailBody" cols="43" >${fn:replace(emailBody, '<br/>', newLineChar)}</textarea>
+			<textarea rows="8" name="emailBody" id="emailBody" cols="43"  class="form-control form-control-inline">${fn:replace(emailBody, '<br/>', newLineChar)}</textarea>
 			<br/><br/>
-			<input class="button" type="button" id="emailButton" value="<fmt:message key="email.notifications.send"/>" />
+			<input class="btn btn-primary btn-sm" type="button" id="emailButton" value="<fmt:message key="email.notifications.send"/>" />
 		</div>		
 		
 		<!-- Dropdown menu for choosing a user search type -->
@@ -234,14 +231,13 @@
 				</h3>
 				
 				<input name="daysToDeadline" type="text" id="daysToDeadline" value="3" size="3"/> 	
-				<input class="button space-left small-space-bottom" type="button" value="<fmt:message key="button.ok"/>" onclick="getUsers();" />			
+				<input class="btn btn-default btn-sm" type="button" value="<fmt:message key="button.ok"/>" onclick="getUsers();" />			
 			</div>
 		</div>
 		
 		<%@ include file="additionalSettings.jsp"%>
 		
 		</form>
-	</div>
-</div>
+	</lams:Page>
 </body>
 </lams:html>
Index: lams_monitoring/web/emailnotifications/scheduledEmailList.jsp
===================================================================
diff -u -r2ef18e4c87e2e7929950dbeb990c6715ef16c0c2 -rd5e8a64224177deb3036042f0cb36fc5a892ae23
--- lams_monitoring/web/emailnotifications/scheduledEmailList.jsp	(.../scheduledEmailList.jsp)	(revision 2ef18e4c87e2e7929950dbeb990c6715ef16c0c2)
+++ lams_monitoring/web/emailnotifications/scheduledEmailList.jsp	(.../scheduledEmailList.jsp)	(revision d5e8a64224177deb3036042f0cb36fc5a892ae23)
@@ -11,45 +11,39 @@
 <!DOCTYPE html>
 <lams:html>
 <lams:head>
-	<link rel="icon" href="<lams:LAMSURL/>favicon.ico" type="image/x-icon" />
-	<link rel="shortcut icon" href="<lams:LAMSURL/>favicon.ico" type="image/x-icon" />
 	<c:if test="${not empty param.sessionMapID}">
 		<c:set var="sessionMapID" value="${param.sessionMapID}" />
 	</c:if>	
 	
-	<lams:css style="main" />	
-	<link type="text/css" href="<lams:LAMSURL/>/css/jquery-ui-redmond-theme.css" rel="stylesheet" />	
-	<style media="screen,projection" type="text/css">
-		html {margin: 0;overflow:auto;background: none;}
-		body {background: none;	min-height: 100%;width: 100%;}	
-	</style>
+	<lams:css/>	
+	<link type="text/css" href="<lams:LAMSURL/>/css/jquery-ui-smoothness-theme.css" rel="stylesheet" />
 </lams:head>
 
 <body>
-	<h2 style="padding: 20px 25px 0;">
+	<h4>
 		<fmt:message key="email.notifications.scheduled.messages.list"/>
-	</h2>
+	</h4>
 
-	<table style="padding: 10px 30px;">
+	<table class="table table-condensed table-striped">
 		<thead>
-			<tr class="ui-widget-header">
-				<td style="text-align: left; width: 20%;">
+			<tr>
+				<td class="text-left">
 					<fmt:message key="email.notifications.scheduled.messages.list.scheduled.date"/>		
 				</td>
-				<td style="text-align: left; width: 30%;">
+				<td  class="text-left">
 					Notify students that	
 				</td>
-				<td style="text-align: left;">
+				<td  class="text-left">
 					<fmt:message key="email.notifications.scheduled.messages.list.email.body"/>		
 				</td>
 			</tr>
 		</thead>
 		<c:forEach var="emailJob" items="${scheduleList}">
 			<tr>
-				<td style="border-bottom: 1px solid #efefef;">
+				<td style="vertical-align: top;">
 					<fmt:formatDate value="${emailJob.triggerDate}" type="date" />
 				</td>
-				<td style="border-bottom: 1px solid #efefef;">
+				<td  style="vertical-align: top;">
 					<c:choose>
 						<c:when test="${emailJob.searchType == 0}"><fmt:message key="email.notifications.user.search.property.0" /></c:when>
 						<c:when test="${emailJob.searchType == 1}"><fmt:message key="email.notifications.user.search.property.1" /></c:when>
@@ -64,7 +58,7 @@
 						<c:when test="${emailJob.searchType == 10}"><fmt:message key="email.notifications.user.search.property.10" /></c:when>
 					</c:choose>
 				</td>
-				<td style="border-bottom: 1px solid #efefef;">
+				<td  style="vertical-align: top;">
 					${emailJob.emailBody}
 				</td>
 			</tr>
@@ -79,7 +73,7 @@
 			<c:set var="returnUrlParams">?method=getCourseView&organisationID=${organisationID}</c:set>
 		</c:otherwise>
 	</c:choose>
-	<a href="<c:url value='/emailNotifications.do'/>${returnUrlParams}" style="margin: 30px 50px; float: right;">
+	<a href="<c:url value='/emailNotifications.do'/>${returnUrlParams}" class="btn btn-primary pull-right">
 		<fmt:message key="email.notifications.scheduled.messages.list.back" />
 	</a>