Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/accommodationmanagepage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/accommodationmanagepage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/accommodationmanagepage.pt	(revision 11037)
@@ -2,29 +2,31 @@
       i18n:domain="waeup.kofa" enctype="multipart/form-data">
 
-  <table class="display dataTableManage">
-    <thead>
-    <tr>
-      <th tal:condition="not: layout/isStudent">&nbsp;</th>
-      <th i18n:translate="">Session</th>
-      <th i18n:translate="">Booking Date</th>
-      <th i18n:translate="">Bed Coordinates</th>
-      <th i18n:translate="">Bed Category</th>
-    </tr>
-    </thead>
-    <tbody>
-      <tr tal:repeat="cl context/values">
-         <td tal:condition="not: layout/isStudent">
-          <input type="checkbox"
-    		 name="val_id"
-    		 tal:attributes="value cl/__name__" />
-        </td>
-        <td> <a tal:attributes="href cl/__name__">
-        <span tal:content="python: cl.getSessionString()">PID</span></a></td>
-        <td tal:content="python: layout.formatDatetime(cl.booking_date)">DATE</td>
-        <td tal:content="cl/display_coordinates">COORDINATES</td>
-        <td tal:content="cl/bed_type">TYPE</td>
+  <div class="table-responsive">
+    <table class="display dataTableManage">
+      <thead>
+      <tr>
+        <th tal:condition="not: layout/isStudent">&nbsp;</th>
+        <th i18n:translate="">Session</th>
+        <th i18n:translate="">Booking Date</th>
+        <th i18n:translate="">Bed Coordinates</th>
+        <th i18n:translate="">Bed Category</th>
       </tr>
-    </tbody>
-  </table>
+      </thead>
+      <tbody>
+        <tr tal:repeat="cl context/values">
+           <td tal:condition="not: layout/isStudent">
+            <input type="checkbox"
+      		 name="val_id"
+      		 tal:attributes="value cl/__name__" />
+          </td>
+          <td> <a tal:attributes="href cl/__name__">
+          <span tal:content="python: cl.getSessionString()">PID</span></a></td>
+          <td tal:content="python: layout.formatDatetime(cl.booking_date)">DATE</td>
+          <td tal:content="cl/display_coordinates">COORDINATES</td>
+          <td tal:content="cl/bed_type">TYPE</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
 
   <div tal:condition="view/availableActions">
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/containermanagepage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/containermanagepage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/containermanagepage.pt	(revision 11037)
@@ -30,34 +30,35 @@
     <span  i18n:translate="">Select all</span>
     <br /><br />
-
-    <table class="display dataTableManage">
-      <thead>
-    	<tr>
-    	  <th>&nbsp;</th>
-        <th i18n:translate="">Student Id</th>
-        <th i18n:translate="">Reg. Number</th>
-        <th i18n:translate="">Matric. Number</th>
-        <th i18n:translate="">State</th>
-        <th i18n:translate="">Full Name</th>
-    	</tr>
-      </thead>
-      <tbody>
-    	<tr tal:repeat="item view/hitlist" class="gradeC">
-    	  <td><input type="checkbox" name="entries"
-    	             tal:attributes="value item/context/__name__" /></td>
-    	  <td> <a tal:attributes="href item/url">
-          <span tal:content="item/student_id">A123456</span></a>
-        </td>
-        <td class="center"> <a tal:attributes="href item/url">
-          <span tal:content="item/reg_number">9999999</span></a>
-        </td>
-        <td class="center"> <a tal:attributes="href item/url">
-          <span tal:content="item/matric_number">9999999</span></a>
-        </td>
-        <td tal:content="item/state">admitted</td>
-    	  <td tal:content="item/display_fullname">Bob</td>
-    	</tr>
-      </tbody>
-    </table>
+    <div class="table-responsive">
+      <table class="display dataTableManage">
+        <thead>
+      	<tr>
+      	  <th>&nbsp;</th>
+          <th i18n:translate="">Student Id</th>
+          <th i18n:translate="">Reg. Number</th>
+          <th i18n:translate="">Matric. Number</th>
+          <th i18n:translate="">State</th>
+          <th i18n:translate="">Full Name</th>
+      	</tr>
+        </thead>
+        <tbody>
+      	<tr tal:repeat="item view/hitlist" class="gradeC">
+      	  <td><input type="checkbox" name="entries"
+      	             tal:attributes="value item/context/__name__" /></td>
+      	  <td> <a tal:attributes="href item/url">
+            <span tal:content="item/student_id">A123456</span></a>
+          </td>
+          <td class="center"> <a tal:attributes="href item/url">
+            <span tal:content="item/reg_number">9999999</span></a>
+          </td>
+          <td class="center"> <a tal:attributes="href item/url">
+            <span tal:content="item/matric_number">9999999</span></a>
+          </td>
+          <td tal:content="item/state">admitted</td>
+      	  <td tal:content="item/display_fullname">Bob</td>
+      	</tr>
+        </tbody>
+      </table>
+    </div>
     
     <input type="submit" name="remove"
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/containerpage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/containerpage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/containerpage.pt	(revision 11037)
@@ -33,30 +33,32 @@
   <input type="hidden" name="old_searchtype"
        tal:attributes="value view/searchtype" />
