Fix: responsiveness issue#5693

src/collections/blog/2023/08-21-layer5-badge-program/blog.style.js

@@ -48,5 +48,8 @@ export const Blog = styled.div`
     div.badge-grid > div {
       max-width: 95%;
     }
+    img.badge-modal{
+      max-width: 95%;
+  }
   }
 `;

src/collections/blog/2023/08-21-layer5-badge-program/index.mdx

@@ -74,7 +74,7 @@ Earning Layer5 Badges is both exciting and achievable. As you continue to contri
 
 <p>To share your badges on other social profiles, utilize the provided embedded code and direct share functionality. Access your badges from the Layer5 Cloud profile badges section, and then use it to post your achievements on social media platforms seamlessly. This enables you to showcase your Layer5 contributions and milestones to a wider audience.</p>
 
-<h2 align="center" style="display:block;width:100%;">Layer5 Badges</h2>
+<h2 align="center" style="display:block;width:100%;clear:right;">Layer5 Badges</h2>
 
 <h3>Achievement Badges</h3>
 <div class="badge-grid">

src/components/Call-To-Actions/CTA_Bottom/index.js

@@ -44,6 +44,19 @@ const CTA_BottomWrapper = styled.div`
     button {
         width: fit-content; 
     }
+
+  @media(max-width: 600px){
+    flex-direction: column-reverse;
+    height: auto;
+
+    img{
+      max-width: 95%;
+    }
+
+    .cta-content{
+      max-width: none;
+    }
+  }
 `;
 
 const defaultHeading = "Layer5 Community";

src/sections/app.style.js

@@ -105,6 +105,7 @@ h3 {
     font-weight: 500;
     @media (max-width: 62rem) {
       font-size: 1.5rem;
+      text-align: center;
     }
 }