diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 0eb466290e..5e74a1c071 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -4050,11 +4050,18 @@ input[type="submit"].btn::-moz-focus-inner {
   margin-bottom: 20px;
   overflow: visible;
   color: #777777;
-  background-color: #f2f2f2;
+  background-color: #fafafa;
+  background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
+  background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
+  background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
+  background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
+  background-repeat: repeat-x;
   border: 1px solid #d4d4d4;
   -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
           border-radius: 4px;
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
   -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);
@@ -4433,8 +4440,15 @@ input[type="submit"].btn::-moz-focus-inner {
 
 .navbar-inverse {
   color: #999999;
-  background-color: #111111;
+  background-color: #1b1b1b;
+  background-image: -moz-linear-gradient(top, #222222, #111111);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#222222), to(#111111));
+  background-image: -webkit-linear-gradient(top, #222222, #111111);
+  background-image: -o-linear-gradient(top, #222222, #111111);
+  background-image: linear-gradient(to bottom, #222222, #111111);
+  background-repeat: repeat-x;
   border-color: #252525;
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff111111', GradientType=0);
 }
 
 .navbar-inverse .brand,
diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index 33b4cf1a1f..bba1384156 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -26,10 +26,6 @@ h3 code {
 /* Tweak navbar brand link to be super sleek
 -------------------------------------------------- */
 
-body > .navbar {
-  background-color: rgba(0,0,0,.9);
-}
-
 /* Change the docs' brand */
 body > .navbar .brand {
   padding-right: 0;
diff --git a/less/navbar.less b/less/navbar.less
index ca492cc7be..7b6a87dd72 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -12,7 +12,7 @@
   padding: 0 20px;
   margin-bottom: @baseLineHeight;
   color: @navbarText;
-  background-color: @navbarBackground;
+  #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground);
   border: 1px solid @navbarBorder;
   .border-radius(4px);
   .box-shadow(0 1px 4px rgba(0,0,0,.065));
@@ -357,7 +357,7 @@
 
 .navbar-inverse {
   color: @navbarInverseText;
-  background-color: @navbarInverseBackground;
+  #gradient > .vertical(@navbarInverseBackgroundHighlight, @navbarInverseBackground);
   border-color: @navbarInverseBorder;
 
   .brand,