Index: lams_admin/web/WEB-INF/tags/AdvancedAccordian.tag
===================================================================
diff -u
--- lams_admin/web/WEB-INF/tags/AdvancedAccordian.tag	(revision 0)
+++ lams_admin/web/WEB-INF/tags/AdvancedAccordian.tag	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -0,0 +1,53 @@
+<%
+	 /****************************************************************
+	 * Copyright (C) 2005 LAMS Foundation (http://lamsfoundation.org)
+	 * =============================================================
+	 * License Information: http://lamsfoundation.org/licensing/lams/2.0/
+	 * 
+	 * This program is free software; you can redistribute it and/or modify
+	 * it under the terms of the GNU General Public License version 2.0
+	 * as published by the Free Software Foundation.
+	 * 
+	 * This program is distributed in the hope that it will be useful,
+	 * but WITHOUT ANY WARRANTY; without even the implied warranty of
+	 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+	 * GNU General Public License for more details.
+	 * 
+	 * You should have received a copy of the GNU General Public License
+	 * along with this program; if not, write to the Free Software
+	 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301
+	 * USA
+	 * 
+	 * http://www.gnu.org/licenses/gpl.txt
+	 * ****************************************************************
+	 */
+
+	/**
+	 * AdvancedAccordian.tag
+	 *	Author: Fiona Malikoff
+	 *	Description: Creates the show/hide entry for the Advanced Settings in Montoring.
+	 * Wiki: 
+	 */
+%>
+<%@ attribute name="title" required="true" rtexprvalue="true"%>
+
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-fmt" prefix="fmt"%>
+<%@ taglib uri="tags-lams" prefix="lams"%>
+
+<div class="panel-group" id="accordionAdvanced" role="tablist" aria-multiselectable="true"> 
+    <div class="panel panel-default" >
+        <div class="panel-heading collapsable-icon-left" id="headingAdvanced">
+        	<span class="panel-title">
+	    	<a class="collapsed" role="button" data-toggle="collapse" href="#collapseAdvanced" aria-expanded="false" aria-controls="collapseAdvanced" >
+          	${title}
+        	</a>
+      		</span>
+        </div>
+
+        <div id="collapseAdvanced" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingAdvanced">
+		<jsp:doBody />
+		</div>
+	</div>
+</div>
+		
\ No newline at end of file
Index: lams_admin/web/WEB-INF/tags/Arrow.tag
===================================================================
diff -u
--- lams_admin/web/WEB-INF/tags/Arrow.tag	(revision 0)
+++ lams_admin/web/WEB-INF/tags/Arrow.tag	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -0,0 +1,35 @@
+<%@ tag body-content="scriptless"%>
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-function" prefix="fn" %>
+
+<%-- state = up: up arrow;  state = down: down arrow --%>
+<%@ attribute name="state" required="true" rtexprvalue="true"%>
+<%@ attribute name="title" required="false" rtexprvalue="true"%>
+<%@ attribute name="onclick" required="false" rtexprvalue="true"%>
+
+<c:choose>
+	<c:when test="${not empty title}">
+		<c:set var="fullTitle">title="${title}"</c:set>
+	</c:when>
+	<c:otherwise>
+		<c:set var="fullTitle" value=""/>
+	</c:otherwise>
+</c:choose>
+
+<c:choose>
+	<c:when test="${not empty onclick}">
+		<c:set var="fullOnclick">onclick="${onclick}"</c:set>
+	</c:when>
+	<c:otherwise>
+		<c:set var="fullOnclick" value=""/>
+	</c:otherwise>
+</c:choose>
+
+<c:choose>
+	<c:when test="${fn:containsIgnoreCase(state, 'up')}">
+		<i class="fa fa-long-arrow-up fa-pull-left" ${fullTitle} ${fullOnclick}></i>
+	</c:when>
+	<c:otherwise>
+		<i class="fa fa-long-arrow-down fa-pull-right"  ${fullTitle} ${fullOnclick}></i>
+	</c:otherwise>
+</c:choose>
Index: lams_admin/web/WEB-INF/tags/CKEditor.tag
===================================================================
diff -u -rdc884b8e6274ebbc664d1ee940e565803445bb26 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/WEB-INF/tags/CKEditor.tag	(.../CKEditor.tag)	(revision dc884b8e6274ebbc664d1ee940e565803445bb26)
+++ lams_admin/web/WEB-INF/tags/CKEditor.tag	(.../CKEditor.tag)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -10,7 +10,12 @@
 <%@ attribute name="contentFolderID" required="false" rtexprvalue="true"%>
 <%@ attribute name="displayExpanded" required="false" rtexprvalue="true"%>
 <%@ attribute name="resizeParentFrameName" required="false" rtexprvalue="true"%>
+<%@ attribute name="method" required="false" rtexprvalue="true"%>
 
+<c:if test="${empty method}">
+	<c:set var="method" value="inline" />
+</c:if>
+
 <c:set var="language">
 	<lams:user property="fckLanguageMapping" />
 </c:set>
@@ -19,6 +24,10 @@
 	<c:set var="toolbarSet" value="Default" />
 </c:if>
 
+<c:if test="${fn:containsIgnoreCase(method,'Inline')}">
+	<c:set var="toolbarSet">${toolbarSet}Inline</c:set>
+</c:if>
+
 <c:if test="${empty displayExpanded}">
 	<c:set var="displayExpanded" value="true" />
 </c:if>
@@ -33,10 +42,10 @@
 <c:set var="fixedValue" value="${fn:replace(value,'&lt','&amp;lt')}"/>
 <c:set var="fixedValue" value="${fn:replace(fixedValue,'&gt','&amp;gt')}"/>
 
-<textarea id="${id}" name="${id}" style="display: none; visibility: hidden; height: 0px;">${fixedValue}</textarea>
+<textarea id="${id}" name="${id}" style="display: none; visibility: hidden; height: 0px;" placeholder="${placeholder}">${fixedValue}</textarea>
 
 <c:if test="${empty ckEditorBasePath}">
-	<c:set scope="request" var="ckEditorBasePath"><lams:LAMSURL/>ckeditor/</c:set>
+	<c:set scope="request" var="ckEditorBasePath">/lams/ckeditor/</c:set>
 	<script type="text/javascript" src="${ckEditorBasePath}ckeditor.js"></script>
 </c:if>
 
@@ -59,10 +68,9 @@
 	    var editor = CKEDITOR.instances["${id}"];
 	    if (editor) { editor.destroy(true); }
 	    
