diff --git a/components/cards-public-page.html b/components/cards-public-page.html
index 16e007f..d65fb78 100644
--- a/components/cards-public-page.html
+++ b/components/cards-public-page.html
@@ -10,7 +10,7 @@
 
   <h1 class="sg-main-heading">Components – Cards Public Page</h1>
 
-  <main aria-label="Cards Public Page" class="sg-cards-public-page__main">
+  <main aria-label="Cards Public Page">
 
     <section id="component-content-wrapper-card">
       <p class="sg-preview-label">Component: Content Wrapper Card</p>
diff --git a/styles/40-components-cards.css b/styles/40-components-cards.css
index a4c568d..82e3bf0 100644
--- a/styles/40-components-cards.css
+++ b/styles/40-components-cards.css
@@ -226,17 +226,8 @@
   width: 100%;
 }
 
-.sg-page-cards-public-page {
-  padding: 0;
-}
-
 .sg-page-cards-public-page > .sg-main-heading {
   margin: 0 0 var(--spacing-large) 0;
-  padding-inline: var(--spacing-small);
-}
-
-.sg-page-cards-public-page .sg-cards-public-page__main {
-  width: 100%;
 }
 
 .sg-page-cards .sg-preview-area > .sg-card,
@@ -245,6 +236,10 @@
   max-width: none;
 }
 
+.sg-page-cards-public-page #component-content-wrapper-card {
+  margin-inline: calc(-1 * var(--spacing-small));
+}
+
 .sg-page-cards-public-page #component-content-wrapper-card > .sg-transparent-card {
   width: 100%;
   max-width: none;