Index: lams_tool_daco/web/WEB-INF/tags/Comments.tag
===================================================================
diff -u
--- lams_tool_daco/web/WEB-INF/tags/Comments.tag	(revision 0)
+++ lams_tool_daco/web/WEB-INF/tags/Comments.tag	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -0,0 +1,47 @@
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-lams" prefix="lams"%>
+<%@ taglib uri="tags-function" prefix="fn" %>
+
+<%@ attribute name="toolSessionId" required="true" rtexprvalue="true"%>
+<%@ attribute name="toolSignature" required="true" rtexprvalue="true"%>
+<%@ attribute name="height" required="false" rtexprvalue="true"%>
+<%@ attribute name="width" required="false" rtexprvalue="true"%>
+<%@ attribute name="mode" required="false" rtexprvalue="true"%>
+<%@ attribute name="likeAndDislike" required="false" rtexprvalue="true"%>
+<%@ attribute name="readOnly" required="false" rtexprvalue="true"%>
+<%@ attribute name="pageSize" required="false" rtexprvalue="true"%>
+<%@ attribute name="sortBy" required="false" rtexprvalue="true"%>
+
+
+<c:if test="${empty width}">
+	<c:set var="width" value="100%" />
+</c:if>
+
+<c:if test="${empty height}">
+	<c:set var="height" value="auto" />
+</c:if>
+
+<c:set var="modeStr" value=""/>
+<c:if test="${!empty mode}">
+	<c:set var="modeStr">&mode=${mode}</c:set>
+</c:if>
+
+<c:if test="${empty likeAndDislike}">
+	<c:set var="likeAndDislike" value="false" />
+</c:if>
+
+<c:if test="${empty readOnly}">
+	<c:set var="readOnly" value="false" />
+</c:if>
+
+<c:if test="${empty sortBy}">
+	<c:set var="sortBy" value="0" /> <!-- 0: date, 1: likes -->
+</c:if>
+
+<div id="commentFrame" class="commentFrame"  style="width: ${width}; height: ${height};"></div>
+<script>
+$(document).ready(function(){
+	var url='<lams:LAMSURL/>comments/comments.do?externalID=${toolSessionId}&externalSig=${toolSignature}&externalType=1${modeStr}&likeAndDislike=${likeAndDislike}&readOnly=${readOnly}&pageSize=${pageSize}&sortBy=${sortBy}';
+	$('#commentFrame').load(url);
+});
+</script>
\ No newline at end of file
Index: lams_tool_daco/web/WEB-INF/tags/CommentsAuthor.tag
===================================================================
diff -u
--- lams_tool_daco/web/WEB-INF/tags/CommentsAuthor.tag	(revision 0)
+++ lams_tool_daco/web/WEB-INF/tags/CommentsAuthor.tag	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -0,0 +1,51 @@
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-html" prefix="html"%>
+<%@ taglib uri="tags-fmt" prefix="fmt"%>
+
+<%@ attribute name="allowCommentsVariableName" required="false" rtexprvalue="true"%>
+<%@ attribute name="allowCommentLabelKey" required="false" rtexprvalue="true"%>
+<%@ attribute name="likeDislikeVariableName" required="false" rtexprvalue="true"%>
+<%@ attribute name="likeOnlyCommentLabelKey" required="false" rtexprvalue="true"%>
+<%@ attribute name="likeDislikeLabelKey" required="false" rtexprvalue="true"%>
+
+<c:if test="${empty allowCommentsVariableName}">
+	<c:set var="allowCommentsVariableName" value="allowComments" />
+</c:if>
+<c:if test="${empty allowCommentLabelKey}">
+	<c:set var="allowCommentLabelKey" value="advanced.allow.comments" />
+</c:if>
+<c:if test="${empty likeDislikeVariableName}">
+	<c:set var="likeDislikeVariableName" value="commentsLikeAndDislike" />
+</c:if>
+<c:if test="${empty likeOnlyCommentLabelKey}">
+	<c:set var="likeOnlyCommentLabelKey" value="advanced.comments.like.only" />
+</c:if>
+<c:if test="${empty likeDislikeLabelKey}">
+	<c:set var="likeDislikeLabelKey" value="advanced.comments.like.and.dislike" />
+</c:if>
+
+<p class="voffset5">
+	<html:checkbox property="${allowCommentsVariableName}" value="1"
+		styleClass="noBorder" styleId="${allowCommentsVariableName}">
+		&nbsp;<fmt:message key="${allowCommentLabelKey}" />
+	</html:checkbox>
+</p>
+	<div style="padding-left: 20px" id="likedislike">
+	<p>
+		<html:radio property="${likeDislikeVariableName}" value="false" />&nbsp;<fmt:message key="${likeOnlyCommentLabelKey}" /> &nbsp;
+		<html:radio property="${likeDislikeVariableName}" value="true" />&nbsp;<fmt:message key="${likeDislikeLabelKey}" /> 
+	</p>
+	</div>
+
+<script>
+jQuery( document ).ready(function( $ ) {
+	if (! $("#${allowCommentsVariableName}").is(':checked')) {
+		$("#likedislike").hide();
+	}
+	$("#${allowCommentsVariableName}").click(function() {
+		$("#likedislike").toggle('slow');
+	});
+});
+</script>
+
+
Index: lams_tool_daco/web/WEB-INF/tags/DefineLater.tag
===================================================================
diff -u -rbe03cfbba16a388e85d82cb8986f63d6b2ad568b -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/WEB-INF/tags/DefineLater.tag	(.../DefineLater.tag)	(revision be03cfbba16a388e85d82cb8986f63d6b2ad568b)
+++ lams_tool_daco/web/WEB-INF/tags/DefineLater.tag	(.../DefineLater.tag)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -1,6 +1,6 @@
 
 <%