-  <table class="table table-striped dataTable">
-    <thead>
-    <tr>
-      <th i18n:translate="">Student Id</th>
-      <th i18n:translate="">Reg. Number</th>
-      <th i18n:translate="">Matric. Number</th>
-      <th i18n:translate="">State</th>
-      <th i18n:translate="">Full Name</th>
-    </tr>
-    </thead>
-    <tbody>
-    <tr tal:repeat="item view/hitlist">
-      <td> <a tal:attributes="href item/url">
-        <span tal:content="item/student_id">A123456</span></a>
-      </td>
-      <td class="center"> <a tal:attributes="href item/url">
-        <span tal:content="item/reg_number">9999999</span></a>
-      </td>
-      <td class="center"> <a tal:attributes="href item/url">
-        <span tal:content="item/matric_number">9999999</span></a>
-      </td>
-      <td tal:content="item/state">admitted</td>
-      <td tal:content="item/display_fullname">Bob</td>
-    </tr>
-    </tbody>
-  </table>
+  <div class="table-responsive">
+    <table class="table table-striped dataTable">
+      <thead>
+      <tr>
+        <th i18n:translate="">Student Id</th>
+        <th i18n:translate="">Reg. Number</th>
+        <th i18n:translate="">Matric. Number</th>
+        <th i18n:translate="">State</th>
+        <th i18n:translate="">Full Name</th>
+      </tr>
+      </thead>
+      <tbody>
+      <tr tal:repeat="item view/hitlist">
+        <td> <a tal:attributes="href item/url">
+          <span tal:content="item/student_id">A123456</span></a>
+        </td>
+        <td class="center"> <a tal:attributes="href item/url">
+          <span tal:content="item/reg_number">9999999</span></a>
+        </td>
+        <td class="center"> <a tal:attributes="href item/url">
+          <span tal:content="item/matric_number">9999999</span></a>
+        </td>
+        <td tal:content="item/state">admitted</td>
+        <td tal:content="item/display_fullname">Bob</td>
+      </tr>
+      </tbody>
+    </table>
+  </div>
   <br />
 </div>
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/editscorespage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/editscorespage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/editscorespage.pt	(revision 11037)
@@ -2,36 +2,37 @@
   <br />
 
