Issue 4462 - Update styles on Eyeo.com to match new logo

static/css/styles.css

Index: static/css/styles.css
diff --git a/static/css/styles.css b/static/css/styles.css
index 562dcb652162d15d49f1ef497157c28fdb1a194f..42bdd07da489880cbfd0095edf474b81dd3094d5 100644
--- a/static/css/styles.css
+++ b/static/css/styles.css
@@ -1,30 +1,27 @@
 /*
  * Fonts

[juliandoucette, 2017/01/10 20:26:39]

We should prefer local("Source Sans Pro") over url("...")

  */
+
 @font-face {
-  font-family: "Lato";
-  font-style: normal;
-  font-weight: 400;
-  src: local("Lato Regular"), local("Lato-Regular"), url(/fonts/Lato-Regular.woff) format('woff');
-}
-@font-face {
-  font-family: "Lato";
+  font-family: "Source Sans Pro";
+  font-weight: 300;
   font-style: normal;
-  font-weight: 700;
-  src: local("Lato Bold"), local("Lato-Bold"), url(/fonts/Lato-Bold.woff) format('woff');
-}
+  src: url("/fonts/Source-Sans-Pro-300/Source-Sans-Pro-300.eot");
+  src: url("/fonts/Source-Sans-Pro-300/Source-Sans-Pro-300.eot?#iefix") format("embedded-opentype"), local("Source Sans Pro Light"), local("Source-Sans-Pro-300"), url("/fonts/Source-Sans-Pro-300/Source-Sans-Pro-300.woff2") format("woff2"), url("/fonts/Source-Sans-Pro-300/Source-Sans-Pro-300.woff") format("woff"), url("/fonts/Source-Sans-Pro-300/Source-Sans-Pro-300.ttf") format("truetype"), url("/fonts/Source-Sans-Pro-300/Source-Sans-Pro-300.svg#SourceSansPro") format("svg"); }
+
 @font-face {
-  font-family: "Lato";
-  font-style: italic;
+  font-family: "Source Sans Pro";
   font-weight: 400;
-  src: local("Lato Italic"), local("Lato-Italic"), url(/fonts/Lato-Italic.woff) format('woff');
-}
+  font-style: normal;
+  src: url("/fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.eot");
+  src: url("/fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.eot?#iefix") format("embedded-opentype"), local("Source Sans Pro"), local("Source-Sans-Pro-regular"), url("/fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.woff2") format("woff2"), url("/fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.woff") format("woff"), url("/fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.ttf") format("truetype"), url("/fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.svg#SourceSansPro") format("svg"); }
+
 @font-face {
-  font-family: "Lato";
-  font-style: italic;
+  font-family: "Source Sans Pro";
   font-weight: 700;
-  src: local("Lato Bold Italic"), local("Lato-BoldItalic"), url(/fonts/Lato-BoldItalic.woff) format('woff');
-}
+  font-style: normal;
+  src: url("/fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.eot");
+  src: url("/fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.eot?#iefix") format("embedded-opentype"), local("Source Sans Pro Bold"), local("Source-Sans-Pro-700"), url("/fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.woff2") format("woff2"), url("/fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.woff") format("woff"), url("/fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.ttf") format("truetype"), url("/fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.svg#SourceSansPro") format("svg"); }
 
 /*
  * General layout
@@ -32,10 +29,11 @@
 
 body
 {
-  font-family: Lato, sans-serif;
-  font-size: 14px;
-  line-height: 1.4;
-  color: #747474;
+  font-family: "Source Sans Pro", sans-serif;
+  font-size: 17px;

[juliandoucette, 2017/01/10 20:26:39]

The issue says 18. Why 17?

+  font-weight: 300;
+  line-height: 24px;
+  color: #161616;
   padding: 0;
   margin: 0;
   padding-top: 78px;
@@ -43,13 +41,14 @@ body
 
 a
 {
-  color: #7ac142;
-  text-decoration: none;
+  color: #161616;
+	text-decoration: none;

[juliandoucette, 2017/01/10 20:26:39]

Please use spaces instead of tabs (everywhere).

+	font-weight: 500;

[juliandoucette, 2017/01/10 20:26:39]

We don't have this font in 500.

 }
 
 a:hover
 {
-  color: #91e64f;
+	text-decoration: underline;
 }
 
 img
@@ -176,6 +175,7 @@ h6
 {
   color: #979797;
   padding: 0 8px;
+	text-transform: uppercase;

[juliandoucette, 2017/01/10 20:26:39]

Please use 2 spaces (everywhere).

 }
 
 .menu-list li:hover > a,
@@ -301,7 +301,6 @@ h6
 {
   margin: 0;
   margin-bottom: 20px;
-  border-bottom: 1px solid #E2E2E2;
   font-weight: normal;
   height: 0.7em;
 }
@@ -327,16 +326,16 @@ button, .button, .menu-button
 {
   display: inline-block;
   cursor: pointer;
-  background-color: #7ac142;
+  background-color: #161616;
   color: #ffffff;
-  border: none;
-  border-radius: 3px;
   font-size: 14px;
+	border: 1px solid #ffffff;
   font-weight: bold;
   line-height: 36px;
   white-space: nowrap;
   height: 36px;
   padding: 0 20px;
+	text-transform: uppercase;
 }
 
 button:hover,
@@ -346,8 +345,10 @@ button:focus,
 .menu-button:hover,
 .menu-button:focus
 {
-  background-color: #7FCF42;
-  color: #ffffff;
+  color: #161616;
+	background-color: #ffffff;
+	text-decoration: none;
+	border: 1px solid #161616;
 }
 
 .page-title
@@ -397,7 +398,7 @@ button:focus,
 {
   padding-top: 50px;
   padding-bottom: 50px;
-  background-color: #f0f0f0;
+  background-color: #f2f2f2;
 }
 
 #media
@@ -412,7 +413,7 @@ button:focus,
 
 #our-work .column
 {
-  text-align: center;
+  text-align: left;
 }
 
 .profile
@@ -525,6 +526,12 @@ button:focus,
   width: 23.125%;
 }
 
+/*
+.four-columns .columns h1,h2,h3,h4,h5,h6 {

[juliandoucette, 2017/01/10 20:26:39]

- Please delete commented code blocks
- This selector probably doesn't work like you expect (you have to re-start
after the comma eg: .test h1, .test h2)
- Please put additional selectors on separate lines

+	text-transform: uppercase;
+}
+*/
+
 .one-sidebar .sidebar-left,
 .one-sidebars .sidebar-right,
 .two-sidebars .sidebar-left,
@@ -596,7 +603,7 @@ button:focus,
 .ui-tabs-nav li:hover
 {
   background-color: #fff;
-  border-top: 2px solid #7ac142;
+  border-top: 2px solid #161616;
   border-bottom: none;
   position: relative;
   top: 2px;
@@ -866,7 +873,7 @@ header > *, .content-block
     display: block;
     margin: 0px;
     padding: 10px;
-    font-size: 14px
+    font-size: 14px;
   }
 
   .menu-button