diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/html.jsp
index e0c87f2..8d78051 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/html.jsp
@@ -30,10 +30,15 @@
     <title><%= title %></title>
     <sling:include resource="<%= resource %>" replaceSelectors="head"/>
   </head>
-  <body class="ui-slingshot-main">
+  <body>
     <sling:include resource="<%= resource %>" replaceSelectors="trail"/>
-    <h1><%= title %></h1>
-    <hr/>
+    <div class="jumbotron">
+      <div class="container">
+        <h1><%= title %></h1>
+        <p>Explore the world of bla....</p>
+      </div>
+    </div>
     <sling:include resource="<%= resource %>" replaceSelectors="itemlist"/>
+    <sling:include resource="<%= resource %>" replaceSelectors="bottom"/>
 </body>
 </html>
\ No newline at end of file
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/itemlist.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/itemlist.html.jsp
index ba23f26..018b3e1 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/itemlist.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/itemlist.html.jsp
@@ -22,17 +22,30 @@
                   org.apache.sling.sample.slingshot.SlingshotConstants" %><%
 %><%@taglib prefix="sling" uri="http://sling.apache.org/taglibs/sling/1.0" %><%
 %><sling:defineObjects/><%
-%><div class="metro ui-slingshot-content">
+%><div class="container">
  <%
+     boolean openedRow = false;
      int i = 0;
      final Iterator<Resource> fi = resource.listChildren();
      while ( fi.hasNext()) {
          final Resource current = fi.next();
          if ( current.isResourceType(SlingshotConstants.RESOURCETYPE_ITEM)) {
+             if ( !openedRow ) {
+                 openedRow = true;
+                 %><div class="row"><%
+             }
              %>
              <sling:include resource="<%= current %>" replaceSelectors="main"/>
              <%
+             i++;
+             if ( i % 3 == 0 ) {
+                 openedRow = false;
+                 %></div><%
+             }
          }
      } 
+     if ( openedRow ) {
+         %></div><%
+     }
   %>
 </div>
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/user.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/user.html.jsp
index a5d646f..299251f 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/user.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Category/user.html.jsp
@@ -31,12 +31,9 @@
     for(final Resource current : resource.getChildren()) {
         count++;
     }
-%><div class="tile double ui-slingshot-clickable" data-link="<%= request.getContextPath() %><%=resource.getPath()%>.html">
-    <div class="tile-content icon">
-        <i class="icon-pictures fg-blue"></i>
-    </div>
-    <div class="brand">
-        <span class="label fg-black"><%= ResponseUtil.escapeXml(itemTitle) %></span>
-        <span class="badge bg-orange"><%= count %></span>
-    </div>
+%>
+<div class="col-md-4">
+   <h2><%= ResponseUtil.escapeXml(itemTitle) %></h2>
+   <!--  <img class="img-responsive" style="padding-top: 5px" src="<%= request.getContextPath() %>"/>  -->
+   <p><a class="btn btn-default" href="<%= request.getContextPath() %><%=resource.getPath()%>.html" role="button">View details &raquo;</a> <span class="badge"><%= count %></span></p>
 </div>
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/bottom.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/bottom.html.jsp
new file mode 100644
index 0000000..b1a513d
--- /dev/null
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/bottom.html.jsp
@@ -0,0 +1,23 @@
+<%--
+    Licensed to the Apache Software Foundation (ASF) under one
+    or more contributor license agreements.  See the NOTICE file
+    distributed with this work for additional information
+    regarding copyright ownership.  The ASF licenses this file
+    to you under the Apache License, Version 2.0 (the
+    "License"); you may not use this file except in compliance
+    with the License.  You may obtain a copy of the License at
+    
+    http://www.apache.org/licenses/LICENSE-2.0
+    
+    Unless required by applicable law or agreed to in writing,
+    software distributed under the License is distributed on an
+    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+    KIND, either express or implied.  See the License for the
+    specific language governing permissions and limitations
+    under the License.
+--%><%@page session="false" %><%
+%><%@page import="org.apache.sling.sample.slingshot.SlingshotConstants" %><%
+%><script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/jquery-2.2.0.min.js"></script>
+<script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/bootstrap.min.js"></script>
+<script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/ie10-viewport-bug-workaround.js"></script>
+<script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/slingshot.js"></script>
\ No newline at end of file
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/head.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/head.html.jsp
index 34f4e6e..4f0c00e 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/head.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/head.html.jsp
@@ -17,15 +17,9 @@
     under the License.
 --%><%@page session="false" %><%
 %><%@page import="org.apache.sling.sample.slingshot.SlingshotConstants" %><%
