Merge branch 'new-colors' into 'master'

New colour scheme

old
![Screenshot_2015-12-17_14.14.53](/uploads/5d6ac28b6d99186485d727a72cc8a662/Screenshot_2015-12-17_14.14.53.png)

new
![Screenshot_2015-12-17_14.15.07](/uploads/06e07fa3716aa8664b1507b390270285/Screenshot_2015-12-17_14.15.07.png)

* Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/2577

See merge request !2151

app/assets/stylesheets/framework/blocks.scss

@@ -76,7 +76,7 @@
 .cover-block {
   text-align: center;
-  background: #f7f8fa;
+  background: $background-color;
   margin: -$gl-padding;
   margin-bottom: 0;
   padding: 44px $gl-padding;

app/assets/stylesheets/framework/layout.scss

@@ -5,7 +5,7 @@ html {
 }
 body {
-  background-color: #EAEBEC !important;
+  background-color: #F3F3F3 !important;
   &.navless {
     background-color: white !important;

app/assets/stylesheets/framework/mixins.scss

@@ -123,7 +123,6 @@
   padding: 0;
   margin: 0;
   list-style: none;
-  margin-top: 5px;
   height: 56px;
   li {
@@ -131,9 +130,9 @@
     a {
       padding: 14px;
-      font-size: 17px;
+      font-size: 15px;
       line-height: 28px;
-      color: #7f8fa4;
+      color: #959494;
       border-bottom: 2px solid transparent;
       &:hover, &:active, &:focus {
@@ -143,8 +142,8 @@
     }
     &.active a {
-      color: #4c4e54;
-      border-bottom: 2px solid #1cacfc;
+      color: #616060;
+      border-bottom: 2px solid #4688f1;
     }
     .badge {

app/assets/stylesheets/framework/variables.scss

-$hover: #FFFAF1;
+$hover: #faf9f9;
 $gl-text-color: #54565B;
 $gl-text-green: #4A2;
 $gl-text-red: #D12F19;
 $gl-text-orange: #D90;
-$gl-header-color: #4c4e54;
+$gl-header-color: #323232;
 $gl-link-color: #333c48;
 $md-text-color: #444;
 $md-link-color: #3084bb;
@@ -15,13 +15,14 @@ $sidebar_width: 230px;
 $avatar_radius: 50%;
 $code_font_size: 13px;
 $code_line_height: 1.5;
-$border-color: #dce0e6;
+$border-color: #efeff1;
 $table-border-color: #eef0f2;
-$background-color: #F7F8FA;
+$background-color: #faf9f9;
 $header-height: 58px;
 $fixed-layout-width: 1280px;
-$gl-gray: #7f8fa4;
+$gl-gray: #5a5a5a;
 $gl-padding: 16px;
+$gl-padding-top:10px;
 $gl-avatar-size: 46px;
 /*
@@ -29,12 +30,12 @@ $gl-avatar-size: 46px;
  */
 $white-light: #FFFFFF;
-$white-normal: #DCE0E5;
-$white-dark: #E4E7ED;
-$gray-light: #F0F2F5;
-$gray-normal: #DCE0E5;
-$gray-dark: #E4E7ED;
+$white-normal: #ededed;
+$white-dark: #ededed;
+$gray-light: #f7f7f7;
+$gray-normal: #ededed;
+$gray-dark: #ededed;
 $green-light: #31AF64;
 $green-normal: #2FAA60;
@@ -52,11 +53,11 @@ $red-light: #F43263;
 $red-normal: #E52C5A;
 $red-dark: #D22852;
-$border-white-light: #E3E7EC;
+$border-white-light: #F1F2F4;
 $border-white-normal: #D6DAE2;
 $border-white-dark: #C6CACF;
-$border-gray-light: #DCE0E5;
+$border-gray-light: #d1d1d1;
 $border-gray-normal: #D6DAE2;
 $border-gray-dark: #C6CACF;
@@ -76,6 +77,8 @@ $border-red-light: #E52C5A;
 $border-red-normal: #D22852;
 $border-red-dark: #CA264F;
+/* header */
+$light-grey-header: #faf9f9;
 /*
  * State colors: