From 7e749b2e253b423a2ea8e3d28677efb543363b2b Mon Sep 17 00:00:00 2001
From: Julia Mehringer <j.mehringer@techdivision.com>
Date: Mon, 21 Oct 2024 16:49:26 +0200
Subject: [PATCH] EDERCMS-0 fix cards for mobile

---
 blocks/cards/cards.css | 30 ++++++++++++++++++++++--------
 1 file changed, 22 insertions(+), 8 deletions(-)

diff --git a/blocks/cards/cards.css b/blocks/cards/cards.css
index aea2d3a..b0599d6 100644
--- a/blocks/cards/cards.css
+++ b/blocks/cards/cards.css
@@ -124,20 +124,17 @@
 .cards.third-width > ul,
 .cards.half-width > ul {
   display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(370px, 1fr));
+  grid-template-columns: 1fr;
   grid-gap: var(--spacing-simple);
 }
 
-/* styling half-width cards with brand logo */
+  /* styling half-width cards with brand logo */
 .cards.half-width .cards-card-image + .cards-card-image {
   max-width: 80px;
-  position: absolute;
-  right: var(--spacing-simple);
+  position: relative;
+  padding-right: var(--spacing-simple);
   margin-top: var(--spacing-simple);
-}
-
-.cards.half-width .cards-card-image + .cards-card-image + .cards-card-body {
-  padding-right: 110px;
+  margin-left: auto;
 }
 
 @media (width >= 600px) {
@@ -150,7 +147,24 @@
     padding-bottom: 130px;
   }
 
+  .cards.third-width > ul,
   .cards.half-width > ul {
     grid-template-columns: 1fr 1fr;
   }
 }
+
+@media (width >= 900px) {
+  .cards.third-width > ul {
+    grid-template-columns: 1fr 1fr 1fr;
+  }
+
+  .cards.half-width .cards-card-image + .cards-card-image + .cards-card-body {
+    padding-right: 110px;
+  }
+
+  .cards.half-width .cards-card-image + .cards-card-image {
+    position: absolute;
+    right: var(--spacing-simple);
+    padding-right: 0;
+  }
+}