-	 /****************************************************************
+	/****************************************************************
 	 * Copyright (C) 2005 LAMS Foundation (http://lamsfoundation.org)
 	 * =============================================================
 	 * License Information: http://lamsfoundation.org/licensing/lams/2.0/
@@ -49,10 +49,18 @@
 	<c:set var="buttonTryAgainKey" value="button.try.again" />
 </c:if>
 
-<p>
-	<fmt:message key="${defineLaterMessageKey}" />
-</p>
-<div align="right" class="space-bottom-top">
-	<a href="javascript:location.reload(true);" class="button"><fmt:message
-			key="${buttonTryAgainKey}" /> </a>
+<div class="row no-gutter">
+	<div
+		class="col-xs-12 col-sm-offset-1 col-sm-10 col-lg-offset-2 col-lg-8">
+		<div class="alert alert-info">
+			<fmt:message key="${defineLaterMessageKey}" />
+		</div>
+	</div>
 </div>
+<div class="row no-gutter">
+	<div class="col-xs-12">
+		<a href="javascript:location.reload(true);"
+			class="btn btn-primary pull-right voffset5"><fmt:message
+				key="${buttonTryAgainKey}" /></a>
+	</div>
+</div>
\ No newline at end of file
Fisheye: Tag c367db7b5c528a0daed19a7bf7b3088e3b1268bc refers to a dead (removed) revision in file `lams_tool_daco/web/WEB-INF/tags/HybridTab.tag'.
Fisheye: No comparison available.  Pass `N' to diff?
Fisheye: Tag c367db7b5c528a0daed19a7bf7b3088e3b1268bc refers to a dead (removed) revision in file `lams_tool_daco/web/WEB-INF/tags/HybridTabAction.tag'.
Fisheye: No comparison available.  Pass `N' to diff?
Fisheye: Tag c367db7b5c528a0daed19a7bf7b3088e3b1268bc refers to a dead (removed) revision in file `lams_tool_daco/web/WEB-INF/tags/HybridTabBody.tag'.
Fisheye: No comparison available.  Pass `N' to diff?
Fisheye: Tag c367db7b5c528a0daed19a7bf7b3088e3b1268bc refers to a dead (removed) revision in file `lams_tool_daco/web/WEB-INF/tags/HybridTabHeader.tag'.
Fisheye: No comparison available.  Pass `N' to diff?
Index: lams_tool_daco/web/WEB-INF/tags/ImgButtonWrapper.tag
===================================================================
diff -u -rbe03cfbba16a388e85d82cb8986f63d6b2ad568b -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/WEB-INF/tags/ImgButtonWrapper.tag	(.../ImgButtonWrapper.tag)	(revision be03cfbba16a388e85d82cb8986f63d6b2ad568b)
+++ lams_tool_daco/web/WEB-INF/tags/ImgButtonWrapper.tag	(.../ImgButtonWrapper.tag)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -1,37 +1,37 @@
-<% 
-/****************************************************************
- * 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
- * ****************************************************************
- */
- 
- /**
-  * ImgButtonWrapper.tag
-  *	Author: Mitchell Seaton
-  *	Description: Simple wrapper that will display buttons correctly when RTL page rendering is used.
-  */
- 
- %>
-<%@ tag body-content="scriptless" %>
-<div id="button-table" class="space-bottom-top">
-	<div id="button-row">
-		<jsp:doBody />
-	</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
+ * ****************************************************************
+ */
+ 
+ /**
+  * ImgButtonWrapper.tag
+  *	Author: Mitchell Seaton
+  *	Description: Simple wrapper that will display buttons correctly when RTL page rendering is used.
+  */
+ 
+ %>
+<%@ tag body-content="scriptless" %>
+<div id="button-table" class="space-bottom-top">
+	<div id="button-row">
+		<jsp:doBody />
+	</div>
+</div>
Index: lams_tool_daco/web/WEB-INF/tags/Tab.tag
===================================================================
diff -u -rbe37ea9b52fd18c106254805e3cc45a6581bdd87 -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/WEB-INF/tags/Tab.tag	(.../Tab.tag)	(revision be37ea9b52fd18c106254805e3cc45a6581bdd87)
+++ lams_tool_daco/web/WEB-INF/tags/Tab.tag	(.../Tab.tag)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -24,8 +24,8 @@
 
 	/**
 	 * Tab.tag
-	 *	Author: Mitchell Seaton
-	 *	Description: Creates a tab element.
+	 *	Author: Fiona Malikoff
+	 *	Description: Creates a tab element within the Hybrid Tab Header.
 	 * Wiki: 
 	 */
 %>