-%><link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/jquery-ui.min.css" rel="stylesheet"/>
-  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/jquery-ui.structure.min.css" rel="stylesheet"/>
-  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/jquery-ui.theme.min.css" rel="stylesheet"/>
-  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/metro-bootstrap.min.css" rel="stylesheet"/>
-  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/jquery-breadcrumbs.css" rel="stylesheet"/>
-  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/iconFont.css" rel="stylesheet"/>
-  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/slingshot.css" rel="stylesheet"/>
-  <script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/jquery.js" type="text/javascript" ></script>
-  <script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/jquery-ui.min.js" type="text/javascript" ></script>
-  <script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/metro.min.js" type="text/javascript" ></script>
-  <script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/jquery-breadcrumbs.js" type="text/javascript" ></script>
-  <script src="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/js/slingshot.js"> type="text/javascript" </script>  
\ No newline at end of file
+%><meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/bootstrap.min.css" rel="stylesheet">
+  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
+  <link href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/resources/css/slingshot.css" rel="stylesheet">
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/trail.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/trail.html.jsp
index f36440d..7698c2d 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/trail.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Component/trail.html.jsp
@@ -26,9 +26,8 @@
                   org.apache.sling.api.request.ResponseUtil" %><%
 %><%@taglib prefix="sling" uri="http://sling.apache.org/taglibs/sling/1.0" %><%
 %><sling:defineObjects/><%
-%><ul id="breadcrumbs" data-home="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/public/<%= request.getRemoteUser() %>.html">
-  <li class="ui-slingshot-clickable" data-link="<%= request.getContextPath() %>/system/sling/logout.html?resource=<%= SlingshotConstants.APP_ROOT_PATH %>.html">Logout</li>
-  <%
+    final boolean isUser = request.getRemoteUser() != null && !request.getRemoteUser().equals("anonymous");
+
     final ValueMap attributes = resource.getValueMap();
     // let's create the trail
     final List<Object[]> parents = new ArrayList<Object[]>();
@@ -50,11 +49,38 @@
             }
         } while ( continueProcessing);
     }  
+%><nav class="navbar navbar-default navbar-fixed-top">
+      <div class="container">
+        <div class="navbar-header">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
+            <span class="sr-only">Toggle navigation</span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+          <a class="navbar-brand" href="#">Slingshot</a>
+        </div>
+        <div id="navbar" class="navbar-collapse collapse">
+          <ul class="nav navbar-nav"><%
     for(int k=parents.size()-1;k>=0;k--) {
       %>
-        <li class="ui-slingshot-clickable" data-link="<%= parents.get(k)[0] %>.html"><%= parents.get(k)[1] %></li>
+        <li><a href="<%= parents.get(k)[0] %>.html"><%= parents.get(k)[1] %></a></li>
       <%
     }
