diff --git a/src/app/components/accordion/accordion.css b/src/app/components/accordion/accordion.css
index c576f092770..8df3eabc905 100755
--- a/src/app/components/accordion/accordion.css
+++ b/src/app/components/accordion/accordion.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-accordion-header-link {
         cursor: pointer;
         display: flex;
diff --git a/src/app/components/autocomplete/autocomplete.css b/src/app/components/autocomplete/autocomplete.css
index aa8619eff26..a7be72518ec 100755
--- a/src/app/components/autocomplete/autocomplete.css
+++ b/src/app/components/autocomplete/autocomplete.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-autocomplete {
         display: inline-flex;
         position: relative;
diff --git a/src/app/components/avatar/avatar.css b/src/app/components/avatar/avatar.css
index 551dff78fcf..d9e3279f528 100755
--- a/src/app/components/avatar/avatar.css
+++ b/src/app/components/avatar/avatar.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-avatar {
         display: inline-flex;
         align-items: center;
diff --git a/src/app/components/avatargroup/avatargroup.css b/src/app/components/avatargroup/avatargroup.css
index 33c97ccb694..ac2fa35be99 100755
--- a/src/app/components/avatargroup/avatargroup.css
+++ b/src/app/components/avatargroup/avatargroup.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-avatar-group p-avatar + p-avatar {
         margin-left: -1rem;
     }
diff --git a/src/app/components/badge/badge.css b/src/app/components/badge/badge.css
index 90a21511f9e..3c4c73863b6 100644
--- a/src/app/components/badge/badge.css
+++ b/src/app/components/badge/badge.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-badge {
         display: inline-block;
         border-radius: 10px;
diff --git a/src/app/components/blockui/blockui.css b/src/app/components/blockui/blockui.css
index 67cd719da8b..9271da5c781 100755
--- a/src/app/components/blockui/blockui.css
+++ b/src/app/components/blockui/blockui.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-blockui {
         position: absolute;
         top: 0;
diff --git a/src/app/components/breadcrumb/breadcrumb.css b/src/app/components/breadcrumb/breadcrumb.css
index 8b62cea4647..60db9532984 100755
--- a/src/app/components/breadcrumb/breadcrumb.css
+++ b/src/app/components/breadcrumb/breadcrumb.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-breadcrumb {
         overflow-x: auto;
     }
diff --git a/src/app/components/button/button.css b/src/app/components/button/button.css
index 7c2ca251cb1..52e82a41be1 100755
--- a/src/app/components/button/button.css
+++ b/src/app/components/button/button.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-button {
         margin: 0;
         display: inline-flex;
diff --git a/src/app/components/calendar/calendar.css b/src/app/components/calendar/calendar.css
index 04d41c00c91..b97b9ce0923 100755
--- a/src/app/components/calendar/calendar.css
+++ b/src/app/components/calendar/calendar.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-calendar {
         position: relative;
         display: inline-flex;
diff --git a/src/app/components/card/card.css b/src/app/components/card/card.css
index f3e561f53ef..2a1f6b9372a 100755
--- a/src/app/components/card/card.css
+++ b/src/app/components/card/card.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-card-header img {
         width: 100%;
     }
diff --git a/src/app/components/carousel/carousel.css b/src/app/components/carousel/carousel.css
index 799ef9e9d4c..fb8226285c4 100755
--- a/src/app/components/carousel/carousel.css
+++ b/src/app/components/carousel/carousel.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-carousel {
         display: flex;
         flex-direction: column;
diff --git a/src/app/components/cascadeselect/cascadeselect.css b/src/app/components/cascadeselect/cascadeselect.css
index 75f0b5dd54b..e6a8ab928f1 100644
--- a/src/app/components/cascadeselect/cascadeselect.css
+++ b/src/app/components/cascadeselect/cascadeselect.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-cascadeselect {
         display: inline-flex;
         cursor: pointer;
diff --git a/src/app/components/checkbox/checkbox.css b/src/app/components/checkbox/checkbox.css
index e4741b28fe7..49a232ccba5 100755
--- a/src/app/components/checkbox/checkbox.css
+++ b/src/app/components/checkbox/checkbox.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-checkbox {
         display: inline-flex;
         cursor: pointer;
diff --git a/src/app/components/chip/chip.css b/src/app/components/chip/chip.css
index d9c03023a6f..a297d7f0800 100755
--- a/src/app/components/chip/chip.css
+++ b/src/app/components/chip/chip.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-chip {
         display: inline-flex;
         align-items: center;
diff --git a/src/app/components/chips/chips.css b/src/app/components/chips/chips.css
index 96104c7feb7..27d06a31e1e 100755
--- a/src/app/components/chips/chips.css
+++ b/src/app/components/chips/chips.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-chips {
         display: inline-flex;
     }
diff --git a/src/app/components/colorpicker/colorpicker.css b/src/app/components/colorpicker/colorpicker.css
index f79c5e8a8aa..b643f6a2f16 100755
--- a/src/app/components/colorpicker/colorpicker.css
+++ b/src/app/components/colorpicker/colorpicker.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-colorpicker {
         display: inline-block;
     }
diff --git a/src/app/components/common/common.css b/src/app/components/common/common.css
index 0ed78d752ca..67874812b52 100755
--- a/src/app/components/common/common.css
+++ b/src/app/components/common/common.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-component,
     .p-component * {
         box-sizing: border-box;
diff --git a/src/app/components/confirmpopup/confirmpopup.css b/src/app/components/confirmpopup/confirmpopup.css
index 30998582078..d1f23e339a0 100755
--- a/src/app/components/confirmpopup/confirmpopup.css
+++ b/src/app/components/confirmpopup/confirmpopup.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-confirm-popup {
         position: absolute;
         margin-top: 10px;
diff --git a/src/app/components/contextmenu/contextmenu.css b/src/app/components/contextmenu/contextmenu.css
index 0c1b58c8201..c25bc45ac58 100755
--- a/src/app/components/contextmenu/contextmenu.css
+++ b/src/app/components/contextmenu/contextmenu.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-contextmenu {
         position: absolute;
     }
diff --git a/src/app/components/dataview/dataview.css b/src/app/components/dataview/dataview.css
index 9b6a9334c75..9ceb9575ce7 100755
--- a/src/app/components/dataview/dataview.css
+++ b/src/app/components/dataview/dataview.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-dataview {
         position: relative;
     }
diff --git a/src/app/components/dialog/dialog.css b/src/app/components/dialog/dialog.css
index 48a9455108b..7f31802d0eb 100755
--- a/src/app/components/dialog/dialog.css
+++ b/src/app/components/dialog/dialog.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-dialog-mask {
         position: fixed;
         top: 0;
diff --git a/src/app/components/divider/divider.css b/src/app/components/divider/divider.css
index 2738f847c0b..dcfb3d83400 100644
--- a/src/app/components/divider/divider.css
+++ b/src/app/components/divider/divider.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-divider-horizontal {
         display: flex;
         width: 100%;
diff --git a/src/app/components/dock/dock.css b/src/app/components/dock/dock.css
index c5d1a39e529..520cb5cf2ce 100755
--- a/src/app/components/dock/dock.css
+++ b/src/app/components/dock/dock.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-dock {
         position: absolute;
         z-index: 1;
diff --git a/src/app/components/dropdown/dropdown.css b/src/app/components/dropdown/dropdown.css
index e19f076a4ad..1608519463b 100755
--- a/src/app/components/dropdown/dropdown.css
+++ b/src/app/components/dropdown/dropdown.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-dropdown {
         display: inline-flex;
         cursor: pointer;
diff --git a/src/app/components/fieldset/fieldset.css b/src/app/components/fieldset/fieldset.css
index c61be72c0d9..d0fc16ab465 100755
--- a/src/app/components/fieldset/fieldset.css
+++ b/src/app/components/fieldset/fieldset.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-fieldset-legend > a,
     .p-fieldset-legend > span {
         display: flex;
diff --git a/src/app/components/fileupload/fileupload.css b/src/app/components/fileupload/fileupload.css
index eccb43d9dc3..d675b419ec6 100755
--- a/src/app/components/fileupload/fileupload.css
+++ b/src/app/components/fileupload/fileupload.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-fileupload-content {
         position: relative;
     }
diff --git a/src/app/components/galleria/galleria.css b/src/app/components/galleria/galleria.css
index c996776c864..11df2dad389 100755
--- a/src/app/components/galleria/galleria.css
+++ b/src/app/components/galleria/galleria.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-galleria-content {
         display: flex;
         flex-direction: column;
diff --git a/src/app/components/image/image.css b/src/app/components/image/image.css
index b8a4ecaa43e..1c036318713 100755
--- a/src/app/components/image/image.css
+++ b/src/app/components/image/image.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-image-mask {
         display: flex;
         align-items: center;
diff --git a/src/app/components/inplace/inplace.css b/src/app/components/inplace/inplace.css
index 3e560777672..6706c19c748 100755
--- a/src/app/components/inplace/inplace.css
+++ b/src/app/components/inplace/inplace.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-inplace .p-inplace-display {
         display: inline;
         cursor: pointer;
diff --git a/src/app/components/inputmask/inputmask.css b/src/app/components/inputmask/inputmask.css
index 9dd41c31041..6cd1b8ffaa0 100644
--- a/src/app/components/inputmask/inputmask.css
+++ b/src/app/components/inputmask/inputmask.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-inputmask-clear-icon {
         position: absolute;
         top: 50%;
diff --git a/src/app/components/inputnumber/inputnumber.css b/src/app/components/inputnumber/inputnumber.css
index 32bfc0e9c80..782ee64a8ce 100755
--- a/src/app/components/inputnumber/inputnumber.css
+++ b/src/app/components/inputnumber/inputnumber.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     p-inputnumber,
     .p-inputnumber {
         display: inline-flex;
diff --git a/src/app/components/inputswitch/inputswitch.css b/src/app/components/inputswitch/inputswitch.css
index a073d08bfb1..a67d5c79dda 100755
--- a/src/app/components/inputswitch/inputswitch.css
+++ b/src/app/components/inputswitch/inputswitch.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-inputswitch {
         position: relative;
         display: inline-block;
diff --git a/src/app/components/inputtext/inputtext.css b/src/app/components/inputtext/inputtext.css
index a125423f616..f62064e065b 100755
--- a/src/app/components/inputtext/inputtext.css
+++ b/src/app/components/inputtext/inputtext.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-inputtext {
         margin: 0;
     }
diff --git a/src/app/components/inputtextarea/inputtextarea.css b/src/app/components/inputtextarea/inputtextarea.css
index 8268a70b0c8..a2108214707 100755
--- a/src/app/components/inputtextarea/inputtextarea.css
+++ b/src/app/components/inputtextarea/inputtextarea.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-inputtextarea-resizable {
         overflow: hidden;
         resize: none;
diff --git a/src/app/components/knob/knob.css b/src/app/components/knob/knob.css
index 75c96121508..1a5c9a94ba6 100644
--- a/src/app/components/knob/knob.css
+++ b/src/app/components/knob/knob.css
@@ -3,7 +3,7 @@
         stroke-dashoffset: 0;
     }
 }
-@layer primeng {
+@layer primeng.core {
     .p-knob-range {
         fill: none;
         transition: stroke 0.1s ease-in;
diff --git a/src/app/components/listbox/listbox.css b/src/app/components/listbox/listbox.css
index 05f0f975be2..6121720f72a 100755
--- a/src/app/components/listbox/listbox.css
+++ b/src/app/components/listbox/listbox.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-listbox-list-wrapper {
         overflow: auto;
     }
diff --git a/src/app/components/megamenu/megamenu.css b/src/app/components/megamenu/megamenu.css
index 7057b962b72..08826d3a3b9 100755
--- a/src/app/components/megamenu/megamenu.css
+++ b/src/app/components/megamenu/megamenu.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-megamenu-root-list {
         margin: 0;
         padding: 0;
diff --git a/src/app/components/menu/menu.css b/src/app/components/menu/menu.css
index 24e52435d69..0a313cc8917 100755
--- a/src/app/components/menu/menu.css
+++ b/src/app/components/menu/menu.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-menu-overlay {
         position: absolute;
         top: 0;
diff --git a/src/app/components/menubar/menubar.css b/src/app/components/menubar/menubar.css
index 8acb442cb1f..578f0f14873 100755
--- a/src/app/components/menubar/menubar.css
+++ b/src/app/components/menubar/menubar.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-menubar {
         display: flex;
         align-items: center;
diff --git a/src/app/components/message/message.css b/src/app/components/message/message.css
index 3ff4ab27106..9423679dfd4 100755
--- a/src/app/components/message/message.css
+++ b/src/app/components/message/message.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-inline-message {
         display: inline-flex;
         align-items: center;
diff --git a/src/app/components/messages/messages.css b/src/app/components/messages/messages.css
index c0b0e9eefff..f4e16ed72e2 100755
--- a/src/app/components/messages/messages.css
+++ b/src/app/components/messages/messages.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-message-wrapper {
         display: flex;
         align-items: center;
diff --git a/src/app/components/multiselect/multiselect.css b/src/app/components/multiselect/multiselect.css
index 285ca026914..c914ca05334 100755
--- a/src/app/components/multiselect/multiselect.css
+++ b/src/app/components/multiselect/multiselect.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-multiselect {
         display: inline-flex;
         cursor: pointer;
diff --git a/src/app/components/orderlist/orderlist.css b/src/app/components/orderlist/orderlist.css
index a4b898a9b87..bd3507a2993 100755
--- a/src/app/components/orderlist/orderlist.css
+++ b/src/app/components/orderlist/orderlist.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-orderlist {
         display: flex;
     }
diff --git a/src/app/components/organizationchart/organizationchart.css b/src/app/components/organizationchart/organizationchart.css
index 85ffeb92ce9..bcbeb7934a4 100755
--- a/src/app/components/organizationchart/organizationchart.css
+++ b/src/app/components/organizationchart/organizationchart.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-organizationchart-table {
         border-spacing: 0;
         border-collapse: separate;
diff --git a/src/app/components/overlay/overlay.css b/src/app/components/overlay/overlay.css
index fb691ce8d6d..81292e58dff 100644
--- a/src/app/components/overlay/overlay.css
+++ b/src/app/components/overlay/overlay.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-overlay {
         position: absolute;
         top: 0;
diff --git a/src/app/components/overlaypanel/overlaypanel.css b/src/app/components/overlaypanel/overlaypanel.css
index 2a2bb984805..a4153805f2e 100755
--- a/src/app/components/overlaypanel/overlaypanel.css
+++ b/src/app/components/overlaypanel/overlaypanel.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-overlaypanel {
         position: absolute;
         margin-top: 10px;
diff --git a/src/app/components/paginator/paginator.css b/src/app/components/paginator/paginator.css
index a86d6f19f6b..d9b7e528bb6 100755
--- a/src/app/components/paginator/paginator.css
+++ b/src/app/components/paginator/paginator.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-paginator {
         display: flex;
         align-items: center;
diff --git a/src/app/components/panel/panel.css b/src/app/components/panel/panel.css
index 3bd0f07e425..2c649e02933 100755
--- a/src/app/components/panel/panel.css
+++ b/src/app/components/panel/panel.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-panel-header {
         display: flex;
         align-items: center;
diff --git a/src/app/components/panelmenu/panelmenu.css b/src/app/components/panelmenu/panelmenu.css
index b409dacea47..3c3bba71391 100755
--- a/src/app/components/panelmenu/panelmenu.css
+++ b/src/app/components/panelmenu/panelmenu.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-panelmenu .p-panelmenu-header-action {
         display: flex;
         align-items: center;
diff --git a/src/app/components/password/password.css b/src/app/components/password/password.css
index 7a58f85ea5b..095a0e33da4 100755
--- a/src/app/components/password/password.css
+++ b/src/app/components/password/password.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-password {
         position: relative;
         display: inline-flex;
diff --git a/src/app/components/picklist/picklist.css b/src/app/components/picklist/picklist.css
index 3ef00411fd2..205d3434749 100755
--- a/src/app/components/picklist/picklist.css
+++ b/src/app/components/picklist/picklist.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-picklist {
         display: flex;
     }
diff --git a/src/app/components/progressbar/progressbar.css b/src/app/components/progressbar/progressbar.css
index 009b823f5a5..dfe7b496aea 100755
--- a/src/app/components/progressbar/progressbar.css
+++ b/src/app/components/progressbar/progressbar.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-progressbar {
         position: relative;
         overflow: hidden;
diff --git a/src/app/components/progressspinner/progressspinner.css b/src/app/components/progressspinner/progressspinner.css
index 9092d69f1a6..df4b18fdebf 100755
--- a/src/app/components/progressspinner/progressspinner.css
+++ b/src/app/components/progressspinner/progressspinner.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-progress-spinner {
         position: relative;
         margin: 0 auto;
diff --git a/src/app/components/radiobutton/radiobutton.css b/src/app/components/radiobutton/radiobutton.css
index 7bd8a90360e..e4287e925b8 100755
--- a/src/app/components/radiobutton/radiobutton.css
+++ b/src/app/components/radiobutton/radiobutton.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-radiobutton {
         display: inline-flex;
         cursor: pointer;
diff --git a/src/app/components/rating/rating.css b/src/app/components/rating/rating.css
index c755b715ca2..6ab8fe3c0fb 100755
--- a/src/app/components/rating/rating.css
+++ b/src/app/components/rating/rating.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-rating {
         display: inline-flex;
     }
diff --git a/src/app/components/ripple/ripple.css b/src/app/components/ripple/ripple.css
index 811262ded4a..a5fcc62a577 100644
--- a/src/app/components/ripple/ripple.css
+++ b/src/app/components/ripple/ripple.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-ripple {
         overflow: hidden;
         position: relative;
diff --git a/src/app/components/scroller/scroller.css b/src/app/components/scroller/scroller.css
index 7df9403016d..bcf16ff1d7e 100644
--- a/src/app/components/scroller/scroller.css
+++ b/src/app/components/scroller/scroller.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     p-scroller {
         flex: 1;
         outline: 0 none;
diff --git a/src/app/components/scrollpanel/scrollpanel.css b/src/app/components/scrollpanel/scrollpanel.css
index 84d19e50c1d..b6db26a8c0f 100755
--- a/src/app/components/scrollpanel/scrollpanel.css
+++ b/src/app/components/scrollpanel/scrollpanel.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-scrollpanel-wrapper {
         overflow: hidden;
         width: 100%;
diff --git a/src/app/components/scrolltop/scrolltop.css b/src/app/components/scrolltop/scrolltop.css
index 840a514a877..00aecb0b71f 100644
--- a/src/app/components/scrolltop/scrolltop.css
+++ b/src/app/components/scrolltop/scrolltop.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-scrolltop {
         position: fixed;
         bottom: 20px;
diff --git a/src/app/components/sidebar/sidebar.css b/src/app/components/sidebar/sidebar.css
index b99d1f5e4a1..6c4036b6f50 100755
--- a/src/app/components/sidebar/sidebar.css
+++ b/src/app/components/sidebar/sidebar.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-sidebar {
         position: fixed;
         transition: transform 0.3s;
diff --git a/src/app/components/skeleton/skeleton.css b/src/app/components/skeleton/skeleton.css
index 0ba87206225..02e11ca1da8 100644
--- a/src/app/components/skeleton/skeleton.css
+++ b/src/app/components/skeleton/skeleton.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-skeleton {
         position: relative;
         overflow: hidden;
diff --git a/src/app/components/slidemenu/slidemenu.css b/src/app/components/slidemenu/slidemenu.css
index 2b92f6373e3..3db2b8ea792 100755
--- a/src/app/components/slidemenu/slidemenu.css
+++ b/src/app/components/slidemenu/slidemenu.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-slidemenu .p-slidemenu-root-list {
         position: relative;
         top: 0;
diff --git a/src/app/components/slider/slider.css b/src/app/components/slider/slider.css
index 6ca7433da2d..ab7ee8588a8 100755
--- a/src/app/components/slider/slider.css
+++ b/src/app/components/slider/slider.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-slider {
         position: relative;
     }
diff --git a/src/app/components/speeddial/speeddial.css b/src/app/components/speeddial/speeddial.css
index f6f7dd57b38..06b02e85d2e 100755
--- a/src/app/components/speeddial/speeddial.css
+++ b/src/app/components/speeddial/speeddial.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-speeddial {
         position: absolute;
         display: flex;
diff --git a/src/app/components/spinner/spinner.css b/src/app/components/spinner/spinner.css
index 0ca2b584239..9adc62acad0 100755
--- a/src/app/components/spinner/spinner.css
+++ b/src/app/components/spinner/spinner.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .ui-spinner {
         display: inline-block;
         overflow: visible;
diff --git a/src/app/components/splitbutton/splitbutton.css b/src/app/components/splitbutton/splitbutton.css
index b95f56ee19b..9a6c3f9ac8f 100755
--- a/src/app/components/splitbutton/splitbutton.css
+++ b/src/app/components/splitbutton/splitbutton.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-splitbutton {
         display: inline-flex;
         position: relative;
diff --git a/src/app/components/splitter/splitter.css b/src/app/components/splitter/splitter.css
index c265335f1da..1544b67ba28 100644
--- a/src/app/components/splitter/splitter.css
+++ b/src/app/components/splitter/splitter.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-splitter {
         display: flex;
         flex-wrap: nowrap;
diff --git a/src/app/components/steps/steps.css b/src/app/components/steps/steps.css
index 15abf80aa8b..4987f657018 100755
--- a/src/app/components/steps/steps.css
+++ b/src/app/components/steps/steps.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-steps {
         position: relative;
     }
diff --git a/src/app/components/table/table.css b/src/app/components/table/table.css
index 1d9c7591346..649af8ff209 100755
--- a/src/app/components/table/table.css
+++ b/src/app/components/table/table.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-datatable {
         position: relative;
     }
diff --git a/src/app/components/tabmenu/tabmenu.css b/src/app/components/tabmenu/tabmenu.css
index 062d291951a..02fcfaa2057 100755
--- a/src/app/components/tabmenu/tabmenu.css
+++ b/src/app/components/tabmenu/tabmenu.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-tabmenu-nav-container {
         position: relative;
     }
diff --git a/src/app/components/tabview/tabview.css b/src/app/components/tabview/tabview.css
index 00152ebc2d2..894c8fb5965 100755
--- a/src/app/components/tabview/tabview.css
+++ b/src/app/components/tabview/tabview.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-tabview-nav-container {
         position: relative;
     }
diff --git a/src/app/components/tag/tag.css b/src/app/components/tag/tag.css
index 87e0cc6a369..d3c22d89dd9 100644
--- a/src/app/components/tag/tag.css
+++ b/src/app/components/tag/tag.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-tag {
         display: inline-flex;
         align-items: center;
diff --git a/src/app/components/terminal/terminal.css b/src/app/components/terminal/terminal.css
index 103a40241da..d0634d94230 100755
--- a/src/app/components/terminal/terminal.css
+++ b/src/app/components/terminal/terminal.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-terminal {
         height: 18rem;
         overflow: auto;
diff --git a/src/app/components/tieredmenu/tieredmenu.css b/src/app/components/tieredmenu/tieredmenu.css
index e7d8051507d..7bdac7361d7 100755
--- a/src/app/components/tieredmenu/tieredmenu.css
+++ b/src/app/components/tieredmenu/tieredmenu.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-tieredmenu-overlay {
         position: absolute;
         top: 0;
diff --git a/src/app/components/timeline/timeline.css b/src/app/components/timeline/timeline.css
index e8475978679..69a59b5f03d 100755
--- a/src/app/components/timeline/timeline.css
+++ b/src/app/components/timeline/timeline.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-timeline {
         display: flex;
         flex-grow: 1;
diff --git a/src/app/components/toast/toast.css b/src/app/components/toast/toast.css
index be31f90e627..41cfb0422cb 100755
--- a/src/app/components/toast/toast.css
+++ b/src/app/components/toast/toast.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-toast {
         position: fixed;
         width: 25rem;
diff --git a/src/app/components/toolbar/toolbar.css b/src/app/components/toolbar/toolbar.css
index 7e15a448162..d65ef584092 100755
--- a/src/app/components/toolbar/toolbar.css
+++ b/src/app/components/toolbar/toolbar.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-toolbar {
         display: flex;
         align-items: center;
diff --git a/src/app/components/tooltip/tooltip.css b/src/app/components/tooltip/tooltip.css
index 59fa161d5cd..6ea39727966 100755
--- a/src/app/components/tooltip/tooltip.css
+++ b/src/app/components/tooltip/tooltip.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-tooltip {
         position: absolute;
         display: none;
diff --git a/src/app/components/tree/tree.css b/src/app/components/tree/tree.css
index a8c4215090a..f7c7bc9616c 100755
--- a/src/app/components/tree/tree.css
+++ b/src/app/components/tree/tree.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-tree-container {
         margin: 0;
         padding: 0;
diff --git a/src/app/components/treeselect/treeselect.css b/src/app/components/treeselect/treeselect.css
index f6e980edc16..c815e2c1a76 100755
--- a/src/app/components/treeselect/treeselect.css
+++ b/src/app/components/treeselect/treeselect.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-treeselect {
         display: inline-flex;
         cursor: pointer;
diff --git a/src/app/components/treetable/treetable.css b/src/app/components/treetable/treetable.css
index f823f52add8..34e7f7a735e 100755
--- a/src/app/components/treetable/treetable.css
+++ b/src/app/components/treetable/treetable.css
@@ -1,4 +1,4 @@
-@layer primeng {
+@layer primeng.core {
     .p-treetable {
         position: relative;
     }