-
-  <table class="display dataTable">
-    <thead>
-  	<tr>
-      <th i18n:translate="">Matric No.</th>
-      <th i18n:translate="">Score</th>
-      <th i18n:translate="">Fullname</th>
-      <th i18n:translate="">Status</th>
-      <th i18n:translate="">Certificate</th>
-      <th i18n:translate="">Current Session</th>
-      <th i18n:translate="">Current Level</th>
-      <th i18n:translate="">Course Level</th>
-  	</tr>
-    </thead>
-    <tbody>
-  	<tr tal:repeat="ticket view/tickets" class="gradeC">
-      <td tal:content="ticket/student/matric_number">MATRIC_NUMBER</td>
-  	  <td tal:condition="ticket/editable_by_lecturer">
-          <input type="text" name="scores" class="span1"
-  	             tal:attributes="value ticket/score" />
-      </td>
-      <td tal:condition="not: ticket/editable_by_lecturer"
-          tal:content="ticket/score">SCORE</td>
-  	  <td tal:content="ticket/student/display_fullname">FULLNAME</td>
-      <td tal:content="ticket/student/translated_state">STATE</td>
-      <td tal:content="ticket/student/certcode">CERTCODE</td>
-      <td tal:content="ticket/student/current_session">SESSION</td>
-      <td tal:content="ticket/student/current_level">LEVEL</td>
-      <td tal:content="ticket/level">LEVEL</td>
-  	</tr>
-    </tbody>
-  </table>
+  <div class="table-responsive">
+    <table class="display dataTable">
+      <thead>
+    	<tr>
+        <th i18n:translate="">Matric No.</th>
+        <th i18n:translate="">Score</th>
+        <th i18n:translate="">Fullname</th>
+        <th i18n:translate="">Status</th>
+        <th i18n:translate="">Certificate</th>
+        <th i18n:translate="">Current Session</th>
+        <th i18n:translate="">Current Level</th>
+        <th i18n:translate="">Course Level</th>
+    	</tr>
+      </thead>
+      <tbody>
+    	<tr tal:repeat="ticket view/tickets" class="gradeC">
+        <td tal:content="ticket/student/matric_number">MATRIC_NUMBER</td>
+    	  <td tal:condition="ticket/editable_by_lecturer">
+            <input type="text" name="scores" class="span1"
+    	             tal:attributes="value ticket/score" />
+        </td>
+        <td tal:condition="not: ticket/editable_by_lecturer"
+            tal:content="ticket/score">SCORE</td>
+    	  <td tal:content="ticket/student/display_fullname">FULLNAME</td>
+        <td tal:content="ticket/student/translated_state">STATE</td>
+        <td tal:content="ticket/student/certcode">CERTCODE</td>
+        <td tal:content="ticket/student/current_session">SESSION</td>
+        <td tal:content="ticket/student/current_level">LEVEL</td>
+        <td tal:content="ticket/level">LEVEL</td>
+    	</tr>
+      </tbody>
+    </table>
+  </div>
 
   <input type="submit" name="UPDATE"
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/filterstudentspage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/filterstudentspage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/filterstudentspage.pt	(revision 11037)
@@ -51,38 +51,40 @@
       <span tal:replace="view/level_string">LEVEL</span>
     </h3>
-    <table class="display dataTable">
-      <thead>
-    	<tr>
-    	  <th i18n:translate="">Student Id</th>
-        <th i18n:translate="">Matric No.</th>
-        <th i18n:translate="">Fullname</th>
-        <th i18n:translate="">Status</th>
-        <th i18n:translate="">Certificate</th>
-        <th i18n:translate="">Current Session</th>
-        <th i18n:translate="">Current Level</th>
-        <th i18n:translate="">Comment</th>
-    	</tr>
-      </thead>
-      <tbody>
-    	<tr tal:repeat="item view/hitlist" class="gradeC">
-    	  <td> <a tal:attributes="href item/url"
-                target="_blank">
-          <span tal:content="item/student_id">A123456</span></a>
-        </td>
-        <td tal:content="item/matric_number">MATRIC_NUMBER</td>
-    	  <td tal:content="item/display_fullname">FULLNAME</td>
-        <td tal:content="item/translated_state">STATE</td>
-        <td>
-          <a tal:attributes="href python: view.url(item.certificate)"
-             tal:content="item/certificate/code">
-             CERTIFICATE
-          </a>
-        </td>
-        <td tal:content="item/current_session">SESSION</td>
-        <td tal:content="item/current_level">LEVEL</td>
-        <td><span tal:condition="item/comment">yes</span></td>
-    	</tr>
-      </tbody>
-    </table>
+    <div class="table-responsive">
+      <table class="display dataTable">
+        <thead>
+      	<tr>
+      	  <th i18n:translate="">Student Id</th>
+          <th i18n:translate="">Matric No.</th>
+          <th i18n:translate="">Fullname</th>
+          <th i18n:translate="">Status</th>
+          <th i18n:translate="">Certificate</th>
+          <th i18n:translate="">Current Session</th>
+          <th i18n:translate="">Current Level</th>
+          <th i18n:translate="">Comment</th>
+      	</tr>
+        </thead>
+        <tbody>
+      	<tr tal:repeat="item view/hitlist" class="gradeC">
+      	  <td> <a tal:attributes="href item/url"
+                  target="_blank">
+            <span tal:content="item/student_id">A123456</span></a>
+          </td>
+          <td tal:content="item/matric_number">MATRIC_NUMBER</td>
+      	  <td tal:content="item/display_fullname">FULLNAME</td>
+          <td tal:content="item/translated_state">STATE</td>
+          <td>
+            <a tal:attributes="href python: view.url(item.certificate)"
+               tal:content="item/certificate/code">
+               CERTIFICATE
+            </a>
+          </td>
+          <td tal:content="item/current_session">SESSION</td>
+          <td tal:content="item/current_level">LEVEL</td>
+          <td><span tal:condition="item/comment">yes</span></td>
+      	</tr>
+        </tbody>
+      </table>
+    </div>
   </div>
 </form>
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/paymentsmanagepage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/paymentsmanagepage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/paymentsmanagepage.pt	(revision 11037)
@@ -2,38 +2,40 @@
       i18n:domain="waeup.kofa" enctype="multipart/form-data">
 
