diff --git a/src/components/Button.js b/src/components/Button.js
index 5b3a6e3..bb0b9bd 100644
--- a/src/components/Button.js
+++ b/src/components/Button.js
@@ -2,7 +2,7 @@ import React from 'react'
 import Link from 'gatsby-link'
 
 let defaultClasses =
-  'px-6 py-3 leading-none inline-block text-sm no-underline uppercase'
+  'px-6 py-2 leading-none inline-block text-sm no-underline uppercase'
 
 let standardBtn = 'border hover:bg-teal hover:text-white hover:border-teal'
 
diff --git a/src/components/Footer.js b/src/components/Footer.js
index 6eb3579..17fedf2 100644
--- a/src/components/Footer.js
+++ b/src/components/Footer.js
@@ -4,6 +4,11 @@ import Button from './Button'
 
 import LogoSaburly from '../images/logo-saburly-colorful.svg'
 
+import Facebook from '../images/facebook.svg'
+import Instagram from '../images/instagram.svg'
+import Twitter from '../images/twitter.svg'
+import LinkedIn from '../images/linkedin.svg'
+
 let menuClasses =
   'no-underline mt-4 lg:inline-block opacity-100 lg:mt-0 text-white  hover:opacity-100 uppercase mr-4'
 
@@ -12,12 +17,52 @@ const Footer = () => (
     <div className="container mx-auto pt-10 pb-10 lg:flex">
       <div className="lg:w-1/4 p-4">
         <img src={LogoSaburly} alt="Saburly Logo" className="max-w-full" />
-        <a href="mailto:info@saburly.com">E: info@saburly.com</a>
-        <a href="tel:+46760477717">P: +46760477717</a>
+        <div className="flex justify-between social-icons py-2">
+          <div>
+            <img
+              src={Facebook}
+              alt="Facebook Social Media"
+              className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
+            />
+          </div>
+          <div>
+            <img
+              src={Instagram}
+              alt="Instagram Social Media"
+              className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
+            />
+          </div>
+          <div>
+            <img
+              src={Twitter}
+              alt="Twitter Social Media"
+              className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
+            />
+          </div>
+          <div>
+            <img
+              src={LinkedIn}
+              alt="LinkedIn Social Media"
+              className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
+            />
+          </div>
+        </div>
+        <a
+          className="opacity-70 hover:opacity-100 pb-1 no-underline text-white block"
+          href="mailto:info@saburly.com"
+        >
+          E-mail: info@saburly.com
+        </a>
+        <a
+          className="opacity-70 hover:opacity-100 pt-1 no-underline text-white block"
+          href="tel:+46760477717"
+        >
+          Phone: +46760477717
+        </a>
       </div>
 
       <div className="lg:w-3/4 ml-10 p-4">
-        <div className="lg:flex items-center justify-between">
+        <div className="lg:flex items-center justify-around">
           <h3 className="text-white font-light">
             Let's start a new project together
           </h3>
@@ -31,7 +76,7 @@ const Footer = () => (
 
         <div className="mt-4 lg:flex justify-between">
           <nav>
-            <p className="font-thin text-white opacity-70">Sitemap</p>
+            <p className="font-thin text-white opacity-50">Sitemap</p>
             <ul className="list-reset text-sm inline-block">
               <Link className="block my-2" to="/">
                 <li className={menuClasses}>Home</li>
@@ -48,14 +93,14 @@ const Footer = () => (
             </ul>
           </nav>
           <div>
-            <p className="font-thin text-white opacity-70">Office - Sweden</p>
-            <p className="text-white my-2 leading-normal">
+            <p className="font-thin text-white opacity-50">Office - Sweden</p>
+            <p className="text-white my-2 opacity-80 leading-normal">
               Saburly AB<br />Vretenvägen 13<br />171 54 Solna<br />Sweden
             </p>
           </div>
           <div>
-            <p className="font-thin text-white opacity-70">Office - Bosnia</p>
-            <p className="text-white my-2 leading-normal">
+            <p className="font-thin text-white opacity-50">Office - Bosnia</p>
+            <p className="text-white my-2 opacity-80 leading-normal">
               Saburly d.o.o<br />Hakije Turajlica 2<br />71 000 Sarajevo<br />Bosnia
               & Herzegovina
             </p>
diff --git a/src/images/facebook.svg b/src/images/facebook.svg
new file mode 100644
index 0000000..e16b208
--- /dev/null
+++ b/src/images/facebook.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<title  id="simpleicons-facebook-icon">Facebook icon</title>
+<path class="st0" d="M22.7,0H1.3C0.6,0,0,0.6,0,1.3v21.4C0,23.4,0.6,24,1.3,24h11.5v-9.3H9.7v-3.6h3.1V8.4c0-3.1,1.9-4.8,4.7-4.8
+	c1.3,0,2.5,0.1,2.8,0.1V7h-1.9c-1.5,0-1.8,0.7-1.8,1.8v2.3h3.6l-0.5,3.6h-3.1V24h6.1c0.7,0,1.3-0.6,1.3-1.3V1.3
+	C24,0.6,23.4,0,22.7,0"/>
+</svg>
diff --git a/src/images/instagram.svg b/src/images/instagram.svg
new file mode 100644
index 0000000..19b206e
--- /dev/null
+++ b/src/images/instagram.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<title  id="simpleicons-instagram-icon">Instagram icon</title>
+<path class="st0" d="M12,0C8.7,0,8.3,0,7.1,0.1C5.8,0.1,4.9,0.3,4.1,0.6C3.4,0.9,2.7,1.3,2,2S0.9,3.3,0.6,4.1
+	C0.3,4.9,0.1,5.8,0.1,7.1C0,8.3,0,8.7,0,12s0,3.7,0.1,4.9c0.1,1.3,0.3,2.1,0.6,2.9C0.9,20.6,1.3,21.3,2,22c0.7,0.7,1.3,1.1,2.1,1.4
+	c0.8,0.3,1.6,0.5,2.9,0.6C8.3,24,8.7,24,12,24s3.7,0,4.9-0.1c1.3-0.1,2.1-0.3,2.9-0.6c0.8-0.3,1.5-0.7,2.1-1.4
+	c0.7-0.7,1.1-1.3,1.4-2.1c0.3-0.8,0.5-1.6,0.6-2.9C24,15.7,24,15.3,24,12s0-3.7-0.1-4.9c-0.1-1.3-0.3-2.1-0.6-2.9
+	C23.1,3.4,22.7,2.7,22,2c-0.7-0.7-1.3-1.1-2.1-1.4c-0.8-0.3-1.6-0.5-2.9-0.6C15.7,0,15.3,0,12,0z M12,2.2c3.2,0,3.6,0,4.9,0.1
+	c1.2,0.1,1.8,0.2,2.2,0.4c0.6,0.2,1,0.5,1.4,0.9c0.4,0.4,0.7,0.8,0.9,1.4c0.2,0.4,0.4,1.1,0.4,2.2c0.1,1.3,0.1,1.6,0.1,4.8
+	s0,3.6-0.1,4.9c-0.1,1.2-0.3,1.8-0.4,2.2c-0.2,0.6-0.5,1-0.9,1.4c-0.4,0.4-0.8,0.7-1.4,0.9c-0.4,0.2-1.1,0.4-2.2,0.4
+	c-1.3,0.1-1.6,0.1-4.9,0.1c-3.2,0-3.6,0-4.9-0.1c-1.2-0.1-1.8-0.3-2.2-0.4c-0.6-0.2-1-0.5-1.4-0.9c-0.4-0.4-0.7-0.8-0.9-1.4
+	c-0.2-0.4-0.4-1.1-0.4-2.2c0-1.3-0.1-1.6-0.1-4.8c0-3.2,0-3.6,0.1-4.9C2.2,6,2.4,5.3,2.6,4.9c0.2-0.6,0.5-1,0.9-1.4
+	c0.4-0.4,0.8-0.7,1.4-0.9c0.4-0.2,1.1-0.4,2.2-0.4C8.4,2.1,8.7,2.1,12,2.2C12,2.1,12,2.2,12,2.2z M12,5.8c-3.4,0-6.2,2.8-6.2,6.2
+	c0,3.4,2.8,6.2,6.2,6.2c3.4,0,6.2-2.8,6.2-6.2C18.2,8.6,15.4,5.8,12,5.8z M12,16c-2.2,0-4-1.8-4-4s1.8-4,4-4s4,1.8,4,4
+	S14.2,16,12,16z M19.8,5.6c0,0.8-0.6,1.4-1.4,1.4C17.6,7,17,6.4,17,5.6s0.6-1.4,1.4-1.4C19.2,4.2,19.8,4.8,19.8,5.6z"/>
+</svg>
diff --git a/src/images/linkedin.svg b/src/images/linkedin.svg
new file mode 100644
index 0000000..2e8e29c
--- /dev/null
+++ b/src/images/linkedin.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<title  id="simpleicons-linkedin-icon">LinkedIn icon</title>
+<path class="st0" d="M20.4,20.5h-3.6v-5.6c0-1.3,0-3-1.9-3c-1.9,0-2.1,1.4-2.1,2.9v5.7H9.4V9h3.4v1.6h0c0.5-0.9,1.6-1.9,3.4-1.9
+	c3.6,0,4.3,2.4,4.3,5.5L20.4,20.5L20.4,20.5z M5.3,7.4c-1.1,0-2.1-0.9-2.1-2.1c0-1.1,0.9-2.1,2.1-2.1c1.1,0,2.1,0.9,2.1,2.1
+	C7.4,6.5,6.5,7.4,5.3,7.4z M7.1,20.5H3.6V9h3.6V20.5z M22.2,0H1.8C0.8,0,0,0.8,0,1.7v20.5c0,1,0.8,1.7,1.8,1.7h20.5
+	c1,0,1.8-0.8,1.8-1.7V1.7C24,0.8,23.2,0,22.2,0L22.2,0z"/>
+</svg>
diff --git a/src/images/twitter.svg b/src/images/twitter.svg
new file mode 100644
index 0000000..ecf29d0
--- /dev/null
+++ b/src/images/twitter.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFFFF;}
+</style>
+<title  id="simpleicons-twitter-icon">Twitter icon</title>
+<path class="st0" d="M24,4.6c-0.9,0.4-1.8,0.7-2.8,0.8c1-0.6,1.8-1.6,2.2-2.7c-1,0.6-2,1-3.1,1.2c-0.9-1-2.2-1.6-3.6-1.6
+	c-2.7,0-4.9,2.2-4.9,4.9c0,0.4,0,0.8,0.1,1.1C7.7,8.1,4.1,6.1,1.6,3.2C1.2,3.9,1,4.7,1,5.6c0,1.7,0.9,3.2,2.2,4.1
+	c-0.8,0-1.6-0.2-2.2-0.6v0.1c0,2.4,1.7,4.4,3.9,4.8c-0.4,0.1-0.8,0.2-1.3,0.2c-0.3,0-0.6,0-0.9-0.1c0.6,2,2.4,3.4,4.6,3.4
+	c-1.7,1.3-3.8,2.1-6.1,2.1c-0.4,0-0.8,0-1.2-0.1c2.2,1.4,4.8,2.2,7.6,2.2c9.1,0,14-7.5,14-14c0-0.2,0-0.4,0-0.6
+	C22.5,6.4,23.3,5.6,24,4.6C24,4.6,24,4.6,24,4.6z"/>
+</svg>
diff --git a/src/styles/custom.css b/src/styles/custom.css
index 32cfbcb..f334611 100644
--- a/src/styles/custom.css
+++ b/src/styles/custom.css
@@ -34,5 +34,5 @@
 }
 
 .client-logo {
-  max-height: 4rem;
+  max-height: 3rem;
 }
diff --git a/src/styles/index.css b/src/styles/index.css
index 64fab05..1b9a246 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -3094,6 +3094,34 @@ table {
   max-height: 100vh;
 }
 
+.max-w-1 {
+  max-width: 1rem;
+}
+
+.max-w-2 {
+  max-width: 2rem;
+}
+
+.max-w-3 {
+  max-width: 3rem;
+}
+
+.max-w-4 {
+  max-width: 4rem;
+}
+
+.max-w-5 {
+  max-width: 5rem;
+}
+
+.max-w-10 {
+  max-width: 10rem;
+}
+
+.max-w-2\.5 {
+  max-width: 2.5rem;
+}
+
 .max-w-xs {
   max-width: 20rem;
 }
@@ -7370,6 +7398,34 @@ table {
     max-height: 100vh;
   }
 
+  .sm\:max-w-1 {
+    max-width: 1rem;
+  }
+
+  .sm\:max-w-2 {
+    max-width: 2rem;
+  }
+
+  .sm\:max-w-3 {
+    max-width: 3rem;
+  }
+
+  .sm\:max-w-4 {
+    max-width: 4rem;
+  }
+
+  .sm\:max-w-5 {
+    max-width: 5rem;
+  }
+
+  .sm\:max-w-10 {
+    max-width: 10rem;
+  }
+
+  .max-w-2\.sm\:5 {
+    max-width: 2.5rem;
+  }
+
   .sm\:max-w-xs {
     max-width: 20rem;
   }
@@ -11631,6 +11687,34 @@ table {
     max-height: 100vh;
   }
 
+  .md\:max-w-1 {
+    max-width: 1rem;
+  }
+
+  .md\:max-w-2 {
+    max-width: 2rem;
+  }
+
+  .md\:max-w-3 {
+    max-width: 3rem;
+  }
+
+  .md\:max-w-4 {
+    max-width: 4rem;
+  }
+
+  .md\:max-w-5 {
+    max-width: 5rem;
+  }
+
+  .md\:max-w-10 {
+    max-width: 10rem;
+  }
+
+  .max-w-2\.md\:5 {
+    max-width: 2.5rem;
+  }
+
   .md\:max-w-xs {
     max-width: 20rem;
   }
@@ -15892,6 +15976,34 @@ table {
     max-height: 100vh;
   }
 
+  .lg\:max-w-1 {
+    max-width: 1rem;
+  }
+
+  .lg\:max-w-2 {
+    max-width: 2rem;
+  }
+
+  .lg\:max-w-3 {
+    max-width: 3rem;
+  }
+
+  .lg\:max-w-4 {
+    max-width: 4rem;
+  }
+
+  .lg\:max-w-5 {
+    max-width: 5rem;
+  }
+
+  .lg\:max-w-10 {
+    max-width: 10rem;
+  }
+
+  .max-w-2\.lg\:5 {
+    max-width: 2.5rem;
+  }
+
   .lg\:max-w-xs {
     max-width: 20rem;
   }
@@ -20153,6 +20265,34 @@ table {
     max-height: 100vh;
   }
 
+  .xl\:max-w-1 {
+    max-width: 1rem;
+  }
+
+  .xl\:max-w-2 {
+    max-width: 2rem;
+  }
+
+  .xl\:max-w-3 {
+    max-width: 3rem;
+  }
+
+  .xl\:max-w-4 {
+    max-width: 4rem;
+  }
+
+  .xl\:max-w-5 {
+    max-width: 5rem;
+  }
+
+  .xl\:max-w-10 {
+    max-width: 10rem;
+  }
+
+  .max-w-2\.xl\:5 {
+    max-width: 2.5rem;
+  }
+
   .xl\:max-w-xs {
     max-width: 20rem;
   }
diff --git a/tailwind.config.js b/tailwind.config.js
index 6f959a7..0d7a7c9 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -574,6 +574,13 @@ module.exports = {
   */
 
   maxWidth: {
+    '1': '1rem',
+    '2': '2rem',
+    '2.5': '2.5rem',
+    '3': '3rem',
+    '4': '4rem',
+    '5': '5rem',
+    '10': '10rem',
     xs: '20rem',
     sm: '30rem',
     md: '40rem',