More footer reponsivness

source/_patterns/02-organisms/00-global/footer.mustache

 <footer class="footer bg-grey-700 text-white">
-  <div class="footer__main py-4 lg:py-8 container container--default">
+  <div class="footer__main py-4 lg:py-16 container container--default">
     <section class="footer__brand">
       <img
         src="https://www.va-fighters.com/pirati/krajska-sablona/dist/assets/img/logo.svg"
@@ -60,35 +60,37 @@
         {{> molecules-basic-social-icon-group(classes: "text-white pb-4") }}
         {{> atoms-basic-contact-line(icon: "fas fa-envelope", caption: "Dejte nám vědět") }}
       </div>
-      {{> atoms-icon-button(cta: "Přispěj", icon: "fas fa-hand-holding-usd", classes: "btn--white btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth mb-2") }}
-      {{> atoms-icon-button(cta: "Naloď se", icon: "fas fa-anchor", classes: "btn--green-100 btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth") }}
+      <div class="flex flex-col md:flex-row lg:flex-col lg:items-end space-y-2 md:space-y-0 md:space-x-2 lg:space-x-0 lg:space-y-2">
+        {{> atoms-icon-button(cta: "Přispěj", icon: "fas fa-hand-holding-usd", classes: "btn--white btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth") }}
+        {{> atoms-icon-button(cta: "Naloď se", icon: "fas fa-anchor", classes: "btn--green-100 btn--hoveractive text-lg btn--fullwidth sm:btn--autowidth") }}
+      </div>
     </section>
   </div>
   <section class="footer__sub-links lg:border-t border-grey-400">
     <div class="container container--default">
       <div class="flex flex-col lg:flex-row lg:space-x-4 lg:items-center py-4 lg:py-8 border-t border-grey-400 lg:border-t-0">
         <span class="lg:w-1/4 text-xl uppercase text-white">Otevřenost</span>
-        <ul class="lg:w-2/4 grid grid-cols-1 lg:grid-cols-3 lg:gap-4 items-center mt-6 space-y-2 lg:mt-0 lg:space-y-0 text-grey-200">
-          <li>
+        <ul class="lg:w-2/4 lg:pr-8 grid grid-cols-1 lg:grid-cols-3 lg:gap-4 items-center mt-6 space-y-2 lg:mt-0 lg:space-y-0 text-grey-200">
+          <li class="w-full">
             <a href="#">Transparentní účet</a>
           </li>
-          <li>
+          <li class="w-full">
             <a href="#">Registr smluv</a>
           </li>
-          <li>
+          <li class="w-full">
             <a href="#">Otevřené účetnictví</a>
           </li>
         </ul>
       </div>
     </div>
   </section>
-  <section class="footer-section bg-black py-4 md:py-8">
+  <section class="footer-section bg-black py-4 lg:py-12">
     <div class="container container--default">
       <div class="grid grid-cols-1 lg:grid-cols-3 xl:grid-cols-4 gap-4">
         {{> molecules-condensed-badge(hideOccupation: true) }}
         {{> molecules-condensed-badge(hideOccupation: true) }}
         {{> molecules-condensed-badge(hideOccupation: true) }}
-        <div class="lg:col-span-3 xl:col-span-1 lg:mt-0 lg:text-center xl:text-right">
+        <div class="lg:col-span-3 xl:col-span-1 lg:mt-4 xl:mt-0 lg:text-center xl:text-right">
           {{> atoms-basic-button(cta: "Kontakt", classes: "btn--white btn--hoveractive btn--fullwidth lg:btn--autowidth text-lg btn--fading") }}
         </div>
       </div>