-		var instance = CKEDITOR.replace( "${id}", {
+		var instance = CKEDITOR.${method}( "${id}", {
 				width                         : "${width}",
 				height                        : "${height}",
-				autoGrow_minHeight            : "${height}".replace("px", ""),
 				toolbar                       : "${toolbarSet}",
 				language                      : "${language}",
 				defaultLangugage              : "en",
Index: lams_admin/web/WEB-INF/tags/Page.tag
===================================================================
diff -u
--- lams_admin/web/WEB-INF/tags/Page.tag	(revision 0)
+++ lams_admin/web/WEB-INF/tags/Page.tag	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -0,0 +1,49 @@
+<%@ tag body-content="scriptless"%>
+<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
+
+<%@ attribute name="type" required="true" rtexprvalue="true"%>
+<%@ attribute name="style" required="false" rtexprvalue="true"%>
+<%@ attribute name="title" required="false" rtexprvalue="true"%>
+<%@ attribute name="titleHelpURL" required="false" rtexprvalue="true"%>
+<%@ attribute name="headingContent" required="false" rtexprvalue="true"%>
+
+
+
+<div class="row no-gutter">
+	<div class="col-xs-12">
+		<div class="container" id="content">
+		
+		<c:choose>
+		<c:when test='${type == "navbar"}'>
+			<jsp:doBody />
+		</c:when> 
+		<c:otherwise>
+			<div class="panel panel-default panel-${type}-page">
+				<c:if test="${not empty title}">
+					<div class="panel-heading">
+						<div class="panel-title panel-${type}-title">
+							<c:out value="${title}" escapeXml="true" />
+							<c:if test="${not empty titleHelpURL}">
+								<span class="pull-right">${titleHelpURL}</span>
+							</c:if>
+						</div>
+						<c:if test="${not empty headingContent}">
+							<c:out value="${headingContent}" escapeXml="true" />
+						</c:if>
+					</div>
+				</c:if>
+				<div class="panel-body panel-${type}-body">
+					<jsp:doBody />
+				</div>
+			</div>
+		</c:otherwise>
+		</c:choose>
+			
+		</div>
+		<!-- End content container -->
+	</div>
+</div>
+
+
+		
+			
Index: lams_admin/web/WEB-INF/tags/RestrictedUsageAccordian.tag
===================================================================
diff -u
--- lams_admin/web/WEB-INF/tags/RestrictedUsageAccordian.tag	(revision 0)
+++ lams_admin/web/WEB-INF/tags/RestrictedUsageAccordian.tag	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -0,0 +1,54 @@
+<%
+	 /****************************************************************
+	 * Copyright (C) 2005 LAMS Foundation (http://lamsfoundation.org)
+	 * =============================================================
+	 * License Information: http://lamsfoundation.org/licensing/lams/2.0/
+	 * 
+	 * This program is free software; you can redistribute it and/or modify
+	 * it under the terms of the GNU General Public License version 2.0
+	 * as published by the Free Software Foundation.
+	 * 
+	 * This program is distributed in the hope that it will be useful,
+	 * but WITHOUT ANY WARRANTY; without even the implied warranty of
+	 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+	 * GNU General Public License for more details.
+	 * 
+	 * You should have received a copy of the GNU General Public License
+	 * along with this program; if not, write to the Free Software
+	 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301
+	 * USA
+	 * 
+	 * http://www.gnu.org/licenses/gpl.txt
+	 * ****************************************************************
+	 */
+
+	/**
+	 * AdvancedAccordian.tag
+	 *	Author: Fiona Malikoff
+	 *	Description: Creates the show/hide entry for the Restricted Usage Settings in Monitoring.
+	 * Wiki: 
+	 */
+%>
+<%@ attribute name="title" required="true" rtexprvalue="true"%>
+
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-fmt" prefix="fmt"%>
+<%@ taglib uri="tags-lams" prefix="lams"%>
+
+<div class="panel-group" id="accordionRestrictUsageDiv" role="tablist" aria-multiselectable="true"> 
+    <div class="panel panel-default" >
+        <div class="panel-heading collapsable-icon-left" id="headingRestrictedUsageDiv">
+        	<span class="panel-title">
+	    	<a class="collapsed" role="button" data-toggle="collapse" href="#restrictUsageDiv" aria-expanded="false" aria-controls="restrictUsageDiv" >
+          	${title}
+        	</a>
+      		</span>
+        </div>
+
+
+		<div id="restrictUsageDiv" class="panel-body panel-collapse collapse" role="tabpanel" aria-labelledby="headingRestrictedUsageDiv">
+		<jsp:doBody />
+		</div>
+	</div>
+</div>
+		
\ No newline at end of file
Index: lams_admin/web/WEB-INF/tags/Tab.tag
===================================================================
diff -u -rac6c077d83ef253fa3f07a515edc49077317029a -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/WEB-INF/tags/Tab.tag	(.../Tab.tag)	(revision ac6c077d83ef253fa3f07a515edc49077317029a)
+++ lams_admin/web/WEB-INF/tags/Tab.tag	(.../Tab.tag)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,85 +1,89 @@
-<%
-	 /****************************************************************
-	 * Copyright (C) 2005 LAMS Foundation (http://lamsfoundation.org)
-	 * =============================================================
-	 * License Information: http://lamsfoundation.org/licensing/lams/2.0/
-	 * 
-	 * This program is free software; you can redistribute it and/or modify
-	 * it under the terms of the GNU General Public License version 2.0
-	 * as published by the Free Software Foundation.
-	 * 
-	 * This program is distributed in the hope that it will be useful,
-	 * but WITHOUT ANY WARRANTY; without even the implied warranty of
-	 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-	 * GNU General Public License for more details.
-	 * 
-	 * You should have received a copy of the GNU General Public License
-	 * along with this program; if not, write to the Free Software
-	 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301
-	 * USA
-	 * 
-	 * http://www.gnu.org/licenses/gpl.txt
-	 * ****************************************************************
-	 */
-
-	/**
-	 * Tab.tag
-	 *	Author: Mitchell Seaton
-	 *	Description: Creates a tab element.
-	 * Wiki: 
-	 */
-%>
-<%@ tag body-content="empty"%>
-<%@ attribute name="id" required="true" rtexprvalue="true"%>
-<%@ attribute name="value" required="false" rtexprvalue="true"%>
-<%@ attribute name="key" required="false" rtexprvalue="true"%>
-<%@ attribute name="inactive" required="false" rtexprvalue="true"%>
-<%@ attribute name="methodCall" required="false" rtexprvalue="true"%>
-
-<%@ taglib uri="tags-core" prefix="c"%>
-<%@ taglib uri="tags-fmt" prefix="fmt"%>
-<%@ taglib uri="tags-lams" prefix="lams"%>
-
-<%-- Check if  bundle is set --%>
-<c:if test="${not empty bundle}">
-	<fmt:setBundle basename="${bundle}"/>
-</c:if>
-
-<c:set var="lams">
-	<lams:LAMSURL />
-</c:set>
-
-<c:set var="tabTitle" value="${value}" />
-
-<%--
-	Usually methodCall is selectTab, but the calling code can override methodCall if desired.
-	this is handy if the page needs different logic on initialisation and user switching tabs
---%>
-
-<c:if test="${methodCall == null}">
-	<c:choose>
-		<c:when test="${dControl}">
-			<c:set var="methodCall" value="doSelectTab" />
-		</c:when>
-		<c:otherwise>
-			<c:set var="methodCall" value="selectTab" />
-		</c:otherwise>
-	</c:choose>
-</c:if>
-
-<c:if test="${key != null && value == null}">
-	<c:set var="tabTitle">
-		<fmt:message key="${key}" />
-	</c:set>
-</c:if>
-
-<div class="nav-box">
-	<div class="tab-left" id="tab-left-${id}"></div>
-	<div class="tab-middle" id="tab-middle-${id}">
-		<a class="tab-middle-link" id="tab-middle-link-${id}" href="#"
-			onclick="${methodCall}(${id});return false;">
-			${tabTitle}
-		</a>
-	</div>
-	<div class="tab-right" id="tab-right-${id}"></div>
-</div>
+<%
+	 /****************************************************************
+	 * Copyright (C) 2005 LAMS Foundation (http://lamsfoundation.org)
+	 * =============================================================
+	 * License Information: http://lamsfoundation.org/licensing/lams/2.0/
+	 * 
+	 * This program is free software; you can redistribute it and/or modify
+	 * it under the terms of the GNU General Public License version 2.0
+	 * as published by the Free Software Foundation.
+	 * 
+	 * This program is distributed in the hope that it will be useful,
+	 * but WITHOUT ANY WARRANTY; without even the implied warranty of
+	 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+	 * GNU General Public License for more details.
+	 * 
+	 * You should have received a copy of the GNU General Public License
+	 * along with this program; if not, write to the Free Software
+	 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301
+	 * USA
+	 * 
+	 * http://www.gnu.org/licenses/gpl.txt
+	 * ****************************************************************
+	 */
+
+	/**
+	 * Tab.tag
+	 *	Author: Fiona Malikoff
+	 *	Description: Creates a tab element within the Hybrid Tab Header.
+	 * Wiki: 
+	 */
+%>
+<%@ tag body-content="empty"%>
+<%@ attribute name="id" required="true" rtexprvalue="true"%>
+<%@ attribute name="value" required="false" rtexprvalue="true"%>
+<%@ attribute name="key" required="false" rtexprvalue="true"%>
+<%@ attribute name="inactive" required="false" rtexprvalue="true"%>
+<%@ attribute name="methodCall" required="false" rtexprvalue="true"%>
+
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-fmt" prefix="fmt"%>
+<%@ taglib uri="tags-lams" prefix="lams"%>
+
+<%-- Check if  bundle is set --%>
+<c:if test="${not empty bundle}">
+	<fmt:setBundle basename="${bundle}"/>
+</c:if>
+
+<c:set var="lams">
+	<lams:LAMSURL />
+</c:set>
+
+<c:set var="tabTitle" value="${value}" />
+
+<%--
+	Usually methodCall is selectTab, but the calling code can override methodCall if desired.
+	this is handy if the page needs different logic on initialisation and user switching tabs
+	
+	-- 			onclick="${methodCall}(${id});return false;">
+	
+--%>
+
+<c:if test="${methodCall == null}">
+	<c:choose>
+		<c:when test="${dControl}">
+			<c:set var="methodCall" value="doSelectTab" />
+		</c:when>
+		<c:otherwise>
+			<c:set var="methodCall" value="selectTab" />
+		</c:otherwise>
+	</c:choose>
+</c:if>
+
+<c:if test="${key != null && value == null}">
+	<c:set var="tabTitle">
+		<fmt:message key="${key}" />
+	</c:set>
+</c:if>
+
+<c:set var="class" value=""/>
+<c:if test="${id == 1}">
+	<c:set var="class">class="active"</c:set>
+</c:if>
+	
+<c:set var="disabled" value=""/>
+<c:if test="${inactive}">
+	<c:set var="class">class="disabled"</c:set>
+</c:if>
+
+<li role="presentation" ${class}><a href="#t${id}" aria-controls="t${id}" role="tab" onclick="${methodCall}(${id});return false;">${tabTitle}</a></li>
Index: lams_admin/web/WEB-INF/tags/Tabs.tag
===================================================================
diff -u -r9481bb9c6f8c0e4d6fbed6b230a41c77feda64c6 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/WEB-INF/tags/Tabs.tag	(.../Tabs.tag)	(revision 9481bb9c6f8c0e4d6fbed6b230a41c77feda64c6)
+++ lams_admin/web/WEB-INF/tags/Tabs.tag	(.../Tabs.tag)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,69 +1,92 @@
-<%/****************************************************************
- * Copyright (C) 2005 LAMS Foundation (http://lamsfoundation.org)
- * =============================================================
- * License Information: http://lamsfoundation.org/licensing/lams/2.0/
- * 
- * This program is free software; you can redistribute it and/or modify
- * it under the terms of the GNU General Public License version 2.0
- * as published by the Free Software Foundation.
- * 
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU General Public License for more details.
- * 
- * You should have received a copy of the GNU General Public License
- * along with this program; if not, write to the Free Software
- * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301
- * USA
- * 
- * http://www.gnu.org/licenses/gpl.txt
- * ****************************************************************
- */
-
-/**
- * Tabs.tag
- *	Author: Mitchell Seaton
- *	Description: Create a tab list from a input collection or nested Tab tags.
- * Wiki: 
- */
-
-		%>
-<%@ tag body-content="scriptless"%>
-<%@ attribute name="collection" type="java.util.Collection" required="false" rtexprvalue="true"%>
-<%@ attribute name="control" required="false" rtexprvalue="true"%>
-<%@ attribute name="useKey" required="false" rtexprvalue="true"%>
-<%@ taglib uri="tags-core" prefix="c"%>
-<%@ taglib uri="tags-lams" prefix="lams"%>
-<c:set var="dControl" value="false" scope="request" />
-<c:if test="${control}">
-	<c:set var="dControl" value="${control}" scope="request" />
-</c:if>
-
-<c:set var="dUseKey" value="false" scope="request" />
-<c:if test="${useKey}">
-	<c:set var="dUseKey" value="${useKey}" scope="request" />
-</c:if>
-
-<!-- tab holder table -->
-<div id="nav">
-	<c:choose>
-		<c:when test="${collection != null}">
-			<c:set var="count" value="0" />
-			<c:forEach var="tab" begin="0" items="${collection}">
-				<c:set var="count" value="${count+1}" />
-				<c:choose>
-					<c:when test="${dUseKey}">
-						<lams:Tab id="${count}" key="${tab}" />
-					</c:when>
-					<c:otherwise>
-						<lams:Tab id="${count}" value="${tab}" />
-					</c:otherwise>
-				</c:choose>
-			</c:forEach>
-		</c:when>
-		<c:otherwise>
-			<jsp:doBody />
-		</c:otherwise>
-	</c:choose>
-</div>
+<%/****************************************************************
+ * Copyright (C) 2005 LAMS Foundation (http://lamsfoundation.org)
+ * =============================================================
+ * License Information: http://lamsfoundation.org/licensing/lams/2.0/
+ * 
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 2.0
+ * as published by the Free Software Foundation.
+ * 
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ * 
+ * You should have received a copy of the GNU General Public License
+ * along with this program; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301
+ * USA
+ * 
+ * http://www.gnu.org/licenses/gpl.txt
+ * ****************************************************************
+ */
+
+/**
+ * Tabs.tag
+ *	Author: Fiona Malikoff
+ *	Description: Create a hybrid panel header that contains a nav bar that acts like tabs.
+ */
+
+%>
+<%@ attribute name="control" required="false" rtexprvalue="true"%>
+<%@ attribute name="title" required="false" rtexprvalue="true"%>
+<%@ attribute name="refreshOnClickAction" required="false" rtexprvalue="true"%>
+<%@ attribute name="helpToolSignature" required="false" rtexprvalue="true"%>
+<%@ attribute name="helpModule" required="false" rtexprvalue="true"%>
+<%@ attribute name="extraControl" required="false" rtexprvalue="true"%>
+
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-lams" prefix="lams"%>
+
+<c:set var="useActions" value="false" scope="request" />
+<c:if test="${not empty helpToolSignature or not empty helpModule or not empty refreshOnClickAction or not empty extraControl}">
+	<c:set var="useActions" value="true" scope="request" />
+</c:if>
+
+<c:set var="dControl" value="false" scope="request" />
+<c:if test="${control}">
+	<c:set var="dControl" value="${control}" scope="request" />
+</c:if>
+
+<!-- navbar combined with tabs -->
+<div class="panel panel-default panel-monitor-page">
+<div class="panel-heading navbar-heading">
+
+ 	<nav class="navbar navbar-default navbar-heading">
+	<div class="container-fluid">
+    	<!-- Brand and toggle get grouped for better mobile display -->
+		<div class="navbar-header">
+	      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1" aria-expanded="false">
+	        <span class="sr-only">Toggle navigation</span>
+	        <span class="icon-bar"></span>
+	        <span class="icon-bar"></span>
+	        <span class="icon-bar"></span>
+	      </button>
+	      <span class="navbar-brand">${title}</span>
+		</div>
+		<div class="collapse navbar-collapse" id="navbar-collapse-1" role="navigation">
+         <ul class="nav navbar-nav" id="page-tabs">
+	         <li role="separator" class="divider"></li>
+	          <jsp:doBody />
+         </ul>
+         <c:if test="${useActions}">
+         <ul class="nav navbar-nav navbar-right" id="page-actions">
+		     <li role="separator" class="divider"></li>
+		     <c:if test="${not empty refreshOnClickAction}">
+             <li class="navbar-text" ><span onclick="${refreshOnClickAction}"><i class="fa fa-refresh"></i></span></li>
+             </c:if>
+             <c:if test="${not empty helpToolSignature or not empty helpModule}">
+             <li class="navbar-text" ><lams:help toolSignature="${helpToolSignature}" module="${helpModule}" style="small"/></li>
+             </c:if>
+             <c:if test="${not empty extraControl}">
+             <li class="navbar-text" >${extraControl}</li>
+             </c:if>
+         </ul>
+         </c:if>
+ 	    
+ 		</div>
+	 </div>
+     </nav>
+     <!-- /top nav -->
+</div>
+<!-- panel div closed by TabBodyArea -->
\ No newline at end of file
Index: lams_admin/web/cleanup.jsp
===================================================================
diff -u -r4398957e0d74208a8f4a605910d1cce71b4ed531 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/cleanup.jsp	(.../cleanup.jsp)	(revision 4398957e0d74208a8f4a605910d1cce71b4ed531)
+++ lams_admin/web/cleanup.jsp	(.../cleanup.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -2,26 +2,25 @@
 <%@ page import="org.lamsfoundation.lams.util.FileUtil" %>
 <%@ page import="org.lamsfoundation.lams.util.TempDirectoryFilter" %>
 
-<h4><a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a></h4>
-<h1><fmt:message key="sysadmin.batch.temp.file.delete"/></h1>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
-<p><html:errors /></p>
+<html:errors />
 
+<lams:Alert type="warn" id="cleanup-warning" close="false">
+	<fmt:message key="msg.cleanup.warning" /><br />
+</lams:Alert>
+
 <logic:notEmpty name="filesDeleted">
 	<p><c:out value="${filesDeleted}" /></p>
 </logic:notEmpty>
 
-<p>
-	<fmt:message key="msg.cleanup.warning" /><br />
-	<input class="button" type="submit" value="Calculate" onClick="javascript:document.location='cleanup.do?action=refresh'" />
-	<ul>
-		<li><c:out value="<%= FileUtil.getTempDir() %>" />
-		<ul>
-			<li><%= TempDirectoryFilter.zip_prefix %>* : <c:out value="${zipTotal}" /><logic:empty name="zipTotal"><i><fmt:message key="label.unknown"/></i></logic:empty> KB
-			<li><%= TempDirectoryFilter.tmp_prefix %>* : <c:out value="${tmpTotal}" /><logic:empty name="tmpTotal"><i><fmt:message key="label.unknown"/></i></logic:empty> KB
-		</ul>
+	<input class="btn btn-default" type="submit" value="Calculate" onClick="javascript:document.location='cleanup.do?action=refresh'" />
+	<span class="loffset10"><c:out value="<%= FileUtil.getTempDir() %>" /></span>
+	
+	<ul class="list-group voffset5">
+		<li class="list-group-item"><%= TempDirectoryFilter.zip_prefix %>* : <c:out value="${zipTotal}" /><logic:empty name="zipTotal"><i><fmt:message key="label.unknown"/></i></logic:empty> KB
+		<li class="list-group-item"><%= TempDirectoryFilter.tmp_prefix %>* : <c:out value="${tmpTotal}" /><logic:empty name="tmpTotal"><i><fmt:message key="label.unknown"/></i></logic:empty> KB
 	</ul>
-	<br />
 	<fmt:message key="msg.cleanup.actual.space" />
 </p>
 
@@ -30,10 +29,13 @@
 </p>
 
 <html:form action="/cleanup" method="post">
-	<p><fmt:message key="label.cleanup.delete" />: <br />
-	<html:text property="numDays" maxlength="4" size="4" /></p>
 
-	<html:submit styleClass="button"><fmt:message key="admin.delete"/></html:submit>
-	<html:cancel styleClass="button"><fmt:message key="admin.cancel"/></html:cancel>					
-
-</html:form>
\ No newline at end of file
+	<p><fmt:message key="label.cleanup.delete" />:
+	<html:text property="numDays" maxlength="4" size="4" styleClass="form-control form-control-inline"/></p>
+	
+	<div class="pull-right">
+		<html:cancel styleClass="btn btn-default"><fmt:message key="admin.cancel"/></html:cancel>	
+		<html:submit styleClass="btn btn-primary loffset5"><fmt:message key="admin.delete"/></html:submit>
+	</div>
+	
+</html:form>
Index: lams_admin/web/config/editconfig.jsp
===================================================================
diff -u -r15f56ca278fe37b325c0faf582c1245545a4100f -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/config/editconfig.jsp	(.../editconfig.jsp)	(revision 15f56ca278fe37b325c0faf582c1245545a4100f)
+++ lams_admin/web/config/editconfig.jsp	(.../editconfig.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -2,37 +2,28 @@
 <%@ page import="org.lamsfoundation.lams.config.ConfigurationItem"%>
 <%@ include file="/taglibs.jsp"%>
 
-<h4>
-	<a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a>
-</h4>
-<lams:help style="no-tabs"
-	page="<%=Configuration.CONFIGURATION_HELP_PAGE%>" />
-<h1>
-	<fmt:message key="sysadmin.config.settings.edit" />
-</h1>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
-<div align="center">
-	<c:if test="${not empty error}">
-		<p class='warning'>
+<c:if test="${not empty error}">
+	<lams:Alert type="danger" id="error-messages" close="false">
 			<c:out value="${error}" />
-		</p>
-	</c:if>
-</div>
+	</lams:Alert>
+</c:if>
 
 <html:form action="/config" method="post">
 	<html:hidden property="method" value="save" />
 
 	<tiles:insert attribute="items" />
 
-	<p align="center">
-		<html:submit styleId="saveButton" styleClass="button">
-			<fmt:message key="admin.save" />
-		</html:submit>
-		<html:reset styleClass="button">
-			<fmt:message key="admin.reset" />
-		</html:reset>
-		<html:cancel styleClass="button">
+	<div class="pull-right">
+		<html:cancel styleClass="btn btn-default">
 			<fmt:message key="admin.cancel" />
 		</html:cancel>
-	</p>
-</html:form>
\ No newline at end of file
+		<html:reset styleClass="btn btn-default loffset5">
+			<fmt:message key="admin.reset" />
+		</html:reset>
+		<html:submit styleId="saveButton" styleClass="btn btn-primary loffset5">
+			<fmt:message key="admin.save" />
+		</html:submit>
+	</div>
+</html:form>
Index: lams_admin/web/config/items.jsp
===================================================================
diff -u -r7d24c6689041f052f79e57c4044cdbea901cda04 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/config/items.jsp	(.../items.jsp)	(revision 7d24c6689041f052f79e57c4044cdbea901cda04)
+++ lams_admin/web/config/items.jsp	(.../items.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -2,11 +2,14 @@
 <%@ include file="/taglibs.jsp"%>
 
 	<logic:iterate name="config" id="group">
-		<h2 align="center"><fmt:message key="${group.key}"/></h2>
-		<table class="alternative-color" width=100% cellspacing="0">
+		<div class="panel panel-default">
+			<div class="panel-heading">
+				<div class="panel-title"><fmt:message key="${group.key}"/></div>
+			</div>
+		<table class="table table-striped table-condensed" >
 		<logic:iterate name="group" property="value" id="row">
 			<tr>
-				<td align="right" width="50%">
+				<td>
 					<fmt:message key="${row.descriptionKey}"/>
 					<c:if test="${row.required}">&nbsp;&nbsp;*</c:if>
 				</td>
@@ -15,17 +18,18 @@
 					<c:set var="BOOLEAN"><%= ConfigurationItem.BOOLEAN_FORMAT %></c:set>
 					<c:choose>
 					<c:when test="${row.format==BOOLEAN}">
-						<html:select styleId="${row.key}" name="row" property="value">
+						<html:select styleId="${row.key}" name="row" property="value" styleClass="form-control form-control-sm">
 						<html:option value="true">true</html:option>
 						<html:option value="false">false&nbsp;&nbsp;</html:option>
 						</html:select>
 					</c:when>
 					<c:otherwise>
-						<html:text styleId="${row.key}" property="value" name="row" value="${row.value}" size="50" maxlength="255"/>
+						<html:text styleId="${row.key}" property="value" name="row" value="${row.value}" size="50" maxlength="255" styleClass="form-control"/>
 					</c:otherwise>
 					</c:choose>
 				</td>
 			</tr>
 		</logic:iterate>
 		</table>
+		</div>
 	</logic:iterate>
Index: lams_admin/web/disabledusers.jsp
===================================================================
diff -u -r7ab9e2377fd1ff4c3c5554bd1f6dffe3384f6f9a -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/disabledusers.jsp	(.../disabledusers.jsp)	(revision 7ab9e2377fd1ff4c3c5554bd1f6dffe3384f6f9a)
+++ lams_admin/web/disabledusers.jsp	(.../disabledusers.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,9 +1,8 @@
 <%@ include file="/taglibs.jsp"%>
 
-<h4><a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a></h4>
-<h1><fmt:message key="admin.list.disabled.users"/></h1>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
-<table class="alternative-color" width=100% cellspacing="0">
+<table class="table table-striped table-condensed">
 <tr>
 	<th></th>
 	<th><fmt:message key="admin.user.login"/></th>
@@ -30,7 +29,7 @@
 			<bean:write name="user" property="lastName" />
 		</td>
 		<td>
-			<a href="user.do?method=enable&userId=<bean:write name='user' property='userId' />"><fmt:message key="admin.enable"/></a>
+			<a href="user.do?method=enable&userId=<bean:write name='user' property='userId' />" class="btn btn-default btn-sm"><fmt:message key="admin.enable"/></a>
 		</td>		
 	</tr>
 </logic:iterate>
Index: lams_admin/web/groupStatistics.jsp
===================================================================
diff -u -r6b759dda2b1837d0da0b214bbfabbfa6deddc3bb -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/groupStatistics.jsp	(.../groupStatistics.jsp)	(revision 6b759dda2b1837d0da0b214bbfabbfa6deddc3bb)
+++ lams_admin/web/groupStatistics.jsp	(.../groupStatistics.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,11 +1,11 @@
 <%@ include file="/taglibs.jsp"%>
 
-<h3>${groupStatisticsDTO.name}</h3>
+<h4>${groupStatisticsDTO.name}</h4>
 
-<table class="alternative-color">
+<table class="table table-striped table-condensed" >
 	<tr>
 		<td><fmt:message key="admin.statistics.totalUsers" /></td>
-		<td>${groupStatisticsDTO.totalUsers}</td>
+		<td width="150px">${groupStatisticsDTO.totalUsers}</td>
 	</tr>
 	<tr>
 		<td><fmt:message key="admin.statistics.lessons" /></td>
@@ -26,15 +26,15 @@
 </table>
 
 <c:if test="${not empty  groupStatisticsDTO.subGroups}">
-	<div style="margin-left: 50px"><c:forEach
+	<div style="margin-left: 4%"><c:forEach
 		var="subGroupStatisticsDTO" items="${groupStatisticsDTO.subGroups}">
 
-		<h3>${subGroupStatisticsDTO.name}</h3>
+		<h4>${subGroupStatisticsDTO.name}</h4>
 
-		<table class="alternative-color">
+		<table class="table table-striped table-condensed" >
 			<tr>
 				<td><fmt:message key="admin.statistics.totalUsers" /></td>
-				<td>${subGroupStatisticsDTO.totalUsers}</td>
+				<td width="150px">${subGroupStatisticsDTO.totalUsers}</td>
 			</tr>
 			<tr>
 				<td><fmt:message key="admin.statistics.lessons" /></td>
Index: lams_admin/web/ldap.jsp
===================================================================
diff -u -rce3e782fd6844641f7298e09104f8d7554f073ff -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/ldap.jsp	(.../ldap.jsp)	(revision ce3e782fd6844641f7298e09104f8d7554f073ff)
+++ lams_admin/web/ldap.jsp	(.../ldap.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -11,80 +11,80 @@
 	}
 </script>
 
-<h4><a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a></h4>
-<lams:help style="no-tabs" page="LDAP+Configuration"/>
-<h1><fmt:message key="sysadmin.ldap.configuration"/></h1>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
-<c:if test="${not empty config}">
-<html:form action="/config" method="post">
-	<html:hidden property="method" value="save"/>
-	<tiles:insert attribute="items" />
-	<p align="center">
-		<html:submit styleClass="button"><fmt:message key="admin.save" /></html:submit>
-		<html:reset styleClass="button"><fmt:message key="admin.reset" /></html:reset>
-		<html:cancel styleClass="button"><fmt:message key="admin.cancel" /></html:cancel>
-	</p>
-</html:form>
-</c:if>
+<div class="panel panel-default">
+	<div class="panel-heading">
+		<div class="panel-title"><fmt:message key="sysadmin.ldap.configuration"/></div>
+	</div>
 
-<h3><fmt:message key="heading.ldap.synchronise"/></h3>
-<p>
-<fmt:message key="msg.ldap.synchronise.intro"/>
-</p>
-<p>
-<fmt:message key="msg.ldap.synchronise.warning"/>
-</p>
+	<div class="panel-body panel-default">
+		<c:if test="${not empty config}">
+		<html:form action="/config" method="post">
+			<html:hidden property="method" value="save"/>
+			<tiles:insert attribute="items" />
+			<div class="pull-right">
+				<html:reset styleClass="btn btn-default"><fmt:message key="admin.reset" /></html:reset>
+				<html:cancel styleClass="btn btn-default loffset5"><fmt:message key="admin.cancel" /></html:cancel>
+				<html:submit styleClass="btn btn-primary loffset5"><fmt:message key="admin.save" /></html:submit>
+			</div>
+		</html:form>
+		</c:if>
+	</div>
+</div>
 
-<c:if test="${not empty numLdapUsersMsg}">
-	<p><c:out value="${numLdapUsersMsg}"/></p>
-</c:if>
+<div class="panel panel-default">
+	<div class="panel-heading">
+		<div class="panel-title"><fmt:message key="heading.ldap.synchronise"/></div>
+	</div>
 
-<p>
-	<input 
-		class="button" 
-		type="button" 
-		value="<fmt:message key="label.synchronise" />" 
-		onclick='startSync();'
-	/>
-</p>
-
-<p>&nbsp;</p>
-
-<c:if test="${not empty wait}">
-	<p><c:out value="${wait}"/></p>
-	<script language="javascript" type="text/javascript">
-		function refresh() {
-			document.location = 'ldap.do?action=waiting';
-		}
-		window.setInterval("refresh()",5000);
-	</script>
-</c:if>
-
-<c:if test="${not empty done}">
-	<h3><c:out value="${done}"/></h3>
-	<ul>
-		<c:if test="${not empty messages}">
-		<li>
-			<fmt:message key="msg.ldap.synchronise.errors"/>
+	<div class="panel-body panel-default">
+		<p><fmt:message key="msg.ldap.synchronise.intro"/></p>
+		<p><fmt:message key="msg.ldap.synchronise.warning"/></p>
+		
+		<c:if test="${not empty numLdapUsersMsg}">
+			<p><c:out value="${numLdapUsersMsg}"/></p>
+		</c:if>
+		
+		<c:if test="${not empty wait}">
+			<p><c:out value="${wait}"/></p>
+			<script language="javascript" type="text/javascript">
+				function refresh() {
+					document.location = 'ldap.do?action=waiting';
+				}
+				window.setInterval("refresh()",5000);
+			</script>
+		</c:if>
+		
+		<c:if test="${not empty done}">
+			<h4><c:out value="${done}"/></h4>
 			<ul>
-				<c:forEach items="${messages}" var="message">
-					<li><c:out value="${message}"/></li>
-				</c:forEach>
+				<c:if test="${not empty messages}">
+				<li>
+					<fmt:message key="msg.ldap.synchronise.errors"/>
+					<ul>
+						<c:forEach items="${messages}" var="message">
+							<li><c:out value="${message}"/></li>
+						</c:forEach>
+					</ul>
+				</li>
+				</c:if>
+				<c:if test="${not empty numSearchResults}">
+				<li><c:out value="${numSearchResults}"/></li>
+				</c:if>
+				<c:if test="${not empty numLdapUsersCreated}">
+				<li><c:out value="${numLdapUsersCreated}"/></li>
+				</c:if>
+				<c:if test="${not empty numLdapUsersUpdated}">
+				<li><c:out value="${numLdapUsersUpdated}"/></li>
+				</c:if>
+				<c:if test="${not empty numLdapUsersDisabled}">
+				<li><c:out value="${numLdapUsersDisabled}"/></li>
+				</c:if>
 			</ul>
-		</li>
 		</c:if>
-		<c:if test="${not empty numSearchResults}">
-		<li><c:out value="${numSearchResults}"/></li>
-		</c:if>
-		<c:if test="${not empty numLdapUsersCreated}">
-		<li><c:out value="${numLdapUsersCreated}"/></li>
-		</c:if>
-		<c:if test="${not empty numLdapUsersUpdated}">
-		<li><c:out value="${numLdapUsersUpdated}"/></li>
-		</c:if>
-		<c:if test="${not empty numLdapUsersDisabled}">
-		<li><c:out value="${numLdapUsersDisabled}"/></li>
-		</c:if>
-	</ul>
-</c:if>
-
+		
+		<input class="btn btn-primary pull-right" value="<fmt:message key="label.synchronise" />" onclick='startSync();'/>
+		
+	</div>
+</div>
Index: lams_admin/web/loginmaintain.jsp
===================================================================
diff -u -r5170c21ad54f59efa06760fa86efcace8de2792a -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/loginmaintain.jsp	(.../loginmaintain.jsp)	(revision 5170c21ad54f59efa06760fa86efcace8de2792a)
+++ lams_admin/web/loginmaintain.jsp	(.../loginmaintain.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,14 +1,12 @@
 <%@ include file="/taglibs.jsp"%>
 
-<h4><a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a>
-</h4>
-<h1><fmt:message key="sysadmin.maintain.loginpage"/></h1>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
 <html:errors />
-<br />
+
 <html:form action="/loginsave.do?method=save" enctype="multipart/form-data" method="post">
 <p><fmt:message key="sysadmin.login.logo"/></p>
-<p><html:file property="logo" size="40" styleClass="button" /></p>
+<p><html:file property="logo" size="40" styleClass="form-control" /></p>
 <br />
 <c:set var="language"><lams:user property="localeLanguage"/></c:set>
 <p><fmt:message key="sysadmin.login.text"/></p>
@@ -17,12 +15,12 @@
 
 <c:set var="existingContent"><bean:write name='LoginMaintainForm' property='news' filter='false' /></c:set>
 
-<lams:CKEditor id="news" value="${existingContent}"	contentFolderID="../public" width="95%" height="600px"></lams:CKEditor>
+<lams:CKEditor id="news" value="${existingContent}"	contentFolderID="../public" height="600px"></lams:CKEditor>
 
 </div>
-<br />
-<p align="center">
-	<html:cancel styleId="cancelButton" styleClass="button"><fmt:message key="admin.cancel" /></html:cancel>
-	<html:submit styleId="saveButton" styleClass="button"><fmt:message key="admin.save" /></html:submit>
-</p>
+
+<div class="pull-right voffset5">
+	<html:cancel styleId="cancelButton" styleClass="btn btn-default"><fmt:message key="admin.cancel" /></html:cancel>
+	<html:submit styleId="saveButton" styleClass="btn btn-primary loffset5"><fmt:message key="admin.save" /></html:submit>
+</div>
 </html:form>
Index: lams_admin/web/organisation/cloneResult.jsp
===================================================================
diff -u -r7a038b413299c10aa5b3dd168e35811597f44173 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/organisation/cloneResult.jsp	(.../cloneResult.jsp)	(revision 7a038b413299c10aa5b3dd168e35811597f44173)
+++ lams_admin/web/organisation/cloneResult.jsp	(.../cloneResult.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -2,22 +2,19 @@
 
 <tiles:insert attribute="breadcrumbs" />
 
-<h1><fmt:message key="title.clone.lessons.for"><fmt:param value="${org.name}" /></fmt:message></h1>
+<h4><fmt:message key="title.clone.lessons.for"><fmt:param value="${org.name}" /></fmt:message></h4>
 
 <c:if test="${not empty errors}">
-	<p class="warning">
+	<lams:Alert type="danger" id="errorKey" close="false">	
 		<c:forEach items="${errors}" var="error">
 			<c:out value="${error}" />
 		</c:forEach>
-	</p>
+	</lams:Alert>
 </c:if>
 
 <p>
 	<fmt:message key="message.cloned.lessons"><fmt:param value="${result}" /></fmt:message>
 </p>
 
-<p align="center">
-	<input type="button" class="button" value="<fmt:message key="label.return.to.group" />" 
-		onclick="document.location='orgmanage.do?org=<c:out value="${org.organisationId}" />';"
-	>
-</p>
\ No newline at end of file
+<input type="button" class="btn btn-default pull-right" value="<fmt:message key="label.return.to.group" />" 
+		onclick="document.location='orgmanage.do?org=<c:out value="${org.organisationId}" />';"	>
Index: lams_admin/web/organisation/cloneStart.jsp
===================================================================
diff -u -r35a0e719d061c08b52e705135bb2f2126079ed21 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/organisation/cloneStart.jsp	(.../cloneStart.jsp)	(revision 35a0e719d061c08b52e705135bb2f2126079ed21)
+++ lams_admin/web/organisation/cloneStart.jsp	(.../cloneStart.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,152 +1,166 @@
 <%@ include file="/taglibs.jsp"%>
+<c:set var="lams"><lams:LAMSURL /></c:set>
 
-<link type="text/css" href="<lams:LAMSURL/>css/jquery-ui-smoothness-theme.css" rel="stylesheet">
+<link type="text/css" href="${lams}css/jquery-ui-smoothness-theme.css" rel="stylesheet">
+<link type="text/css" href="${lams}css/jquery.tablesorter.theme.bootstrap.css" rel="stylesheet">
+<link type="text/css" href="${lams}css/jquery.tablesorter.pager.css"  rel="stylesheet">
 
-<style type="text/css">
-	.clone-box {
-		border: 1px solid grey; padding: 10px; margin-top: 10px;
-	}
-	.padding-bottom {
-		padding-bottom: 20px;
-	}
-</style>
 
-<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery.js"></script>
-<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery-ui.js"></script>
-<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery.tablesorter.pack.js"></script>
-<script language="JavaScript" type="text/javascript" src="<lams:LAMSURL/>/includes/javascript/jquery.tablesorter.pager.js"></script>
+<script language="JavaScript" type="text/javascript" src="${lams}includes/javascript/jquery.js"></script>
+<script language="JavaScript" type="text/javascript" src="${lams}includes/javascript/jquery-ui.js"></script>
+<script language="JavaScript" type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter.js"></script>
+<script language="JavaScript" type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter-widgets.js"></script>
+<script language="JavaScript" type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter-pager.js"></script>
+
+<%-- <script language="JavaScript" type="text/javascript" src="${lams}includes/javascript/jquery.tablesorter.pack.js"></script>
+ --%>
 <script language="JavaScript" type="text/javascript">
 	<!--
 	var staffLoaded, learnersLoaded = false;
 	var lessonsLoaded = {};
 
-	jQuery(document).ready(function() {
-		jQuery("#sourceGroupId").change(function() {
-			loadSubgroups(jQuery("#sourceGroupId").val());
+	$(document).ready(function() {
+		$("#sourceGroupId").change(function() {
+			loadSubgroups($("#sourceGroupId").val());
 		});
-		jQuery("#sourceGroupId").load("<lams:LAMSURL/>/admin/clone.do", { method: "getGroups" }, function() {
-			loadSubgroups(jQuery("#sourceGroupId").val());
+		$("#sourceGroupId").load("<lams:LAMSURL/>/admin/clone.do", { method: "getGroups" }, function() {
+			loadSubgroups($("#sourceGroupId").val());
 		});
-		jQuery("a.lessonNameLink").live("click", function() {
-			lessonDialog(jQuery(this).attr("id"));
+		$("a.lessonNameLink").on("click", function() {
+			lessonDialog($(this).attr("id"));
 		});
 	});
 
 	function loadSubgroups(groupId) {
-		jQuery("#sourceSubgroupId").load("<lams:LAMSURL/>/admin/clone.do", { method: "getSubgroups", groupId: groupId });
+		$("#sourceSubgroupId").load("<lams:LAMSURL/>/admin/clone.do", { method: "getSubgroups", groupId: groupId });
 	}
 
 	function chosenGroup() {
-		if (jQuery("#sourceSubgroupId").val() != '') {
-			return jQuery("#sourceSubgroupId").val();
+		if ($("#sourceSubgroupId").val() != '') {
+			return $("#sourceSubgroupId").val();
 		} else {
-			return jQuery("#sourceGroupId").val();
+			return $("#sourceGroupId").val();
 		}
 	}
 
 	function loadGroupAttributes(sourceGroupId) {
-		jQuery("#cloneOptionsDiv").show();
-		jQuery("#availableLessons").load("<lams:LAMSURL/>/admin/clone.do", { method: "availableLessons", sourceGroupId: sourceGroupId });
+		$("#cloneOptionsDiv").show();
+		$("#availableLessons").load("<lams:LAMSURL/>/admin/clone.do", { method: "availableLessons", sourceGroupId: sourceGroupId });
 	}
 
 	function lessonDialog(lessonId) {
 		if (lessonsLoaded[lessonId] == null || !lessonsLoaded[lessonId]) {
-			jQuery("#lessonDialog-"+lessonId).dialog({
+			$("#lessonDialog-"+lessonId).dialog({
 				autoOpen: false,
 				modal: true
 			});
 			lessonsLoaded[lessonId] = true;
 		}
-		jQuery("#lessonDialog-"+lessonId).dialog("open");
+		$("#lessonDialog-"+lessonId).dialog("open");
 		return false;
 	}
 
 	function initUserDialog(selector) {
-		jQuery(selector).dialog({
+		$(selector).dialog({
 			autoOpen: false,
 			modal: true, 
-			width: 500, 
+			width: 680, 
 			buttons: { 
 				"<fmt:message key='label.ok' />": function() {
-					jQuery(this).dialog("close");
+					$(this).dialog("close");
 				} 
 			} 
 		});
 	}
 
 	function staffDialog() {
 		if (!staffLoaded) {
-			jQuery("#staffDialog").load("<lams:LAMSURL/>/admin/clone.do", { method: "selectStaff", groupId: <c:out value="${org.organisationId}" /> });
+			$("#staffDialog").load("<lams:LAMSURL/>/admin/clone.do", { method: "selectStaff", groupId: <c:out value="${org.organisationId}" /> });
 			initUserDialog("#staffDialog");
 			staffLoaded = true;
 		}
-		jQuery("#staffDialog").dialog("open");
+		$("#staffDialog").dialog("open");
 		return false;
 	}
 
 	function learnerDialog() {
 		if (!learnersLoaded) {
-			jQuery("#learnerDialog").load("<lams:LAMSURL/>/admin/clone.do", { method: "selectLearners", groupId: <c:out value="${org.organisationId}" /> });
+			$("#learnerDialog").load("<lams:LAMSURL/>/admin/clone.do", { method: "selectLearners", groupId: <c:out value="${org.organisationId}" /> });
 			initUserDialog("#learnerDialog");
 			learnersLoaded = true;
 		}
-		jQuery("#learnerDialog").dialog("open");
+		$("#learnerDialog").dialog("open");
 		return false;
 	}
 
 	function clone() {
 		var lessons = [];
 		var staff = [];
 		var learners = [];
-		jQuery("input[name=lessons]:checked").each(function() {
-			lessons.push(jQuery(this).val());
+		$("input[name=lessons]:checked").each(function() {
+			lessons.push($(this).val());
 		});
-		jQuery("input[name=staff]:checked").each(function() {
-			staff.push(jQuery(this).val());
+		$("input[name=staff]:checked").each(function() {
+			staff.push($(this).val());
 		});
-		jQuery("input[name=learners]:checked").each(function() {
-			learners.push(jQuery(this).val());
+		$("input[name=learners]:checked").each(function() {
+			learners.push($(this).val());
 		});
-		jQuery("input[name=lessons]").val(lessons.join(","));
-		jQuery("input[name=staff]").val(staff.join(","));
-		jQuery("input[name=learners]").val(learners.join(","));
-		jQuery("input[name=addAllStaff]").val(jQuery("#addAllStaff").is(":checked"));
-		jQuery("input[name=addAllLearners]").val(jQuery("#addAllLearners").is(":checked"));
+		$("input[name=lessons]").val(lessons.join(","));
+		$("input[name=staff]").val(staff.join(","));
+		$("input[name=learners]").val(learners.join(","));
+		$("input[name=addAllStaff]").val($("#addAllStaff").is(":checked"));
+		$("input[name=addAllLearners]").val($("#addAllLearners").is(":checked"));
 		return true;
 	}
 	//-->
 </script>
 
 <tiles:insert attribute="breadcrumbs" />
 
-<h1><fmt:message key="title.clone.lessons.for"><fmt:param value="${org.name}" /></fmt:message></h1>
+<h4><fmt:message key="title.clone.lessons.for"><fmt:param value="${org.name}" /></fmt:message></h4>
 
 <c:if test="${not empty errors}">
-	<p class="warning">
+	<lams:Alert type="danger" id="errorKey" close="false">			
 		<c:forEach items="${errors}" var="error">
 			<c:out value="${error}" />
 		</c:forEach>
-	</p>
+	</lams:Alert>
 </c:if>
 
-<h2><fmt:message key="title.choose.group" /></h2>
-<div class="clone-box">
-	<p>
-		<fmt:message key="admin.course" />:
-		<select id="sourceGroupId">
-			<option value="">...</option>
-		</select>
-	</p>
-	<p class="padding-bottom">
-		<fmt:message key="admin.class" />:
-		<select id="sourceSubgroupId">
-		</select>
-	</p>
-	<p>
-		<input type="submit" class="button" value="<fmt:message key="label.choose" />" onclick="javascript:loadGroupAttributes(chosenGroup());">
-	</p>
+<div class="panel panel-default voffset5" >
+	<div class="panel-heading">
+		<span class="panel-title">
+			<fmt:message key="title.choose.group" />
+		</span>
+	</div>
+	<div class="panel-body">
+		<div class="form-group">
+			<fmt:message key="admin.course" />:
+			<select id="sourceGroupId" class="form-control">
+				<option value="">...</option>
+			</select>
+		</div>
+		<div class="form-group">
+			<fmt:message key="admin.class" />:
+			<select id="sourceSubgroupId" class="form-control">
+			</select>
+		</div>
+		<div class="form-group">
+			<input type="submit" class="btn btn-default" value="<fmt:message key="label.choose" />" onclick="javascript:loadGroupAttributes(chosenGroup());">
+		</div>
+	</div>
 </div>
 
+<div id="staffDialog" title="<fmt:message key="label.configure.staff" />" style="display:none;">
+
+</div>
+
+<div id="learnerDialog" title="<fmt:message key="label.configure.learners" />" style="display:none;">
+
+</div>
+
+
 <form name="cloneForm" id="cloneForm" action="<lams:LAMSURL/>/admin/clone.do" method="post">
 	<input type="hidden" name="method" value="clone">
 	<input type="hidden" name="groupId" value="<c:out value="${org.organisationId}" />">
@@ -155,41 +169,45 @@
 	<input type="hidden" name="learners">
 
 	<div style="display:none;" id="cloneOptionsDiv">
-		<h2><fmt:message key="title.select.lessons" /></h2>
-		<p class="clone-box" id="availableLessons"></p>
-		
-		<h2><fmt:message key="title.select.staff" /></h2>
-		<div class="clone-box">
-			<p class="padding-bottom">
-				<input type="checkbox" id="addAllStaff" name="addAllStaff" checked="checked"> <fmt:message key="message.add.all.monitors" />
-			</p>
-			<p>
-				<a onclick="staffDialog();"><fmt:message key="label.configure.staff" /></a>
-			</p>
+	
+		<div class="panel panel-default voffset5" >
+		<div class="panel-heading">
+			<span class="panel-title">
+				<fmt:message key="title.select.lessons" />
+			</span>
 		</div>
-		
-		<h2><fmt:message key="title.select.learners" /></h2>
-		<div class="clone-box">
-			<p class="padding-bottom">
-				<input type="checkbox" id="addAllLearners" name="addAllLearners" checked="checked"> <fmt:message key="message.add.all.learners" />
-			</p>
-			<p>
-				<a onclick="learnerDialog();"><fmt:message key="label.configure.learners" /></a>
-			</p>
+		<div class="panel-body">
+			<p id="availableLessons"></p>
 		</div>
+		</div>
+	
+		<div class="panel panel-default voffset5" >
+		<div class="panel-heading">
+			<span class="panel-title">
+				<fmt:message key="title.select.staff" />
+			</span>
+		</div>
+		<div class="panel-body">
+			<input type="checkbox" id="addAllStaff" name="addAllStaff" checked="checked"> <fmt:message key="message.add.all.monitors" />
+			<a onclick="staffDialog();" class="btn btn-default pull-right"><fmt:message key="label.configure.staff" /></a>
+		</div>
+		</div>
 		
-		<p style="float:right;">
-			<input type="submit" class="button" onclick="return clone();" value="<fmt:message key="label.clone" />">
-		</p>
-		<p class="padding-bottom"></p>
+		<div class="panel panel-default voffset5" >
+		<div class="panel-heading">
+			<span class="panel-title">
+				<fmt:message key="title.select.learners" />
+			</span>
+		</div>
+		<div class="panel-body">
+			<input type="checkbox" id="addAllLearners" name="addAllLearners" checked="checked"> <fmt:message key="message.add.all.learners" />
+			<a onclick="learnerDialog();" class="btn btn-default pull-right"><fmt:message key="label.configure.learners" /></a>
+		</div>
+		</div>
+
+		<div class="pull-right">
+			<input type="submit" class="btn btn-primary" onclick="return clone();" value="<fmt:message key="label.clone" />">
+		</div>
 	</div>
 	
-	<div id="staffDialog" title="<fmt:message key="label.configure.staff" />" style="display:none;">
-	
-	</div>
-	
-	<div id="learnerDialog" title="<fmt:message key="label.configure.learners" />" style="display:none;">
-	
-	</div>
-
 </form>
\ No newline at end of file
Index: lams_admin/web/organisation/courseAdminEdit.jsp
===================================================================
diff -u -ref31c70885b34d2475c8b297d7f9bb0f564a829b -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/organisation/courseAdminEdit.jsp	(.../courseAdminEdit.jsp)	(revision ef31c70885b34d2475c8b297d7f9bb0f564a829b)
+++ lams_admin/web/organisation/courseAdminEdit.jsp	(.../courseAdminEdit.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -10,35 +10,35 @@
 <logic:equal name="OrganisationForm" property="courseAdminCanChangeStatusOfCourse" value="false">
 	<html:hidden property="stateId" />
 </logic:equal>
-<h4>
-	<a href="orgmanage.do?org=1"><fmt:message key="admin.course.manage" /></a> : 
-	<a href="orgmanage.do?org=<bean:write name="OrganisationForm" property="orgId" />">
+<p>
+	<a href="orgmanage.do?org=1" class="btn btn-default"><fmt:message key="admin.course.manage" /></a> : 
+	<a href="orgmanage.do?org=<bean:write name="OrganisationForm" property="orgId" />" class="btn btn-default">
 		<bean:write name="OrganisationForm" property="name"/>
 	</a>
-</h4>
+</p>
 
 <h1>
 	<fmt:message key="admin.edit"/> <bean:write name="OrganisationForm" property="name"/>
 </h1>
 
 <div align="center"><html-el:errors/></div>
-<table>
+<table  class="table table-no-border">
 	<tr>
 		<td><fmt:message key="admin.organisation.name"/>:</td>
-		<td><html-el:text property="name" size="40" /> *</td>
+		<td><html-el:text property="name" size="40" styleClass="form-control"/> *</td>
 	</tr>
 	<tr>
 	<td><fmt:message key="admin.organisation.code"/>:</td>
-		<td><html-el:text property="code" size="20" /></td>
+		<td><html-el:text property="code" size="20"  styleClass="form-control"/></td>
 	</tr>
 	<tr>
 		<td><fmt:message key="admin.organisation.description"/>:</td>
-		<td><html-el:textarea property="description" cols="50" rows="3" /></td>
+		<td><html-el:textarea property="description" cols="50" rows="3"  styleClass="form-control"/></td>
 	</tr>
 	<tr>
 		<td><fmt:message key="admin.organisation.locale"/>:</td>
 		<td>
-			<html-el:select property="localeId">
+			<html-el:select property="localeId"  styleClass="form-control">
 				<c:forEach items="${locales}" var="locale">
 					<html-el:option value="${locale.localeId}">
 						<c:out value="${locale.description}" />
@@ -51,7 +51,7 @@
 	<tr>
 		<td><fmt:message key="admin.organisation.status"/>:</td>
 		<td>
-			<html-el:select property="stateId">
+			<html-el:select property="stateId"  styleClass="form-control">
 				<c:forEach items="${status}" var="state">
 					<html-el:option value="${state.organisationStateId}"><fmt:message key="organisation.state.${state.description}"/></html-el:option>
 				</c:forEach>
@@ -71,12 +71,13 @@
 	<tr>
 		<td colspan="2">&nbsp;</td>
 	</tr>
-	<tr>
-		<td colspan=2 class="align-right">
-			<html-el:submit styleClass="button"><fmt:message key="admin.save"/></html-el:submit>
-			<html-el:reset styleClass="button"><fmt:message key="admin.reset"/></html-el:reset>
-			<html-el:cancel styleClass="button"><fmt:message key="admin.cancel"/></html-el:cancel>
-		</td>
-	</tr>
 </table>
+
+<div class="pull-right">
+	<html-el:cancel styleClass="btn btn-default"><fmt:message key="admin.cancel"/></html-el:cancel>
+	<html-el:reset styleClass="btn btn-default loffset5"><fmt:message key="admin.reset"/></html-el:reset>
+	<html-el:submit styleClass="btn btn-primary loffset5"><fmt:message key="admin.save"/></html-el:submit>
+</div>
+
 </html-el:form>
+		
\ No newline at end of file
Index: lams_admin/web/organisation/createOrEdit.jsp
===================================================================
diff -u -r5e63656a12c02f7476564e278b43ff4ce86ac930 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/organisation/createOrEdit.jsp	(.../createOrEdit.jsp)	(revision 5e63656a12c02f7476564e278b43ff4ce86ac930)
+++ lams_admin/web/organisation/createOrEdit.jsp	(.../createOrEdit.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -20,21 +20,20 @@
 <html-el:hidden property="orgId" />
 <html-el:hidden property="parentId" />
 <html-el:hidden property="typeId" />
-<h4>
-	<a href="orgmanage.do?org=1"><fmt:message key="admin.course.manage" /></a>
-	
+
+<p><a href="orgmanage.do?org=1" class="btn btn-default"><fmt:message key="admin.course.manage" /></a>
 	<logic:equal name="OrganisationForm" property="typeId" value="3">
-		: <a href="orgmanage.do?org=<bean:write name="OrganisationForm" property="parentId" />"><bean:write name="OrganisationForm" property="parentName"/></a>
+		: <a href="orgmanage.do?org=<bean:write name="OrganisationForm" property="parentId" />" class="btn btn-default"><bean:write name="OrganisationForm" property="parentName"/></a>
 	</logic:equal>
 	
 	<logic:notEmpty name="OrganisationForm" property="orgId">
-		: <a href="orgmanage.do?org=<bean:write name="OrganisationForm" property="orgId" />"><bean:write name="OrganisationForm" property="name"/></a>
+		: <a href="orgmanage.do?org=<bean:write name="OrganisationForm" property="orgId" />" class="btn btn-default"><bean:write name="OrganisationForm" property="name"/></a>
 	</logic:notEmpty>
-</h4>
+</p>
 
-<h1>
+<h4>
 	<logic:notEmpty name="OrganisationForm" property="orgId">
-		<fmt:message key="admin.edit"/> <bean:write name="OrganisationForm" property="name"/>
+		<fmt:message key="admin.edit"/>&nbsp;<bean:write name="OrganisationForm" property="name"/>&nbsp;
 	</logic:notEmpty>
 	<logic:empty name="OrganisationForm" property="orgId">
 		<logic:equal name="OrganisationForm" property="typeId" value="2">
@@ -44,26 +43,27 @@
 			<fmt:message key="admin.class.add"/>
 		</logic:equal>
 	</logic:empty>
-</h1>
+</h4>
 
 <div align="center"><html-el:errors/></div>
-<table>
+
+<table class="table table-condensed table-no-border">
 	<tr>
-		<td><fmt:message key="admin.organisation.name"/>:</td>
-		<td><html-el:text property="name" size="40" /> *</td>
+		<td width="15%"><fmt:message key="admin.organisation.name"/> *</td>
+		<td><html-el:text property="name" size="40" styleClass="form-control" /></td>
 	</tr>
 	<tr>
-	<td><fmt:message key="admin.organisation.code"/>:</td>
-		<td><html-el:text property="code" size="20" /></td>
+	<td><fmt:message key="admin.organisation.code"/></td>
+		<td><html-el:text property="code" size="20" styleClass="form-control" /></td>
 	</tr>
 	<tr>
-		<td><fmt:message key="admin.organisation.description"/>:</td>
-		<td><html-el:textarea property="description" cols="50" rows="3" /></td>
+		<td><fmt:message key="admin.organisation.description"/></td>
+		<td><html-el:textarea property="description" cols="50" rows="3" styleClass="form-control" /></td>
 	</tr>
 	<tr>
-		<td><fmt:message key="admin.organisation.locale"/>:</td>
+		<td><fmt:message key="admin.organisation.locale"/></td>
 		<td>
-			<html-el:select property="localeId">
+			<html-el:select property="localeId" styleClass="form-control" >
 				<c:forEach items="${locales}" var="locale">
 					<html-el:option value="${locale.localeId}">
 						<c:out value="${locale.description}" />
@@ -73,107 +73,82 @@
 		</td>
 	</tr>
 	<tr>
-		<td><fmt:message key="admin.organisation.status"/>:</td>
+		<td><fmt:message key="admin.organisation.status"/></td>
 		<td>
-			<html-el:select property="stateId">
+			<html-el:select property="stateId" styleClass="form-control" >
 				<c:forEach items="${status}" var="state">
 					<html-el:option value="${state.organisationStateId}"><fmt:message key="organisation.state.${state.description}"/></html-el:option>
 				</c:forEach>
 			</html-el:select>
 		</td>
 	</tr>
+</table>
 	
 	<logic:equal name="OrganisationForm" property="typeId" value="2">
-	<tr>
-		<td colspan=2>
-			<html-el:checkbox property="courseAdminCanAddNewUsers" styleId="course-admin-can-add-new-users" />
+		<div class="checkbox">
 			<label for="course-admin-can-add-new-users">
+			<html-el:checkbox property="courseAdminCanAddNewUsers" styleId="course-admin-can-add-new-users" />
 				<fmt:message key="admin.can.add.user"/>
 			</label>
-		</td>
-	</tr>
-	<tr>
-		<td colspan=2>
-			<html-el:checkbox property="courseAdminCanBrowseAllUsers" styleId="course-admin-can-browse-all-users"/>
+		</div>
+		<div class="checkbox">
 			<label for="course-admin-can-browse-all-users">
+			<html-el:checkbox property="courseAdminCanBrowseAllUsers" styleId="course-admin-can-browse-all-users"/>
 				<fmt:message key="admin.can.browse.user"/>
 			</label>
-		</td>
-	</tr>
-	<tr>
-		<td colspan=2>
-			<html-el:checkbox property="courseAdminCanChangeStatusOfCourse" styleId="course-admin-can-change-status-of-course"/>
+		</div>
+		<div class="checkbox">
 			<label for="course-admin-can-change-status-of-course">
+			<html-el:checkbox property="courseAdminCanChangeStatusOfCourse" styleId="course-admin-can-change-status-of-course"/>
 				<fmt:message key="admin.can.change.status"/>
 			</label>
-		</td>
-	</tr>
-	<tr>
-		<td colspan=2>
-			<html-el:checkbox property="enableCourseNotifications" styleId="enable-course-notifications"/>
+		</div>
+		<div class="checkbox">
 			<label for="enable-course-notifications">
+			<html-el:checkbox property="enableCourseNotifications" styleId="enable-course-notifications"/>
 				<fmt:message key="admin.enable.course.notifications"/>
 			</label>
-		</td>
-	</tr>
-	<tr>
-		<td colspan=2>
-			<html-el:checkbox onclick="unSelectLearnerGradebook();" styleId="enableGradebookForMonitors" property="enableGradebookForMonitors" />
+		</div>
+		<div class="checkbox">
 			<label for="enableGradebookForMonitors">
+			<html-el:checkbox onclick="unSelectLearnerGradebook();" styleId="enableGradebookForMonitors" property="enableGradebookForMonitors" />
 				<fmt:message key="admin.gradebook.monitor.enable"/>
 			</label>
-		</td>
-	</tr>
-	<tr>
-		<td colspan=2>
-			<html-el:checkbox onclick="selectMonitorGradebook();" styleId="enableGradebookForLearners" property="enableGradebookForLearners" />
+		</div>
+		<div class="checkbox">
 			<label for="enableGradebookForLearners">
+			<html-el:checkbox onclick="selectMonitorGradebook();" styleId="enableGradebookForLearners" property="enableGradebookForLearners" />
 				<fmt:message key="admin.gradebook.learner.enable"/>
 			</label>
-		</td>
-	</tr>
-	<tr>
-		<td colspan=2>
-			<html-el:checkbox property="enableSingleActivityLessons" styleId="enable-single-activity-lessons"/>
+		</div>
+		<div class="checkbox">
 			<label for="enable-single-activity-lessons">
+			<html-el:checkbox property="enableSingleActivityLessons" styleId="enable-single-activity-lessons"/>
 				<fmt:message key="config.authoring.single.activity"/>
 			</label>
-		</td>
-	</tr>
+		</div>
 	</logic:equal>
 	
-	<tr>
-		<td colspan=2>
+		<div class="checkbox">
+			<label for="enable-live-edit">
 			<html-el:checkbox property="enableLiveEdit" styleId="enable-live-edit"/>
 			<!-- to overcome nasty DynaActionForm bug (http://www.coderanch.com/t/46408/Struts/DynaValidatorActionForm-checkboxes) -->
 			<input type="hidden" name="enableLiveEdit" value="false">
-			<label for="enable-live-edit">
 				<fmt:message key="config.live.edit"/>
 			</label>
-		</td>
-	</tr>
+		</div>
 	
 	<logic:notEmpty name="OrganisationForm" property="orgId">
-	<tr>
-		<td colspan="2">&nbsp;</td>
-	</tr>
-	<tr>
-		<td>
+		<div class="voffset10">
 			<logic:equal name="OrganisationForm" property="typeId" value="2"><fmt:message key="msg.group.organisation_id"/></logic:equal>
 			<logic:equal name="OrganisationForm" property="typeId" value="3"><fmt:message key="msg.subgroup.organisation_id"/></logic:equal>
-			<bean:write name="OrganisationForm" property="orgId" />.
-		</td>
-	</tr>
-	<tr>
-		<td colspan="2">&nbsp;</td>
-	</tr>
+			&nbsp;<bean:write name="OrganisationForm" property="orgId" />.
+		</div>
 	</logic:notEmpty>
 	
-	<tr>
-		<td colspan=2 class="align-right">
-			<html-el:submit styleId="saveButton" styleClass="button"><fmt:message key="admin.save"/></html-el:submit>
-			<html-el:cancel styleId="cancelButton" styleClass="button"><fmt:message key="admin.cancel"/></html-el:cancel>
-		</td>
-	</tr>
-</table>
+	<div class="pull-right">
+		<html-el:cancel styleId="cancelButton" styleClass="btn btn-default"><fmt:message key="admin.cancel"/></html-el:cancel>
+		<html-el:submit styleId="saveButton" styleClass="btn btn-primary loffset5"><fmt:message key="admin.save"/></html-el:submit>
+	</div>
+
 </html-el:form>
Index: lams_admin/web/organisation/list.jsp
===================================================================
diff -u -r4ef740155321a3d46583770e5ea58e56719597b2 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/organisation/list.jsp	(.../list.jsp)	(revision 4ef740155321a3d46583770e5ea58e56719597b2)
+++ lams_admin/web/organisation/list.jsp	(.../list.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -2,27 +2,19 @@
 <%@ page import="org.lamsfoundation.lams.usermanagement.Role" %>
 <c:set var="lams"><lams:LAMSURL /></c:set>
 
-<link type="text/css" href="${lams}css/jquery.tablesorter.theme-blue.css" rel="stylesheet">
+ <link rel="stylesheet" href="${lams}css/jquery.tablesorter.theme.bootstrap.css">
 <link type="text/css" href="${lams}css/jquery.tablesorter.pager.css" rel="stylesheet">
 <style>
 	table.infoDisplay {
 		margin-left:5px; 
 		padding-top:10px; 
 		width:100%;
 	}
-	p {
-		margin-left:5px;
-	}
-	.floatRight {
-		float:right;
-	}
-	.indentPad {
+/* 	.indentPad {
 		margin-left:5px; 
 		padding-top:10px;
 	}
-	#tablesorter thead .disabled {
-		display: none
-	}
+ */
 </style>
 
 <script type="text/javascript" src="${lams}includes/javascript/jquery.js"></script>
@@ -33,9 +25,10 @@
 	
   	$(document).ready(function(){
 	    
-		$("#tablesorter").tablesorter({
-			theme: 'blue',
-			widgets: ["zebra", "filter"],
+		$(".tablesorter").tablesorter({
+			theme: 'bootstrap',
+			headerTemplate : '{content} {icon}',
+			widgets: ["uitheme","zebra", "filter"],
 			headers: { 0: { filter: false }, 2: { filter: false }, 3: { filter: false } },
 		    widgetOptions : {
 		        // include column filters
@@ -47,10 +40,15 @@
             sortList: [[1]] 
 		});
 		
-		$("#tablesorter").each(function() {
+		$(".tablesorter").each(function() {
 			$(this).tablesorterPager({
 				savePages: false,
-				ajaxUrl : "<c:url value='/orgmanage.do'/>?dispatch=getOrgs&type=${OrgManageForm.type}&page={page}&size={size}&{sortList:column}&parentOrgId=${OrgManageForm.parentId}&{filterList:fcol}",
+                container: $(this).find(".ts-pager"),
+                output: '{startRow} to {endRow} ({totalRows})',
+                cssPageDisplay: '.pagedisplay',
+                cssPageSize: '.pagesize',
+                cssDisabled: 'disabled',
+                ajaxUrl : "<c:url value='/orgmanage.do'/>?dispatch=getOrgs&type=${OrgManageForm.type}&page={page}&size={size}&{sortList:column}&parentOrgId=${OrgManageForm.parentId}&{filterList:fcol}",
 				ajaxProcessing: function (data, table) {
 			    	if (data && data.hasOwnProperty('rows')) {
 			    		var rows = [],
@@ -92,240 +90,209 @@
 				customAjaxUrl: function(table, url) {
 				    // get current selection & add it to the url
 				    return url += '&stateId=' + $("#org-state-id").val();
-				},
-			    container: $(this).next("#pager"),
-			    output: '{startRow} to {endRow} ({totalRows})',// possible variables: {page}, {totalPages}, {filteredPages}, {startRow}, {endRow}, {filteredRows} and {totalRows}
-			    // css class names of pager arrows
-			    cssNext: '.tablesorter-next', // next page arrow
-				cssPrev: '.tablesorter-prev', // previous page arrow
-				cssFirst: '.tablesorter-first', // go to first page arrow
-				cssLast: '.tablesorter-last', // go to last page arrow
-				cssGoto: '.gotoPage', // select dropdown to allow choosing a page
-				cssPageDisplay: '.pagedisplay', // location of where the "output" is displayed
-				cssPageSize: '.pagesize', // page size selector - select dropdown that sets the "size" option
-				// class added to arrows when at the extremes (i.e. prev/first arrows are "disabled" when on the first page)
-				cssDisabled: 'disabled' // Note there is no period "." in front of this class name
+				}
 			})
 		});
 		
 		$( "#org-state-id" ).change(function() {
-			$('#tablesorter').trigger('pagerUpdate');
+			$('.tablesorter').trigger('pagerUpdate');
 		});
   	})
 </script>
 
 <logic:equal name="OrgManageForm" property="type" value="1">
-	<h4>
-		<a href="orgmanage.do?org=<bean:write name="OrgManageForm" property="parentId"/>"><fmt:message key="admin.course.manage" /></a>
-	</h4>
-	<h1><fmt:message key="admin.course.manage" /></h1>
-	
 	<form>
 	
-	<div class="floatRight">
-		<input id="userCreate" class="button" type="button" value="<fmt:message key="admin.user.create"/>" onclick=javascript:document.location='user.do?method=edit' />
-		<input id="findUsers" class="button" type="button" value="<fmt:message key="admin.user.find"/>" onclick=javascript:document.location='usersearch.do' />
+	<div class="pull-right">
+		<input id="userCreate" class="btn btn-default" type="button" value="<fmt:message key="admin.user.create"/>" onclick=javascript:document.location='user.do?method=edit' />
+		<input id="findUsers" class="btn btn-default" type="button" value="<fmt:message key="admin.user.find"/>" onclick=javascript:document.location='usersearch.do' />
 		<logic:equal name="manageGlobalRoles" value="true">
-			<input id="manageGlobalRoles" class="button" type="button" value="<fmt:message key="admin.global.roles.manage" />" onclick=javascript:document.location='usermanage.do?org=<c:out value="${OrgManageForm.parentId}"/>' />
+			<input id="manageGlobalRoles" class="btn btn-default" type="button" value="<fmt:message key="admin.global.roles.manage" />" onclick=javascript:document.location='usermanage.do?org=<c:out value="${OrgManageForm.parentId}"/>' />
 		</logic:equal>
-	</div>
-	<p style="padding-top:10px;"><c:out value="${numUsers}"/></p>
-	<div class="floatRight">
 		<logic:equal name="createGroup" value="true">
 			<c:url var="editaction" value="organisation.do">
 				<c:param name="method" value="create" />
 				<c:param name="typeId" value="2" />
 				<c:param name="parentId" value="${OrgManageForm.parentId}" />
 			</c:url>
-			<input id="createCourse" class="button" type="button" value="<fmt:message key="admin.course.add"/>" onclick=javascript:document.location='<c:out value="${editaction}"/>' />
+			<input id="createCourse" class="btn btn-default" type="button" value="<fmt:message key="admin.course.add"/>" onclick=javascript:document.location='<c:out value="${editaction}"/>' />
 		</logic:equal>
 	</div>
+	<p style="padding-top:10px;"><c:out value="${numUsers}"/></p>
 	</form>
+
 	<html:form styleClass="indentPad" action="orgmanage.do" method="post">
 		<input type="hidden" name="org" value="<bean:write name="OrgManageForm" property="parentId"/>" />
-		<fmt:message key="label.show"/> 
-		<html:select property="stateId" styleId="org-state-id">
+		<fmt:message key="label.show"/> &nbsp;
+		<html:select property="stateId" styleId="org-state-id" styleClass="form-control form-control-inline input-sm">
 			<html:option value="1"><fmt:message key="organisation.state.ACTIVE"/></html:option>
 			<html:option value="2"><fmt:message key="organisation.state.HIDDEN"/></html:option>
 			<html:option value="3"><fmt:message key="organisation.state.ARCHIVED"/></html:option>
-		</html:select> 
+		</html:select> &nbsp;
 		<fmt:message key="label.groups"/>:
 	</html:form>
 </logic:equal>
 
 <logic:equal name="OrgManageForm" property="type" value="2">
-	<h4>
-		<a href="orgmanage.do?org=1"><fmt:message key="admin.course.manage" /></a>
-		: <a href="orgmanage.do?org=<bean:write name="OrgManageForm" property="parentId"/>"><bean:write name="OrgManageForm" property="parentName"/></a>
-	</h4>
-	<h1><bean:write name="OrgManageForm" property="parentName"/></h1>
+	<p><a href="orgmanage.do?org=1" class="btn btn-default"><fmt:message key="admin.course.manage" /></a></p>
+
+	<div class="panel panel-default voffset5" >
+		<div class="panel-heading">
+			<span class="panel-title">
+				<bean:write name="OrgManageForm" property="parentName"/>
+			</span>
+			<div class="btn-group btn-group-sm  pull-right">
+				<logic:equal name="editGroup" value="true">
+					<input id="editCourse" class="btn btn-default" type="button" value="<fmt:message key="admin.edit" />&nbsp;<bean:write name="OrgManageForm" property="parentName"/>" onclick=javascript:document.location='organisation.do?method=edit&orgId=<c:out value="${OrgManageForm.parentId}"/>' />
+				</logic:equal>
+				<input id="manageUsers" class="btn btn-default" type="button" value="<fmt:message key="admin.user.manage" />" onclick=javascript:document.location='usermanage.do?org=<c:out value="${OrgManageForm.parentId}"/>' />
+				<% if (request.isUserInRole(Role.SYSADMIN)) { %>
+					<input id="closeLessons" class="btn btn-default" type="button" value="<fmt:message key="title.clone.lessons" />" onclick="javascript:document.location='clone.do?groupId=<c:out value="${OrgManageForm.parentId}"/>';">
+				<% } %>
+			</div>
+		</div>
 	
-	<table cellspacing="7" class="infoDisplay">
-		<tr>
-			<td id="courseName" align="right"><fmt:message key="admin.organisation.name"/>:</td>
-			<td><c:out value="${org.name}" /></td>
-			<td align="right"><fmt:message key="admin.organisation.status"/>:</td>
-			<td id="courseStatus" width="10%"><c:out value="${org.organisationState.description}" /></td>
-		</tr>
-		<tr>
-			<td align="right"><fmt:message key="admin.organisation.code"/>:</td>
-			<td><c:out value="${org.code}" /></td>
-			<td align="right"><fmt:message key="admin.can.add.user"/>:</td>
-			<td><c:out value="${org.courseAdminCanAddNewUsers}" /></td>
-		</tr>
-		<tr>
-			<td align="right"><fmt:message key="admin.organisation.description"/>:</td>
-			<td><c:out value="${org.description}" /></td>
-			<td align="right"><fmt:message key="admin.can.browse.user"/>:</td>
-			<td><c:out value="${org.courseAdminCanBrowseAllUsers}" /></td>
-		</tr>
-		<tr>
-			<td align="right"><fmt:message key="admin.organisation.locale"/>:</td>
-			<td><c:out value="${org.locale.description}" /></td>
-			<td align="right"><fmt:message key="admin.can.change.status"/>:</td>
-			<td><c:out value="${org.courseAdminCanChangeStatusOfCourse}" /></td>
-		</tr>
-	</table>
-	
-	<form>
-	
-	<p>
-	<logic:equal name="editGroup" value="true">
-		<input id="editCourse" class="button" type="button" value="<fmt:message key="admin.edit" /> <bean:write name="OrgManageForm" property="parentName"/>" onclick=javascript:document.location='organisation.do?method=edit&orgId=<c:out value="${OrgManageForm.parentId}"/>' />
-	</logic:equal>
-	</p>
-	
-	<div class="floatRight">
-		<input id="manageUsers" class="button" type="button" value="<fmt:message key="admin.user.manage" />" onclick=javascript:document.location='usermanage.do?org=<c:out value="${OrgManageForm.parentId}"/>' />
+		<table class="table table-striped">
+			<tr>
+				<td id="courseName" width="50%"><fmt:message key="admin.organisation.name"/>:</td>
+				<td><c:out value="${org.name}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.code"/>:</td>
+				<td><c:out value="${org.code}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.description"/>:</td>
+				<td><c:out value="${org.description}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.status"/>:</td>
+				<td id="courseStatus"><c:out value="${org.organisationState.description}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.locale"/>:</td>
+				<td><c:out value="${org.locale.description}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.can.add.user"/>:</td>
+				<td><c:out value="${org.courseAdminCanAddNewUsers}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.can.browse.user"/>:</td>
+				<td><c:out value="${org.courseAdminCanBrowseAllUsers}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.can.change.status"/>:</td>
+				<td><c:out value="${org.courseAdminCanChangeStatusOfCourse}" /></td>
+			</tr>
+			<tr>
+				<td colspan="2"><c:out value="${numUsers}"/></td>
+			</tr>
+		</table>		
 	</div>
-	<p style="padding-top:10px;"><c:out value="${numUsers}"/></p>
 	
-	<% if (request.isUserInRole(Role.SYSADMIN)) { %>
-	<div class="floatRight">
-		<input id="closeLessons" class="button" type="button" value="<fmt:message key="title.clone.lessons" />" onclick="javascript:document.location='clone.do?groupId=<c:out value="${OrgManageForm.parentId}"/>';">
-	</div>
-	<p style="padding-top:10px;">&nbsp;</p>
-	<% } %>
-	
-	<div class="floatRight">
+	<form>
+	<div class="pull-right">
 		<c:url var="createSubgroupLink" value="organisation.do">
 			<c:param name="method" value="create" />
 			<c:param name="typeId" value="3" />
 			<c:param name="parentId" value="${OrgManageForm.parentId}" />
 		</c:url>
-		<input id="createNewSubcourse" class="button" type="button" value="<fmt:message key="admin.class.add"/>" onclick=javascript:document.location='<c:out value="${createSubgroupLink}"/>' />
+		<input id="createNewSubcourse" class="btn btn-default" type="button" value="<fmt:message key="admin.class.add"/>" onclick=javascript:document.location='<c:out value="${createSubgroupLink}"/>' />
 	</div>
 	</form>
+
 	<html:form styleClass="indentPad" action="orgmanage.do" method="post">
 		<input type="hidden" name="org" value="<bean:write name="OrgManageForm" property="parentId"/>" />
-		<fmt:message key="label.show"/> 
-		<html:select property="stateId" styleId="org-state-id">
+		<fmt:message key="label.show"/>&nbsp;
+		<html:select property="stateId" styleId="org-state-id" styleClass="form-control form-control-inline input-sm">
 			<html:option value="1"><fmt:message key="organisation.state.ACTIVE"/></html:option>
 			<html:option value="2"><fmt:message key="organisation.state.HIDDEN"/></html:option>
 			<html:option value="3"><fmt:message key="organisation.state.ARCHIVED"/></html:option>
-		</html:select> 
+		</html:select> &nbsp;
 		<fmt:message key="label.subgroups"/>:
 	</html:form>
 </logic:equal>
 
 <logic:equal name="OrgManageForm" property="type" value="3">
-	<h4>
-		<a href="orgmanage.do?org=1"><fmt:message key="admin.course.manage" /></a>
-		: <a href="orgmanage.do?org=<c:out value="${parentGroupId}"/>"><c:out value="${parentGroupName}"/></a>
-		: <a href="orgmanage.do?org=<bean:write name="OrgManageForm" property="parentId"/>"><bean:write name="OrgManageForm" property="parentName"/></a>
-	</h4>
-	<h1><bean:write name="OrgManageForm" property="parentName"/></h1>
-	
-	<table cellspacing="7" class="infoDisplay">
-		<tr>
-			<td align="right"><fmt:message key="admin.organisation.name"/>:</td>
-			<td><c:out value="${org.name}" /></td>
-			<td align="right"><fmt:message key="admin.organisation.status"/>:</td>
-			<td width="10%"><c:out value="${org.organisationState.description}" /></td>
-		</tr>
-		<tr>
-			<td align="right"><fmt:message key="admin.organisation.code"/>:</td>
-			<td><c:out value="${org.code}" /></td>
-			<td align="right"><fmt:message key="admin.can.add.user"/>:</td>
-			<td><c:out value="${org.courseAdminCanAddNewUsers}" /></td>
-		</tr>
-		<tr>
-			<td align="right"><fmt:message key="admin.organisation.description"/>:</td>
-			<td><c:out value="${org.description}" /></td>
-			<td align="right"><fmt:message key="admin.can.browse.user"/>:</td>
-			<td><c:out value="${org.courseAdminCanBrowseAllUsers}" /></td>
-		</tr>
-		<tr>
-			<td align="right"><fmt:message key="admin.organisation.locale"/>:</td>
-			<td><c:out value="${org.locale.description}" /></td>
-			<td align="right"><fmt:message key="admin.can.change.status"/>:</td>
-			<td><c:out value="${org.courseAdminCanChangeStatusOfCourse}" /></td>
-		</tr>
-	</table>
-	
-	<form>
-	
 	<p>
-		<logic:equal name="editGroup" value="true">
-			<input class="button" type="button" value="<fmt:message key="admin.edit" /> <bean:write name="OrgManageForm" property="parentName"/>" onclick=javascript:document.location='organisation.do?method=edit&orgId=<c:out value="${OrgManageForm.parentId}"/>' />
-		</logic:equal>
+		<a href="orgmanage.do?org=1" class="btn btn-default"><fmt:message key="admin.course.manage" /></a>
+		: <a href="orgmanage.do?org=<c:out value="${parentGroupId}"/>" class="btn btn-default"><c:out value="${parentGroupName}"/></a>
 	</p>
 	
-	<div class="floatRight">
-		<input class="button" type="button" value="<fmt:message key="admin.user.manage" />" onclick=javascript:document.location='usermanage.do?org=<c:out value="${OrgManageForm.parentId}"/>' />
-	</div>
-	<p style="padding-top:10px;"><c:out value="${numUsers}"/></p>
-	
-	<% if (request.isUserInRole(Role.SYSADMIN)) { %>
-		<div class="floatRight">
-			<input class="button" type="button" value="<fmt:message key="title.clone.lessons" />" onclick="javascript:document.location='clone.do?groupId=<c:out value="${OrgManageForm.parentId}"/>';">
+	<div class="panel panel-default voffset5" >
+		<div class="panel-heading">
+			<span class="panel-title">
+				<bean:write name="OrgManageForm" property="parentName"/>
+			</span>
+			<div class="btn-group btn-group-sm  pull-right">
+				<logic:equal name="editGroup" value="true">
+					<input class="btn btn-default" type="button" value="<fmt:message key="admin.edit" />&nbsp;<bean:write name="OrgManageForm" property="parentName"/>" onclick=javascript:document.location='organisation.do?method=edit&orgId=<c:out value="${OrgManageForm.parentId}"/>' />
+				</logic:equal>
+				<input class="btn btn-default" type="button" value="<fmt:message key="admin.user.manage" />" onclick=javascript:document.location='usermanage.do?org=<c:out value="${OrgManageForm.parentId}"/>' />
+				<% if (request.isUserInRole(Role.SYSADMIN)) { %>
+						<input class="btn btn-default" type="button" value="<fmt:message key="title.clone.lessons" />" onclick="javascript:document.location='clone.do?groupId=<c:out value="${OrgManageForm.parentId}"/>';">
+				<% } %>
+			</div>
 		</div>
-		<p style="padding-top:10px;">&nbsp;</p>
-	<% } %>
+
+		<table class="table table-striped">
+			<tr>
+				<td width="50%"><fmt:message key="admin.organisation.name"/>:</td>
+				<td><c:out value="${org.name}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.code"/>:</td>
+				<td><c:out value="${org.code}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.description"/>:</td>
+				<td><c:out value="${org.description}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.status"/>:</td>
+				<td><c:out value="${org.organisationState.description}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.organisation.locale"/>:</td>
+				<td><c:out value="${org.locale.description}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.can.add.user"/>:</td>
+				<td><c:out value="${org.courseAdminCanAddNewUsers}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.can.browse.user"/>:</td>
+				<td><c:out value="${org.courseAdminCanBrowseAllUsers}" /></td>
+			</tr>
+			<tr>
+				<td><fmt:message key="admin.can.change.status"/>:</td>
+				<td><c:out value="${org.courseAdminCanChangeStatusOfCourse}" /></td>
+			</tr>
+			<tr>
+				<td colspan="2"><c:out value="${numUsers}"/></td>
+			</tr>
+		</table>
 	
-	</form>
+		</div>	
 </logic:equal>
 
 <c:if test="${OrgManageForm.type != 3}">
 
-	<table id="tablesorter">
-		<thead>
-			<tr>
-				<th width="3%" clas="filter-false">
-					Id
-				</th>
-				<th width="10%" align="center"> 
-					<fmt:message key="admin.organisation.name"/>
-				</th>
-				<th width="10%" align="center">
-					<fmt:message key="admin.organisation.code"/>
-				</th>
-				<th width="20%" align="center">
-					<fmt:message key="admin.organisation.description"/>
-				</th>
-			</tr>
-		</thead>
-			
-		<tbody>
-		</tbody>
-	</table>
-		
-	<!-- pager -->
-	<div id="pager">
-		<form>
-			<img class="tablesorter-first"/>
-			<img class="tablesorter-prev"/>
-			<span class="pagedisplay"></span> <!-- this can be any element, including an input -->
-			<img class="tablesorter-next"/>
-			<img class="tablesorter-last"/>
-			<select class="pagesize">
-				<option selected="selected" value="10">10</option>
-				<option value="20">20</option>
-				<option value="30">30</option>
-				<option value="40">40</option>
-				<option value="50">50</option>
-				<option value="100">100</option>
-			</select>
-		</form>
+	<div class="voffset10">
+	<lams:TSTable numColumns="4"> 
+		<th width="3%" clas="filter-false">
+			Id
+		</th>
+		<th width="10%" align="center"> 
+			<fmt:message key="admin.organisation.name"/>
+		</th>
+		<th width="10%" align="center">
+			<fmt:message key="admin.organisation.code"/>
+		</th>
+		<th width="20%" align="center">
+			<fmt:message key="admin.organisation.description"/>
+		</th>
+	</lams:TSTable>
 	</div>
 </c:if>
Index: lams_admin/web/register.jsp
===================================================================
diff -u -r1d2ff22c947ab0d5646bb02b8189ca668020bdbc -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/register.jsp	(.../register.jsp)	(revision 1d2ff22c947ab0d5646bb02b8189ca668020bdbc)
+++ lams_admin/web/register.jsp	(.../register.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -31,33 +31,28 @@
 <html:form action="/register" method="post" styleId="RegisterForm">
 	<html:hidden property="method" value="register" />
 	
-	<h4 class="align-left">
-		<a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a>
-	</h4>
-	<h1><fmt:message key="sysadmin.register.server" /></h1>
-	<br />
-	
+	<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
+
 	<c:choose>
 		<c:when test="${not empty errorKey}">
-			<p class="warning">
+			<lams:Alert type="warn" id="errorKey" close="false">				
 				<fmt:message key="${errorKey}"/>
-			</p>
+			</lams:Alert>
 		</c:when>
-		<c:otherwise>
-			<c:if test="${not empty successKey}">
-				<p class="info">
-					<fmt:message key="${successKey}"/>
-				</p>
-			</c:if>
-		</c:otherwise>
+		<c:when test="${not empty successKey}">
+			<lams:Alert type="info" id="successKey" close="false">				
+				<fmt:message key="${successKey}"/>
+			</lams:Alert>
+		</c:when>
 	</c:choose>
 
-	<table class="alternative-color" width=100% cellspacing="0">
+	<div class="panel panel-default">
+		<div class="panel-heading">
+			<div class="panel-title"><fmt:message key="admin.register.heading.title"/></div>
+		</div>
+		<table class="table table-striped table-condensed" >
 			<tr>
-				<th colspan="2"><fmt:message key="admin.register.heading.title"/></th>
-			</tr>
-			<tr>
-				<td>
+				<td width="40%">
 					<fmt:message key="admin.register.enableLamsCommunity"/>
 				</td>
 				<td>
@@ -69,22 +64,22 @@
 					<fmt:message key="admin.register.sitename"/>
 				</td>
 				<td>
-					<html:text property="siteName" size="40"/>
+					<html:text property="siteName" size="40" styleClass="form-control"/>
 				</td>
 			</tr>
 			<tr>
 				<td>
 					<fmt:message key="admin.register.orgname"/>
 				</td>
 				<td>
-					<html:text property="organisation" size="40" />
+					<html:text property="organisation" size="40"  styleClass="form-control" />
 				</td>
 			<tr>
 				<td>
 					<fmt:message key="admin.user.name"/>
 				</td>
 				<td>
-					<html:text property="name" size="40" />
+					<html:text property="name" size="40"  styleClass="form-control"/>
 					
 				</td>
 			</tr>
@@ -93,7 +88,7 @@
 					<fmt:message key="admin.user.email"/>
 				</td>
 				<td>
-					<html:text property="email" size="40" />
+					<html:text property="email" size="40"  styleClass="form-control"/>
 				</td>
 			</tr>
 			<tr>
@@ -102,7 +97,7 @@
 				</td>
 				<td>
 					
-					<html:select property="serverCountry">
+					<html:select property="serverCountry"  styleClass="form-control">
 						<html:option value="AF">Afghanistan</html:option>
 						<html:option value="AX">Aland Islands</html:option>
 						<html:option value="AL">Albania</html:option>
@@ -342,13 +337,16 @@
 					<html:checkbox property="publicDirectory" />
 				</td>
 			</tr>
+		</table>
+		</div>
+		
+		<div class="panel panel-default">
+		<div class="panel-heading">
+			<div class="panel-title"><fmt:message key="admin.register.server.config.title"/></div>
+		</div>
+		<table class="table table-striped table-condensed" >
 			<tr>
-				<th colspan="2">
-					<fmt:message key="admin.register.server.config.title"/>
-				</th>
-			</tr>
-			<tr>
-				<td>
+				<td width="40%">
 					<fmt:message key="admin.register.server.config.url"/>
 				</td>
 				<td>
@@ -387,13 +385,16 @@
 					${registerDTO.serverLanguageDate}
 				</td>
 			</tr>
+		</table>
+		</div>
+		
+		<div class="panel panel-default">
+		<div class="panel-heading">
+			<div class="panel-title"><fmt:message key="admin.register.server.stats.title"/></div>
+		</div>
+		<table class="table table-striped table-condensed" >
 			<tr>
-				<th colspan="2">
-					<fmt:message key="admin.register.server.stats.title"/>
-				</th>
-			</tr>
-			<tr>
-				<td>
+				<td width="40%">
 					<fmt:message key="admin.course"/>
 				</td>
 				<td>
@@ -466,10 +467,10 @@
 			</tr>
 	</table>
 	
-	<p align="center">
-		<input class="button" type="submit" value="<fmt:message key="admin.register" />"/>
-		<html:reset styleClass="button"><fmt:message key="admin.reset" /></html:reset>
-        <input class="button" type="button" value="<fmt:message key="admin.cancel" />" onClick="javascript:window.location.href='<lams:LAMSURL/>/admin/sysadminstart.do'"/>
-	</p>
+	<div class="pull-right voffset5">
+        <input class="btn btn-default" type="button" value="<fmt:message key="admin.cancel" />" onClick="javascript:window.location.href='<lams:LAMSURL/>/admin/sysadminstart.do'"/>
+		<html:reset styleClass="btn btn-default"><fmt:message key="admin.reset" /></html:reset>
+		<input class="btn btn-primary loffset5" type="submit" value="<fmt:message key="admin.register" />"/>
+	</div>
 </html:form>
 
Index: lams_admin/web/remove.jsp
===================================================================
diff -u -r7ab9e2377fd1ff4c3c5554bd1f6dffe3384f6f9a -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/remove.jsp	(.../remove.jsp)	(revision 7ab9e2377fd1ff4c3c5554bd1f6dffe3384f6f9a)
+++ lams_admin/web/remove.jsp	(.../remove.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -12,38 +12,52 @@
 </logic:notEmpty>
 
 <logic:equal name="method" value="disable">
-<h1><fmt:message key="admin.user.disable"/></h1>
-<p>&nbsp;</p>
-<p>
-	<fmt:message key="msg.disable.user.1"/>&nbsp;&nbsp;
-	<fmt:message key="msg.disable.user.2"/>&nbsp;&nbsp;
-	<fmt:message key="msg.disable.user.3"/><br />
-	<fmt:message key="msg.disable.user.4"/>
-</p>
-<c:url var="disableaction" value="user.do">
-		<c:param name="method" value="disable" />
-		<c:param name="userId" value="${userId}" />
-		<c:param name="orgId" value="${orgId}" />
-	</c:url>
-<div style="float:right">
-<input class="button" type="button" value="Disable" onClick="javascript:document.location='<c:out value="${disableaction}"/>'" />
-<input class="button" type="button" value="Cancel" onClick="javascript:document.location='<c:out value="${cancel}"/>'" />
-</div>
+	<div class="panel panel-default" >
+		<div class="panel-heading">
+			<span class="panel-title">
+				<fmt:message key="admin.user.disable"/>
+			</span>
+		</div>
+		<div class="panel-body">     
+			<p>
+				<fmt:message key="msg.disable.user.1"/>&nbsp;&nbsp;
+				<fmt:message key="msg.disable.user.2"/>&nbsp;&nbsp;
+				<fmt:message key="msg.disable.user.3"/><br />
+				<fmt:message key="msg.disable.user.4"/>
+			</p>
+			<c:url var="disableaction" value="user.do">
+				<c:param name="method" value="disable" />
+				<c:param name="userId" value="${userId}" />
+				<c:param name="orgId" value="${orgId}" />
+			</c:url>
+			<div class="pull-right">
+				<input class="btn btn-primary" type="button" value="Disable" onClick="javascript:document.location='<c:out value="${disableaction}"/>'" />
+				<input class="btn btn-default" type="button" value="Cancel" onClick="javascript:document.location='<c:out value="${cancel}"/>'" />
+			</div>
+		</div>
+	</div>	
 </logic:equal>
 
 <logic:equal name="method" value="delete">
-<h2><fmt:message key="admin.user.delete"/></h2>
-<p>&nbsp;</p>
-<p><fmt:message key="msg.delete.user.1"/>&nbsp;&nbsp;<fmt:message key="msg.delete.user.2"/></p>
-<c:url var="deleteaction" value="user.do">
-		<c:param name="method" value="delete" />
-		<c:param name="userId" value="${userId}" />
-		<c:param name="orgId" value="${orgId}" />
-	</c:url>
-<div class="float-right">
-<input class="button" type="button" value="Delete" onClick="javascript:document.location='<c:out value="${deleteaction}"/>'" />
-<input class="button" type="button" value="Cancel" onClick="javascript:document.location='<c:out value="${cancel}"/>'" />
-</div>
+	<div class="panel panel-default" >
+		<div class="panel-heading">
+			<span class="panel-title">
+				<fmt:message key="admin.user.delete"/>
+			</span>
+		</div>
+		<div class="panel-body">     
+			<p><fmt:message key="msg.delete.user.1"/>&nbsp;&nbsp;<fmt:message key="msg.delete.user.2"/></p>
+			<c:url var="deleteaction" value="user.do">
+					<c:param name="method" value="delete" />
+					<c:param name="userId" value="${userId}" />
+					<c:param name="orgId" value="${orgId}" />
+				</c:url>
+			<div class="pull-right">
+				<input class="btn btn-default" type="button" value="Delete" onClick="javascript:document.location='<c:out value="${deleteaction}"/>'" />
+				<input class="btn btn-default" type="button" value="Cancel" onClick="javascript:document.location='<c:out value="${cancel}"/>'" />
+			</div>
+		</div>
+	</div>
 </logic:equal>
 </form>
 
Index: lams_admin/web/serverlist.jsp
===================================================================
diff -u -rc489cfcc88cdf13c07c2b9f78ff7c7cf5a2b3531 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/serverlist.jsp	(.../serverlist.jsp)	(revision c489cfcc88cdf13c07c2b9f78ff7c7cf5a2b3531)
+++ lams_admin/web/serverlist.jsp	(.../serverlist.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,10 +1,8 @@
 <%@ include file="/taglibs.jsp"%>
 
-<h4><a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a></h4>
-<h1><fmt:message key="sysadmin.maintain.external.servers" /></h1>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
-<p class="align-right"><input class="button" name="addnewserver" type="button" value="<fmt:message key='sysadmin.server.add' />" onClick="javascript:document.location='servermaintain.do?method=edit'" /></p>
-<table class=alternative-color width=100%>
+<table class="table table-striped">
 	<tr>
 		<th><fmt:message key="sysadmin.serverid" /></th>
 		<th><fmt:message key="sysadmin.serverkey" /></th>
@@ -50,4 +48,7 @@
 	</tr>
 	</c:forEach>
 </table>
-<p>${fn:length(servers)} <fmt:message key="sysadmin.integrated.servers" /></p>
+<p>${fn:length(servers)}&nbsp;<fmt:message key="sysadmin.integrated.servers" /></p>
+
+<input class="btn btn-default pull-right" name="addnewserver" type="button" value="<fmt:message key='sysadmin.server.add' />" onClick="javascript:document.location='servermaintain.do?method=edit'" />
+
Index: lams_admin/web/servermaintain.jsp
===================================================================
diff -u -rd0a703641dee45b84a2cd9a011376a8f0d72c9fb -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/servermaintain.jsp	(.../servermaintain.jsp)	(revision d0a703641dee45b84a2cd9a011376a8f0d72c9fb)
+++ lams_admin/web/servermaintain.jsp	(.../servermaintain.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,55 +1,44 @@
 <%@ include file="/taglibs.jsp"%>
-<style media="screen,projection" type="text/css">
-	table td {
-  		padding-bottom: 7px;
-	}
-</style>
-
 <script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.js"></script>
 <script type="text/javascript" src="<lams:LAMSURL/>includes/javascript/jquery.validate.js"></script>
 
-<h4>
-	<a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a> :
-	<a href="serverlist.do"><fmt:message key="sysadmin.maintain.external.servers" /></a>
-</h4>
-<lams:help style="no-tabs" page="Integrations"/>
-<h1><fmt:message key="sysadmin.maintain.server.edit"/></h1>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
 <html:errors/>
-<br />
+
 <html:form action="serversave.do" styleId="ext-server-form" method="post">
 	<c:set var="formBean" value="<%=request.getAttribute(org.apache.struts.taglib.html.Constants.BEAN_KEY)%>" />
 	<html:hidden property="sid" />
 	
-<table>
+<table class="table table-no-border">
 	<tr>
-		<td><fmt:message key="sysadmin.serverid" />:</td>
-		<td><html:text property="serverid" size="20"/> *</td>
+		<td width="25%"><fmt:message key="sysadmin.serverid" />&nbsp;*</td>
+		<td><html:text property="serverid" size="20" styleClass="form-control"/></td>
 	</tr>
 	<tr>
-		<td><fmt:message key="sysadmin.serverkey" />:</td>
-		<td><html:text property="serverkey" size="30"/> *</td>
+		<td><fmt:message key="sysadmin.serverkey" />&nbsp;*</td>
+		<td><html:text property="serverkey" size="30" styleClass="form-control"/></td>
 	</tr>
 	<tr>
-		<td><fmt:message key="sysadmin.servername" />:</td>
-		<td><html:text property="servername" size="30"/> *</td>
+		<td><fmt:message key="sysadmin.servername" />&nbsp;*</td>
+		<td><html:text property="servername" size="30" styleClass="form-control"/></td>
 	</tr>
 	<tr>
-		<td valign="top"><fmt:message key="sysadmin.serverdesc" />:</td>
-		<td><html:textarea property="serverdesc" cols="40" rows="3"/> </td>
+		<td valign="top"><fmt:message key="sysadmin.serverdesc" /></td>
+		<td><html:textarea property="serverdesc" cols="40" rows="3" styleClass="form-control"/> </td>
 	</tr>
 	<tr>
-		<td><fmt:message key="sysadmin.prefix" />:</td>
-		<td><html:text property="prefix" size="10"/> *</td>
+		<td><fmt:message key="sysadmin.prefix" />&nbsp;*</td>
+		<td><html:text property="prefix" size="10" styleClass="form-control"/></td>
 	</tr>
 	
 	<tr>
-		<td><fmt:message key="sysadmin.disabled" />:</td>
+		<td><fmt:message key="sysadmin.disabled" /></td>
 		<td><html:checkbox property="disabled" /></td>
 	</tr>
 	
 	<tr>
-		<td><fmt:message key="sysadmin.login.request.ttl.enable" />:</td>
+		<td><fmt:message key="sysadmin.login.request.ttl.enable" /></td>
 		<td>
 			<html:checkbox property="timeToLiveLoginRequestEnabled" styleId="ttl-login-request-enabled"/>
 			<!-- to overcome nasty DynaActionForm bug (http://www.coderanch.com/t/46408/Struts/DynaValidatorActionForm-checkboxes) -->
@@ -58,47 +47,50 @@
 	</tr>
 	
 	<tr id="ttl-login-request-wrap" <c:if test="${!formBean.map.timeToLiveLoginRequestEnabled}">style="display:none;"</c:if>>
-		<td><fmt:message key="sysadmin.login.request.ttl" />:</td>
-		<td><html:text property="timeToLiveLoginRequest" size="10" styleId="ttl-login-request"/></td>
+		<td><fmt:message key="sysadmin.login.request.ttl" /></td>
+		<td><html:text property="timeToLiveLoginRequest" size="10" styleId="ttl-login-request" styleClass="form-control"/></td>
 	</tr>
 	
 	<logic:notEqual name="ServerOrgMapForm" property="orgId" value="-1">
 		<tr>
-			<td><fmt:message key="sysadmin.organisation" />:</td>
+			<td><fmt:message key="sysadmin.organisation" /></td>
 			<td>
-				<html:select property="orgId" >
+				<html:select property="orgId" styleClass="form-control">
 					<html:options collection="orgs" property="organisationId" labelProperty="name"/> 
 				</html:select> &nbsp; 
 			</td>
 		</tr>
 	</logic:notEqual>
 	<tr>
-		<td><fmt:message key="sysadmin.userinfoUrl" />:</td>
-		<td><html:text property="userinfoUrl" size="70"/> *</td>
+		<td><fmt:message key="sysadmin.userinfoUrl" />&nbsp;*</td>
+		<td><html:text property="userinfoUrl" size="70" styleClass="form-control"/></td>
 	</tr>
 	<tr>
-		<td><fmt:message key="sysadmin.serverUrl" />:</td>
-		<td><html:text property="serverUrl" size="70"/></td>
+		<td><fmt:message key="sysadmin.serverUrl" /></td>
+		<td><html:text property="serverUrl" size="70" styleClass="form-control"/></td>
 	</tr>
 	<tr>
-		<td><fmt:message key="sysadmin.timeoutUrl" />:</td>
-		<td><html:text property="timeoutUrl" size="70"/> *</td>
+		<td><fmt:message key="sysadmin.timeoutUrl" />&nbsp;*</td>
+		<td><html:text property="timeoutUrl" size="70" styleClass="form-control"/></td>
 	</tr>
 	<tr>
-		<td><fmt:message key="sysadmin.lessonFinishUrl" />:</td>
-		<td><html:text property="lessonFinishUrl" size="70"/></td>
+		<td><fmt:message key="sysadmin.lessonFinishUrl" /></td>
+		<td><html:text property="lessonFinishUrl" size="70" styleClass="form-control"/></td>
 	</tr>
 		<tr>
-		<td><fmt:message key="sysadmin.extGroupsUrl" />:</td>
-		<td><html:text property="extGroupsUrl" size="70"/></td>
+		<td><fmt:message key="sysadmin.extGroupsUrl" /></td>
+		<td><html:text property="extGroupsUrl" size="70" styleClass="form-control"/></td>
 	</tr>
 </table>
-<div align="center">
-	<html:submit property="submitbutton" styleClass="button"><fmt:message key="admin.save" /></html:submit>
-	<html:reset styleClass="button cancel"><fmt:message key="admin.reset" /></html:reset>
-	<html:cancel styleClass="button cancel"><fmt:message key="admin.cancel" /></html:cancel>
+<div class="pull-right">
+	<html:reset styleClass="btn btn-default"><fmt:message key="admin.reset" /></html:reset>
+	<html:cancel styleClass="btn btn-default"><fmt:message key="admin.cancel" /></html:cancel>
+	<html:submit property="submitbutton" styleClass="btn btn-primary loffset5"><fmt:message key="admin.save" /></html:submit>
 </div>
 </html:form>
+
+<a href="sysadminstart.do" class="btn btn-default pull-left"><fmt:message key="sysadmin.maintain" /></a>
+
 <script type="text/javascript" language="javascript">
 	function changeStatus(obj){
 		document.forms[0].orgId.disabled = obj.checked;
@@ -142,3 +134,5 @@
 		});
 	});
 </script>
+
+
Index: lams_admin/web/statistics.jsp
===================================================================
diff -u -r35a0e719d061c08b52e705135bb2f2126079ed21 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/statistics.jsp	(.../statistics.jsp)	(revision 35a0e719d061c08b52e705135bb2f2126079ed21)
+++ lams_admin/web/statistics.jsp	(.../statistics.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -20,84 +20,89 @@
 	}
 </script>
 
-<h4 class="align-left">
-		<a href="sysadminstart.do"><fmt:message key="sysadmin.maintain" /></a>
-</h4>
+<p><a href="<lams:LAMSURL/>/admin/sysadminstart.do" class="btn btn-default"><fmt:message key="sysadmin.maintain" /></a></p>
 
-<h1><fmt:message key="admin.statistics.title" /></h1>
-
-<h3><fmt:message key="admin.statistics.overall" /></h3>
-
-<table class="alternative-color">
-	<tr>
-		<td>
-			<fmt:message key="admin.statistics.totalUsers" />
-		</td>
-		<td>
-			${statisticsDTO.users}
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="admin.statistics.learningDesigns" />
-		</td>
-		<td>
-			${statisticsDTO.sequences}
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="admin.statistics.lessons" />
-		</td>
-		<td>
-			${statisticsDTO.lessons}
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="admin.statistics.activities" />
-		</td>
-		<td>
-			${statisticsDTO.activities}
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="admin.statistics.completedActivities" />
-		</td>
-		<td>
-			${statisticsDTO.completedActivities}
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="admin.statistics.groups" />
-		</td>
-		<td>
-			${statisticsDTO.groups}
-		</td>
-	</tr>
-	<tr>
-		<td>
-			<fmt:message key="admin.statistics.subGroups" />
-		</td>
-		<td>
-			${statisticsDTO.subGroups}
-		</td>
-	</tr>
-</table>
-
-<br />
-<h1><fmt:message key="admin.statistics.title.byGroup" /></h1>
-<br />
-<select onchange="javascript:loadGroupStats(this.options[this.selectedIndex].value)">
-	<option></option>
-	<c:forEach var="groupEntry" items="${groupMap}" >	
-		<option value="${groupEntry.value}">${groupEntry.key}</option>
-	</c:forEach>
-</select>
-<br />
-<div id="groupDiv">
-
+<div class="panel panel-default">
+	<div class="panel-heading">
+		<div class="panel-title"><fmt:message key="admin.statistics.overall" /></div>
+	</div>
+	<div class="panel-body">
+	<table class="table table-striped table-condensed" >
+		<tr>
+			<td>
+				<fmt:message key="admin.statistics.totalUsers" />
+			</td>
+			<td width="150px">
+				${statisticsDTO.users}
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="admin.statistics.learningDesigns" />
+			</td>
+			<td>
+				${statisticsDTO.sequences}
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="admin.statistics.lessons" />
+			</td>
+			<td>
+				${statisticsDTO.lessons}
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="admin.statistics.activities" />
+			</td>
+			<td>
+				${statisticsDTO.activities}
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="admin.statistics.completedActivities" />
+			</td>
+			<td>
+				${statisticsDTO.completedActivities}
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="admin.statistics.groups" />
+			</td>
+			<td>
+				${statisticsDTO.groups}
+			</td>
+		</tr>
+		<tr>
+			<td>
+				<fmt:message key="admin.statistics.subGroups" />
+			</td>
+			<td>
+				${statisticsDTO.subGroups}
+			</td>
+		</tr>
+	</table>
+	</div>
 </div>
 
+<div class="panel panel-default">
+	<div class="panel-heading">
+		<div class="panel-title"><fmt:message key="admin.statistics.title.byGroup" /></div>
+	</div>
+	
+	<div class="panel-body">
+		<select onchange="javascript:loadGroupStats(this.options[this.selectedIndex].value)" class="form-control">
+			<option></option>
+			<c:forEach var="groupEntry" items="${groupMap}" >	
+				<option value="${groupEntry.value}">${groupEntry.key}</option>
+			</c:forEach>
+		</select>
+		<br />
+		<div id="groupDiv">
+	
+		</div>
+	</div>
+</div>
Index: lams_admin/web/sysadmin.jsp
===================================================================
diff -u -r44f9636e4923ab01e51ff46d67b190caf4c93012 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/sysadmin.jsp	(.../sysadmin.jsp)	(revision 44f9636e4923ab01e51ff46d67b190caf4c93012)
+++ lams_admin/web/sysadmin.jsp	(.../sysadmin.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -1,14 +1,12 @@
 <%@ include file="/taglibs.jsp"%>
 
-<h1 class=no-tabs-below><fmt:message key="sysadmin.headline"/></h1>
-<br />
-
-<logic:iterate name="links" id="linkBean">
-	<p>
+<div class="list-group">
+	<logic:iterate name="links" id="linkBean">
+	<span class="list-group-item">
 		<a href="<bean:write name="linkBean" property="link"/>">
-			<fmt:message><bean:write name="linkBean" property="name"/></fmt:message>
-		</a>
-	</p>
-</logic:iterate>
+				<fmt:message><bean:write name="linkBean" property="name"/></fmt:message>
+			</a>
+	</span>
+	</logic:iterate>
+</div>
 
-
Index: lams_admin/web/template.jsp
===================================================================
diff -u -r2ef18e4c87e2e7929950dbeb990c6715ef16c0c2 -rf7cb84defcd7ff6e4f3232f2ef1856f1311215d9
--- lams_admin/web/template.jsp	(.../template.jsp)	(revision 2ef18e4c87e2e7929950dbeb990c6715ef16c0c2)
+++ lams_admin/web/template.jsp	(.../template.jsp)	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -4,18 +4,37 @@
 <lams:html>
 <lams:head>
 	<c:set var="title" scope="session"><tiles:getAsString name="title"/></c:set>
-	<title><fmt:message key="${title}"/></title>
-	<lams:css style="learner"/>
-	<link rel="stylesheet" href="<lams:LAMSURL/>css/jquery-ui-redmond-theme.css" type="text/css" media="screen">
+	<c:set var="title" scope="session"><fmt:message key="${title}"/></c:set>
+	<title>${title}</title>
+
+	<lams:css/>
+	<link rel="stylesheet" href="<lams:LAMSURL/>/admin/css/admin.css" type="text/css" media="screen">
+	<link rel="stylesheet" href="<lams:LAMSURL/>css/jquery-ui-smoothness-theme.css" type="text/css" media="screen">
 	<script language="JavaScript" type="text/JavaScript" src="<lams:LAMSURL/>/includes/javascript/changeStyle.js"></script>
 	<link rel="shortcut icon" href="<lams:LAMSURL/>/favicon.ico" type="image/x-icon" />
 </lams:head>
     
 <body class="stripes">
-<div id="page">
-	<div id="content">
-			<tiles:insert attribute="content" />
-	</div>
-</div>
+	<c:set var="subtitle" scope="session"><tiles:getAsString name="subtitle" ignore="true"/></c:set>	
+	<c:if test="${not empty subtitle}">
+		<c:set var="title" scope="session">${title}: <fmt:message key="${subtitle}"/></c:set>
+	</c:if>
+	
+	<c:set var="help"><tiles:getAsString name='help'  ignore="true"/></c:set>
+	<c:choose>
+		<c:when test="${not empty help}">
+			<c:set var="help"><lams:help style="small" page="${help}" /></c:set>
+			<lams:Page type="admin" title="${title}" titleHelpURL="${help}">
+				<tiles:insert attribute="content" />
+			</lams:Page>
+		</c:when>
+		<c:otherwise>
+			<lams:Page type="admin" title="${title}" >
+				<tiles:insert attribute="content" />
+			</lams:Page>
+		</c:otherwise>
+	</c:choose>
+
+
 </body>
 </lams:html>
Index: lams_admin/web/templatehelp.jsp
===================================================================
diff -u
--- lams_admin/web/templatehelp.jsp	(revision 0)
+++ lams_admin/web/templatehelp.jsp	(revision f7cb84defcd7ff6e4f3232f2ef1856f1311215d9)
@@ -0,0 +1,22 @@
+<%@ include file="/taglibs.jsp"%>
+
+<!DOCTYPE html>
+<lams:html>
+<lams:head>
+	<c:set var="title" scope="session"><tiles:getAsString name="title"/></c:set>
+	<c:set var="title" scope="session"><fmt:message key="${title}"/></c:set>
+	<title>${title}</title>
+	<lams:css/>
+	<link rel="stylesheet" href="<lams:LAMSURL/>css/jquery-ui-smoothness-theme.css" type="text/css" media="screen">
+	<script language="JavaScript" type="text/JavaScript" src="<lams:LAMSURL/>/includes/javascript/changeStyle.js"></script>
+	<link rel="shortcut icon" href="<lams:LAMSURL/>/favicon.ico" type="image/x-icon" />
+</lams:head>
+    
+<body class="stripes">
+	<c:set var="help"><tiles:getAsString name='help'/></c:set>
+	<c:set var="help"><lams:help style="small" page="${help}" /></c:set>
+	<lams:Page type="admin" title="${title}" titleHelpURL="${help}">
+		<tiles:insert attribute="content" />
+	</lams:Page>
+</body>
+</lams:html>