@@ -34,7 +34,7 @@
 <%@ 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"%> 
+<%@ attribute name="methodCall" required="false" rtexprvalue="true"%>
 
 <%@ taglib uri="tags-core" prefix="c"%>
 <%@ taglib uri="tags-fmt" prefix="fmt"%>
Index: lams_tool_daco/web/WEB-INF/tags/TabBodyArea.tag
===================================================================
diff -u
--- lams_tool_daco/web/WEB-INF/tags/TabBodyArea.tag	(revision 0)
+++ lams_tool_daco/web/WEB-INF/tags/TabBodyArea.tag	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -0,0 +1,39 @@
+<%/****************************************************************
+ * 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
+ * ****************************************************************
+ */
+
+/**
+ * TabBodyArea.tag
+ *	Author: Fiona Malikoff
+ *	Description: Creates the panel body area for a nav bar screen
+ * Wiki: 
+ */
+
+%>
+<%@ taglib uri="tags-core" prefix="c"%>
+<%@ taglib uri="tags-bean" prefix="bean"%>
+
+<div class="panel-body panel-monitor-body">
+	 <jsp:doBody />
+</div>
+
+</div> <!--  close tab opened in TabHeader -->
\ No newline at end of file
Index: lams_tool_daco/web/WEB-INF/tags/Tabs.tag
===================================================================
diff -u -rbe37ea9b52fd18c106254805e3cc45a6581bdd87 -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/WEB-INF/tags/Tabs.tag	(.../Tabs.tag)	(revision be37ea9b52fd18c106254805e3cc45a6581bdd87)
+++ lams_tool_daco/web/WEB-INF/tags/Tabs.tag	(.../Tabs.tag)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -23,52 +23,70 @@
 
 /**
  * Tabs.tag
- *	Author: Mitchell Seaton
- *	Description: Create a tab list from a input collection or nested Tab tags.
- * Wiki: 
+ *	Author: Fiona Malikoff
+ *	Description: Create a hybrid panel header that contains a nav bar that acts like tabs.
  */
 
-		%>
-<%@ 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"%>
-<%@ attribute name="format" 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>
-<c:choose>
-<c:when test="${empty format}">
-	<c:set var="dFormat" value="nav-tabs" scope="request" />
-</c:when>
-<c:otherwise>
-	<c:set var="dFormat" value="${format}" scope="request" />
-</c:otherwise>
-</c:choose>
 
-<!-- tab holder table -->
-<ul id="page-tabs" class="nav ${dFormat}" role="tablist">
-	<jsp:doBody />
-</ul>
+<!-- navbar combined with tabs -->
+<div class="panel panel-default panel-monitor-page">
+<div class="panel-heading navbar-heading">
 
