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

static/css/styles.css

 /*
  * Fonts

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

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

  */
+
 @font-face {
-  font-family: "Lato";
+  font-family: "Source Sans Pro";
+  font-weight: 300;
   font-style: normal;
+  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: "Source Sans Pro";
   font-weight: 400;
-  src: local("Lato Regular"), local("Lato-Regular"), url(/fonts/Lato-Regular.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-family: "Source Sans Pro";
+  font-weight: 700;
   font-style: normal;
-  font-weight: 700;
-  src: local("Lato Bold"), local("Lato-Bold"), url(/fonts/Lato-Bold.woff) format('woff');
-}
-@font-face {
-  font-family: "Lato";
-  font-style: italic;
-  font-weight: 400;
-  src: local("Lato Italic"), local("Lato-Italic"), url(/fonts/Lato-Italic.woff) format('woff');
-}
-@font-face {
-  font-family: "Lato";
-  font-style: italic;
-  font-weight: 700;
-  src: local("Lato Bold Italic"), local("Lato-BoldItalic"), url(/fonts/Lato-BoldItalic.woff) format('woff');
-}
+  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
  */
 
 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;
 }
 
 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
 {
   border-width: 0px;
 }
 
 header,
 footer,
 nav
@@ skipping 106 matching lines @@
 {
   display: inline;
   font-weight: bold;
   white-space: nowrap;
 }
 
 .menu-list li a
 {
   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,
 .menu-list li.current-menu-item > a
 {
   color: #373737;
 }
 
 #header-hamburger
 {
@@ skipping 105 matching lines @@
 .page-title h1
 {
   max-width: 1080px;
   margin: 0 auto;
 }
 
 .heading
 {
   margin: 0;
   margin-bottom: 20px;
-  border-bottom: 1px solid #E2E2E2;
   font-weight: normal;
   height: 0.7em;
 }
 
 .heading span
 {
   padding: 0;
   padding-right: 10px;
   background-color: #fff;
 }
 
 .centered
 {
   text-align: center;
 }
 
 .centered span
 {
   padding-left: 10px;
 }
 
 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,
 button:focus,
 .button:hover,
 .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
 {
   background-image: url(/images/subtlenet2.png);
   background-color: #e9e9e5;
   padding-top: 25px;
   padding-bottom: 25px;
   margin-bottom: 40px;
 }
@@ skipping 29 matching lines @@
 #who-we-are
 {
   margin-top: 25px;
   margin-bottom: 25px;
 }
 
 #our-work
 {
   padding-top: 50px;
   padding-bottom: 50px;
-  background-color: #f0f0f0;
+  background-color: #f2f2f2;
 }
 
 #media
 {
   margin-top: 25px;
 }
 
 #our-work .heading span
 {
   background-color: #f0f0f0;
 }
 
 #our-work .column
 {
-  text-align: center;
+  text-align: left;
 }
 
 .profile
 {
   text-align: center;
   margin-top: 0px;
   margin-bottom: 30px;
 }
 
 .profile-image,
@@ skipping 92 matching lines @@
 .two-sidebars .column
 {
   width: 48.75%;
 }
 
 .four-columns .column
 {
   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,
 .two-sidebars .sidebar-right
 {
   width: 23.125%;
 }
 
 .column:first-child
 {
@@ skipping 51 matching lines @@
 .ui-tabs-nav li:first-child
 {
   border-left: 1px solid #E1E1E1;
   border-top: 1px solid #E1E1E1;
 }
 
 .ui-tabs-nav li.ui-tabs-active,
 .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;
 }
 
 .ui-tabs-active .ui-tabs-anchor
 {
   cursor: default;
 }
 
@@ skipping 249 matching lines @@
   {
     display: block;
     border-top: 1px solid #eee;
   }
 
   .menu-list > li > a
   {
     display: block;
     margin: 0px;
     padding: 10px;
-    font-size: 14px
+    font-size: 14px;
   }
 
   .menu-button
   {
     position: absolute;
     top: 9px;
     right: 50px;
     height: 32px;
     padding: 0 10px;
     line-height: 32px;
@@ skipping 45 matching lines @@
     padding-right: .1em;
     border-right-width: 1px;
     border-right-width: 1px;
   }
 
   #panels-openings
   {
     margin-top: -40px;
   }
 }