diff --git a/styleguide/src/Layout/Box/Box.spec.tsx b/styleguide/src/Layout/Box/Box.spec.tsx
index 05f79485..5821eab9 100644
--- a/styleguide/src/Layout/Box/Box.spec.tsx
+++ b/styleguide/src/Layout/Box/Box.spec.tsx
@@ -18,13 +18,13 @@ describe('Box tests', () => {
         cy.get('.box-header .indicator-status').contains('Some status')
         cy.get('.box-header .tabs button').should('have.length', 3)
         cy.get('.box-content').contains('Box Content')
-        cy.get('.box-content').should('have.class', 'lg:px-10')
+        cy.get('.box-content').should('have.class', 'lg:p-10')
       })
   })
 
   it('Small', () => {
     mount(<Default variant="small" />)
-    cy.get('.box .box-content').should('not.have.class', 'lg:px-10')
+    cy.get('.box .box-content').should('not.have.class', 'lg:p-10')
   })
 
   it('WithAction', () => {
diff --git a/styleguide/src/Layout/Box/Components/Separator/BoxSeparator.tsx b/styleguide/src/Layout/Box/Components/Separator/BoxSeparator.tsx
index d0056dd3..2effcf1d 100644
--- a/styleguide/src/Layout/Box/Components/Separator/BoxSeparator.tsx
+++ b/styleguide/src/Layout/Box/Components/Separator/BoxSeparator.tsx
@@ -3,8 +3,8 @@ import React, { useContext } from 'react'
 import { SharedContext } from '../utils'
 
 const listOfMarginVariants = {
-  default: `my-5 -mx-6 lg:my-8 lg:-mx-10`,
-  small: `my-5 -mx-6`,
+  default: `my-6 -mx-6 lg:my-10 lg:-mx-10`,
+  small: `my-6 -mx-6`,
 }
 
 export const BoxSeparator = () => {
diff --git a/styleguide/src/Layout/Box/Components/utils.ts b/styleguide/src/Layout/Box/Components/utils.ts
index a969852a..94813f13 100644
--- a/styleguide/src/Layout/Box/Components/utils.ts
+++ b/styleguide/src/Layout/Box/Components/utils.ts
@@ -17,6 +17,6 @@ export const defaultPaddingVariantsHeader = {
 }
 
 export const defaultPaddingVariantsContent = {
-  default: `px-6 py-5 lg:px-10 lg:py-8`,
-  small: `px-6 py-5`,
+  default: `p-6 lg:p-10`,
+  small: `p-6`,
 }