diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index 9c1f7d5..1fe0ba7 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -1,36 +1,51 @@
 <div class="page-header">
-    <h3>Query overview</h3>
+    <h3>Query detail</h3>
 </div>
 
 <div class="row">
-    <div class="span1 ">
+    <div class="col-md-1 ">
         <a href="/queries" class="btn btn-primary">Back</a>
     </div>
-    <div class="span1 offset10">
+    <div class="col-md-1 col-md-offset-10">
         <a href="/query/${hash}" class="btn btn-primary">Refresh</a>
     </div>
 </div>
 
-<div class="row">
-    <div class="span6">
-        <div># Queries: ${count}</div>
-        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
-        <div>Avg. time/query: ${avgTime}</div>
+<div class="row" style="margin-top: 15px;">
+    <div class="col-md-6">
+        <table >
+            <tr>
+                <th style="padding: 2px"># Queries:</th>
+                <td style="padding: 2px">${count}</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Time span:</th>
+                <td style="padding: 2px">${deltaTime} (${fromTime} - ${toTime})</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Avg. time/query:</th>
+                <td style="padding: 2px">${avgTime}</td>
+            </tr>
+        </table>
     </div>
 </div>
 
+<hr/>
+
 <div class="row">
-    <div class="span10 offset1">
+    <div class="col-md-10 col-md-offset-1">
         <p><pre><code class="sql">${if(sql)}${!sql}${/if}</code></pre></p>
     </div>
 </div>
 
+<hr/>
+
 <ul class="nav nav-pills">
     <li ${if(sortTime)}class="active"${/if}><a onclick="return Sjs.submit('sortTime')">Timestamp</a></li>
     <li ${if(sortAvgTime)}class="active"${/if}><a onclick="return Sjs.submit('sortAvgTime')">Avg. query time</a></li>
 </ul>
 
-<table class="table table-condensed table-striped " id="overview">
+<table class="table table-condensed table-striped " id="overview" style="margin-top: 15px;">
     <thead>
     <tr>
         <th></th>
@@ -43,7 +58,7 @@
     <tbody>
     ${each(queries as q)}
     <tr>
-        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><i class=" icon-zoom-in"></i></a>${/if}</td>
+        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><span class="glyphicon glyphicon-zoom-in"></span></a>${/if}</td>
         <td>${q.formattedTimestamp}</td>
         <td>${q.threadId}</td>
         <td>${q.type.description}</td>

diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index 9c1f7d5..1fe0ba7 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -1,36 +1,51 @@
 <div class="page-header">
-    <h3>Query overview</h3>
+    <h3>Query detail</h3>
 </div>
 
 <div class="row">
-    <div class="span1 ">
+    <div class="col-md-1 ">
         <a href="/queries" class="btn btn-primary">Back</a>
     </div>
-    <div class="span1 offset10">
+    <div class="col-md-1 col-md-offset-10">
         <a href="/query/${hash}" class="btn btn-primary">Refresh</a>
     </div>
 </div>
 
-<div class="row">
-    <div class="span6">
-        <div># Queries: ${count}</div>
-        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
-        <div>Avg. time/query: ${avgTime}</div>
+<div class="row" style="margin-top: 15px;">
+    <div class="col-md-6">
+        <table >
+            <tr>
+                <th style="padding: 2px"># Queries:</th>
+                <td style="padding: 2px">${count}</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Time span:</th>
+                <td style="padding: 2px">${deltaTime} (${fromTime} - ${toTime})</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Avg. time/query:</th>
+                <td style="padding: 2px">${avgTime}</td>
+            </tr>
+        </table>
     </div>
 </div>
 
+<hr/>
+
 <div class="row">
-    <div class="span10 offset1">
+    <div class="col-md-10 col-md-offset-1">
         <p><pre><code class="sql">${if(sql)}${!sql}${/if}</code></pre></p>
     </div>
 </div>
 
+<hr/>
+
 <ul class="nav nav-pills">
     <li ${if(sortTime)}class="active"${/if}><a onclick="return Sjs.submit('sortTime')">Timestamp</a></li>
     <li ${if(sortAvgTime)}class="active"${/if}><a onclick="return Sjs.submit('sortAvgTime')">Avg. query time</a></li>
 </ul>
 
