[FIX]

contact

main/styleguide/source/_patterns/templates/contact.mustache

@@ -5,8 +5,8 @@
 <main role="main">
   <div class="grid-container">
     <section class="grid-content-with-right-side flex flex-wrap mb-16">
-      <div>
-        <h2 class="font-alt text-4xl mb-5">
+      <div class="mb-12 md:mb-0">
+        <h2 class="font-alt text-3xl sm:text-4xl mb-5">
           Kontakty pro veřejnost
         </h2>
         <div class="flex flex-wrap justify-between">
@@ -30,7 +30,7 @@
             </a><br>
             <br>
           </div>
-          <div class="leading-5 w-5/12">
+          <div class="leading-5 w-5/6 sm:w-5/12">
             <span class="font-bold">Informační linka:</span><br/>
             +420 703 681 682<br/>
             +420 608 963 111<br/>
@@ -67,7 +67,7 @@
       <h2 class="font-alt text-4xl mb-5">
         Další kontakty
       </h2>
-      <div class="flex flex-wrap">
+      <div class="flex flex-wrap xs:justify-center">
         <div class="contact-box">
           <div>
             <div class="h-16 mx-auto w-16">
@@ -138,14 +138,14 @@
       <h2 class="font-alt text-4xl mb-5">
         Kontakty pro média
       </h2>
-      <div class="flex flex-wrap">
+      <div class="flex flex-wrap justify-center">
         <div class="flex mr-4 person-box">
           <div class="mr-7">
-            <img class="rounded-full shadow-sm w-40 mb-2" src="https://randomuser.me/api/portraits/women/26.jpg"
+            <img class="rounded-full shadow-sm w-20 sm:w-40 mb-2" src="https://randomuser.me/api/portraits/women/26.jpg"
                  alt="user image">
           </div>
           <div class="flex flex-col py-4">
-            <h6 class="font-bold text-3xl">
+            <h6 class="font-bold text-2xl sm:text-3xl">
               Veronika Šmídová
             </h6>
             <span class="mb-6 text-grey-300">
@@ -161,11 +161,11 @@
         </div>
         <div class="flex mr-4 person-box">
           <div class="mr-7">
-            <img class="rounded-full shadow-sm w-40 mb-2" src="https://randomuser.me/api/portraits/women/26.jpg"
+            <img class="rounded-full shadow-sm w-20 sm:w-40" src="https://randomuser.me/api/portraits/women/26.jpg"
                  alt="user image">
           </div>
           <div class="flex flex-col py-4">
-            <h6 class="font-bold text-3xl">
+            <h6 class="font-bold text-2xl sm:text-3xl">
               Veronika Šmídová
             </h6>
             <span class="mb-6 text-grey-300">

main/styleguide/tailwind.config.js

@@ -30,6 +30,7 @@ module.exports = {
         },
         // Breakpoints
         screens: {
+            'xs': '480px',
             'sm': '576px',
             'md': '768px',
             'lg': '992px',