-  <table class="display dataTableManage">
-    <thead>
-    <tr>
-      <th>&nbsp;</th>
-      <th i18n:translate="">Payment Id</th>
-      <th i18n:translate="">Creation Date</th>
-      <th i18n:translate="">Payment Date</th>
-      <th i18n:translate="">Category</th>
-      <th i18n:translate="">Item</th>
-      <th i18n:translate="">Amount</th>
-      <th i18n:translate="">Session</th>
-      <th i18n:translate="">State</th>
-    </tr>
-    </thead>
-    <tbody>
-      <tr tal:repeat="cl context/values">
-         <td>
-          <input type="checkbox"
-    		 name="val_id"
-    		 tal:attributes="value cl/__name__"
-         tal:condition="python: not view.unremovable(cl)" />
-        </td>
-        <td> <a tal:attributes="href cl/__name__">
-        <span tal:content="cl/p_id">PID</span></a></td>
-        <td tal:content="python: layout.formatDatetime(cl.creation_date)">CREATION DATE</td>
-        <td tal:content="python: layout.formatDatetime(cl.payment_date)">PAYMENT DATE</td>
-      <td nowrap tal:content ="cl/category">CATEGORY</td>
-      <td tal:content ="cl/display_item">ITEM</td>
-      <td tal:content ="cl/amount_auth">AMOUNT</td>
-      <td tal:content ="cl/p_session">SESSION</td>
-      <td tal:content ="cl/p_state_title">STATE</td>
+  <div class="table-responsive">
+    <table class="display dataTableManage">
+      <thead>
+      <tr>
+        <th>&nbsp;</th>
+        <th i18n:translate="">Payment Id</th>
+        <th i18n:translate="">Creation Date</th>
+        <th i18n:translate="">Payment Date</th>
+        <th i18n:translate="">Category</th>
+        <th i18n:translate="">Item</th>
+        <th i18n:translate="">Amount</th>
+        <th i18n:translate="">Session</th>
+        <th i18n:translate="">State</th>
       </tr>
-    </tbody>
-  </table>
+      </thead>
+      <tbody>
+        <tr tal:repeat="cl context/values">
+           <td>
+            <input type="checkbox"
+      		 name="val_id"
+      		 tal:attributes="value cl/__name__"
+           tal:condition="python: not view.unremovable(cl)" />
+          </td>
+          <td> <a tal:attributes="href cl/__name__">
+          <span tal:content="cl/p_id">PID</span></a></td>
+          <td tal:content="python: layout.formatDatetime(cl.creation_date)">CREATION DATE</td>
+          <td tal:content="python: layout.formatDatetime(cl.payment_date)">PAYMENT DATE</td>
+        <td nowrap tal:content ="cl/category">CATEGORY</td>
+        <td tal:content ="cl/display_item">ITEM</td>
+        <td tal:content ="cl/amount_auth">AMOUNT</td>
+        <td tal:content ="cl/p_session">SESSION</td>
+        <td tal:content ="cl/p_state_title">STATE</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
 
   <div tal:condition="python: view.availableActions and view.manage_payments_allowed">
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studycoursemanagepage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studycoursemanagepage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studycoursemanagepage.pt	(revision 11037)
@@ -34,28 +34,30 @@
     <div id="tab2" class="tab-pane">
       <br />
