diff --git a/docs/index.html b/docs/index.html
index c30d8c3f..b9c50bd6 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -22,19 +22,19 @@ root: ../
 <h1><small>The Recline Library consists of 3 parts: Models, Backends and Views</small></h1>
 
 <div class="row">
-  <div class="span4">
+  <div class="col-md-4">
     <div class="well">
       <h3>Models</h3>
       <p>Models help you structure your work with data by providing some standard objects such as Dataset and Record &ndash; a Dataset being a collection of Records. <a href="models.html">More &raquo;</a></p>
     </div>
   </div>
-  <div class="span4">
+  <div class="col-md-4">
     <div class="well">
       <h3>Backends</h3>
       <p>Backends connect your Models to data sources (and stores) &ndash; for example Google Docs spreadsheets, local CSV files, the DataHub, ElasticSearch etc. <a href="backends.html">More &raquo;</a></p>
     </div>
   </div>
-  <div class="span4">
+  <div class="col-md-4">
     <div class="well">
       <h3>Views</h3>
       <p>Views are user interface components for displaying, editing or interacting with the data. For example, maps, graphs, data grids or a query editor. <a href="views.html">More &raquo;</a></p>
@@ -46,13 +46,13 @@ root: ../
 
 <h2 id="docs-source">Source Docs (via Docco)</h2>
 <div class="row">
-  <div class="span4">
+  <div class="col-md-4">
     <h4>Models</h4>
     <ul>
       <li><a href="src/model.html">Models</a></li>
     </ul>
   </div>
-  <div class="span4">
+  <div class="col-md-4">
     <h4>Dataset Views and Widgets</h4>
     <ul>
       <li><a href="src/view.multiview.html">MultiView View (plus common view code)</a></li>
diff --git a/docs/tutorials.html b/docs/tutorials.html
index 8ed90f7f..6ef1e832 100644
--- a/docs/tutorials.html
+++ b/docs/tutorials.html
@@ -12,19 +12,19 @@ root: ../
 
 <h3>Basics &ndash; Using the Dataset and its Friends</h3>
 <hr />
-<div id="tutorials" class="tutorials">
+<div id="tutorials" class="tutorials container">
   <div class="row">
-    <div class="span4">
+    <div class="col-md-4">
       <div class="well">
         <h4><a href="tutorial-basics.html">Dataset Basics</a></h4>
       </div>
     </div>
-    <div class="span4">
+    <div class="col-md-4">
       <div class="well">
         <h4><a href="tutorial-basics-query.html">Dataset Querying</a></h4>
       </div>
     </div>
-    <div class="span4">
+    <div class="col-md-4">
       <div class="well">
         <h4><a href="tutorial-basics-events.html">Datasets and Events</a></h4>
       </div>
@@ -34,9 +34,9 @@ root: ../
 
 <h3>Backends &ndash; Loading and Storing Data from Remote Sources</h3>
 <hr />
-<div class="tutorials">
+<div class="tutorials container">
   <div class="row">
-    <div class="span4">
+    <div class="col-md-4">
       <div class="well">
         <h4><a href="tutorial-backends.html">Backends: loading data from Google Docs, Local CSV, DataHub &amp; more ...</a></h4>
       </div>
@@ -46,14 +46,14 @@ root: ../
 
 <h3>Views &ndash; visualize data</h3>
 <hr />
-<div class="tutorials">
+<div class="tutorials container">
   <div class="row">
-    <div class="span4">
+    <div class="col-md-4">
       <div class="well">
         <h4><a href="tutorial-views.html">Views Quickstart - Grids, Graphs, Maps &amp; Timelines</a></h4>
       </div>
     </div>
-    <div class="span4">
+    <div class="col-md-4">
       <div class="well">
         <h4><a href="tutorial-maps.html">Doing more with maps</a></h4>
       </div>