-<table class="table table-condensed table-striped " id="overview">
+<table class="table table-condensed table-striped " id="overview" style="margin-top: 15px;">
     <thead>
     <tr>
         <th></th>
@@ -43,7 +58,7 @@
     <tbody>
     ${each(queries as q)}
     <tr>
-        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><i class=" icon-zoom-in"></i></a>${/if}</td>
+        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><span class="glyphicon glyphicon-zoom-in"></span></a>${/if}</td>
         <td>${q.formattedTimestamp}</td>
         <td>${q.threadId}</td>
         <td>${q.type.description}</td>
diff --git a/src/nl/astraeus/jdbc/web/page/QueryOverview.html b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
index ff6fd2f..b578f2c 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
@@ -4,11 +4,22 @@
 <form method="post">
 <div class="row">
     <div class="col-md-6">
-
-        <div># Queries: ${count}</div>
-        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
-        <div>Avg. time/query: ${avgTime}</div>
+        <table >
+            <tr>
+                <th style="padding: 2px"># Queries:</th>
+                <td style="padding: 2px">${count}</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Time span:</th>
+                <td style="padding: 2px">${deltaTime} (${fromTime} - ${toTime})</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Avg. time/query:</th>
+                <td style="padding: 2px">${avgTime}</td>
+            </tr>
+        </table>
     </div>
+
     <div class="col-md-6 pull-right">
         <input type="submit" name="action" value="Clear queries" class="btn btn-danger" />
     </div>
@@ -44,7 +55,7 @@
     <tbody>
     ${each(queries as q)}
     <tr>
-        <td><a href="/query/${q.hash}"><i class=" icon-zoom-in"></i></a></td>
+        <td><a href="/query/${q.hash}"><span class="glyphicon glyphicon-zoom-in"></span></a></td>
         ${if(sortLast100)}
         <td>${q.formattedTimestamp}</td>
         <td>${q.formattedNano}</td>

diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index 9c1f7d5..1fe0ba7 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -1,36 +1,51 @@
 <div class="page-header">
-    <h3>Query overview</h3>
+    <h3>Query detail</h3>
 </div>
 
 <div class="row">
-    <div class="span1 ">
+    <div class="col-md-1 ">
         <a href="/queries" class="btn btn-primary">Back</a>
     </div>
-    <div class="span1 offset10">
+    <div class="col-md-1 col-md-offset-10">
         <a href="/query/${hash}" class="btn btn-primary">Refresh</a>
     </div>
 </div>
 
-<div class="row">
-    <div class="span6">
-        <div># Queries: ${count}</div>
-        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
-        <div>Avg. time/query: ${avgTime}</div>
+<div class="row" style="margin-top: 15px;">
+    <div class="col-md-6">
+        <table >
+            <tr>
+                <th style="padding: 2px"># Queries:</th>
+                <td style="padding: 2px">${count}</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Time span:</th>
+                <td style="padding: 2px">${deltaTime} (${fromTime} - ${toTime})</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Avg. time/query:</th>
+                <td style="padding: 2px">${avgTime}</td>
+            </tr>
+        </table>
     </div>
 </div>
 
+<hr/>
+
 <div class="row">
-    <div class="span10 offset1">
+    <div class="col-md-10 col-md-offset-1">
         <p><pre><code class="sql">${if(sql)}${!sql}${/if}</code></pre></p>
     </div>
 </div>
 
+<hr/>
+
 <ul class="nav nav-pills">
     <li ${if(sortTime)}class="active"${/if}><a onclick="return Sjs.submit('sortTime')">Timestamp</a></li>
     <li ${if(sortAvgTime)}class="active"${/if}><a onclick="return Sjs.submit('sortAvgTime')">Avg. query time</a></li>
 </ul>
 
-<table class="table table-condensed table-striped " id="overview">
+<table class="table table-condensed table-striped " id="overview" style="margin-top: 15px;">
     <thead>
     <tr>
         <th></th>
@@ -43,7 +58,7 @@
     <tbody>
     ${each(queries as q)}
     <tr>
-        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><i class=" icon-zoom-in"></i></a>${/if}</td>
+        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><span class="glyphicon glyphicon-zoom-in"></span></a>${/if}</td>
         <td>${q.formattedTimestamp}</td>
         <td>${q.threadId}</td>
         <td>${q.type.description}</td>