-      <table class="dataTableManage">
-        <thead>
-          <tr>
-            <th>&nbsp;</th>
-            <th i18n:translate="">Level Code</th>
-            <th i18n:translate="">Level Title</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr tal:repeat="cl context/values">
-             <td>
-              <input type="checkbox"
-        		 name="val_id"
-        		 tal:attributes="value cl/__name__" />
-            </td>
-            <td> <a tal:attributes="href python:view.url(cl)">
-              <span tal:content="cl/level">CODE</span></a>
-            </td>
-            <td>
-              <span tal:content="cl/level_title">TITLE</span>
-            </td>
-          </tr>
-        </tbody>
-      </table>
+      <div class="table-responsive">
+        <table class="dataTableManage">
+          <thead>
+            <tr>
+              <th>&nbsp;</th>
+              <th i18n:translate="">Level Code</th>
+              <th i18n:translate="">Level Title</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr tal:repeat="cl context/values">
+               <td>
+                <input type="checkbox"
+          		 name="val_id"
+          		 tal:attributes="value cl/__name__" />
+              </td>
+              <td> <a tal:attributes="href python:view.url(cl)">
+                <span tal:content="cl/level">CODE</span></a>
+              </td>
+              <td>
+                <span tal:content="cl/level_title">TITLE</span>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
 
       <div tal:condition="view/availableActions">
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studyleveleditpage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studyleveleditpage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studyleveleditpage.pt	(revision 11037)
@@ -8,38 +8,40 @@
       tal:replace="view/context/total_credits">TOTAL</span>)
   </h3>
-  <table class="display dataTableManage">
-  <thead>
-    <tr>
-      <th>&nbsp;</th>
-      <th i18n:translate="">Term</th>
-      <th i18n:translate="">Code</th>
-      <th i18n:translate="">Title</th>
-      <th i18n:translate="">Department</th>
-      <th i18n:translate="">Faculty</th>
-      <th i18n:translate="">Credits</th>
-      <th i18n:translate="">Score</th>
-      <th i18n:translate="">CO</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr tal:repeat="value view/translated_values" class="gradeC">
-       <td>
-        <input type="checkbox" name="val_id"
-  		  tal:attributes="value value/__name__"
-        tal:condition="value/removable_by_student" />
-      </td>
-      <td tal:content="value/semester" nowrap>TERM</td>
-      <td> <a tal:attributes="href value/url">
-      <span tal:content="value/code">CODE</span>
-      </a></td>
-      <td tal:content="value/title">TITLE</td>
-      <td tal:content="value/dcode">DEPARTMENT</td>
-      <td tal:content="value/fcode">FACULTY</td>
-      <td tal:content="value/credits">CREDITS</td>
-      <td tal:content="value/score|nothing">SCORE</td>
-      <td tal:content="value/carry_over">CO</td>
-    </tr>
-  </tbody>
-  </table>
+  <div class="table-responsive">
+    <table class="display dataTableManage">
+    <thead>
+      <tr>
+        <th>&nbsp;</th>
+        <th i18n:translate="">Term</th>
+        <th i18n:translate="">Code</th>
+        <th i18n:translate="">Title</th>
+        <th i18n:translate="">Department</th>
+        <th i18n:translate="">Faculty</th>
+        <th i18n:translate="">Credits</th>
+        <th i18n:translate="">Score</th>
+        <th i18n:translate="">CO</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr tal:repeat="value view/translated_values" class="gradeC">
+         <td>
+          <input type="checkbox" name="val_id"
+    		  tal:attributes="value value/__name__"
+          tal:condition="value/removable_by_student" />
+        </td>
+        <td tal:content="value/semester" nowrap>TERM</td>
+        <td> <a tal:attributes="href value/url">
+        <span tal:content="value/code">CODE</span>
+        </a></td>
+        <td tal:content="value/title">TITLE</td>
+        <td tal:content="value/dcode">DEPARTMENT</td>
+        <td tal:content="value/fcode">FACULTY</td>
+        <td tal:content="value/credits">CREDITS</td>
+        <td tal:content="value/score|nothing">SCORE</td>
+        <td tal:content="value/carry_over">CO</td>
+      </tr>
+    </tbody>
+    </table>
+  </div>
 
   <div tal:condition="view/availableActions">