-<%--
-	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>
+ 	<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_tool_daco/web/WEB-INF/tags/headItems.tag
===================================================================
diff -u -r613f0d0d76eb497ed58d7e6836eda34a245425a9 -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/WEB-INF/tags/headItems.tag	(.../headItems.tag)	(revision 613f0d0d76eb497ed58d7e6836eda34a245425a9)
+++ lams_tool_daco/web/WEB-INF/tags/headItems.tag	(.../headItems.tag)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -41,7 +41,9 @@
 	<lams:WebAppURL />
 </c:set>
 
-<lams:css style="main"/>
+<lams:css/>
 
 <script type="text/javascript" src="${lams}includes/javascript/common.js"></script>
-<script type="text/javascript" src="${lams}includes/javascript/tabcontroller.js"></script>
+<script type="text/javascript" src="${lams}includes/javascript/jquery.js"></script>
+<script type="text/javascript" src="${lams}includes/javascript/bootstrap.min.js"></script>
+<script type="text/javascript" src="${lams}includes/javascript/bootstrap.tabcontroller.js"></script>
Index: lams_tool_daco/web/pages/authoring/authoring.jsp
===================================================================
diff -u -r2ba408421bb2e9ae92dc8f0c98c0aa2312a6842a -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/pages/authoring/authoring.jsp	(.../authoring.jsp)	(revision 2ba408421bb2e9ae92dc8f0c98c0aa2312a6842a)
+++ lams_tool_daco/web/pages/authoring/authoring.jsp	(.../authoring.jsp)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -43,12 +43,12 @@
 <c:set var="title"><fmt:message key="label.common.heading" /></c:set>
 <lams:Page title="${title}" type="navbar">
 
- 	<lams:HybridTabHeader control="true" title="${title}" helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>" helpModule="authoring">
-			<lams:HybridTab id="1" key="label.authoring.heading.basic" />
-			<lams:HybridTab id="2" key="label.authoring.heading.advanced" />
-	</lams:HybridTabHeader>	
+ 	<lams:Tabs control="true" title="${title}" helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>" helpModule="authoring">
+			<lams:Tab id="1" key="label.authoring.heading.basic" />
+			<lams:Tab id="2" key="label.authoring.heading.advanced" />
+	</lams:Tabs>	
 
- 	<lams:HybridTabBody>
+ 	<lams:TabBodyArea>
 		<%@ include file="/common/messages.jsp"%>
 
 
@@ -74,7 +74,7 @@
 			 customiseSessionID="${formBean.sessionMapID}"
 			 contentFolderID="${formBean.contentFolderID}"
 			 cancelConfirmMsgKey="message.authoring.cancel.save" />
-	</lams:HybridTabBody>
+	</lams:TabBodyArea>
  
 
 <div id="footer"></div>
Index: lams_tool_daco/web/pages/authoring/parts/addcheckbox.jsp
===================================================================
diff -u -re48fc0e1f6819e257b87efa36c3baec3c1c488f0 -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/pages/authoring/parts/addcheckbox.jsp	(.../addcheckbox.jsp)	(revision e48fc0e1f6819e257b87efa36c3baec3c1c488f0)
+++ lams_tool_daco/web/pages/authoring/parts/addcheckbox.jsp	(.../addcheckbox.jsp)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -5,7 +5,7 @@
 <lams:html>
 <lams:head>
 	<%@ include file="/common/header.jsp"%>
-	<lams:css style="main" />
+	<lams:css/>
 	<!-- To use in external script files. -->
 	<script type="text/javascript">
 	   var removeAnswerOptionUrl = "<c:url value='/authoring/removeAnswerOption.do'/>";
@@ -18,6 +18,13 @@
 </lams:head>
 <body class="tabpart">
 
+<div class="panel panel-default">
+<div class="panel-heading">
+	<div class="panel-title"><fmt:message key="label.authoring.basic.checkbox" /></div>
+</div>
+
+<div class="panel-body">
+
 <!-- Add question form-->
 <%@ include file="/common/messages.jsp"%>
 <html:form action="/authoring/saveOrUpdateQuestion" method="post" styleId="dacoQuestionForm">
@@ -26,47 +33,63 @@
 	<html:hidden property="questionIndex" />
 	<input type="hidden" id="answerOptionList" name="answerOptionList" />
 