diff --git a/src/nl/astraeus/jdbc/web/page/QueryOverview.html b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
index ff6fd2f..b578f2c 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
@@ -4,11 +4,22 @@
 <form method="post">
 <div class="row">
     <div class="col-md-6">
-
-        <div># Queries: ${count}</div>
-        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
-        <div>Avg. time/query: ${avgTime}</div>
+        <table >
+            <tr>
+                <th style="padding: 2px"># Queries:</th>
+                <td style="padding: 2px">${count}</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Time span:</th>
+                <td style="padding: 2px">${deltaTime} (${fromTime} - ${toTime})</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Avg. time/query:</th>
+                <td style="padding: 2px">${avgTime}</td>
+            </tr>
+        </table>
     </div>
+
     <div class="col-md-6 pull-right">
         <input type="submit" name="action" value="Clear queries" class="btn btn-danger" />
     </div>
@@ -44,7 +55,7 @@
     <tbody>
     ${each(queries as q)}
     <tr>
-        <td><a href="/query/${q.hash}"><i class=" icon-zoom-in"></i></a></td>
+        <td><a href="/query/${q.hash}"><span class="glyphicon glyphicon-zoom-in"></span></a></td>
         ${if(sortLast100)}
         <td>${q.formattedTimestamp}</td>
         <td>${q.formattedNano}</td>
diff --git a/src/nl/astraeus/jdbc/web/page/SettingsOverview.html b/src/nl/astraeus/jdbc/web/page/SettingsOverview.html
index 24fe7e6..c39a8ce 100644
--- a/src/nl/astraeus/jdbc/web/page/SettingsOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/SettingsOverview.html
@@ -44,22 +44,20 @@
       <input class="form-control" type="text" id="pstart" name="packageStart" value="${packageStart}">
     </div>
 
-    <div class="control-group">
+    <button type="submit" class="btn btn-primary" style="margin-top: 15px;">Save</button>
+
+    <div class="control-group" style="margin-top: 15px;">
       <label>Jdbc url example:</label>
       <div class="controls" id="settings">
         ${jdbcUrl}
       </div>
     </div>
 
-    <button type="submit" class="btn btn-primary">Save</button>
-  </form>
+    <div class="form-group">
+      <span class="label label-info">1</span> These settings won't take effect until after a restart, add them to your
+      jdbc url.
+    </div>
 
-  <div class="row">
-    &nbsp;
-  </div>
-  <div class="row">
-    <span class="label label-info">1</span> These settings won't take effect until after a restart, add them to your
-    jdbc url.
-  </div>
+  </form>
 </div>
 

diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index 9c1f7d5..1fe0ba7 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -1,36 +1,51 @@
 <div class="page-header">
-    <h3>Query overview</h3>
+    <h3>Query detail</h3>
 </div>
 
 <div class="row">
-    <div class="span1 ">
+    <div class="col-md-1 ">
         <a href="/queries" class="btn btn-primary">Back</a>
     </div>
-    <div class="span1 offset10">
+    <div class="col-md-1 col-md-offset-10">
         <a href="/query/${hash}" class="btn btn-primary">Refresh</a>
     </div>
 </div>
 
-<div class="row">
-    <div class="span6">
-        <div># Queries: ${count}</div>
-        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
-        <div>Avg. time/query: ${avgTime}</div>
+<div class="row" style="margin-top: 15px;">
+    <div class="col-md-6">
+        <table >
+            <tr>
+                <th style="padding: 2px"># Queries:</th>
+                <td style="padding: 2px">${count}</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Time span:</th>
+                <td style="padding: 2px">${deltaTime} (${fromTime} - ${toTime})</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Avg. time/query:</th>
+                <td style="padding: 2px">${avgTime}</td>
+            </tr>
+        </table>
     </div>
 </div>
 
+<hr/>
+
 <div class="row">
-    <div class="span10 offset1">
+    <div class="col-md-10 col-md-offset-1">
         <p><pre><code class="sql">${if(sql)}${!sql}${/if}</code></pre></p>
     </div>
 </div>
 
+<hr/>
+
 <ul class="nav nav-pills">
     <li ${if(sortTime)}class="active"${/if}><a onclick="return Sjs.submit('sortTime')">Timestamp</a></li>
     <li ${if(sortAvgTime)}class="active"${/if}><a onclick="return Sjs.submit('sortAvgTime')">Avg. query time</a></li>
 </ul>
 
