diff --git a/components/Loyalty/Sidebar/index.tsx b/components/Loyalty/Sidebar/index.tsx
index 85afa27c4..12cdc81f6 100644
--- a/components/Loyalty/Sidebar/index.tsx
+++ b/components/Loyalty/Sidebar/index.tsx
@@ -2,6 +2,8 @@ import JsonToHtml from "@/components/JsonToHtml"
 
 import JoinLoyaltyContact from "./JoinLoyalty"
 
+import styles from "./sidebar.module.css"
+
 import { SidebarProps } from "@/types/components/loyalty/sidebar"
 import { SidebarTypenameEnum } from "@/types/requests/loyaltyPage"
 
@@ -9,10 +11,12 @@ export default function SidebarLoyalty({ block }: SidebarProps) {
   switch (block.__typename) {
     case SidebarTypenameEnum.LoyaltyPageSidebarContent:
       return (
-        <JsonToHtml
-          embeds={block.content.content.embedded_itemsConnection.edges}
-          nodes={block.content.content.json.children}
-        />
+        <section className={styles.content}>
+          <JsonToHtml
+            embeds={block.content.content.embedded_itemsConnection.edges}
+            nodes={block.content.content.json.children}
+          />
+        </section>
       )
     case SidebarTypenameEnum.LoyaltyPageSidebarJoinLoyaltyContact:
       return <JoinLoyaltyContact block={block.join_loyalty_contact} />
diff --git a/components/Loyalty/Sidebar/sidebar.module.css b/components/Loyalty/Sidebar/sidebar.module.css
new file mode 100644
index 000000000..71e960078
--- /dev/null
+++ b/components/Loyalty/Sidebar/sidebar.module.css
@@ -0,0 +1,9 @@
+.content {
+  padding: 0 1.6rem;
+}
+
+@media screen and (min-width: 950px) {
+  .content {
+    padding: 0;
+  }
+}