Merge branch 'feature/pirati-cz' into feature/5-ajax-content-na-homepage

main/styleguide/source/_patterns/molecules/box-link.mustache

-<div class="m-1 w-96 h-72 flex bg-white flex-col items-center justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80">
+<div class="w-96 h-72 flex bg-white flex-col items-center justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80">
   <img src="https://i.picsum.photos/id/865/90/100.jpg?hmac=0E2Zv4lGASwKCcZxquMc_v2Y3Rg68gw21euyRQ1bu80" alt=""
        class="mb-8 max-w-20 max-h-20">
   <h5 class="head-4xl mb-8">naloď se k pirátům</h5>

main/styleguide/source/_patterns/molecules/representative-box.mustache

-<div class="w-full max-w-xs mb-1 w-80 h-80 flex flex-col items-center justify-center"
+<div class="w-96 h-60 flex bg-white flex-col items-center bg-cover justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80"
      style="background-image: url('https://i.picsum.photos/id/261/350/350.jpg?hmac=GOGR4Va2TTfzr3sxRHwTlAxqhpu4M_pl_oKex2O7fcQ')">
   <h5 class="head-alt-md text-white mt-24 mb-8">poslanci za piráty</h5>
   <a href="" class="btn btn__slide__wrap w-32 mt-">

main/styleguide/source/_patterns/organisms/box-links-section.mustache

-<div class="bg-cover bg-no-repeat relative section-clip py-16 xl:h-screen lg:py-36"
+<div class="bg-cover bg-no-repeat section-clip py-16 xl:h-screen lg:py-36"
      style="background-image: url('../../images/background-images/bg-join-us.jpg')">
   <div class="container--wide mx-auto z-10">
     <h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
       Buď v tom s námi
     </h2>
-    <div class="flex flex-wrap gap-1 justify-center items-center md:flex-row">
+    <div class="flex flex-wrap gap-2 md:gap-1 justify-center items-center md:flex-row">
       {{> molecules-box-link }}
       {{> molecules-box-link }}
       {{> molecules-box-link }}

main/styleguide/source/_patterns/organisms/representatives-section.mustache

-<div class="container--medium mb-8 lg:mb-16">
-  <h2 class="head-7xl text-center mb-6 xl:mb-28">
+<div class="container--medium mb-8 xl:h-screen flex flex-col justify-center lg:mb-16">
+  <h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
     Piráti zastupují občany
   </h2>
-  <div class="flex flex-wrap space-x-1 justify-center items-center">
+  <div class="flex flex-wrap space-x-1 justify-center gap-2 md:gap-1 items-center">
     {{> molecules-representative-box }}
     {{> molecules-representative-box }}
     {{> molecules-representative-box }}