Fixed carousel esp. on mobile.

css/main.css

@@ -30,6 +30,11 @@
   border-radius: 3px;
 }
 
+.site .carousel-inner .item {
+  width: 80%;
+  margin: 0 auto;
+}
+
 .site h1 { font-size: 24px; }
 .site h2 { font-size: 20px; }
 
@@ -51,12 +56,8 @@
   color: white;
 }
 
-.site .banner table {
-  margin: 0 auto;
-}
-
-.site .banner table td {
-  padding-right: 50px;
+.site .banner .col-sm-4 {
+  text-align: center;
 }
 
 .site .carousel-control i {
@@ -76,9 +77,6 @@
   margin-right: 3em;
 }
 
-.footer .contact a {
-}
-
 .footer .rss {
   margin-top: 1.1em;
   margin-right: -.2em;

index.html

@@ -18,43 +18,43 @@ root: .
             <!-- Slides -->
             <div class="item active">
                 <div class="container">
-                    <table><tr>
-                        <td>
-                            <img class="pull-left" src="{{page.root}}/img/torque.png"></img>
-                        </td>
-                        <td>
+                    <div class="row">
+                        <div class="col-sm-4">
+                            <img src="{{page.root}}/img/torque.png"></img>
+                        </div>
+                        <div class="col-sm-8">
                             <h1 class="title">{{site.name}}</h1>
                             <p>The open-source game engine of the future.</p>
-                        </td>
-                    </tr></table>
+                        </div>
+                    </div>
                 </div>
             </div>
 
             <div class="item">
                 <div class="container">
-                    <table><tr>
-                        <td>
-                            <img class="pull-left" src="{{page.root}}/img/torque.png"></img>
-                        </td>
-                        <td>
+                    <div class="row">
+                        <div class="col-sm-4">
+                            <img src="{{page.root}}/img/torque.png"></img>
+                        </div>
+                        <div class="col-sm-8">
                             <h1 class="title">{{site.name}}</h1>
                             <p>The open-source game engine of the future.</p>
-                        </td>
-                    </tr></table>
+                        </div>
+                    </div>
                 </div>
             </div>
 
             <div class="item">
                 <div class="container">
-                    <table><tr>
-                        <td>
-                            <img class="pull-left" src="{{page.root}}/img/torque.png"></img>
-                        </td>
-                        <td>
+                    <div class="row">
+                        <div class="col-sm-4">
+                            <img src="{{page.root}}/img/torque.png"></img>
+                        </div>
+                        <div class="col-sm-8">
                             <h1 class="title">{{site.name}}</h1>
                             <p>The open-source game engine of the future.</p>
-                        </td>
-                    </tr></table>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>