-  %>
-</ul>
-
+            %>
+          </ul>
+          <ul class="nav navbar-nav navbar-right">
+          <% if ( isUser ) {
+          %>
+            <li><a href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/users/<%= request.getRemoteUser() %>.html"><span class="glyphicon glyphicon-home" aria-hidden="true"></span></a></li>
+            <li><a href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/users/<%= request.getRemoteUser() %>.html"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a></li>
+            <li><a href="<%= request.getContextPath() %>/system/sling/logout.html?resource=<%= SlingshotConstants.APP_ROOT_PATH %>.html"><span class="glyphicon glyphicon-off" aria-hidden="true"></span></a></li>
+          <%
+          } else { %>
+          <li><a href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>.html"><span class="glyphicon glyphicon-log-in" aria-hidden="true"></span></a></li>
+          <%
+          } %>
+          </ul>
+        </div>
+      </div>
+    </nav>
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Content/itemlist.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Content/itemlist.html.jsp
index c844857..408a694 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Content/itemlist.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Content/itemlist.html.jsp
@@ -22,7 +22,7 @@
                   org.apache.sling.sample.slingshot.SlingshotConstants" %><%
 %><%@taglib prefix="sling" uri="http://sling.apache.org/taglibs/sling/1.0" %><%
 %><sling:defineObjects/><%
-%><div class="metro ui-slingshot-content">
+%><div class="container">
  <%
      int i = 0;
      final Iterator<Resource> fi = resource.listChildren();
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Home/html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Home/html.jsp
index 7d90e58..f9b21ae 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Home/html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Home/html.jsp
@@ -31,47 +31,41 @@
     <sling:include resource="<%= resource %>" replaceSelectors="head"/>
   </head>
 
-  <body class="ui-body-app">
+  <body class="login">
     <%
     if ( request.getRemoteUser() != null && !request.getRemoteUser().equals("anonymous") ) {
         %>
-<div class="ui-widget ui-form">
-    <div class="ui-widget-header">
-        <h1>Welcome to SlingShot</h1>
+    <div class="container">
+        <h1 class="bg-primary">Welcome to SlingShot</h1>
+        <p class="bg-primary">Welcome back, <%= request.getRemoteUser() %></p>
+        <p class="bg-warning"><a href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/users/<%= request.getRemoteUser() %>.html">Go to your SlingShot home page</a></p>
     </div>
-    <div class="ui-widget-content">
-       <p>Welcome back, <%= request.getRemoteUser() %></p>
-        <p><a href="<%= request.getContextPath() %><%= SlingshotConstants.APP_ROOT_PATH %>/users/<%= request.getRemoteUser() %>.html">Go to your SlingShot home page</a></p>
-    </div>
- </div>
         <%
     } else {
         %>
-<div class="ui-widget ui-form">
-    <div class="ui-widget-header">
-        <h1>Welcome to SlingShot</h1>
+    <div class="container">
+
+      <form class="form-signin" method="POST" action="<%= request.getContextPath() %><%= resource.getPath() %>.user.html" enctype="multipart/form-data" accept-charset="UTF-8">
+        <input type="hidden" name="_charset_" value="UTF-8" />
+        <input type="hidden" name="resource" value="<%= request.getContextPath() %><%= resource.getPath() %>.user.html" />
+        <p class="form-signin-heading bg-primary">Welcome to SlingShot</p>
+        <label for="j_username" class="sr-only" accesskey="u">Username</label>
+        <input type="text" id="j_username" class="form-control" placeholder="Username" required autofocus>
+        <label for="j_password" class="sr-only" accesskey="p">Password</label>
+        <input type="password" id="j_password" class="form-control" placeholder="Password" required>
+        <p>
+        <button class="btn btn-lg btn-success btn-block" type="submit">Go</button>
+        </p>
+        <p>
+        <button class="btn btn-primary btn-block form-button-new" type="button">New Account</button>
+        <button class="btn btn-info btn-block form-button-help" type="button">Help Me</button>
+        </p>
+      </form>
+
     </div>
-    <div class="ui-widget-content">
-        <form class="ui-form-form" method="POST" action="<%= request.getContextPath() %><%= resource.getPath() %>.user.html" enctype="multipart/form-data" accept-charset="UTF-8">
-          <input type="hidden" name="_charset_" value="UTF-8" />
-          <input type="hidden" name="resource" value="<%= request.getContextPath() %><%= resource.getPath() %>.user.html" />
-          <span class="ui-form-label">
-              <label for="j_username" accesskey="u">Username</label>
-          </span>
-          <input id="j_username" name="j_username" type="text" class="ui-form-field">
-    
-          <span class="ui-form-label">
-              <label for="j_password" accesskey="p">Password</label>
-          </span>
-          <input id="j_password" name="j_password" type="password" class="ui-form-field">
-          <button accesskey="l" class="ui-button ui-form-button ui-form-button-login" type="submit">Go</button>
-          <button accesskey="n" class="ui-button ui-form-button ui-form-button-new" type="button">New Account</button>
-          <button accesskey="n" class="ui-button ui-form-button ui-form-button-help" type="button">Help Me</button>
-        </form>
-    </div>
- </div>
         <%
     }
     %>
 </body>
