From ef2c45cf097ced21b7f5b039e221276f2d43c5de Mon Sep 17 00:00:00 2001
From: Moris Zen <moris.pasic@gmail.com>
Date: Wed, 4 Jul 2018 20:49:13 +0200
Subject: [PATCH] Styling and restructure client section

---
 src/pages/index.js    | 34 ++++++++++++++++------------------
 src/styles/custom.css |  4 ++++
 2 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/src/pages/index.js b/src/pages/index.js
index 1e3c871..53237c2 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -50,7 +50,7 @@ const IndexPage = () => (
       </svg>
     </section>
 
-    <section className="text-center mt-12 mb-12 p-2">
+    <section className="text-center mt-12 mb-12 p-3">
       <SectionIntro
         classes="max-w-lg m-auto"
         intro="Services"
@@ -93,42 +93,40 @@ const IndexPage = () => (
           standard
           text="More About What We Do"
           url="/services"
-          classes="m-1 rounded-full text-black hover:shadow"
+          classes="m-1 rounded-full text-grey-darker hover:shadow"
         />
         <Button
           standard
           text="How We Work"
-          url="/work"
-          classes="m-1 rounded-full text-black hover:shadow"
+          url="/how-we-work"
+          classes="m-1 rounded-full text-grey-darker hover:shadow"
         />
       </div>
     </section>
 
-    <section className="text-center p-3">
-      <SectionIntro
-        intro="Showcase"
-        headline="We don’t descriminate, all screens & devices are welcome"
-      />
-    </section>
-
-    <section className="text-center p-3">
+    <section className="text-center p-3 mt-8">
       <SectionIntro
+        classes="max-w-lg m-auto"
         intro="Clients"
         headline="With ambitious projects comes great responsibility"
         text="We think big, design smart and develop fast for all projects and teams. Currently we’re serving everything from global leaders to startups and we tailor our processes based on your scale and needs. We have helped some of the worlds leading enterprises and businesses bring ideas to life and we’re really interested in hearing what we can help you with"
       />
-      <div className="lg:flex items-center">
-        <img src={LogoIBM} alt="IBM Logo" />
-        <img src={LogoRicoh} alt="Ricoh Logo" />
-        <img src={LogoKinnarps} alt="Kinnarps Logo" />
-        <img src={LogoCoor} alt="Coor Logo" />
+      <div className="p-4 lg:flex items-center max-w-full  justify-center">
+        <img src={LogoIBM} className="client-logo p-1" alt="IBM Logo" />
+        <img src={LogoRicoh} className="client-logo p-1" alt="Ricoh Logo" />
+        <img src={LogoCoor} className="client-logo p-1" alt="Coor Logo" />
+        <img
+          src={LogoKinnarps}
+          className="client-logo p-1"
+          alt="Kinnarps Logo"
+        />
       </div>
 
       <Button
         filled
         text="Let's Build Together"
         url="/proposal"
-        classes="rounded-full"
+        classes="shadow-md hover:shadow-lg rounded-full mt-4 font-light btn-saburly-green mb-20"
       />
     </section>
 
diff --git a/src/styles/custom.css b/src/styles/custom.css
index 931a0d9..8fcfa6d 100644
--- a/src/styles/custom.css
+++ b/src/styles/custom.css
@@ -30,3 +30,7 @@
     rgba(0, 177, 186, 1) 55%
   );
 }
+
+.client-logo {
+  max-height: 4rem;
+}