Styling and restructure client section

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>
 

src/styles/custom.css

@@ -30,3 +30,7 @@
     rgba(0, 177, 186, 1) 55%
   );
 }
+
+.client-logo {
+  max-height: 4rem;
+}