Index: main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studylevelmanagepage.pt
===================================================================
--- main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studylevelmanagepage.pt	(revision 11028)
+++ main/waeup.kofa/branches/uli-diazo-themed/src/waeup/kofa/students/browser_templates/studylevelmanagepage.pt	(revision 11037)
@@ -34,41 +34,45 @@
     <div id="tab2" class="tab-pane">
       <br />
-      <table class="display dataTableManage">
-      <thead>
-        <tr>
-          <th>&nbsp;</th>
-          <th i18n:translate="">Term</th>
-          <th i18n:translate="">Code</th>
-          <th i18n:translate="">Title</th>
-          <th i18n:translate="">Dept.</th>
-          <th i18n:translate="">Fact.</th>
-          <th i18n:translate="">Cred.</th>
-          <th i18n:translate="">Requ.</th>
-          <th i18n:translate="">Score</th>
-          <th i18n:translate="">CO</th>
-          <th i18n:translate="">Auto</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr tal:repeat="value view/translated_values" class="gradeC">
-          <td>
-            <input type="checkbox" name="val_id"
-      		  tal:attributes="value value/__name__" />
-          </td>
-          <td tal:content="value/semester" nowrap>TERM</td>
-          <td> <a tal:attributes="href value/url">
-          <span tal:content="value/code">CODE</span>
-          </a></td>
-          <td tal:content="value/title">TITLE</td>
-          <td tal:content="value/dcode">DEPARTMENT</td>
-          <td tal:content="value/fcode">FACULTY</td>
-          <td tal:content="value/credits">CREDITS</td>
-          <td tal:content="value/mandatory">MANDATORY</td>
-          <td tal:content="value/score|nothing">SCORE</td>
-          <td tal:content="value/carry_over">CO</td>
-          <td tal:content="value/automatic">AUTO</td>
-        </tr>
-      </tbody>
-      </table>
+      <div class="table-responsive">
+        <div class="table-responsive">
+          <table class="display dataTableManage">
+            <thead>
+              <tr>
+                <th>&nbsp;</th>
+                <th i18n:translate="">Term</th>
+                <th i18n:translate="">Code</th>
+                <th i18n:translate="">Title</th>
+                <th i18n:translate="">Dept.</th>
+                <th i18n:translate="">Fact.</th>
+                <th i18n:translate="">Cred.</th>
+                <th i18n:translate="">Requ.</th>
+                <th i18n:translate="">Score</th>
+                <th i18n:translate="">CO</th>
+                <th i18n:translate="">Auto</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr tal:repeat="value view/translated_values" class="gradeC">
+                <td>
+                  <input type="checkbox" name="val_id"
+            		  tal:attributes="value value/__name__" />
+                </td>
+                <td tal:content="value/semester" nowrap>TERM</td>
+                <td> <a tal:attributes="href value/url">
+                <span tal:content="value/code">CODE</span>
+                </a></td>
+                <td tal:content="value/title">TITLE</td>
+                <td tal:content="value/dcode">DEPARTMENT</td>
+                <td tal:content="value/fcode">FACULTY</td>
+                <td tal:content="value/credits">CREDITS</td>
+                <td tal:content="value/mandatory">MANDATORY</td>
+                <td tal:content="value/score|nothing">SCORE</td>
+                <td tal:content="value/carry_over">CO</td>
+                <td tal:content="value/automatic">AUTO</td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
 
       <div tal:condition="view/availableActions">
