diff --git a/libs/portal-layout-styles/src/styles/primeng/sass/theme/designer/components/overlay/_dialog.scss b/libs/portal-layout-styles/src/styles/primeng/sass/theme/designer/components/overlay/_dialog.scss
index 29ccec44..c27ef581 100644
--- a/libs/portal-layout-styles/src/styles/primeng/sass/theme/designer/components/overlay/_dialog.scss
+++ b/libs/portal-layout-styles/src/styles/primeng/sass/theme/designer/components/overlay/_dialog.scss
@@ -63,7 +63,7 @@
   }
 }
 
-@media (max-width: $mobileBreakpoint) {
+@media (max-width: $smallScreenBreakpoint) {
   .p-dialog.p-dialog {
     transition: none;
     transform: none;
diff --git a/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss b/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss
index 814dce71..5305c161 100644
--- a/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss
+++ b/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss
@@ -7,3 +7,4 @@ $animationTimingFunction: cubic-bezier(0.05, 0.74, 0.2, 0.99) !default;
 $letterSpacing: normal !default;
 $transitionDuration: 0.2s !default;
 $mobileBreakpoint: 991px !default;
+$smallScreenBreakpoint: 576px !default;
diff --git a/libs/portal-layout-styles/src/styles/shell/_variables.scss b/libs/portal-layout-styles/src/styles/shell/_variables.scss
index 5ddcf0c1..4c3f8ad7 100644
--- a/libs/portal-layout-styles/src/styles/shell/_variables.scss
+++ b/libs/portal-layout-styles/src/styles/shell/_variables.scss
@@ -34,6 +34,7 @@ $submenuShadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.1
 $animationTimingFunction: cubic-bezier(0.05, 0.74, 0.2, 0.99) !default;
 // $transitionDuration: 0.2s !default;
 $mobileBreakpoint: 991px !default;
+$smallScreenBreakpoint: 576px !default;
 
 // Menu Light
 // $menuBgColor: #fdfeff;