-	<h2 class="no-space-left"><fmt:message key="label.authoring.basic.checkbox" /></h2>
-	<div><fmt:message key="label.authoring.basic.radio.help" /></div>
+	<p><fmt:message key="label.authoring.basic.radio.help" /></p>
 
-	<div class="field-name space-top"><fmt:message key="label.authoring.basic.description" /></div>
-
 	<c:set var="formBean" value="<%=request.getAttribute(org.apache.struts.taglib.html.Constants.BEAN_KEY)%>" />
 	<c:set var="sessionMap" value="${sessionScope[formBean.sessionMapID]}" />
-	<lams:CKEditor id="description" value="${formBean.description}" 
-		contentFolderID="${sessionMap.contentFolderID}"
-                width="100%"
-                resizeParentFrameName="questionInputArea">
-	</lams:CKEditor>
-	<div class="space-bottom-top"><a id="toggleAdditionalOptionsAreaLink" href="javascript:toggleAdditionalOptionsArea()"><fmt:message
-		key="label.authoring.basic.additionaloptions.show" /> </a><br />
+
+	<div class="form-group">
+    	<label for="description"><fmt:message key="label.authoring.basic.description" /></label>
+		<lams:CKEditor id="description" value="${formBean.description}" 
+			contentFolderID="${sessionMap.contentFolderID}"
+	                width="100%"
+	                resizeParentFrameName="questionInputArea">
+		</lams:CKEditor>
 	</div>
+  
+	<a id="toggleAdditionalOptionsAreaLink" href="javascript:toggleAdditionalOptionsArea()" class="btn btn-default btn-sm pull-right"><fmt:message
+		key="label.authoring.basic.additionaloptions.show" /> </a>
 
-	<div id="additionalOptionsArea" style="display: none;">
-
-	<div class="field-name"><fmt:message key="label.authoring.basic.min.select" /></div>
-	<html:text styleId="min" property="min" size="10" />
-	<div class="field-name space-top"><fmt:message key="label.authoring.basic.max.select" /></div>
-	<html:text styleId="max" property="max" size="10" />
-	<div class="space-top"><html:checkbox property="questionRequired" styleId="questionRequired" styleClass="noBorder">
-		<fmt:message key="label.authoring.basic.required" />
-	</html:checkbox></div>
-	<div class="field-name space-top"><fmt:message key="label.common.summary" /></div>
+	<div id="additionalOptionsArea" class="voffset5" style="display: none;">
+		<div class="form-group">
+	    	<label for=min><fmt:message key="label.authoring.basic.min.select" />&nbsp;
+		<html:text styleId="min" property="min" size="10" />
+		</div>
+		
+		<div class="form-group">
+	    	<label for="max"><fmt:message key="label.authoring.basic.max.select" />&nbsp;
+		<html:text styleId="max" property="max" size="10" />
+		</div>
+		
+		<div class="form-group">
+	    	<label for="questionRequired"><html:checkbox property="questionRequired" styleId="questionRequired" styleClass="noBorder">&nbsp;
+			<fmt:message key="label.authoring.basic.required" />
+		</html:checkbox>
+		</div>
+	</div>
+	
+	<div class="form-group voffset5">
+    	<label for="summary"><fmt:message key="label.common.summary" />
 	<html:select property="summary" styleClass="noBorder">
 		<html:option value="0" styleId="noSummaryOption"><fmt:message key="label.common.summary.none" /></html:option>
 		<html:option value="2"><fmt:message key="label.common.summary.average" /></html:option>
 		<html:option value="3"><fmt:message key="label.common.summary.count" /></html:option>
-	</html:select></div>
+	</html:select>
+	</div>
 </html:form>
 
 <!-- Answer options -->
 
 <%@ include file="answeroptions.jsp"%>
 
-<lams:ImgButtonWrapper>
-	<a href="#" onclick="javascript:submitDacoQuestion()" class="button-add-item"><fmt:message
+<div class="voffset5">
+	<a href="#" onclick="javascript:submitDacoQuestion()" class="btn btn-default btn-sm"> <fmt:message
 		key="label.authoring.basic.checkbox.add" /> </a>
-	<a href="#" onclick="javascript:cancelDacoQuestion()" class="button space-left"><fmt:message key="label.common.cancel" /> </a>
-</lams:ImgButtonWrapper>
+	<a href="#" onclick="javascript:cancelDacoQuestion()" class="btn btn-default btn-sm loffset5"> <fmt:message key="label.common.cancel" /> </a>
+</div>
+
+</div>
+</div>
+
 </body>
 </lams:html>
