Index: lams_tool_scratchie/web/pages/learning/scratchies.jsp
===================================================================
diff -u -r8d76bd31dd55117e17dc31cbd49ca1f6cca90e7e -ra173c56737e22188f4ea7b1188b4282eaba5ed31
--- lams_tool_scratchie/web/pages/learning/scratchies.jsp	(.../scratchies.jsp)	(revision 8d76bd31dd55117e17dc31cbd49ca1f6cca90e7e)
+++ lams_tool_scratchie/web/pages/learning/scratchies.jsp	(.../scratchies.jsp)	(revision a173c56737e22188f4ea7b1188b4282eaba5ed31)
@@ -100,19 +100,22 @@
 		</c:forEach>
 	</table>
 
+	<%--Display Etherpad for each question --%>
 	<c:if test="${isQuestionEtherpadEnabled}">
-		<%--Display Etherpad for each question --%>
-		<div class="panel panel-default question-etherpad">
-			<div class="panel-heading">
-				<div class="panel-title">
-					<fmt:message key="label.etherpad.discussion" />
+		<div class="form-group question-etherpad-container">
+			<a data-toggle="collapse" data-target="#question-etherpad-${item.uid}" href="#qe${item.uid}" class="collapsed">
+				<span class="if-collapsed"><i class="fa fa-xs fa-plus-square-o roffset5" aria-hidden="true"></i></span>
+  				<span class="if-not-collapsed"><i class="fa fa-xs fa-minus-square-o roffset5" aria-hidden="true"></i></span>
+				<fmt:message key="label.etherpad.discussion" />
+			</a>
+			
+			<div id="question-etherpad-${item.uid}" class="collapse">
+				<div class="panel panel-default question-etherpad">
+					<lams:Etherpad groupId="etherpad-scratchie-${toolSessionID}-question-${item.uid}" 
+					   showControls="${mode eq 'teacher'}" showChat="false" height="200"
+					>${questionEtherpadContent}</lams:Etherpad>
 				</div>
 			</div>
-			<div class="panel-body">
-				<lams:Etherpad groupId="etherpad-scratchie-${toolSessionID}-question-${item.uid}" 
-				   showControls="${mode eq 'teacher'}" showChat="false" height="200"
-				>${questionEtherpadContent}</lams:Etherpad>
-			</div>
 		</div>
 	</c:if>