-<table class="table table-condensed table-striped " id="overview">
+<table class="table table-condensed table-striped " id="overview" style="margin-top: 15px;">
     <thead>
     <tr>
         <th></th>
@@ -43,7 +58,7 @@
     <tbody>
     ${each(queries as q)}
     <tr>
-        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><i class=" icon-zoom-in"></i></a>${/if}</td>
+        <td>${if(q.stackTrace)}<a href="/stacktrace/${hash}/${q.timestamp}"><span class="glyphicon glyphicon-zoom-in"></span></a>${/if}</td>
         <td>${q.formattedTimestamp}</td>
         <td>${q.threadId}</td>
         <td>${q.type.description}</td>
diff --git a/src/nl/astraeus/jdbc/web/page/QueryOverview.html b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
index ff6fd2f..b578f2c 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
@@ -4,11 +4,22 @@
 <form method="post">
 <div class="row">
     <div class="col-md-6">
-
-        <div># Queries: ${count}</div>
-        <div>Time span: ${deltaTime} (${fromTime} - ${toTime})</div>
-        <div>Avg. time/query: ${avgTime}</div>
+        <table >
+            <tr>
+                <th style="padding: 2px"># Queries:</th>
+                <td style="padding: 2px">${count}</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Time span:</th>
+                <td style="padding: 2px">${deltaTime} (${fromTime} - ${toTime})</td>
+            </tr>
+            <tr>
+                <th style="padding: 2px">Avg. time/query:</th>
+                <td style="padding: 2px">${avgTime}</td>
+            </tr>
+        </table>
     </div>
+
     <div class="col-md-6 pull-right">
         <input type="submit" name="action" value="Clear queries" class="btn btn-danger" />
     </div>
@@ -44,7 +55,7 @@
     <tbody>
     ${each(queries as q)}
     <tr>
-        <td><a href="/query/${q.hash}"><i class=" icon-zoom-in"></i></a></td>
+        <td><a href="/query/${q.hash}"><span class="glyphicon glyphicon-zoom-in"></span></a></td>
         ${if(sortLast100)}
         <td>${q.formattedTimestamp}</td>
         <td>${q.formattedNano}</td>
diff --git a/src/nl/astraeus/jdbc/web/page/SettingsOverview.html b/src/nl/astraeus/jdbc/web/page/SettingsOverview.html
index 24fe7e6..c39a8ce 100644
--- a/src/nl/astraeus/jdbc/web/page/SettingsOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/SettingsOverview.html
@@ -44,22 +44,20 @@
       <input class="form-control" type="text" id="pstart" name="packageStart" value="${packageStart}">
     </div>
 
-    <div class="control-group">
+    <button type="submit" class="btn btn-primary" style="margin-top: 15px;">Save</button>
+
+    <div class="control-group" style="margin-top: 15px;">
       <label>Jdbc url example:</label>
       <div class="controls" id="settings">
         ${jdbcUrl}
       </div>
     </div>
 
-    <button type="submit" class="btn btn-primary">Save</button>
-  </form>
+    <div class="form-group">
+      <span class="label label-info">1</span> These settings won't take effect until after a restart, add them to your
+      jdbc url.
+    </div>
 
-  <div class="row">
-    &nbsp;
-  </div>
-  <div class="row">
-    <span class="label label-info">1</span> These settings won't take effect until after a restart, add them to your
-    jdbc url.
-  </div>
+  </form>
 </div>
 
diff --git a/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html b/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
index 984ebbb..37f639f 100644
--- a/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
+++ b/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
@@ -3,17 +3,21 @@
 </div>
 
 <div class="row">
-    <div class="span1 ">
+    <div class="col-md-1 ">
         <a href="/query/${hash}" class="btn btn-primary">Back</a>
     </div>
 </div>
 
+<hr/>
+
 <div class="row">
-    <div class="span10 offset1">
+    <div class="col-md-10 col-md-offset-1">
         <p><pre><code class="sql">${!sql}</code></pre></p>
     </div>
 </div>
 
+<hr/>
+
 <table class="table table-condensed table-striped " id="overview">
     <thead>
     <tr>