Partner logos, styling

src/pages/index.js

@@ -19,6 +19,8 @@ import LogoIBM from '../images/logo-ibm-color.svg'
 import LogoRicoh from '../images/logo-ricoh-color.svg'
 import LogoKinnarps from '../images/logo-kinnarps-color.svg'
 import LogoCoor from '../images/logo-coor-color.svg'
+import LogoIMCG from '../images/logo-imcg.png'
+import LogoColounge from '../images/logo-colounge.svg'
 
 import PageTransition from 'gatsby-plugin-page-transitions'
 
@@ -87,22 +89,42 @@ const IndexPage = ({ ...props }) => (
           headline="Ambitious projects bring great responsibility"
           text="By thinking big, designing smart and developing fast, we have helped organizations of various sizes bring life to ideas and existing products. We're now eager to hear what challenges you have for us"
         />
-        <div className="p-4 md:flex items-center max-w-full justify-center">
-          <img
-            src={LogoRicoh}
-            className="opacity-50 hover:opacity-100 client-logo p-1"
-            alt="Ricoh Logo"
-          />
-          <img
-            src={LogoCoor}
-            className="opacity-50 hover:opacity-100 client-logo p-1"
-            alt="Coor Logo"
-          />
-          <img
-            src={LogoKinnarps}
-            className="opacity-50 hover:opacity-100 client-logo p-1"
-            alt="Kinnarps Logo"
-          />
+        <div className="p-4 sm:flex flex-wrap items-center max-w-full justify-around">
+          <div className="sm:w-1/2 md:w-1/5 p-2">
+            <img
+              src={LogoColounge}
+              className="opacity-50 hover:opacity-100 client-logo p-1"
+              alt="Colounge Logo"
+            />
+          </div>
+          <div className="sm:w-1/2 md:w-1/5 p-2">
+            <img
+              src={LogoRicoh}
+              className="opacity-50 hover:opacity-100 client-logo p-1"
+              alt="Ricoh Logo"
+            />
+          </div>
+          <div className="sm:w-1/3 md:w-1/5 p-2">
+            <img
+              src={LogoCoor}
+              className="opacity-50 hover:opacity-100 client-logo p-1"
+              alt="Coor Logo"
+            />
+          </div>
+          <div className="sm:w-1/3 md:w-1/5 p-2">
+            <img
+              src={LogoKinnarps}
+              className="opacity-50 hover:opacity-100 client-logo p-1"
+              alt="Kinnarps Logo"
+            />
+          </div>
+          <div className="sm:w-1/3 md:w-1/5 p-2">
+            <img
+              src={LogoIMCG}
+              className="opacity-50 hover:opacity-100 client-logo p-1"
+              alt="IMCG Logo"
+            />
+          </div>
         </div>
 
         <Button