Index: lams_tool_daco/web/pages/authoring/parts/answeroptions.jsp
===================================================================
diff -u -r0f72f0de2b62adf76a38ed64e1226b317d86bc60 -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/pages/authoring/parts/answeroptions.jsp	(.../answeroptions.jsp)	(revision 0f72f0de2b62adf76a38ed64e1226b317d86bc60)
+++ lams_tool_daco/web/pages/authoring/parts/answeroptions.jsp	(.../answeroptions.jsp)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -7,49 +7,35 @@
 <div id="answerOptionsArea" class="space-bottom-top">
 <form id="answerOptionsForm"><input type="hidden" id="answerOptionCount" name="answerOptionCount" value="${listSize}"/>
 <div class="field-name"><fmt:message key="label.authoring.basic.answeroption" /></div>
-<a href="#" onclick="javascript:addAnswerOption()" class="button left-buttons"><fmt:message
+<a href="#" onclick="javascript:addAnswerOption()" class="btn btn-default btn-sm pull-left"><fmt:message
 	key="label.authoring.basic.answeroption.add" /></a>
 	
 		<%-- This image is shown when answer options are downloaded from a server. --%>
 		<img src="${ctxPath}/includes/images/indicator.gif"
 			style="display:none;" id="answerOptionsArea_Busy" name="answerOptionsArea_Busy"/>
-<table>
+<table class="table table-condensed">
 	<c:forEach var="item" items="${answerOptionList}" varStatus="status">
 		<tr>
 			<td width="3px">${fn:substring(ordinal,status.index,status.index+1)})</td>
 			<td><input type="text" name="answerOptionItemDesc${status.index+1}" id="answerOptionItemDesc${status.index+1}" size="60" value="<c:out  value='${item}'/>"></td>
 
-			<td>
-			<%-- Don't display up icon if first line --%>
-			<c:choose>
-				<c:when test="${status.first}">
-					<img src="<html:rewrite page='/includes/images/uparrow_disabled.gif'/>" border="0"
-						title="<fmt:message key="label.authoring.basic.answeroption.up"/>">
-				</c:when>
-				<c:otherwise>
-					<img src="<html:rewrite page='/includes/images/uparrow.gif'/>" border="0"
-						title="<fmt:message key="label.authoring.basic.answeroption.up"/>" onclick="javascript:upItem('${status.index+1}')">
-				</c:otherwise>
-			</c:choose>
-			<%-- Don't display down icon if last line --%>
-			<c:choose>
-				<c:when test="${status.last}">
-					<img src="<html:rewrite page='/includes/images/downarrow_disabled.gif'/>" border="0"
-						title="<fmt:message key="label.authoring.basic.answeroption.down"/>">			
-				</c:when>
-				<c:otherwise>
-					<img src="<html:rewrite page='/includes/images/downarrow.gif'/>" border="0"
-						title="<fmt:message key="label.authoring.basic.answeroption.down"/>" onclick="javascript:downItem('${status.index+1}','${listSize}')">
-				</c:otherwise>
-
-			</c:choose> <%-- Don't display remove icon if there is less than 2 answer options --%></td>
+			<td class="arrows">
+			<!-- Don't display up icon if first line -->
+			<c:if test="${not status.first}">
+ 				<lams:Arrow state="up" title="<fmt:message key='label.authoring.basic.answeroption.up'/>" onclick="javascript:upItem('${status.index+1}')"/>
+ 			</c:if>
+			<!-- Don't display down icon if last line -->
+			<c:if test="${not status.last}">
+				<lams:Arrow state="down" title="<fmt:message key='label.authoring.basic.answeroption.down'/>" onclick="javascript:downItem('${status.index+1}','${listSize}')"/>
+ 			</c:if>
+			</td>
+			<!-- Don't display remove icon if there is less than 2 answer options -->
 			<c:if test="${listSize > 2}">
-				<td><img src="<html:rewrite page='/includes/images/cross.gif'/>" border="0"
-					title="<fmt:message key="label.common.delete"/>" onclick="javascript:removeAnswerOption('${status.index+1}')"></td>
+				<td><i class="fa fa-times" title="<fmt:message key='label.common.delete'/>" onclick="javascript:removeAnswerOption('${status.index+1}')"></i></td>
 			</c:if>
 		</tr>
 	</c:forEach>
