Use the latest Bootstrap

examples/resources/layout.css

@@ -1,15 +1,59 @@
 @import url(http://fonts.googleapis.com/css?family=Quattrocento+Sans:400,400italic,700);
 
 body {
-  padding-top: 60px;
+  font-family: 'Quattrocento Sans', sans-serif;
+  font-size: 16px;
 }
+.navbar {
+  background-color: #1F6B75;
+  color: white;
+  border: 0;
+  border-radius: 0;
+}
+.navbar-brand {
+  color: white;
+  font-weight: bold;
+  font-size: 160%;
+  padding: 8px 0;
+}
+.navbar-brand:hover,
+.navbar-brand:focus {
+  color: #aae1e9;
+}
+.navbar-brand img {
+  height: 35px;
+  vertical-align: middle;
+  margin-right: 5px;
+  display: inline-block;
+}
+
+ul.inline,
+ol.inline {
+  margin-left: 0;
+  padding-left: 0;
+  list-style: none;
+}
+
+ul.inline>li,
+ol.inline>li {
+  display: inline-block;
+  padding-left: 5px;
+  padding-right: 5px;
+}
+
 .map {
   height: 400px;
   width: 100%;
   background: url(map-background.jpg) repeat;
+  margin-bottom: 10px;
 }
-.ol-attribution {
+.ol-attribution.ol-logo-only,
+.ol-attribution.ol-uncollapsible {
   max-width: calc(100% - 3em);
+  height: 1.5em;
+}
+.ol-attribution ul {
+  font-size: 1rem;
 }
 .ol-control button, .ol-attribution, .ol-scale-line-inner {
   font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
@@ -21,18 +65,3 @@ body {
 #api-links ul {
   display: inline;
 }
-
-body, h1, h2, h3, h4, p, li, td, th {
-  font-family: Quattrocento Sans;
-}
-.navbar-inverse .navbar-inner {
-  background: #1F6B75;
-}
-.navbar-inverse .brand {
-  color: white;
-  padding: 5px;
-}
-.brand img {
-  width: 35px;
-  height: 35px;
-}