doc: support the new website layout

4 files changed, 1261 insertions, 279 deletions

diff --git a/doc/doxy/doxy_stylesheet.css b/doc/doxy/doxy_stylesheet.css
index ff1e2147d3..63238a2d5c 100644
--- a/doc/doxy/doxy_stylesheet.css
+++ b/doc/doxy/doxy_stylesheet.css
@@ -1,31 +1,1137 @@
-/* The standard CSS for doxygen */
+/*!
+ * Bootstrap v2.1.1
+ *
+ * Copyright 2012 Twitter, Inc
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Designed and built with all the love in the world @twitter by @mdo and @fat.
+ */
+
+html {
+  font-size: 100%;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+}
+a:focus {
+  outline: thin dotted #333;
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+a:hover,
+a:current {
+  outline: 0;
+}
+img {
+  /* Responsive images (ensure images don't scale beyond their parents) */
 
-/* @group Heading Levels */
+  max-width: 100%;
+  /* Part 1: Set a maxium relative to the parent */
+
+  width: auto\9;
+  /* IE7-8 need help adjusting responsive images */
+
+  height: auto;
+  /* Part 2: Scale the height according to the width, otherwise you get stretching */
+
+  vertical-align: middle;
+  border: 0;
+  -ms-interpolation-mode: bicubic;
+}
+body {
+  margin: 0;
+  font-family: sans-serif;
+  font-size: 14px;
+  line-height: 20px;
+  color: #333333;
+  background-color: #ffffff;
+}
+a {
+  color: #0088cc;
+  text-decoration: none;
+}
+a:hover {
+  color: #005580;
+  text-decoration: underline;
+}
+.container {
+  width: 940px;
+}
 
+.container {
+  margin-right: auto;
+  margin-left: auto;
+  *zoom: 1;
+}
 
+.container:before,
+.container:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+.container:after {
+  clear: both;
+}
+.container-fluid {
+  padding-right: 20px;
+  padding-left: 20px;
+  *zoom: 1;
+}
+small {
+  font-size: 85%;
+}
+strong {
+  font-weight: bold;
+}
+em {
+  font-style: italic;
+}
+cite {
+  font-style: normal;
+}
+.text-warning {
+  color: #c09853;
+}
+.text-error {
+  color: #b94a48;
+}
+.text-info {
+  color: #3a87ad;
+}
+.text-success {
+  color: #468847;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin: 10px 0;
+  font-family: inherit;
+  font-weight: bold;
+  line-height: 1;
+  color: inherit;
+  text-rendering: optimizelegibility;
+}
+h1 small,
+h2 small,
+h3 small,
+h4 small,
+h5 small,
+h6 small {
+  font-weight: normal;
+  line-height: 1;
+  color: #999999;
+}
 h1 {
-    font-size: 150%;
+  font-size: 30px;
+  line-height: 40px;
+}
+h2 {
+  font-size: 20px;
+  line-height: 40px;
+}
+h3 {
+  font-size: 18px;
+  line-height: 40px;
+}
+h4 {
+  font-size: 18px;
+  line-height: 20px;
+}
+h5 {
+  font-size: 14px;
+  line-height: 20px;
+}
+h6 {
+  font-size: 12px;
+  line-height: 20px;
+}
+ul,
+ol {
+  padding: 0;
+  margin: 0 0 10px 25px;
+}
+ul ul,
+ul ol,
+ol ol,
+ol ul {
+  margin-bottom: 0;
+}
+li {
+  line-height: 20px;
+}
+ul.unstyled,
+ol.unstyled {
+  margin-left: 0;
+  list-style: none;
+}
+dl {
+  margin-bottom: 20px;
+}
+dt,
+dd {
+  line-height: 20px;
+}
+dt {
+  font-weight: bold;
+}
+dd {
+  margin-left: 10px;
+}
+blockquote {
+  padding: 0 0 0 15px;
+  margin: 0 0 20px;
+  border-left: 5px solid #eeeeee;
+}
+blockquote p {
+  margin-bottom: 0;
+  font-size: 16px;
+  font-weight: 300;
+  line-height: 25px;
+}
+blockquote:before,
+blockquote:after {
+  content: "";
+}
+.fragment,
+code,
+pre {
+  padding: 0 3px 2px;
+  font-family: monospace;
+  font-size: 12px;
+  color: #333333;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px;
+}
+.fragment,
+code {
+  padding: 2px 4px;
+  color: #d14;
+  background-color: #f7f7f9;
+  border: 1px solid #e1e1e8;
+}
+pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  font-size: 13px;
+  line-height: 20px;
+  word-break: break-all;
+  word-wrap: break-word;
+  white-space: pre;
+  white-space: pre-wrap;
+  background-color: #f5f5f5;
+  border: 1px solid #ccc;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+}
+pre code {
+  padding: 0;
+  color: inherit;
+  background-color: transparent;
+  border: 0;
+}
+.label,
+.badge {
+  font-size: 11.844px;
+  font-weight: bold;
+  line-height: 14px;
+  color: #ffffff;
+  vertical-align: baseline;
+  white-space: nowrap;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+  background-color: #999999;
+}
+.label {
+  padding: 1px 4px 2px;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  border-radius: 3px;
+}
+.badge {
+  padding: 1px 9px 2px;
+  -webkit-border-radius: 9px;
+  -moz-border-radius: 9px;
+  border-radius: 9px;
+}
+a.label:hover,
+a.badge:hover {
+  color: #ffffff;
+  text-decoration: none;
+  cursor: pointer;
+}
+.label-important,
+.badge-important {
+  background-color: #b94a48;
+}
+.label-important[href],
+.badge-important[href] {
+  background-color: #953b39;
+}
+.label-warning,
+.badge-warning {
+  background-color: #f89406;
+}
+.label-warning[href],
+.badge-warning[href] {
+  background-color: #c67605;
+}
+.label-success,
+.badge-success {
+  background-color: #468847;
+}
+.label-success[href],
+.badge-success[href] {
+  background-color: #356635;
+}
+.label-info,
+.badge-info {
+  background-color: #3a87ad;
+}
+.label-info[href],
+.badge-info[href] {
+  background-color: #2d6987;
+}
+.label-inverse,
+.badge-inverse {
+  background-color: #333333;
+}
+.label-inverse[href],
+.badge-inverse[href] {
+  background-color: #1a1a1a;
+}
+table {
+  max-width: 100%;
+  background-color: transparent;
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+table [class*=span],
+.row-fluid table [class*=span] {
+  display: table-cell;
+  float: none;
+  margin-left: 0;
+}
+fieldset {
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+legend {
+  display: block;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 20px;
+  font-size: 21px;
+  line-height: 40px;
+  color: #333333;
+  border: 0;
+  border-bottom: 1px solid #e5e5e5;
+}
+legend small {
+  font-size: 15px;
+  color: #999999;
+}
+label,
+input,
+button,
+select,
+textarea {
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 20px;
+}
+input,
+button,
+select,
+textarea {
+  font-family: sans-serif;
+}
+label {
+  display: block;
+  margin-bottom: 5px;
+}
+
+.tablist {
+  margin-left: 0;
+  margin-bottom: 20px;
+  list-style: none;
+}
+.tablist > li > a {
+  display: block;
+}
+.tablist > li > a:hover {
+  text-decoration: none;
+  background-color: #eeeeee;
+}
+.tablist > .pull-right {
+  float: right;
+}
+.tablist-header {
+  display: block;
+  padding: 3px 15px;
+  font-size: 11px;
+  font-weight: bold;
+  line-height: 20px;
+  color: #999999;
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+  text-transform: uppercase;
+}
+.tablist li + .tablist-header {
+  margin-top: 9px;
+}
+.tablist-list {
+  padding-left: 15px;
+  padding-right: 15px;
+  margin-bottom: 0;
+}
+.tablist-list > li > a,
+.tablist-list .tablist-header {
+  margin-left: -15px;
+  margin-right: -15px;
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+}
+.tablist-list > li > a {
+  padding: 3px 15px;
+}
+.tablist-list > .current > a,
+.tablist-list > .current > a:hover {
+  color: #ffffff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
+  background-color: #0088cc;
+}
+.tablist-list [class^="icon-"] {
+  margin-right: 2px;
+}
+.tablist-list .divider {
+  *width: 100%;
+  height: 1px;
+  margin: 9px 1px;
+  *margin: -5px 0 5px;
+  overflow: hidden;
+  background-color: #e5e5e5;
+  border-bottom: 1px solid #ffffff;
+}
+.tablist-tabs,
+.tablist {
+  *zoom: 1;
+}
+.tablist-tabs:before,
+.tablist:before,
+.tablist-tabs:after,
+.tablist:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+.tablist-tabs:after,
+.tablist:after {
+  clear: both;
+}
+.tablist-tabs > li,
+.tablist > li {
+  float: left;
+}
+.tablist-tabs > li > a,
+.tablist > li > a {
+  padding-right: 12px;
+  padding-left: 12px;
+  margin-right: 2px;
+  line-height: 14px;
+}
+.tablist-tabs {
+  border-bottom: 1px solid #ddd;
+}
+.tablist-tabs > li {
+  margin-bottom: -1px;
+}
+.tablist-tabs > li > a {
+  padding-top: 8px;
+  padding-bottom: 8px;
+  line-height: 20px;
+  border: 1px solid transparent;
+  -webkit-border-radius: 4px 4px 0 0;
+  -moz-border-radius: 4px 4px 0 0;
+  border-radius: 4px 4px 0 0;
+}
+.tablist-tabs > li > a:hover {
+  border-color: #eeeeee #eeeeee #dddddd;
+}
+.tablist-tabs > .current > a,
+.tablist-tabs > .current > a:hover {
+  color: #555555;
+  background-color: #ffffff;
+  border: 1px solid #ddd;
+  border-bottom-color: transparent;
+  cursor: default;
+}
+.tablist > li > a {
+  padding-top: 8px;
+  padding-bottom: 8px;
+  margin-top: 2px;
+  margin-bottom: 2px;
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  border-radius: 5px;
+}
+.tablist > .current > a,
+.tablist > .current > a:hover {
+  color: #ffffff;
+  background-color: #0088cc;
+}
+.tablist-stacked > li {
+  float: none;
+}
+.tablist-stacked > li > a {
+  margin-right: 0;
+}
+.tablist-tabs.tablist-stacked {
+  border-bottom: 0;
+}
+.tablist-tabs.tablist-stacked > li > a {
+  border: 1px solid #ddd;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
+.tablist-tabs.tablist-stacked > li:first-child > a {
+  -webkit-border-top-right-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  border-top-right-radius: 4px;
+  -webkit-border-top-left-radius: 4px;
+  -moz-border-radius-topleft: 4px;
+  border-top-left-radius: 4px;
+}
+.tablist-tabs.tablist-stacked > li:last-child > a {
+  -webkit-border-bottom-right-radius: 4px;
+  -moz-border-radius-bottomright: 4px;
+  border-bottom-right-radius: 4px;
+  -webkit-border-bottom-left-radius: 4px;
+  -moz-border-radius-bottomleft: 4px;
+  border-bottom-left-radius: 4px;
+}
+.tablist-tabs.tablist-stacked > li > a:hover {
+  border-color: #ddd;
+  z-index: 2;
+}
+.tablist.tablist-stacked > li > a {
+  margin-bottom: 3px;
+}
+.tablist.tablist-stacked > li:last-child > a {
+  margin-bottom: 1px;
+}
+.tablist-tabs .dropdown-menu {
+  -webkit-border-radius: 0 0 6px 6px;
+  -moz-border-radius: 0 0 6px 6px;
+  border-radius: 0 0 6px 6px;
+}
+.tablist .dropdown-menu {
+  -webkit-border-radius: 6px;
+  -moz-border-radius: 6px;
+  border-radius: 6px;
+}
+.tablist .dropdown-toggle .caret {
+  border-top-color: #0088cc;
+  border-bottom-color: #0088cc;
+  margin-top: 6px;
+}
+.tablist .dropdown-toggle:hover .caret {
+  border-top-color: #005580;
+  border-bottom-color: #005580;
+}
+/* move down carets for tabs */
+.tablist-tabs .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+.tablist .current .dropdown-toggle .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+}
+.tablist-tabs .current .dropdown-toggle .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+.tablist > .dropdown.current > a:hover {
+  cursor: pointer;
+}
+.tablist-tabs .open .dropdown-toggle,
+.tablist .open .dropdown-toggle,
+.tablist > li.dropdown.open.current > a:hover {
+  color: #ffffff;
+  background-color: #999999;
+  border-color: #999999;
+}
+.tablist li.dropdown.open .caret,
+.tablist li.dropdown.open.current .caret,
+.tablist li.dropdown.open a:hover .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+  opacity: 1;
+  filter: alpha(opacity=100);
+}
+.tabs-stacked .open > a:hover {
+  border-color: #999999;
+}
+.tab-content > .tab-pane,
+.pill-content > .pill-pane {
+  display: none;
+}
+.tab-content > .current,
+.pill-content > .current {
+  display: block;
+}
+.tabs-below > .tablist-tabs {
+  border-top: 1px solid #ddd;
+}
+.tabs-below > .tablist-tabs > li {
+  margin-top: -1px;
+  margin-bottom: 0;
+}
+.tabs-below > .tablist-tabs > li > a {
+  -webkit-border-radius: 0 0 4px 4px;
+  -moz-border-radius: 0 0 4px 4px;
+  border-radius: 0 0 4px 4px;
+}
+.tabs-below > .tablist-tabs > li > a:hover {
+  border-bottom-color: transparent;
+  border-top-color: #ddd;
+}
+.tabs-below > .tablist-tabs > .current > a,
+.tabs-below > .tablist-tabs > .current > a:hover {
+  border-color: transparent #ddd #ddd #ddd;
+}
+.tabs-left > .tablist-tabs > li,
+.tabs-right > .tablist-tabs > li {
+  float: none;
+}
+.tabs-left > .tablist-tabs > li > a,
+.tabs-right > .tablist-tabs > li > a {
+  min-width: 74px;
+  margin-right: 0;
+  margin-bottom: 3px;
+}
+.tabs-left > .tablist-tabs {
+  float: left;
+  margin-right: 19px;
+  border-right: 1px solid #ddd;
+}
+.tabs-left > .tablist-tabs > li > a {
+  margin-right: -1px;
+  -webkit-border-radius: 4px 0 0 4px;
+  -moz-border-radius: 4px 0 0 4px;
+  border-radius: 4px 0 0 4px;
+}
+.tabs-left > .tablist-tabs > li > a:hover {
+  border-color: #eeeeee #dddddd #eeeeee #eeeeee;
+}
+.tabs-left > .tablist-tabs .current > a,
+.tabs-left > .tablist-tabs .current > a:hover {
+  border-color: #ddd transparent #ddd #ddd;
+  *border-right-color: #ffffff;
+}
+.tabs-right > .tablist-tabs {
+  float: right;
+  margin-left: 19px;
+  border-left: 1px solid #ddd;
+}
+.tabs-right > .tablist-tabs > li > a {
+  margin-left: -1px;
+  -webkit-border-radius: 0 4px 4px 0;
+  -moz-border-radius: 0 4px 4px 0;
+  border-radius: 0 4px 4px 0;
+}
+.tabs-right > .tablist-tabs > li > a:hover {
+  border-color: #eeeeee #eeeeee #eeeeee #dddddd;
+}
+.tabs-right > .tablist-tabs .current > a,
+.tabs-right > .tablist-tabs .current > a:hover {
+  border-color: #ddd #ddd #ddd transparent;
+  *border-left-color: #ffffff;
+}
+.tablist > .disabled > a {
+  color: #999999;
+}
+.tablist > .disabled > a:hover {
+  text-decoration: none;
+  background-color: transparent;
+  cursor: default;
+}
+.tablistbar {
+  overflow: visible;
+  margin-bottom: 20px;
+  color: #ffffff;
+  *position: relative;
+  *z-index: 2;
+}
+.tablistbar-inner {
+  min-height: 40px;
+  padding-left: 20px;
+  padding-right: 20px;
+  background-color: #034c03;
+  background-image: -moz-linear-gradient(top, #024002, #045f04);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#024002), to(#045f04));
+  background-image: -webkit-linear-gradient(top, #024002, #045f04);
+  background-image: -o-linear-gradient(top, #024002, #045f04);
+  background-image: linear-gradient(to bottom, #024002, #045f04);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff024002', endColorstr='#ff045f04', GradientType=0);
+  border: 1px solid #022402;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
+  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
+  *zoom: 1;
+}
+.tablistbar-inner:before,
+.tablistbar-inner:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+.tablistbar-inner:after {
+  clear: both;
+}
+.tablistbar .container {
+  width: auto;
+}
+.tablist-collapse.collapse {
+  height: auto;
+}
+.tablistbar .brand {
+  float: left;
+  display: block;
+  padding: 10px 20px 10px;
+  margin-left: -20px;
+  font-size: 20px;
+  font-weight: 200;
+  color: #ffffff;
+  text-shadow: 0 1px 0 #024002;
+}
+.tablistbar .brand:hover {
+  text-decoration: none;
+}
+.tablistbar-text {
+  margin-bottom: 0;
+  line-height: 40px;
+}
+.tablistbar-link {
+  color: #ffffff;
+}
+.tablistbar-link:hover {
+  color: #333333;
+}
+.tablistbar .tablist {
+  position: relative;
+  left: 0;
+  display: block;
+  float: left;
+  margin: 0 10px 0 0;
+}
+.tablistbar .tablist.pull-right {
+  float: right;
+  margin-right: 0;
+}
+.tablistbar .tablist > li {
+  float: left;
+}
+.tablistbar .tablist > li > a {
+  float: none;
+  padding: 10px 15px 10px;
+  color: #ffffff;
+  text-decoration: none;
+  text-shadow: 0 1px 0 #024002;
+}
+.tablistbar .tablist .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+.tablistbar .tablist > li > a:focus,
+.tablistbar .tablist > li > a:hover {
+  background-color: transparent;
+  color: white;
+  text-decoration: none;
+}
+.tablistbar .tablist > .current > a,
+.tablistbar .tablist > .current > a:hover,
+.tablistbar .tablist > .current > a:focus {
+  color: #555555;
+  text-decoration: none;
+  background-color: #034703;
+  -webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
+  -moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
+  box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
+}
+.tablistbar .btn-navbar {
+  display: none;
+  float: right;
+  padding: 7px 10px;
+  margin-left: 5px;
+  margin-right: 5px;
+  color: #ffffff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+  background-color: #023402;
+  background-image: -moz-linear-gradient(top, #012701, #034703);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#012701), to(#034703));
+  background-image: -webkit-linear-gradient(top, #012701, #034703);
+  background-image: -o-linear-gradient(top, #012701, #034703);
+  background-image: linear-gradient(to bottom, #012701, #034703);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff012701', endColorstr='#ff034703', GradientType=0);
+  border-color: #034703 #034703 #000000;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  *background-color: #034703;
+  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
+
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
+  -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
+}
+.tablistbar .tablist > li > .dropdown-menu:before {
+  content: '';
+  display: inline-block;
+  border-left: 7px solid transparent;
+  border-right: 7px solid transparent;
+  border-bottom: 7px solid #ccc;
+  border-bottom-color: rgba(0, 0, 0, 0.2);
+  position: absolute;
+  top: -7px;
+  left: 9px;
+}
+.tablistbar .tablist > li > .dropdown-menu:after {
+  content: '';
+  display: inline-block;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-bottom: 6px solid #ffffff;
+  position: absolute;
+  top: -6px;
+  left: 10px;
+}
+.tablistbar .tablist li.dropdown.open > .dropdown-toggle,
+.tablistbar .tablist li.dropdown.current > .dropdown-toggle,
+.tablistbar .tablist li.dropdown.open.current > .dropdown-toggle {
+  background-color: #034703;
+  color: #555555;
+}
+.tablistbar .tablist li.dropdown > .dropdown-toggle .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+}
+.tablistbar .tablist li.dropdown.open > .dropdown-toggle .caret,
+.tablistbar .tablist li.dropdown.current > .dropdown-toggle .caret,
+.tablistbar .tablist li.dropdown.open.current > .dropdown-toggle .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+.tablistbar .pull-right > li > .dropdown-menu,
+.tablistbar .tablist > li > .dropdown-menu.pull-right {
+  left: auto;
+  right: 0;
+}
+.tablistbar .pull-right > li > .dropdown-menu:before,
+.tablistbar .tablist > li > .dropdown-menu.pull-right:before {
+  left: auto;
+  right: 12px;
+}
+.tablistbar .pull-right > li > .dropdown-menu:after,
+.tablistbar .tablist > li > .dropdown-menu.pull-right:after {
+  left: auto;
+  right: 13px;
+}
+.tablistbar .pull-right > li > .dropdown-menu .dropdown-menu,
+.tablistbar .tablist > li > .dropdown-menu.pull-right .dropdown-menu {
+  left: auto;
+  right: 100%;
+  margin-left: 0;
+  margin-right: -1px;
+  -webkit-border-radius: 6px 0 6px 6px;
+  -moz-border-radius: 6px 0 6px 6px;
+  border-radius: 6px 0 6px 6px;
+}
+.breadcrumb {
+  padding: 8px 15px;
+  margin: 0 0 20px;
+  list-style: none;
+  background-color: #f5f5f5;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+}
+.breadcrumb li {
+  display: inline-block;
+  *display: inline;
+  /* IE7 inline-block hack */
+
+  *zoom: 1;
+  text-shadow: 0 1px 0 #ffffff;
+}
+.breadcrumb .divider {
+  padding: 0 5px;
+  color: #ccc;
+}
+.breadcrumb .current {
+  color: #999999;
+}
+.pagination-right {
+  text-align: right;
+}
+.fade {
+  opacity: 0;
+  -webkit-transition: opacity 0.15s linear;
+  -moz-transition: opacity 0.15s linear;
+  -o-transition: opacity 0.15s linear;
+  transition: opacity 0.15s linear;
+}
+.fade.in {
+  opacity: 1;
+}
+.collapse {
+  position: relative;
+  height: 0;
+  overflow: hidden;
+  -webkit-transition: height 0.35s ease;
+  -moz-transition: height 0.35s ease;
+  -o-transition: height 0.35s ease;
+  transition: height 0.35s ease;
+}
+.collapse.in {
+  height: auto;
+}
+.hidden {
+  display: none;
+  visibility: hidden;
+}
+.visible-phone {
+  display: none !important;
+}
+.visible-tablet {
+  display: none !important;
+}
+.hidden-desktop {
+  display: none !important;
+}
+.visible-desktop {
+  display: inherit !important;
+}
+@media (min-width: 768px) and (max-width: 979px) {
+  .hidden-desktop {
+    display: inherit !important;
+  }
+  .visible-desktop {
+    display: none !important ;
+  }
+  .visible-tablet {
+    display: inherit !important;
+  }
+  .hidden-tablet {
+    display: none !important;
+  }
+}
+@media (max-width: 767px) {
+  .hidden-desktop {
+    display: inherit !important;
+  }
+  .visible-desktop {
+    display: none !important;
+  }
+  .visible-phone {
+    display: inherit !important;
+  }
+  .hidden-phone {
+    display: none !important;
+  }
+}
+@media (max-width: 767px) {
+  body {
+    padding-left: 20px;
+    padding-right: 20px;
+  }
+  .container {
+    width: auto;
+  }
+  .row,
+  .thumbnails {
+    margin-left: 0;
+  }
+}
+@media (max-width: 480px) {
+  .tablist-collapse {
+    -webkit-transform: translate3d(0, 0, 0);
+  }
+  .page-header h1 small {
+    display: block;
+    line-height: 20px;
+  }
+}
+@media (min-width: 768px) and (max-width: 979px) {
+  .row {
+    margin-left: -20px;
+    *zoom: 1;
+  }
+  .row:before,
+  .row:after {
+    display: table;
+    content: "";
+    line-height: 0;
+  }
+  .row:after {
+    clear: both;
+  }
+  [class*="span"] {
+    float: left;
+    min-height: 1px;
+    margin-left: 20px;
+  }
+  .container {
+    width: 724px;
+  }
+}
+@media (min-width: 1200px) {
+  .row {
+    margin-left: -30px;
+    *zoom: 1;
+  }
+  .row:before,
+  .row:after {
+    display: table;
+    content: "";
+    line-height: 0;
+  }
+  .row:after {
+    clear: both;
+  }
+  [class*="span"] {
+    float: left;
+    min-height: 1px;
+    margin-left: 30px;
+  }
+  .container {
+    width: 1070px;
+  }
+}
+@media (max-width: 979px) {
+  body {
+    padding-top: 0;
+  }
+}
+@media (min-width: 980px) {
+  .tablist-collapse.collapse {
+    height: auto !important;
+    overflow: visible !important;
+  }
+}
+.tablistbar .brand {
+  padding: 5px;
+  margin-left: 0;
+}
+.tablistbar .brand img {
+  width: 30px;
+  vertical-align: middle;
 }
 
+h1 small {
+  font-size: 18px;
+}
+
+h1 small,
+h2 small,
+h3 small,
+h4 small,
+h5 small,
+h6 small,
+.page-header small {
+  line-height: 0.8;
+  font-weight: normal;
+  color: #999999;
+  display:block;
+  vertical-align: middle;
+}
+
+.page-header h1, h1:first-child {
+  font-size: 40px;
+  padding-bottom: 5px;
+}
+
+.page-header h1 {
+  border-bottom: 1px solid #999999;
+  padding-bottom: 9px;
+}
+
+.page-header img {
+  height: 80px;
+  padding-bottom: 5px;
+}
+
+.page-header small {
+  line-height: 1.1;
+  font-size: 18px;
+}
+
+h2,
+h3,
+h4,
+div.ah,
 .title {
-    font-weight: bold;
-    margin: 10px 2px;
-    background-color: #7BB37B;
-    border: 1px solid #6A996A;
-    color: #151515;
-    font-size: 1.2em;
-    padding-bottom: 0.2em;
-    padding-left: 0.4em;
-    padding-top: 0.2em;
+  border-color: #D6E9C6;
+  color: #468847;
+  border-style: solid;
+  border-width: 0 0 1px;
+  padding-left: 0.5em;
 }
 
-h2 {
-    font-size: 120%;
+
+.google {
+  color: white;
 }
 
-h3 {
-    font-size: 100%;
+.breadcrumb {
+  font-size: 11px;
+  padding-top: 2px;
+  padding-bottom: 2px;
+}
+
+h1 a,
+h2 a,
+h3 a,
+h4 a {
+  color: inherit;
+}
+
+.tablistbar-inner a {
+  font-weight: bold;
+}
+
+.list-2panes:before,
+.list-2panes:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+
+.list-2panes:after {
+  clear:both;
+}
+
+.list-2panes li {
+  width: 470px;
+  width: 470px;
+  float: left;
+  margin-left: 30px;
+  min-height: 1px;
 }
+/* The standard CSS for doxygen */
+
+/* @group Heading Levels */
+
 
 dt {
     font-weight: bold;
@@ -70,18 +1176,18 @@ h3.version {
         text-align: center;
 }
 
-div.qindex, div.navtab{
+div.qindex, div.tablisttab{
     background-color: #EBF6EB;
     border: 1px solid #A3D7A3;
     text-align: center;
 }
 
-div.qindex, div.navpath {
+div.qindex, div.tablistpath {
     width: 100%;
     line-height: 140%;
 }
 
-div.navtab {
+div.tablisttab {
     margin-right: 15px;
 }
 
@@ -153,24 +1259,6 @@ pre.fragment {
     line-height: 125%;
 }
 
-div.ah {
-    background-color: black;
-    font-weight: bold;
-    color: #ffffff;
-    margin-bottom: 3px;
-    margin-top: 3px;
-    padding: 0.2em;
-    border: solid thin #333;
-    border-radius: 0.5em;
-    -webkit-border-radius: .5em;
-    -moz-border-radius: .5em;
-    box-shadow: 2px 2px 3px #999;
-    -webkit-box-shadow: 2px 2px 3px #999;
-    -moz-box-shadow: rgba(0, 0, 0, 0.15) 2px 2px 2px;
-    background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#000),color-stop(0.3, #444));
-    background-image: -moz-linear-gradient(center top, #eee 0%, #444 40%, #000);
-}
-
 div.groupHeader {
     margin-left: 16px;
     margin-top: 12px;
@@ -189,21 +1277,10 @@ div.contents {
 }
 
 td.indexkey {
-    background-color: #EBF6EB;
-    font-weight: bold;
-    border: 1px solid #C4E5C4;
-    margin: 2px 0px 2px 0;
-    padding: 2px 10px;
-        white-space: nowrap;
-        vertical-align: top;
+    white-space: nowrap;
+    vertical-align: top;
 }
 
-td.indexvalue {
-    background-color: #EBF6EB;
-    border: 1px solid #C4E5C4;
-    padding: 2px 10px;
-    margin: 2px 0px;
-}
 
 tr.memlist {
     background-color: #EEF7EE;
@@ -696,7 +1773,7 @@ table.fieldtable {
     font-size: 13px;
 }
 
-.navpath ul
+.tablistpath ul
 {
     font-size: 11px;
     background-image:url('tab_b.png');
@@ -710,7 +1787,7 @@ table.fieldtable {
     padding:0px;
 }
 
-.navpath li
+.tablistpath li
 {
     list-style-type:none;
     float:left;
@@ -722,7 +1799,7 @@ table.fieldtable {
     color:#367C36;
 }
 
-.navpath li.navelem a
+.tablistpath li.tablistelem a
 {
     height:32px;
     display:block;
@@ -730,12 +1807,12 @@ table.fieldtable {
     outline: none;
 }
 
-.navpath li.navelem a:hover
+.tablistpath li.tablistelem a:hover
 {
     color:#68BD68;
 }
 
-.navpath li.footer
+.tablistpath li.footer
 {
         list-style-type:none;
         float:right;
@@ -937,161 +2014,6 @@ dl.citelist dd {
   }
 }
 
-/* tabs */
-
-.tabs, .tabs2, .tabs3 {
-    z-index: 101;
-}
-
-.tablist {
-    margin: auto;
-    display: table;
-}
-
-.tablist li {
-    float: left;
-    display: table-cell;
-    list-style: none;
-    margin:0 4px;
-}
-
-.tablist a {
-    display: block;
-    padding: 0 0.3em;
-    color: #285D28;
-    text-decoration: none;
-    outline: none;
-}
-
-.tabs3 .tablist a {
-    padding-left: 10px;
-}
-
-
-/* libav.org stylesheet */
-
-a {
-    color: #2D6198;
-}
-
-a:visited {
-    color: #884488;
-}
-
-h1 a, h2 a, h3 a {
-    text-decoration: inherit;
-    color: inherit;
-}
-
-#body {
-    margin: 0 1em;
-}
-
-body {
-    background-color: #313131;
-    margin: 0;
-}
-
-.center {
-    margin-left: auto;
-    margin-right: auto;
-    text-align: center;
-}
-
-#container {
-    background-color: white;
-    color: #202020;
-    margin-left: 1em;
-    margin-right: 1em;
-}
-
-h1 {
-    background-color: #7BB37B;
-    border: 1px solid #6A996A;
-    color: #151515;
-    font-size: 1.2em;
-    padding-bottom: 0.2em;
-    padding-left: 0.4em;
-    padding-top: 0.2em;
-}
-
-h2 {
-    color: #313131;
-    font-size: 1.2em;
-}
-
-h3 {
-    color: #313131;
-    font-size: 0.8em;
-    margin-bottom: -8px;
-}
-
-img {
-    border: 0;
-}
-
-.tabs {
-    margin-top: 12px;
-    border-top: 1px solid #5C665C;
-}
-
-.tabs, .tabs2, .tabs3, .tabs4 {
-    background-color: #738073;
-    border-bottom: 1px solid #5C665C;
-    border-left: 1px solid #5C665C;
-    border-right: 1px solid #5C665C;
-    position: relative;
-    text-align: center;
-}
-
-.tabs a,
-.tabs2 a,
-.tabs3 a,
-.tabs4 a {
-    color: white;
-    padding: 0.3em;
-    text-decoration: none;
-}
-
-
-.tabs ul,
-.tabs2 ul,
-.tabs3 ul,
-.tabs4 ul {
-    padding: 0;
-}
-
-.tabs li.current a,
-.tabs2 li.current a,
-.tabs3 li.current a,
-.tabs4 li.current a {
-    background-color: #414141;
-    color: white;
-    text-decoration: none;
-}
-
-.tabs a:hover,
-.tabs2 a:hover,
-.tabs3 a:hover,
-.tabs4 a:hover {
-    background-color: #313131 !important;
-    color: white;
-    text-decoration: none;
-}
-
-p {
-    margin-left: 1em;
-    margin-right: 1em;
-}
-
-table {
-    margin-left: 2em;
-}
-
-pre {
-    margin-left: 2em;
-}
-
 #proj_desc {
     font-size: 1.2em;
 }
diff --git a/doc/doxy/footer.html b/doc/doxy/footer.html
index 721735164a..101e6fe70b 100644
--- a/doc/doxy/footer.html
+++ b/doc/doxy/footer.html
@@ -1,10 +1,9 @@
- </div>
-
- <div id="footer">
-   Generated on $datetime for $projectname by&#160;<a href="http://www.doxygen.org/index.html">doxygen</a> $doxygenversion
- </div>
 
+ <footer class="footer pagination-right">
+   <span class="label label-info">
+    Generated on $datetime for $projectname by&#160;<a href="http://www.doxygen.org/index.html">doxygen</a> $doxygenversion
+   </span>
+ </footer>
 </div>
-
 </body>
 </html>
diff --git a/doc/doxy/header.html b/doc/doxy/header.html
index 9e57c98e42..312990cdbc 100644
--- a/doc/doxy/header.html
+++ b/doc/doxy/header.html
@@ -1,14 +1,16 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
+<!DOCTYPE html>
+<html>
 <head>
-<meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
 <meta http-equiv="X-UA-Compatible" content="IE=9"/>
 <!--BEGIN PROJECT_NAME--><title>$projectname: $title</title><!--END PROJECT_NAME-->
 <!--BEGIN !PROJECT_NAME--><title>$title</title><!--END !PROJECT_NAME-->
 <link href="$relpath$doxy_stylesheet.css" rel="stylesheet" type="text/css" />
+<!--Header replace -->
+
 </head>
 
-<div id="container">
+<div class="container">
 
-<div id="body">
- <div>
+<!--Header replace -->
+<div class="menu">
diff --git a/doc/t2h.init b/doc/t2h.init
index d91d7b6bff..54235d23ae 100644
--- a/doc/t2h.init
+++ b/doc/t2h.init
@@ -6,73 +6,135 @@ sub Libav_end_section($$)
 
 $EXTRA_HEAD =
 '<link rel="icon" href="favicon.png" type="image/png" />
-<link rel="stylesheet" type="text/css" href="default.css" />
 ';
 
-$CSS_LINES = <<EOT;
+$CSS_LINES = $ENV{"LIBAV_CSS"} || <<EOT;
 <style type="text/css">
 <!--
-a.summary-letter { text-decoration: none }
-a { color: #2D6198; }
-a:visited { color: #884488; }
-h1 a, h2 a, h3 a { text-decoration: inherit; color: inherit; }
-p { margin-left: 1em; margin-right: 1em; }
-table { margin-left: 2em; }
-pre { margin-left: 2em; }
-#footer { text-align: center; }
-#body { margin-left: 1em; margin-right: 1em; }
-body { background-color: #313131; margin: 0; }
-
-#container {
-    background-color: white;
-    color: #202020;
-    margin-left: 1em;
-    margin-right: 1em;
+.container {
+  margin-right: auto;
+  margin-left: auto;
+  width: 1070px;
+}
+body {
+  font-size: 14px;
+  line-height: 20px;
+  color: #333333;
+  background-color: #ffffff;
+}
+a {
+  color: #0088cc;
+  text-decoration: none;
+}
+a:hover {
+  color: #005580;
+  text-decoration: underline;
+}
+p {
+  margin: 0 0 10px;
+}
+h2,
+h3,
+h4 {
+  margin: 10px 0;
+  font-family: inherit;
+  font-weight: bold;
+  line-height: 1;
+  border-color: #D6E9C6;
+  color: #468847;
+  border-style: solid;
+  border-width: 0 0 1px;
+  padding-left: 0.5em;
 }
 
+h1 a,
+h2 a,
+h3 a,
+h4 a {
+  color: inherit;
+}
 h1 {
-    background-color: #7BB37B;
-    border: 1px solid #6A996A;
-    color: #151515;
-    font-size: 1.2em;
-    padding-bottom: 0.2em;
-    padding-left: 0.4em;
-    padding-top: 0.2em;
+  font-size: 30px;
+  line-height: 40px;
 }
-
 h2 {
-    color: #313131;
-    font-size: 1.2em;
+  font-size: 20px;
+  line-height: 40px;
 }
-
 h3 {
-    color: #313131;
-    font-size: 0.8em;
-    margin-bottom: -8px;
+  font-size: 18px;
+  line-height: 40px;
+}
+code,
+pre {
+  padding: 0 3px 2px;
+  font-family: monospace;
+  font-size: 12px;
+  color: #333333;
+  border-radius: 3px;
+}
+pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  font-size: 13px;
+  line-height: 20px;
+  word-break: break-all;
+  word-wrap: break-word;
+  white-space: pre;
+  white-space: pre-wrap;
+  background-color: #f5f5f5;
+  border: 1px solid #ccc;
+  border-radius: 4px;
 }
 
-.note {
-    margin: 1em;
-    border: 1px solid #bbc9d8;
-    background-color: #dde1e1;
+code {
+  padding: 2px 4px;
+  color: #d14;
+  background-color: #f7f7f9;
+  border: 1px solid #e1e1e8;
+}
+pre code {
+  padding: 0;
+  color: inherit;
+  background-color: transparent;
+  border: 0;
+}
+.alert {
+  padding: 8px 35px 8px 14px;
+  margin-bottom: 20px;
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+  background-color: #fcf8e3;
+  border: 1px solid #fbeed5;
+  border-radius: 4px;
+  color: #c09853;
 }
 
-.important {
-    margin: 1em;
-    border: 1px solid #d26767;
-    background-color: #f8e1e1;
+.alert-danger,
+.alert-error {
+  background-color: #f2dede;
+  border-color: #eed3d7;
+  color: #b94a48;
+}
+.alert-info {
+  background-color: #d9edf7;
+  border-color: #bce8f1;
+  color: #3a87ad;
 }
 
+ul.toc {
+  list-style-type: none;
+}
 -->
 </style>
 EOT
 
-my $LIBAV_NAVBAR = $ENV{"LIBAV_NAVBAR"} || '';
-
-$AFTER_BODY_OPEN =
-'<div id="container">' .
-"\n$LIBAV_NAVBAR\n" .
-'<div id="body">';
+my $TEMPLATE_HEADER = $ENV{"LIBAV_HEADER"} || <<EOT;
+<link rel="icon" href="favicon.png" type="image/png" />
+</head>
+<body>
+<div class="container">
+EOT
 
 $PRE_BODY_CLOSE = '</div></div>';
 
@@ -83,9 +145,10 @@ $print_page_foot = \&Libav_print_page_foot;
 sub Libav_print_page_foot($$)
 {
     my $fh = shift;
-    print $fh '<div id="footer">' . "\n";
-    T2H_DEFAULT_print_page_foot($fh);
-    print $fh "</div>\n";
+    my $program_string = T2H_DEFAULT_program_string();
+    print $fh '<footer class="footer pagination-right">' . "\n";
+    print $fh '<span class="label label-info">' . $program_string;
+    print $fh "</span></footer></div>\n";
 }
 
 $float = \&Libav_float;
@@ -107,11 +170,11 @@ sub Libav_float($$$$)
 
     if ($caption =~ /NOTE/)
     {
-        $class = "note";
+        $class = "alert alert-info";
     }
     elsif ($caption =~ /IMPORTANT/)
     {
-        $class = "important";
+        $class = "alert alert-warning";
     }
 
     return '<div class="float ' . $class . '">' . "$label\n" . $text . '</div>';
@@ -134,7 +197,7 @@ sub Libav_print_page_head($$)
     $longtitle = "Libav documentation : " . $longtitle;
 
     print $fh <<EOT;
-$DOCTYPE
+<!DOCTYPE html>
 <html>
 $Texi2HTML::THISDOC{'copying'}<!-- Created on $Texi2HTML::THISDOC{today} by $Texi2HTML::THISDOC{program} -->
 <!--
@@ -150,11 +213,7 @@ $description
 <meta name="Generator" content="$Texi2HTML::THISDOC{program}">
 $encoding
 $CSS_LINES
-$EXTRA_HEAD
-</head>
-
-<body $BODYTEXT>
-$AFTER_BODY_OPEN
+$TEMPLATE_HEADER
 EOT
 }