diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index b9b167f..b1c2d24 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -19,10 +19,10 @@
     </div>
 </div>
 
-<div class="hero-unit">
-    {escape(html|br)}
-    <p>{sql}</p>
-    {escapeend}
+<div class="row">
+    <div class="span10 offset1">
+        <p><pre><code>{sql}</code></pre></p>
+    </div>
 </div>
 
 <ul class="nav nav-pills">

diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index b9b167f..b1c2d24 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -19,10 +19,10 @@
     </div>
 </div>
 
-<div class="hero-unit">
-    {escape(html|br)}
-    <p>{sql}</p>
-    {escapeend}
+<div class="row">
+    <div class="span10 offset1">
+        <p><pre><code>{sql}</code></pre></p>
+    </div>
 </div>
 
 <ul class="nav nav-pills">
diff --git a/src/nl/astraeus/jdbc/web/page/QueryOverview.html b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
index 72e56ab..c10e0f4 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
@@ -40,9 +40,7 @@
         <td>{q.total}</td>
         <td>{q.formattedNano}</td>
         <td>{q.count}</td>
-        {escape(html|br)}
-        <td>{q.sql}</td>
-        {escapeend}
+        <td><pre><code>{q.sql}</code></pre></td>
     </tr>
     {eachend}
     </tbody>

diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index b9b167f..b1c2d24 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -19,10 +19,10 @@
     </div>
 </div>
 
-<div class="hero-unit">
-    {escape(html|br)}
-    <p>{sql}</p>
-    {escapeend}
+<div class="row">
+    <div class="span10 offset1">
+        <p><pre><code>{sql}</code></pre></p>
+    </div>
 </div>
 
 <ul class="nav nav-pills">
diff --git a/src/nl/astraeus/jdbc/web/page/QueryOverview.html b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
index 72e56ab..c10e0f4 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
@@ -40,9 +40,7 @@
         <td>{q.total}</td>
         <td>{q.formattedNano}</td>
         <td>{q.count}</td>
-        {escape(html|br)}
-        <td>{q.sql}</td>
-        {escapeend}
+        <td><pre><code>{q.sql}</code></pre></td>
     </tr>
     {eachend}
     </tbody>
diff --git a/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html b/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
index 5273c19..d2af61d 100644
--- a/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
+++ b/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
@@ -8,10 +8,10 @@
     </div>
 </div>
 
-<div class="hero-unit">
-    {escapehtml(html|br)}
-    <p>{sql}</p>
-    {escapeend}
+<div class="row">
+    <div class="span10 offset1">
+        <p><pre><code>{sql}</code></pre></p>
+    </div>
 </div>
 
 <table class="table table-condensed table-striped " id="overview">

diff --git a/src/nl/astraeus/jdbc/web/page/QueryDetail.html b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
index b9b167f..b1c2d24 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryDetail.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryDetail.html
@@ -19,10 +19,10 @@
     </div>
 </div>
 
-<div class="hero-unit">
-    {escape(html|br)}
-    <p>{sql}</p>
-    {escapeend}
+<div class="row">
+    <div class="span10 offset1">
+        <p><pre><code>{sql}</code></pre></p>
+    </div>
 </div>
 
 <ul class="nav nav-pills">
diff --git a/src/nl/astraeus/jdbc/web/page/QueryOverview.html b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
index 72e56ab..c10e0f4 100644
--- a/src/nl/astraeus/jdbc/web/page/QueryOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/QueryOverview.html
@@ -40,9 +40,7 @@
         <td>{q.total}</td>
         <td>{q.formattedNano}</td>
         <td>{q.count}</td>
-        {escape(html|br)}
-        <td>{q.sql}</td>
-        {escapeend}
+        <td><pre><code>{q.sql}</code></pre></td>
     </tr>
     {eachend}
     </tbody>
diff --git a/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html b/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
index 5273c19..d2af61d 100644
--- a/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
+++ b/src/nl/astraeus/jdbc/web/page/ShowStacktrace.html
@@ -8,10 +8,10 @@
     </div>
 </div>
 
-<div class="hero-unit">
-    {escapehtml(html|br)}
-    <p>{sql}</p>
-    {escapeend}
+<div class="row">
+    <div class="span10 offset1">
+        <p><pre><code>{sql}</code></pre></p>
+    </div>
 </div>
 
 <table class="table table-condensed table-striped " id="overview">
diff --git a/src/nl/astraeus/jdbc/web/page/TransactionOverview.html b/src/nl/astraeus/jdbc/web/page/TransactionOverview.html
index e9fdc81..2a23d2b 100644
--- a/src/nl/astraeus/jdbc/web/page/TransactionOverview.html
+++ b/src/nl/astraeus/jdbc/web/page/TransactionOverview.html
@@ -44,9 +44,7 @@
         <td>{t.totalTime}</td>
         <td>{t.avgTime}</td>
         <td>{t.count}</td>
-        {escape(html|br)}
-        <td>{t.sql}</td>
-        {escapeend}
+        <td><pre><code>{t.sql}</code></pre></td>
     </tr>
     {eachend}
     </tbody>