+    <sling:include resource="<%= resource %>" replaceSelectors="bottom"/>
 </html>
\ No newline at end of file
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/comments.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/comments.html.jsp
index ae6ad8b..74787d6 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/comments.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/comments.html.jsp
@@ -44,12 +44,14 @@
     if ( slingRequest.getAuthType() != null ) {
         %>
         <hr/><p>Leave a comment...</p>
-        <form method="POST" action="<%= request.getContextPath() %><%=resource.getName() %>.comments">
-        <input type="hidden" name=":redirect" value="<%= request.getContextPath() %><%=resource.getPath() %>.html"/>
-        <p>Title: <input name="<%= CommentsUtil.PROPERTY_TITLE %>"/></p>
-        <p>Text: <input name="<%= CommentsUtil.PROPERTY_TEXT %>"/></p>
-        <button class="ui-button ui-form-button" type="submit">Add</button>
-      </form>
+<form class="navbar-form navbar-left" role="comment" method="POST" action="<%= request.getContextPath() %><%=resource.getName() %>.comments">
+  <input type="hidden" name=":redirect" value="<%= request.getContextPath() %><%=resource.getPath() %>.html"/>
+  <div class="form-group">
+    <input type="text" class="form-control" placeholder="Title" name="<%= CommentsUtil.PROPERTY_TITLE %>"/>
+    <input type="text" class="form-control" placeholder="Text" name="<%= CommentsUtil.PROPERTY_TEXT %>"/>
+  </div>
+  <button type="submit" class="ui-button ui-form-button">Add</button>
+</form>
       <%
     }
 %>
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/html.jsp
index bfd329a..470a5f5 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/html.jsp
@@ -44,13 +44,21 @@
     <title><%= title %></title>
     <sling:include resource="<%= resource %>" replaceSelectors="head"/>
   </head>
-  <body class="ui-slingshot-main">
+  <body>
     <sling:include resource="<%= resource %>" replaceSelectors="trail"/>
-    <h1><%= title %></h1>
-    <div style="width:100%; display:block; float:left;">
-      <div style="width:70%; float:left; display:block;">
-        <img src="<%= request.getContextPath() %><%= imagePath %>"/>
+    <div class="jumbotron">
+      <div class="container">
+        <h1><%= title %></h1>
+        <p>Explore the world of bla....</p>
       </div>