-</table>
+</table> 
 </form>
 </div>
 
Index: lams_tool_daco/web/pages/learning/learning.jsp
===================================================================
diff -u -rae4b6677d193f84775e8e4fdd0db76cc71069d2b -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision ae4b6677d193f84775e8e4fdd0db76cc71069d2b)
+++ lams_tool_daco/web/pages/learning/learning.jsp	(.../learning.jsp)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -59,14 +59,14 @@
 </c:choose>
 </c:set> 
 
-<lams:HybridTabHeader control="true" title="${daco.title}" helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>" helpModule="learning" extraControl="${ellipsisControl}">
- 	<lams:HybridTab id="1" key="label.learning.heading.add" />
- 	<lams:HybridTab id="2" key="label.learning.heading.list" />
-	<lams:HybridTab id="3" key="label.learning.heading.summary" />
-</lams:HybridTabHeader>	
+<lams:Tabs control="true" title="${daco.title}" helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>" helpModule="learning" extraControl="${ellipsisControl}">
+ 	<lams:Tab id="1" key="label.learning.heading.add" />
+ 	<lams:Tab id="2" key="label.learning.heading.list" />
+	<lams:Tab id="3" key="label.learning.heading.summary" />
+</lams:Tabs>	
 
 
-<lams:HybridTabBody>
+<lams:TabBodyArea>
 	<lams:TabBodys>
 	 	<lams:TabBody id="1" titleKey="label.learning.heading.add" page="addRecord.jsp?displayedRecordNumber=${displayedRecordNumber}" />
  		<lams:TabBody id="2" titleKey="label.learning.heading.list" page="listRecords.jsp?includeMode=learning" />
@@ -97,7 +97,7 @@
 		</c:choose>
 </c:if>
  
-</lams:HybridTabBody>
+</lams:TabBodyArea>
 
 <div id="footer"></div>
 </lams:Page>
Index: lams_tool_daco/web/pages/monitoring/monitoring.jsp
===================================================================
diff -u -rd55722236d2f82c6bb0c46a30cbc39c22ac01943 -rc367db7b5c528a0daed19a7bf7b3088e3b1268bc
--- lams_tool_daco/web/pages/monitoring/monitoring.jsp	(.../monitoring.jsp)	(revision d55722236d2f82c6bb0c46a30cbc39c22ac01943)
+++ lams_tool_daco/web/pages/monitoring/monitoring.jsp	(.../monitoring.jsp)	(revision c367db7b5c528a0daed19a7bf7b3088e3b1268bc)
@@ -25,19 +25,19 @@
 	<c:set var="title"><fmt:message key="label.common.heading" /></c:set>
  	<lams:Page type="navbar" title="${title}"> 
 
-		<lams:HybridTabHeader control="true" title="${title}" helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>" helpModule="monitoring" refreshOnClickAction="javascript:refreshPage()">
-			<lams:HybridTab id="1" key="label.common.summary"/>
-			<lams:HybridTab id="2" key="tab.monitoring.edit.activity"/>
-			<lams:HybridTab id="3" key="tab.monitoring.statistics"/>
-		</lams:HybridTabHeader>	
+		<lams:Tabs control="true" title="${title}" helpToolSignature="<%= DacoConstants.TOOL_SIGNATURE %>" helpModule="monitoring" refreshOnClickAction="javascript:refreshPage()">
+			<lams:Tab id="1" key="label.common.summary"/>
+			<lams:Tab id="2" key="tab.monitoring.edit.activity"/>
+			<lams:Tab id="3" key="tab.monitoring.statistics"/>
+		</lams:Tabs>	
 
-  		<lams:HybridTabBody>
+  		<lams:TabBodyArea>
 			<lams:TabBodys>			
 					<lams:TabBody id="1" titleKey="label.common.summary" page="summary.jsp"/>
 					<lams:TabBody id="2" titleKey="tab.monitoring.edit.activity" page="editactivity.jsp"/>	
 					<lams:TabBody id="3" titleKey="tab.monitoring.statistics" page="statistics.jsp"/>
 			</lams:TabBodys> 
-		</lams:HybridTabBody> 
+		</lams:TabBodyArea> 
 
 	<div id="footer"></div>
 	</lams:Page>