diff --git a/view/frontend/layout/breeze_default.xml b/view/frontend/layout/breeze_default.xml
new file mode 100644
index 0000000..cfcfad6
--- /dev/null
+++ b/view/frontend/layout/breeze_default.xml
@@ -0,0 +1,20 @@
+<?xml version="1.0"?>
+<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
+    <body>
+        <referenceBlock name="cookie_notices" remove="true"/>
+        <referenceBlock name="breeze.js">
+            <arguments>
+                <argument name="bundles" xsi:type="array">
+                    <item name="default" xsi:type="array">
+                        <item name="items" xsi:type="array">
+                            <item name="Phpro_CookieConsent/js/notice" xsi:type="string">Phpro_CookieConsent/js/breeze/notice</item>
+                            <item name="phpprocookie" xsi:type="string">Phpro_CookieConsent::js/breeze/model/cookie.js</item>
+<!--                            <item name="Phpro_CookieConsent/js/modal/preferences" xsi:type="string">Phpro_CookieConsent/js/breeze/modal/preferences</item>-->
+                        </item>
+                    </item>
+                </argument>
+            </arguments>
+        </referenceBlock>
+    </body>
+</page>
diff --git a/view/frontend/templates/modal/preferences.phtml b/view/frontend/templates/modal/preferences.phtml
index 8e6e824..daac5a7 100644
--- a/view/frontend/templates/modal/preferences.phtml
+++ b/view/frontend/templates/modal/preferences.phtml
@@ -48,7 +48,7 @@ $cookieGroups = $viewModel->getCookieGroups();
 </div>
 <script type="text/x-magento-init">
 {
-    "*": {
+    "#modal-consent-content": {
         "Phpro_CookieConsent/js/modal/preferences": {
             "cookie_name": "<?= $viewModel->getCookieName(); ?>",
             "expiration": <?= $viewModel->getExpirationDays(); ?>,
diff --git a/view/frontend/templates/notice.phtml b/view/frontend/templates/notice.phtml
index f82e7fe..8fc1cb7 100644
--- a/view/frontend/templates/notice.phtml
+++ b/view/frontend/templates/notice.phtml
@@ -20,7 +20,7 @@ $viewModel = $block->getViewModel();
 </div>
 <script type="text/x-magento-init">
 {
-    "*": {
+    ".phpro-cookie-notice": {
         "Phpro_CookieConsent/js/notice": {
             "cookie_name": "<?= $viewModel->getCookieName(); ?>",
             "expiration": <?= $viewModel->getExpirationDays(); ?>,
diff --git a/view/frontend/web/css/breeze/_default.less b/view/frontend/web/css/breeze/_default.less
new file mode 100644
index 0000000..ff9a891
--- /dev/null
+++ b/view/frontend/web/css/breeze/_default.less
@@ -0,0 +1,263 @@
+& when (@critical) {
+    // critical
+
+    //
+    //  Common
+    //  _____________________________________________
+    //
+    //  Notice bar
+    //  ---------------------------------------------
+    .phpro-cookie-notice {
+        width: 100vw;
+        padding: 30px;
+        background: @gray-50;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        z-index: 900;
+
+        .notice-wrapper {
+            display: flex;
+            flex-direction: column;
+            max-width: @container__max-width;
+            margin: auto;
+            justify-content: space-around;
+            align-items: center;
+
+            .notice__description {
+                span {
+                    display: block;
+                }
+            }
+        }
+    }
+}
+& when not (@critical) {
+    // non critical
+
+    //
+    //  Preferences popup
+    //  ---------------------------------------------
+    .modals-wrapper {
+        .modal-popup.cookie-consent-newsletter-modal {
+            .modal-inner-wrap {
+                background-color: @gray-50;
+
+                .modal-header {
+                    height: 0;
+                    padding: 0;
+
+                    .action-close:before {
+                        color: @black;
+                    }
+                }
+
+                .modal-content {
+                    padding-left: 0;
+                    padding-right: 0;
+                }
+
+                .phpro-cookie-consent-modal {
+                    display: flex;
+                    flex-direction: column;
+
+                    .consent-tabs {
+                        display: inline-block;
+                        vertical-align: top;
+                        width: 100%;
+
+                        .consent-tab {
+                            background-color: @gray-50;
+                            width: 100%;
+                            cursor: pointer;
+                            padding: 5px 5px 5px 20px;
+                            box-shadow: 0 5px 10px 0 rgba(0,0,0,.1);
+                            position: relative;
+                            z-index: 10;
+
+                            &.active {
+                                background-color: var(--doulton-primary);
+                            }
+
+                            span {
+                                font-weight: 700;
+                            }
+                        }
+
+                        &-content {
+                            display: inline-block;
+                            vertical-align: top;
+                            background-color: @white;
+                            padding: 20px 20px 0;
+
+                            .consent-tab-content {
+                                position: relative;
+
+                                p.title {
+                                    margin-bottom: 20px;
+                                    font-size: @font-size__lg;
+                                }
+
+                                .cookie-toggle-wrapper {
+                                    position: absolute;
+                                    right: 0;
+                                    top: 0;
+
+                                    .cookie-toggle {
+                                        position: relative;
+                                        display: inline-block;
+                                        width: 60px;
+                                        height: 34px;
+
+                                        input {
+                                            display: none;
+
+                                            &:checked + .cookie-toggle-slider {
+                                                background-color: var(--doulton-primary);
+                                            }
+
+                                            &:focus + .cookie-toggle-slider {
+                                                box-shadow: 0 0 1px var(--doulton-primary);
+                                            }
+
+                                            &:checked + .cookie-toggle-slider:before {
+                                                -webkit-transform: translateX(26px);
+                                                -ms-transform: translateX(26px);
+                                                transform: translateX(26px);
+                                            }
+                                        }
+
+                                        .cookie-toggle-slider {
+                                            position: absolute;
+                                            cursor: pointer;
+                                            top: 0;
+                                            left: 0;
+                                            right: 0;
+                                            bottom: 0;
+                                            -webkit-transition: .4s;
+                                            transition: .4s;
+                                            border-radius: 34px;
+                                            background-color: @slate-600;
+
+                                            &:before {
+                                                position: absolute;
+                                                content: "";
+                                                height: 26px;
+                                                width: 26px;
+                                                left: 4px;
+                                                bottom: 4px;
+                                                background-color: @gray-50;
+                                                -webkit-transition: .4s;
+                                                transition: .4s;
+                                                border-radius: 50%;
+                                            }
+
+                                            &.disabled {
+                                                opacity: 0.5;
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+
+                .modal-footer {
+                    text-align: right;
+                    background-color: @white;
+                }
+            }
+        }
+    }
+
+    //
+    //  Cookie overview widget
+    //  ---------------------------------------------
+    .cookie-consent-overview {
+        p.title {
+            margin-bottom: 20px;
+        }
+
+        .cookie-group-description {
+            margin-bottom: 30px;
+        }
+    }
+
+
+    //  Cookie preferences button widget
+    //  ---------------------------------------------
+    .btn-cookie-preferences-show {
+        cursor: pointer;
+    }
+
+    //
+    //  Desktop
+    //  _____________________________________________
+
+    @media @media-sm {
+        //
+        //  Notice bar
+        //  ---------------------------------------------
+        .phpro-cookie-notice {
+            .notice-wrapper {
+                flex-direction: row;
+            }
+        }
+
+        //
+        //  Preferences popup
+        //  ---------------------------------------------
+        .modals-wrapper {
+            .modal-popup.cookie-consent-newsletter-modal {
+                .modal-inner-wrap {
+                    background-color: @gray-50;
+
+                    .modal-content {
+                        padding-left: 0;
+                    }
+
+                    .phpro-cookie-consent-modal {
+                        flex-direction: row;
+
+                        .consent-tabs {
+                            width: 33%;
+                            padding-left: 3%;
+                            background-color: @white;
+                            padding-top: 30px;
+
+                            .consent-tab {
+                                width: 80%;
+                                border: 2px solid var(--doulton-primary);
+                                border-radius: 3px;
+                                padding: 5px;
+                                margin-bottom: 20px;
+                                background-color: @white;
+                                box-shadow: none;
+                            }
+
+                            &-content {
+                                background-color: @gray-50;
+                                width: 65%;
+                                padding-top: 30px;
+                                padding-left: 30px;
+                                padding-bottom: 50px;
+                            }
+                        }
+                    }
+
+                    .modal-footer {
+                        height: 0;
+                        text-align: right;
+                        margin-right: 20px;
+
+                        .consent-btn {
+                            margin: -100px 0 0 0;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/view/frontend/web/js/breeze/modal/preferences.js b/view/frontend/web/js/breeze/modal/preferences.js
new file mode 100644
index 0000000..c9958b1
--- /dev/null
+++ b/view/frontend/web/js/breeze/modal/preferences.js
@@ -0,0 +1,86 @@
+/* global _ */
+(function () {//todo fixes here, this file makes issue with notice bar too
+    'use strict';
+
+    $.view('modal-consent-content', {
+        component: 'Phpro_CookieConsent/js/modal/preferences',
+        options: {
+            default: 'value'
+        },
+
+        create: function () {
+            let options = this.options;
+            const consentContentElement = '#modal-consent-content';
+
+            var consentModal = $(consentContentElement).modal({
+                type: 'popup',
+                responsive: false,
+                modalClass: 'cookie-consent-newsletter-modal',
+                innerScroll: true,
+                clickableOverlay: true,
+                buttons: [
+                    {
+                        text: $.mage.__('Allow all'),
+                        class: 'action primary consent-btn consent-btn-allow',
+                        click: function () {
+                            $.mage.phpprocookie().saveAll(options.cookie_name, options.expiration, options.secure, options.cookie_groups_data.system_names);
+                            $.mage.phpprocookie().closeCookieNotice();
+                            consentModal.modal("closeModal");
+                        }
+                    },
+                    {
+                        text: $.mage.__('Save'),
+                        class: 'action primary consent-btn consent-btn-save',
+                        click: function () {
+                            $.mage.phpprocookie().saveSelected(options.cookie_name, options.expiration, options.secure, options.cookie_groups_data.system_names);
+                            $.mage.phpprocookie().closeCookieNotice();
+                            consentModal.modal("closeModal");
+                        }
+                    },
+                ]
+            });
+
+            var consent = $.mage.phpprocookie().getConsentCookieObject(options.cookie_name);
+            onClickTab($('#cookie-policy'));
+            if (consent !== undefined) {
+                var values = Object.entries(JSON.parse(consent));
+                $.each(values, function (index, value) {
+                    if ('cg_' === value[0].substring(0, 3)) {
+                        var checkboxSelector = '.phpro-cookie-consent-modal .consent-tab-content.' + value[0].substring(3, value[0].length) + ' .cookie-toggle input[type="checkbox"]';
+                        $(checkboxSelector).prop('checked', value[1]);
+                    }
+                });
+            }
+
+            $(document).on('click', '.notice__btn-settings, .btn-cookie-preferences-show', function (event) {
+                event.preventDefault();
+                consentModal.modal('openModal');
+            });
+
+            // Fix for modal not closing when clicking overlay on mobile (magento bug)
+            $(document).on('click', '.modal-popup.cookie-consent-newsletter-modal', function () {
+                consentModal.modal("closeModal");
+            });
+
+            $(document).on('click', '.cookie-consent-newsletter-modal .modal-inner-wrap', function (event) {
+                event.stopPropagation()
+            });
+
+            $(document).on('click', '.consent-tab', function (event) {
+                event.preventDefault();
+                onClickTab($(this));
+            });
+
+            function onClickTab(tab) {
+                $('.consent-tab').each(function () {
+                    $(this).removeClass('active');
+                });
+                tab.addClass('active');
+                $('.consent-tab-content').each(function () {
+                    $(this).css('display', 'none');
+                });
+                $('.consent-tab-content.' + tab.attr('id')).css('display', 'block');
+            }
+        }
+    });
+})();
diff --git a/view/frontend/web/js/breeze/model/cookie.js b/view/frontend/web/js/breeze/model/cookie.js
new file mode 100644
index 0000000..1febd84
--- /dev/null
+++ b/view/frontend/web/js/breeze/model/cookie.js
@@ -0,0 +1,62 @@
+/* global _ */
+(function () {
+    'use strict';
+
+    $.widget('phpprocookie', {
+        options: {
+        },
+
+        consentCookieExists: function (name) {
+            return ($.cookies.get(name));
+        },
+
+        getConsentCookieObject: function(name) {
+            return $.cookies.get(name);
+        },
+
+        saveAll: function (name, expiration, secure, systemNames) {
+            var data = {};
+            $.each(systemNames, function (index, value) {
+                var sysName = 'cg_' + value;
+                data[sysName] = 1;
+                var checkboxSelector = '.phpro-cookie-consent-modal .consent-tab-content.' + value + ' .cookie-toggle input';
+                $(checkboxSelector).prop('checked', data[sysName]);
+            });
+            data['expire'] = expiration;
+            data['secure'] = secure;
+            $.cookies.set(name, JSON.stringify(data), {
+                expires: this.getExpiration(expiration)
+            });
+        },
+
+        saveSelected: function (name, expiration, secure, systemNames) {
+            var data = {};
+            $.each(systemNames, function (index, value) {
+                var sysName = 'cg_' + value;
+                var checkboxSelector = '.phpro-cookie-consent-modal .consent-tab-content.' + value + ' .cookie-toggle input[type="checkbox"]';
+                data[sysName] = ($(checkboxSelector).is(':checked') ? 1 : 0);
+            });
+            data['expire'] = expiration;
+            data['secure'] = secure;
+            $.cookies.set(name, JSON.stringify(data), {
+                expires: this.getExpiration(expiration)
+            });
+        },
+
+        closeCookieNotice: function () {
+            $('.phpro-cookie-notice').css('display', 'none');
+        },
+
+        getExpiration: function (expiration) {
+            var today = new Date();
+            var expireDate = new Date(today);
+            expireDate.setDate(today.getDate()+expiration);
+
+            return expireDate;
+        }
+    });
+
+    $.mage = $.mage || {};
+    $.mage.phpprocookie = $.fn.phpprocookie;
+
+})();
diff --git a/view/frontend/web/js/breeze/notice.js b/view/frontend/web/js/breeze/notice.js
new file mode 100644
index 0000000..c21925c
--- /dev/null
+++ b/view/frontend/web/js/breeze/notice.js
@@ -0,0 +1,96 @@
+/* global _ */
+(function () {
+    'use strict';
+
+    $.view('phpro-cookie-notice', {
+        component: 'Phpro_CookieConsent/js/notice',
+        options: {
+            default: 'value'
+        },
+
+        create: function () {
+            let options = this.options;
+            if (!$.mage.phpprocookie().consentCookieExists(options.cookie_name)) {
+                $('.phpro-cookie-notice').css('display', 'block');
+            }
+            $(document).on('click', '.phpro-cookie-notice .notice__btn-accept', function (event) {
+                event.preventDefault();
+                $.mage.phpprocookie().saveAll(options.cookie_name, options.expiration, options.secure, options.cookie_groups_data.system_names);
+                $.mage.phpprocookie().closeCookieNotice();
+            });
+
+            // file Phpro/CookieConsent/view/frontend/web/js/breeze/modal/preferences.js not loading properly, so added here
+            const consentContentElement = '#modal-consent-content';
+
+            var consentModal = $(consentContentElement).modal({
+                type: 'popup',
+                responsive: false,
+                modalClass: 'cookie-consent-newsletter-modal',
+                innerScroll: true,
+                clickableOverlay: true,
+                buttons: [
+                    {
+                        text: $.mage.__('Allow all'),
+                        class: 'action primary consent-btn consent-btn-allow',
+                        click: function () {
+                            $.mage.phpprocookie().saveAll(options.cookie_name, options.expiration, options.secure, options.cookie_groups_data.system_names);
+                            $.mage.phpprocookie().closeCookieNotice();
+                            consentModal.modal("closeModal");
+                        }
+                    },
+                    {
+                        text: $.mage.__('Save'),
+                        class: 'action primary consent-btn consent-btn-save',
+                        click: function () {
+                            $.mage.phpprocookie().saveSelected(options.cookie_name, options.expiration, options.secure, options.cookie_groups_data.system_names);
+                            $.mage.phpprocookie().closeCookieNotice();
+                            consentModal.modal("closeModal");
+                        }
+                    },
+                ]
+            });
+
+            var consent = $.mage.phpprocookie().getConsentCookieObject(options.cookie_name);
+            onClickTab($('#cookie-policy'));
+            if (consent !== undefined) {
+                var values = Object.entries(JSON.parse(consent));
+                $.each(values, function (index, value) {
+                    if ('cg_' === value[0].substring(0, 3)) {
+                        var checkboxSelector = '.phpro-cookie-consent-modal .consent-tab-content.' + value[0].substring(3, value[0].length) + ' .cookie-toggle input[type="checkbox"]';
+                        $(checkboxSelector).prop('checked', value[1]);
+                    }
+                });
+            }
+
+            $(document).on('click', '.notice__btn-settings, .btn-cookie-preferences-show', function (event) {
+                event.preventDefault();
+                consentModal.modal('openModal');
+            });
+
+            // Fix for modal not closing when clicking overlay on mobile (magento bug)
+            // $(document).on('click', '.modal-popup.cookie-consent-newsletter-modal', function () {
+            //     consentModal.modal("closeModal");
+            // });
+
+            $(document).on('click', '.cookie-consent-newsletter-modal .modal-inner-wrap', function (event) {
+                event.stopPropagation()
+            });
+
+            $(document).on('click', '.consent-tab', function (event) {
+                event.preventDefault();
+                onClickTab($(this));
+            });
+
+            function onClickTab(tab) {
+                $('.consent-tab').each(function () {
+                    $(this).removeClass('active');
+                });
+                tab.addClass('active');
+                $('.consent-tab-content').each(function () {
+                    $(this).css('display', 'none');
+                });
+                $('.consent-tab-content.' + tab.attr('id')).css('display', 'block');
+            }
+        }
+    });
+})();
