diff --git a/src/pages/index.js b/src/pages/index.js
index 1e94d8a7..9f3ba3fd 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -15,6 +15,7 @@ import GoogleLogo from '../resources/google.svg'
import ARMLogo from '../resources/arm.svg'
import EricssonLogo from '../resources/ericsson.svg'
import SAPLogo from '../resources/sap.svg'
+import Arduino from '../resources/arduino.svg'
import IconExtension from '../resources/icon-extension.svg'
import IconCloudScreen from '../resources/icon-cloud-screen.svg'
import IconOpenSource from '../resources/icon-open-source.svg'
@@ -99,6 +100,12 @@ const Index = styled.div`
justify-content: space-between;
flex-wrap: wrap;
+ @media(min-width: 768px) {
+ display: grid;
+ grid-template-columns: repeat(4, 1fr);
+ grid-row-gap: 80px;
+ }
+
@media(max-width: 50rem) {
text-align: center;
}
@@ -112,10 +119,19 @@ const Index = styled.div`
&-container {
height: 4rem;
+ @media(min-width: 768px) {
+ height: 4.5rem;
+ text-align: center;
+ }
+
@media(max-width: 50rem) {
width: 40%;
margin-bottom: 4rem;
}
+
+ @media(max-width: 30rem) {
+ width: 100%;
+ }
}
&--ericsson {
@@ -390,6 +406,11 @@ export default () => {