+    </div>
+    <div class="container">
+    <ul class="nav nav-tabs">
+      <li role="presentation" class="active"><a href="#">Home</a></li>
+      <li role="presentation"><a href="#">Comments</a></li>
+      <li role="presentation"><a href="#">Edit</a></li>
+    </ul>
+        <img class="img-responsive center-block" src="<%= request.getContextPath() %><%= imagePath %>"/>
       <div style="width:30%; float:left; padding:15px; display:block;">
         <p><%=ResponseUtil.escapeXml(attributes.get(SlingshotConstants.PROPERTY_DESCRIPTION, ""))%></p>
         <% if ( attributes.get(SlingshotConstants.PROPERTY_LOCATION) != null ) { %>
@@ -94,8 +102,9 @@
                     </script>
         </div>
       </div>
-    </div>
     <hr/>
     <sling:include resource="<%= resource %>" replaceSelectors="comments"/>
+    </div>
+    <sling:include resource="<%= resource %>" replaceSelectors="bottom"/>
   </body>
 </html>
\ No newline at end of file
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/main.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/main.html.jsp
index 064b9b2..20a793b 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/main.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/Item/main.html.jsp
@@ -26,27 +26,21 @@
 %><%@taglib prefix="sling" uri="http://sling.apache.org/taglibs/sling/1.0" %><%
 %><sling:defineObjects/><%
 %><%
-    final RatingsService ratingsService = sling.getService(RatingsService.class);
     final ValueMap attr = resource.getValueMap();
     final String itemTitle = attr.get(SlingshotConstants.PROPERTY_TITLE, resource.getName());
     
     String imagePath = null;
-    int count = 0;
     final Resource imagesResource = resource.getResourceResolver().getResource(resource, "images");
     if ( imagesResource != null ) {
         for(final Resource imgResource : imagesResource.getChildren()) {
             if ( imagePath == null ) {
                 imagePath = imgResource.getPath();
+                break;
             }
-            count++;
         }
     }
-%><div class="tile double ui-slingshot-clickable" data-link="<%= request.getContextPath() %><%=resource.getPath()%>.html">
-    <div class="tile-content image">
-        <img src="<%= request.getContextPath() %><%=imagePath%>"/>
-    </div>
-    <div class="brand">
-        <span class="label fg-white"><%= ResponseUtil.escapeXml(itemTitle) %></span>
-        <span class="badge bg-orange"><%= ratingsService.getRating(resource) %></span>
-    </div>
-</div>
+%><div class="col-md-4">
+          <h2><%= ResponseUtil.escapeXml(itemTitle) %></h2>
+          <img class="img-responsive" style="padding-top: 5px" src="<%= request.getContextPath() %><%=imagePath%>"/>
+          <p><a class="btn btn-default" href="<%= request.getContextPath() %><%=resource.getPath()%>.html" role="button">View details &raquo;</a></p>
+        </div>
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/html.jsp
index 0cd2fc4..59825d9 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/html.jsp
@@ -30,12 +30,16 @@
     <title><%= title %></title>
     <sling:include resource="<%= resource %>" replaceSelectors="head"/>
   </head>
-  <body class="ui-slingshot-main">
-  <div>
+  <body>
     <sling:include resource="<%= resource %>" replaceSelectors="trail"/>
-    <h1><%= title %></h1>
-    <hr/>
-    <sling:include resource="<%= resource.getChild("content") %>" replaceSelectors="itemlist"/>
-  </div>
+    <!-- Main jumbotron for a primary marketing message or call to action -->
+    <div class="jumbotron">
+      <div class="container">
+        <h1><%= title %></h1>
+        <p>Explore the world of bla....</p>
+      </div>
+    </div>
+    <sling:include resource="<%= resource %>" replaceSelectors="itemlist"/>
+    <sling:include resource="<%= resource %>" replaceSelectors="bottom"/>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/itemlist.html.jsp b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/itemlist.html.jsp
index c844857..408a694 100644
--- a/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/itemlist.html.jsp
+++ b/slingshot/src/main/resources/SLING-INF/content/libs/slingshot/User/itemlist.html.jsp
@@ -22,7 +22,7 @@
                   org.apache.sling.sample.slingshot.SlingshotConstants" %><%
 %><%@taglib prefix="sling" uri="http://sling.apache.org/taglibs/sling/1.0" %><%
 %><sling:defineObjects/><%
-%><div class="metro ui-slingshot-content">
+%><div class="container">
  <%
      int i = 0;
      final Iterator<Resource> fi = resource.listChildren();