diff --git a/addons/account/static/src/scss/account_journal_dashboard.scss b/addons/account/static/src/scss/account_journal_dashboard.scss
index 42003420008..bcb0b392402 100644
--- a/addons/account/static/src/scss/account_journal_dashboard.scss
+++ b/addons/account/static/src/scss/account_journal_dashboard.scss
@@ -44,7 +44,7 @@
         &:not(.o_column_folded) {
             width: 450px + 2*$o-kanban-group-padding;
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 width: 100%;
             }
         }
diff --git a/addons/base_import/static/src/legacy/scss/base_import.scss b/addons/base_import/static/src/legacy/scss/base_import.scss
index 5fddbbbaab2..12a32d6bd0c 100644
--- a/addons/base_import/static/src/legacy/scss/base_import.scss
+++ b/addons/base_import/static/src/legacy/scss/base_import.scss
@@ -6,7 +6,7 @@
     right: 0;
     bottom: 0;
     left: 0;
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         position: static;
     }
 
diff --git a/addons/hr/static/src/scss/hr.scss b/addons/hr/static/src/scss/hr.scss
index a076eac5e83..0c4f8bbebba 100644
--- a/addons/hr/static/src/scss/hr.scss
+++ b/addons/hr/static/src/scss/hr.scss
@@ -51,7 +51,7 @@
         &:not(.o_column_folded) {
             width: 350px + 2*$o-kanban-group-padding;
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 width: 100%;
             }
         }
diff --git a/addons/hr_attendance/static/src/scss/hr_attendance.scss b/addons/hr_attendance/static/src/scss/hr_attendance.scss
index 495bea84a5c..ae67df30e08 100644
--- a/addons/hr_attendance/static/src/scss/hr_attendance.scss
+++ b/addons/hr_attendance/static/src/scss/hr_attendance.scss
@@ -1,6 +1,6 @@
 
 .o_hr_attendance_kiosk_mode, .o_hr_attendance_clock {
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         width: 100%;
     }
 }
diff --git a/addons/hr_holidays/static/src/scss/time_off.scss b/addons/hr_holidays/static/src/scss/time_off.scss
index 194493eff60..edebb7d77b3 100644
--- a/addons/hr_holidays/static/src/scss/time_off.scss
+++ b/addons/hr_holidays/static/src/scss/time_off.scss
@@ -53,7 +53,7 @@
 }
 
 .o_timeoff_calendar .o_cp_bottom {
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         position: relative;
         flex-direction: column;
         margin-left: -16px;
@@ -75,7 +75,7 @@
             }
         }
     }
-    @include media-breakpoint-down(xs) {
+    @include media-breakpoint-down(sm) {
         .o_cp_bottom_left {
             button {
                 padding: 7px 6px;
@@ -143,10 +143,10 @@
         .o_hr_leave_date {
             display: flex;
             flex-direction: row;
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 flex-direction: column;
             }
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 flex-direction: row;
             }
         }
diff --git a/addons/hr_org_chart/static/src/scss/hr_org_chart.scss b/addons/hr_org_chart/static/src/scss/hr_org_chart.scss
index 0be97346342..7a3a2ff4c05 100644
--- a/addons/hr_org_chart/static/src/scss/hr_org_chart.scss
+++ b/addons/hr_org_chart/static/src/scss/hr_org_chart.scss
@@ -1,5 +1,5 @@
 // MOBILE LAYOUT CUSTOMIZATIONS
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     #o_employee_right {
         .o_org_chart_title {
             font-size: 20px;
diff --git a/addons/im_livechat/static/src/legacy/public_livechat.scss b/addons/im_livechat/static/src/legacy/public_livechat.scss
index 2551a67302c..2b7ddf70ad7 100644
--- a/addons/im_livechat/static/src/legacy/public_livechat.scss
+++ b/addons/im_livechat/static/src/legacy/public_livechat.scss
@@ -19,7 +19,7 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
     z-index: $o-mail-thread-window-zindex;
     box-shadow: -5px -5px 10px rgba(black, 0.18);
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         width: 100%;
         height: 100%!important;
         box-shadow: none;
@@ -43,7 +43,7 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
         background-color: $o-brand-odoo;
         padding: 8px;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             align-items: center;
             height: $o-mail-chat-header-height;
             padding: 0;
@@ -143,7 +143,7 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
     cursor: pointer;
     box-shadow: none;
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         display: none;
     }
 
@@ -235,7 +235,7 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
     .o_thread_date_separator {
         margin-top: 15px;
         margin-bottom: 30px;
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             margin-top: 0px;
             margin-bottom: 15px;
         }
@@ -300,7 +300,7 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
                 }
             }
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 margin-top: 4px;
                 font-size: x-small;
             }
diff --git a/addons/im_livechat/static/src/legacy/public_livechat_chatbot.scss b/addons/im_livechat/static/src/legacy/public_livechat_chatbot.scss
index c254543214a..2c9d1c5ffb6 100644
--- a/addons/im_livechat/static/src/legacy/public_livechat_chatbot.scss
+++ b/addons/im_livechat/static/src/legacy/public_livechat_chatbot.scss
@@ -3,7 +3,7 @@
         color: white;
         @include o-hover-opacity(0.7, 1);
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             // copied from 'o_thread_window_close'
             $o-close-font-size: 17px;
             padding: (($o-mail-chat-header-height - $o-close-font-size) / 2);
diff --git a/addons/knowledge/static/src/scss/knowledge_editor.scss b/addons/knowledge/static/src/scss/knowledge_editor.scss
index 9c91a8a31ed..52fc2958c9f 100644
--- a/addons/knowledge/static/src/scss/knowledge_editor.scss
+++ b/addons/knowledge/static/src/scss/knowledge_editor.scss
@@ -58,7 +58,7 @@ $o-knowledge-font-configs: (
     }
 }
 
-@include media-breakpoint-down(lg) {
+@include media-breakpoint-down(xl) {
     .o_knowledge_editor .note-editable,
     .o_knowledge_editor .o_readonly {
         padding-bottom: 1rem;
diff --git a/addons/knowledge/static/src/scss/knowledge_views.scss b/addons/knowledge/static/src/scss/knowledge_views.scss
index d463b6deea1..8b0af062c41 100644
--- a/addons/knowledge/static/src/scss/knowledge_views.scss
+++ b/addons/knowledge/static/src/scss/knowledge_views.scss
@@ -183,7 +183,7 @@
     }
 }
 
-@include media-breakpoint-down(lg) {
+@include media-breakpoint-down(xl) {
     .o_knowledge_form_view {
         .o_scroll_view_lg {
             width: 100%;
@@ -229,7 +229,7 @@
     }
 }
 
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .o_knowledge_form_view {
         .o_knowledge_icon,
         .o_knowledge_icon_cover_buttons,
@@ -241,7 +241,7 @@
     }
 }
 
-@include media-breakpoint-down(xs) {
+@include media-breakpoint-down(sm) {
     .o_knowledge_form_view {
         .o_knowledge_aside {
             width: 100%;
diff --git a/addons/lunch/static/src/scss/lunch_view.scss b/addons/lunch/static/src/scss/lunch_view.scss
index 540f4db3259..3e91f7b0795 100644
--- a/addons/lunch/static/src/scss/lunch_view.scss
+++ b/addons/lunch/static/src/scss/lunch_view.scss
@@ -53,7 +53,7 @@
     }
 }
 
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .o_lunch_content {
         details summary {
             // Hide the caret. For details see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/summary
diff --git a/addons/mail/static/src/scss/composer.scss b/addons/mail/static/src/scss/composer.scss
index 908fd4b3511..5a27f6cd124 100644
--- a/addons/mail/static/src/scss/composer.scss
+++ b/addons/mail/static/src/scss/composer.scss
@@ -128,7 +128,7 @@
                     height: 80%;
                 }
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     .o_viewer_pdf, .o_viewer_text {
                         width: map-get($sizes, 100);
                     }
diff --git a/addons/mail/static/src/scss/discuss.scss b/addons/mail/static/src/scss/discuss.scss
index 625d04a0a5d..deccabb39ee 100644
--- a/addons/mail/static/src/scss/discuss.scss
+++ b/addons/mail/static/src/scss/discuss.scss
@@ -129,7 +129,7 @@
     }
 }
 
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
 
     .o_main_navbar > ul.o_menu_systray > li .dropdown-menu.show {
         border: none;
diff --git a/addons/mail/static/src/scss/kanban_view.scss b/addons/mail/static/src/scss/kanban_view.scss
index df2ac0db9f1..3406c1af9db 100644
--- a/addons/mail/static/src/scss/kanban_view.scss
+++ b/addons/mail/static/src/scss/kanban_view.scss
@@ -11,7 +11,7 @@ $o-kanban-attachement-image-size: 80px;
 
             + div {
                 padding-left: $o-kanban-attachement-image-size + $o-kanban-inside-hgutter;
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     padding-left:  $o-kanban-attachement-image-size + $o-kanban-inside-hgutter-mobile;
                 }
             }
diff --git a/addons/mail/static/src/scss/systray.scss b/addons/mail/static/src/scss/systray.scss
index d40d57cceeb..0930800a452 100644
--- a/addons/mail/static/src/scss/systray.scss
+++ b/addons/mail/static/src/scss/systray.scss
@@ -87,7 +87,7 @@
 
 // Mobile rules
 // Goal: mock the design of Discuss in mobile
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .o_mail_systray_item {
         .o_mail_systray_dropdown {
             position: fixed;
diff --git a/addons/mail/static/src/scss/thread.scss b/addons/mail/static/src/scss/thread.scss
index 1fa2753e6b6..f70d50875ed 100644
--- a/addons/mail/static/src/scss/thread.scss
+++ b/addons/mail/static/src/scss/thread.scss
@@ -3,7 +3,7 @@
     .o_thread_date_separator {
         margin-top: 15px;
         margin-bottom: 30px;
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             margin-top: 0px;
             margin-bottom: 15px;
         }
@@ -49,7 +49,7 @@
                 }
             }
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 margin-top: 4px;
                 font-size: x-small;
             }
diff --git a/addons/mail/static/src/widgets/attachment_viewer/attachment_viewer.scss b/addons/mail/static/src/widgets/attachment_viewer/attachment_viewer.scss
index 12f6257e59d..bd4e9308a90 100644
--- a/addons/mail/static/src/widgets/attachment_viewer/attachment_viewer.scss
+++ b/addons/mail/static/src/widgets/attachment_viewer/attachment_viewer.scss
@@ -51,7 +51,7 @@
     }
 }
 
-@include media-breakpoint-down(xl, $o-extra-grid-breakpoints) {
+@include media-breakpoint-down(xxl, $o-extra-grid-breakpoints) {
     .o_attachment_preview {
         display: none;
     }
diff --git a/addons/mass_mailing/static/src/scss/mass_mailing.scss b/addons/mass_mailing/static/src/scss/mass_mailing.scss
index d6aad63d21c..120482af250 100644
--- a/addons/mass_mailing/static/src/scss/mass_mailing.scss
+++ b/addons/mass_mailing/static/src/scss/mass_mailing.scss
@@ -128,7 +128,7 @@
                 &:hover {
                     font-weight: normal;
                 }
-                @include media-breakpoint-down(xs) {
+                @include media-breakpoint-down(sm) {
                     font-size: 1.4rem;
                     height: 40px;
                     margin-bottom: 30px;
diff --git a/addons/mass_mailing/static/src/scss/mass_mailing_mobile.scss b/addons/mass_mailing/static/src/scss/mass_mailing_mobile.scss
index 49555291b23..4c04e47f4a0 100644
--- a/addons/mass_mailing/static/src/scss/mass_mailing_mobile.scss
+++ b/addons/mass_mailing/static/src/scss/mass_mailing_mobile.scss
@@ -1,4 +1,4 @@
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .o_utm_campaign_mass_mailing_substats {
         width: 80%;
         margin: 0 auto;
diff --git a/addons/mrp/static/src/scss/mrp_bom_report.scss b/addons/mrp/static/src/scss/mrp_bom_report.scss
index ca2e10857fe..b920b03b173 100644
--- a/addons/mrp/static/src/scss/mrp_bom_report.scss
+++ b/addons/mrp/static/src/scss/mrp_bom_report.scss
@@ -32,7 +32,7 @@
         }
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .o_mrp_bom_report_line {
             & .fa-caret-down, & .fa-caret-right {
                 font-size: 2em;
@@ -42,7 +42,7 @@
 }
 
 .o_mrp_bom_report_buttons {
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         display: grid;
         grid-gap: 4px; // For compatibility
         gap: 4px;
diff --git a/addons/portal/static/src/scss/portal.scss b/addons/portal/static/src/scss/portal.scss
index 33eea4d7bca..305a696c0b9 100644
--- a/addons/portal/static/src/scss/portal.scss
+++ b/addons/portal/static/src/scss/portal.scss
@@ -47,7 +47,7 @@ header {
                 width: auto;
                 height: $o-theme-navbar-logo-height;
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     max-height: min($o-theme-navbar-logo-height, 5rem);
                 }
             }
@@ -60,7 +60,7 @@ header {
 .navbar {
     margin-bottom: 0;
     .nav.navbar-nav.float-right {
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             float: none!important;
         }
     }
@@ -377,7 +377,7 @@ img, .media_iframe_video, .o_image {
 
     @if ($o-portal-mobile-toolbar) {
         #o_portal_navbar_content {
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 margin: $navbar-padding-y (-$navbar-padding-x) 0;
                 padding: $navbar-padding-y $navbar-padding-x ;
                 border-top: $border-width solid $o-portal-mobile-toolbar-border;
diff --git a/addons/project/static/src/scss/project_dashboard.scss b/addons/project/static/src/scss/project_dashboard.scss
index 47289359433..335f9165f44 100644
--- a/addons/project/static/src/scss/project_dashboard.scss
+++ b/addons/project/static/src/scss/project_dashboard.scss
@@ -51,7 +51,7 @@
         }
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .o_view_nocontent {
             top: 15%;
         }
diff --git a/addons/sale/static/src/scss/product_configurator.scss b/addons/sale/static/src/scss/product_configurator.scss
index fc2e561b5da..ad677e59701 100644
--- a/addons/sale/static/src/scss/product_configurator.scss
+++ b/addons/sale/static/src/scss/product_configurator.scss
@@ -247,7 +247,7 @@ label.css_attribute_color.css_not_available {
         width: 120px;
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .td-img,
         .td-price-total {
             display: none;
diff --git a/addons/sale/static/src/scss/sale_portal.scss b/addons/sale/static/src/scss/sale_portal.scss
index 56b7883a7dd..304856c1bfe 100644
--- a/addons/sale/static/src/scss/sale_portal.scss
+++ b/addons/sale/static/src/scss/sale_portal.scss
@@ -36,7 +36,7 @@
         padding: 0.2rem 0.4rem;
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         width: 100%;
     }
 }
diff --git a/addons/survey/static/src/scss/survey_survey_views.scss b/addons/survey/static/src/scss/survey_survey_views.scss
index ee445b27df4..22b0cbfa09b 100644
--- a/addons/survey/static/src/scss/survey_survey_views.scss
+++ b/addons/survey/static/src/scss/survey_survey_views.scss
@@ -86,7 +86,7 @@
             width: 130px;
 
             // Mobile: is in a corner, takes more place
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 height: 100px;
                 width: 100px;
             }
diff --git a/addons/web/static/src/core/dialog/dialog.scss b/addons/web/static/src/core/dialog/dialog.scss
index f007a3e9c5e..edbc87f3316 100644
--- a/addons/web/static/src/core/dialog/dialog.scss
+++ b/addons/web/static/src/core/dialog/dialog.scss
@@ -9,7 +9,7 @@
         justify-content: flex-start;
         gap: map-get($spacers, 1);
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             justify-content: space-around;
         }
     }
diff --git a/addons/web/static/src/legacy/scss/banner.scss b/addons/web/static/src/legacy/scss/banner.scss
index be011d70698..78ff0358986 100644
--- a/addons/web/static/src/legacy/scss/banner.scss
+++ b/addons/web/static/src/legacy/scss/banner.scss
@@ -1,7 +1,7 @@
 .o_has_banner {
     .o_view_nocontent {
         top: 30%;
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             position: relative;
             margin: auto;
         }
diff --git a/addons/web/static/src/legacy/scss/data_export.scss b/addons/web/static/src/legacy/scss/data_export.scss
index a5282dbedf1..de405e2b64d 100644
--- a/addons/web/static/src/legacy/scss/data_export.scss
+++ b/addons/web/static/src/legacy/scss/data_export.scss
@@ -7,7 +7,7 @@
     @include o-grab-cursor;
 }
 
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .ui-sortable-handle {
         display: none;
     }
diff --git a/addons/web/static/src/legacy/scss/fields.scss b/addons/web/static/src/legacy/scss/fields.scss
index 5bc17e6e0a1..39e80021799 100644
--- a/addons/web/static/src/legacy/scss/fields.scss
+++ b/addons/web/static/src/legacy/scss/fields.scss
@@ -397,7 +397,7 @@
     }
     // Radio buttons
     &.o_field_radio {
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             display: inline-block;
         }
         .o_radio_input {
@@ -501,7 +501,7 @@
                 cursor: pointer;
             }
         }
-        @include media-breakpoint-down(xs, $o-extra-grid-breakpoints) {
+        @include media-breakpoint-down(sm, $o-extra-grid-breakpoints) {
             .o_form_image_controls{
                 position: initial;
                 opacity: 1;
diff --git a/addons/web/static/src/legacy/scss/form_view.scss b/addons/web/static/src/legacy/scss/form_view.scss
index 0f2eb3af5ec..2219b8ce165 100644
--- a/addons/web/static/src/legacy/scss/form_view.scss
+++ b/addons/web/static/src/legacy/scss/form_view.scss
@@ -450,7 +450,7 @@ $o-form-label-margin-right: 0px;
             box-sizing: content-box;
             margin: 0;
             padding: 0;
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 // avoid b4 drowdown inline style
                 position: relative !important;
                 transform: none !important;
@@ -463,7 +463,7 @@ $o-form-label-margin-right: 0px;
                 // Override stronger ':not(.o_invisible_modifier) ~' rule
                 border-width: 0 0 $border-width!important;
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     display: inline-block;
                     width: percentage(1/3);
                 }
@@ -618,7 +618,7 @@ $o-form-label-margin-right: 0px;
     .o_checkbox_optional_field {
         display: flex;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             flex-wrap: wrap;
             justify-content: space-between;
         }
diff --git a/addons/web/static/src/legacy/scss/kanban_dashboard.scss b/addons/web/static/src/legacy/scss/kanban_dashboard.scss
index 587df3fa402..d4cd77fa06e 100644
--- a/addons/web/static/src/legacy/scss/kanban_dashboard.scss
+++ b/addons/web/static/src/legacy/scss/kanban_dashboard.scss
@@ -12,7 +12,7 @@
         justify-content: space-between;
         padding: $o-kanban-dashboard-vpadding $o-kanban-dashboard-hpadding;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             margin-bottom: 10px;
         }
 
@@ -172,7 +172,7 @@
                 @include o-text-overflow(inline-block);
             }
 
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 button + a {
                     display: block;
                     margin-top: map-get($spacers, 3);
diff --git a/addons/web/static/src/legacy/scss/kanban_view.scss b/addons/web/static/src/legacy/scss/kanban_view.scss
index 48b93d1be1a..11ebfde2a89 100644
--- a/addons/web/static/src/legacy/scss/kanban_view.scss
+++ b/addons/web/static/src/legacy/scss/kanban_view.scss
@@ -3,7 +3,7 @@
     display: flex;
     align-content: stretch;
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         padding: 0px!important;
     }
 
@@ -12,7 +12,7 @@
         border: 1px solid $border-color;
         background-color: $o-view-background-color;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             padding: $o-kanban-inside-vgutter $o-kanban-inside-hgutter-mobile;
         }
         &:focus, &:focus-within {
@@ -194,7 +194,7 @@
                     margin: { left: $fill-notfill-gap*0.5; right: $fill-notfill-gap*2;}
                 }
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     flex-basis: $o-kanban-image-fill-width;
                     min-height: $o-kanban-image-fill-width;
                 }
@@ -239,7 +239,7 @@
             margin: (-$o-kanban-inside-vgutter) (-$o-kanban-inside-hgutter) 0 0;
             .dropdown-toggle {
                 visibility: hidden;
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     visibility: visible;
                 }
                 @include o-kanban-dropdown;
@@ -318,7 +318,7 @@
 
             > button, > a {
                 @include o-position-absolute($right: $o-kanban-record-margin, $bottom: $o-kanban-record-margin);
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     right: $o-kanban-inside-hgutter-mobile;
                 }
             }
@@ -372,7 +372,7 @@
 
             + div {
                 padding-left: $o-kanban-image-width + $o-kanban-inside-hgutter;
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     padding-left:  $o-kanban-image-width + $o-kanban-inside-hgutter-mobile;
                 }
             }
@@ -426,7 +426,7 @@
         padding: 0;
         background-color: $gray-100;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             min-height: initial;
             height: 100%;
             overflow: scroll hidden !important;
@@ -478,7 +478,7 @@
 
             .o_kanban_config {
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     visibility: visible;
                 }
 
@@ -553,7 +553,7 @@
             margin: $border-width ($o-kanban-inside-hgutter * .5) 0;
             padding: $o-kanban-inside-vgutter $o-kanban-inside-hgutter;
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 margin: 0;
             }
 
@@ -579,7 +579,7 @@
         }
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .o_kanban_group, .o_column_quick_create {
             flex: 1 0 90%; // don't take full width to give a hint of next/previous column
             scroll-snap-align: center;
@@ -612,7 +612,7 @@
             width: $o-kanban-default-record-width;
             margin: ($o-kanban-record-margin * 0.5) $o-kanban-record-margin;
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 margin: 0 0 -1px 0;
                 flex: 1 0 100%;
             }
diff --git a/addons/web/static/src/legacy/scss/modal.scss b/addons/web/static/src/legacy/scss/modal.scss
index f1075065083..f77763e9c29 100644
--- a/addons/web/static/src/legacy/scss/modal.scss
+++ b/addons/web/static/src/legacy/scss/modal.scss
@@ -15,7 +15,7 @@
             &.o_act_window {
                 padding: 0;
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     .o_action {
                         display: flex;
                         flex-direction: column;
@@ -75,7 +75,7 @@
         }
     }
 
-    @include media-breakpoint-down(xs) {
+    @include media-breakpoint-down(sm) {
         &.o_modal_full {
             .modal-dialog {
                 margin: 0px;
diff --git a/addons/web/static/src/legacy/scss/web_calendar.scss b/addons/web/static/src/legacy/scss/web_calendar.scss
index 01586b376cd..eba8bc645fd 100644
--- a/addons/web/static/src/legacy/scss/web_calendar.scss
+++ b/addons/web/static/src/legacy/scss/web_calendar.scss
@@ -385,7 +385,7 @@ $o-cw-filter-avatar-size: 20px;
             justify-content: space-evenly;
             overflow-y: auto;
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 padding-right: 5px;
                 padding-left: 5px;
             }
@@ -458,7 +458,7 @@ $o-cw-filter-avatar-size: 20px;
                 min-width: 25rem;
                 box-sizing: border-box;
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     width: 50%;
                     min-width: 12rem;
                 }
@@ -467,7 +467,7 @@ $o-cw-filter-avatar-size: 20px;
                     width: 21rem;
                     margin: auto;
 
-                    @include media-breakpoint-down(sm) {
+                    @include media-breakpoint-down(md) {
                         width: 95%;
                     }
 
diff --git a/addons/web/static/src/search/search_panel/search_panel.scss b/addons/web/static/src/search/search_panel/search_panel.scss
index a222bb6a1e1..83bb47148bf 100644
--- a/addons/web/static/src/search/search_panel/search_panel.scss
+++ b/addons/web/static/src/search/search_panel/search_panel.scss
@@ -19,7 +19,7 @@ $o-searchpanel-filter-default-color: #D59244;
         max-height: 100%;
         position: relative;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             overflow: visible;
         }    
     }
diff --git a/addons/web/static/src/views/fields/image/image_field.scss b/addons/web/static/src/views/fields/image/image_field.scss
index e5ed1020427..ec4a1ea2678 100644
--- a/addons/web/static/src/views/fields/image/image_field.scss
+++ b/addons/web/static/src/views/fields/image/image_field.scss
@@ -22,7 +22,7 @@
         }
     }
 
-    @include media-breakpoint-down(xs, $o-extra-grid-breakpoints) {
+    @include media-breakpoint-down(sm, $o-extra-grid-breakpoints) {
         .o_form_image_controls {
             position: initial;
             opacity: 1;
diff --git a/addons/web/static/src/views/fields/radio/radio_field.scss b/addons/web/static/src/views/fields/radio/radio_field.scss
index 8b38f65fd1a..4df78059a6a 100644
--- a/addons/web/static/src/views/fields/radio/radio_field.scss
+++ b/addons/web/static/src/views/fields/radio/radio_field.scss
@@ -3,7 +3,7 @@
     > span, > button {
         flex: 0 0 auto;
     }
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         display: inline-block;
     }
     .o_radio_input {
diff --git a/addons/web/static/src/views/form/button_box/button_box.scss b/addons/web/static/src/views/form/button_box/button_box.scss
index ef65911de07..105afd19547 100644
--- a/addons/web/static/src/views/form/button_box/button_box.scss
+++ b/addons/web/static/src/views/form/button_box/button_box.scss
@@ -142,7 +142,7 @@
     //     border: 1px solid gray('300');
     //     margin: 0;
     //     padding: 0;
-    //     @include media-breakpoint-down(sm) {
+    //     @include media-breakpoint-down(md) {
     //         // avoid b4 drowdown inline style
     //         position: relative !important;
     //         transform: none !important;
@@ -156,7 +156,7 @@
     //         border: none;
     //         border-bottom: 1px solid gray('300');
 
-    //         @include media-breakpoint-down(sm) {
+    //         @include media-breakpoint-down(md) {
     //             display: inline-block;
     //             width: percentage(1/3);
     //         }
diff --git a/addons/web/static/src/views/form/form_controller.scss b/addons/web/static/src/views/form/form_controller.scss
index cf6f69316e9..6d4c664e11f 100644
--- a/addons/web/static/src/views/form/form_controller.scss
+++ b/addons/web/static/src/views/form/form_controller.scss
@@ -1,7 +1,7 @@
 // Define left and right padding according to screen resolution
 @mixin o-form-sheet-inner-left-padding {
     padding-left: $o-horizontal-padding;
-    @include media-breakpoint-between(lg, xl, $o-extra-grid-breakpoints) {
+    @include media-breakpoint-between(lg,  xxl, $o-extra-grid-breakpoints) {
         padding-left: $o-horizontal-padding*2;
     }
 }
@@ -10,7 +10,7 @@
 }
 @mixin o-form-sheet-inner-right-padding {
     padding-right: $o-horizontal-padding;
-    @include media-breakpoint-between(lg, xl, $o-extra-grid-breakpoints) {
+    @include media-breakpoint-between(lg,  xxl, $o-extra-grid-breakpoints) {
         padding-right: $o-horizontal-padding*2;
     }
 }
@@ -18,7 +18,7 @@
 @mixin o-form-sheet-negative-margin {
     margin-left: -$o-horizontal-padding;
     margin-right: -$o-horizontal-padding;
-    @include media-breakpoint-between(lg, xl, $o-extra-grid-breakpoints) {
+    @include media-breakpoint-between(lg,  xxl, $o-extra-grid-breakpoints) {
         margin-left: -$o-horizontal-padding*2;
         margin-right: -$o-horizontal-padding*2;
     }
@@ -451,7 +451,7 @@ $o-form-label-margin-right: 0px;
             box-sizing: content-box;
             margin: 0;
             padding: 0;
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 // avoid b4 drowdown inline style
                 position: relative !important;
                 transform: none !important;
@@ -465,7 +465,7 @@ $o-form-label-margin-right: 0px;
                 // Override stronger ':not(.o_invisible_modifier) ~' rule
                 border-width: 0 0 $border-width!important;
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     display: inline-block;
                     width: percentage(1/3);
                 }
@@ -598,7 +598,7 @@ $o-form-label-margin-right: 0px;
     .o_checkbox_optional_field {
         display: flex;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             flex-wrap: wrap;
             justify-content: space-between;
         }
diff --git a/addons/web/static/src/views/kanban/kanban_controller.scss b/addons/web/static/src/views/kanban/kanban_controller.scss
index af05f2b3e32..3977f17e319 100644
--- a/addons/web/static/src/views/kanban/kanban_controller.scss
+++ b/addons/web/static/src/views/kanban/kanban_controller.scss
@@ -7,7 +7,7 @@
         position: inherit;
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         padding: 0px!important;
     }
 
@@ -16,7 +16,7 @@
         border: 1px solid $border-color;
         background-color: $o-view-background-color;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             padding: $o-kanban-inside-vgutter $o-kanban-inside-hgutter-mobile;
         }
         &:focus, &:focus-within {
@@ -206,7 +206,7 @@
                     margin: { left: $fill-notfill-gap*0.5; right: $fill-notfill-gap*2;}
                 }
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     flex-basis: $o-kanban-image-fill-width;
                     min-height: $o-kanban-image-fill-width;
                 }
@@ -248,7 +248,7 @@
             @include o-position-absolute($o-kanban-inside-vgutter, $o-kanban-inside-hgutter);
             visibility: hidden;
             margin: (-$o-kanban-inside-vgutter) (-$o-kanban-inside-hgutter) 0 0;
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 visibility: visible;
             }
 
@@ -330,7 +330,7 @@
 
             > button, > a {
                 @include o-position-absolute($right: $o-kanban-record-margin, $bottom: $o-kanban-record-margin);
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     right: $o-kanban-inside-hgutter-mobile;
                 }
             }
@@ -380,7 +380,7 @@
 
             + div {
                 padding-left: $o-kanban-image-width + $o-kanban-inside-hgutter;
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     padding-left:  $o-kanban-image-width + $o-kanban-inside-hgutter-mobile;
                 }
             }
@@ -434,7 +434,7 @@
         padding: 0;
         background-color: $gray-100;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             min-height: initial;
             height: 100%;
             overflow: scroll hidden !important;
@@ -483,7 +483,7 @@
 
             .o_kanban_config {
                 visibility: hidden;
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     visibility: visible;
                 }
 
@@ -553,7 +553,7 @@
             margin: $border-width ($o-kanban-inside-hgutter * .5) 0;
             padding: $o-kanban-inside-vgutter $o-kanban-inside-hgutter;
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 margin: 0;
             }
 
@@ -579,7 +579,7 @@
         }
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .o_kanban_group, .o_column_quick_create {
             flex: 1 0 90%; // don't take full width to give a hint of next/previous column
             scroll-snap-align: center;
@@ -612,7 +612,7 @@
             width: $o-kanban-default-record-width;
             margin: ($o-kanban-record-margin * 0.5) $o-kanban-record-margin;
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 margin: 0 0 -1px 0;
                 flex: 1 0 100%;
             }
diff --git a/addons/web/static/src/views/kanban/kanban_dashboard.scss b/addons/web/static/src/views/kanban/kanban_dashboard.scss
index 6e152fc755e..d715d95f996 100644
--- a/addons/web/static/src/views/kanban/kanban_dashboard.scss
+++ b/addons/web/static/src/views/kanban/kanban_dashboard.scss
@@ -11,7 +11,7 @@
         justify-content: space-between;
         padding: $o-kanban-dashboard-vpadding $o-kanban-dashboard-hpadding;
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             margin-bottom: 10px;
         }
 
@@ -176,7 +176,7 @@
                 @include o-text-overflow(inline-block);
             }
 
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 button + a {
                     display: block;
                     margin-top: map-get($spacers, 3);
diff --git a/addons/web/static/src/webclient/burger_menu/burger_menu.scss b/addons/web/static/src/webclient/burger_menu/burger_menu.scss
index 4a15f65bceb..ce720f267cc 100644
--- a/addons/web/static/src/webclient/burger_menu/burger_menu.scss
+++ b/addons/web/static/src/webclient/burger_menu/burger_menu.scss
@@ -176,7 +176,7 @@ body.o_home_menu_background .o_burger_menu_topbar .dropdown-toggle {
   color: $o-main-headings-color;
 }
 
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
   .o_debug_dropdown {
     z-index: $zindex-tooltip + 10;
   }
diff --git a/addons/web/static/src/webclient/webclient_layout.scss b/addons/web/static/src/webclient/webclient_layout.scss
index 31084bd0884..4d35d4f298e 100644
--- a/addons/web/static/src/webclient/webclient_layout.scss
+++ b/addons/web/static/src/webclient/webclient_layout.scss
@@ -41,7 +41,7 @@ html {
           height: 100%;
         }
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
           // Made the o_action scroll instead of its o_content.
           // Except when the view wants to handle the scroll itself.
           &:not(.o_action_delegate_scroll) {
diff --git a/addons/web_editor/static/src/scss/web_editor.common.scss b/addons/web_editor/static/src/scss/web_editor.common.scss
index 75adfad39b1..4b4452a42b9 100644
--- a/addons/web_editor/static/src/scss/web_editor.common.scss
+++ b/addons/web_editor/static/src/scss/web_editor.common.scss
@@ -118,7 +118,7 @@ html, body {
             min-width: 20px;
         }
     }
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .table-responsive > table.table {
             table-layout: auto;
         }
@@ -545,7 +545,7 @@ a.o_underline {
     }
 }
 
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     odoo-wysiwyg-container {
         .panel-heading.note-toolbar {
             overflow-x: auto;
diff --git a/addons/web_editor/static/src/scss/web_editor.frontend.scss b/addons/web_editor/static/src/scss/web_editor.frontend.scss
index dabde998bd4..e9e2591b527 100644
--- a/addons/web_editor/static/src/scss/web_editor.frontend.scss
+++ b/addons/web_editor/static/src/scss/web_editor.frontend.scss
@@ -1,4 +1,4 @@
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     img, .media_iframe_video, span.fa, i.fa {
         transform: none !important;
     }
@@ -29,7 +29,7 @@
         }
     }
 }
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .o_we_shape {
         display: none;
     }
diff --git a/addons/web_editor/static/src/scss/wysiwyg.scss b/addons/web_editor/static/src/scss/wysiwyg.scss
index 81fcadb959b..15cf551f30b 100644
--- a/addons/web_editor/static/src/scss/wysiwyg.scss
+++ b/addons/web_editor/static/src/scss/wysiwyg.scss
@@ -526,7 +526,7 @@ img::selection {
     background-color: rgba(255, 255, 255, .7);
 }
 
-@include media-breakpoint-down(md) {
+@include media-breakpoint-down(lg) {
     #web_editor-top-edit {
         position: initial !important;
         height: initial !important;
diff --git a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
index 4ec8df63a99..b6df8f66c68 100644
--- a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
+++ b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
@@ -27,7 +27,7 @@ body.editor_enable.editor_has_snippets {
 }
 
 // Mobile fix for mass mailing
-@include media-breakpoint-down(md) {
+@include media-breakpoint-down(lg) {
     body.editor_enable.editor_has_snippets {
         #web_editor-top-edit {
             position: initial !important;
diff --git a/addons/website/static/src/client_actions/configurator/configurator.scss b/addons/website/static/src/client_actions/configurator/configurator.scss
index d5f4f89e603..9c206ef3aeb 100644
--- a/addons/website/static/src/client_actions/configurator/configurator.scss
+++ b/addons/website/static/src/client_actions/configurator/configurator.scss
@@ -199,7 +199,7 @@
         }
 
         &.o_palette_selection_screen {
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 .o_detect_logo {
                     width: 100% !important;
                 }
@@ -218,7 +218,7 @@
                 }
             }
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 .o_palette_card_container {
                     width: 50% !important;
                 }
@@ -267,13 +267,13 @@
         }
 
         &.o_feature_selection_screen {
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 .o_feature_card_container {
                     width: 50% !important;
                 }
             }
 
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 .o_feature_card_container {
                     width: 100% !important;
                 }
diff --git a/addons/website/static/src/scss/compatibility/bs3_for_12_0.scss b/addons/website/static/src/scss/compatibility/bs3_for_12_0.scss
index 179584b78b9..e335c0eb33c 100644
--- a/addons/website/static/src/scss/compatibility/bs3_for_12_0.scss
+++ b/addons/website/static/src/scss/compatibility/bs3_for_12_0.scss
@@ -230,17 +230,17 @@ $-compat-breakpoints: (
     }
     &-xs {
         &, &-block {
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 display: block !important;
             }
         }
         &-inline {
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 display: inline !important;
             }
         }
         &-inline-block {
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 display: inline-block !important;
             }
         }
@@ -299,7 +299,7 @@ $-compat-breakpoints: (
 }
 .hidden {
     &-xs {
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             display: none !important;
         }
     }
diff --git a/addons/website/static/src/scss/website.backend.scss b/addons/website/static/src/scss/website.backend.scss
index c54b25f4513..46c45fc4cf6 100644
--- a/addons/website/static/src/scss/website.backend.scss
+++ b/addons/website/static/src/scss/website.backend.scss
@@ -70,7 +70,7 @@
                 flex-flow: row wrap;
                 justify-content: flex-start;
                 > .o_inner_box {
-                    @include media-breakpoint-down(sm) {
+                    @include media-breakpoint-down(md) {
                         flex: 1 1 200px;
                         display: block !important;
                     }
@@ -230,7 +230,7 @@
         justify-content: space-between;
         margin: 0 0 0 ($o-kanban-record-margin - 2 * $grid-gutter-width);
 
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             padding-left: $o-horizontal-padding - $o-kanban-record-margin;
             padding-right: $o-horizontal-padding;
         }
diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index e8466cb05ba..2a5064e1ae0 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -494,7 +494,7 @@ table.table_desc tr td {
         width: 8%;
         opacity: 1;
     }
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .carousel-control-prev,
         .carousel-control-next {
             display: none; // remove arrows on mobile
@@ -555,7 +555,7 @@ table.table_desc tr td {
     // Border
     &.s_carousel_bordered {
         border: 2rem solid rgba(0,0,0,0);
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             border: 0.5rem solid rgba(0,0,0,0);
         }
         // Controls - caret
@@ -1465,7 +1465,7 @@ $ribbon-padding: 100px;
     }
     .o_cookies_discrete {
         .js_close_popup.o_cookies_bar_text_button, .o_cookies_bar_text_policy {
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 margin-bottom: 1rem;
             }
         }
diff --git a/addons/website/static/src/scss/website.theme_install.scss b/addons/website/static/src/scss/website.theme_install.scss
index 9374275f5b6..ea08b7703d6 100644
--- a/addons/website/static/src/scss/website.theme_install.scss
+++ b/addons/website/static/src/scss/website.theme_install.scss
@@ -16,7 +16,7 @@
     }
     .o_theme_install_loader_tip {
         font-size: 0.5em;
-        @include media-breakpoint-down(md) {
+        @include media-breakpoint-down(lg) {
             width: 50% !important;
         }
     }
diff --git a/addons/website/static/src/snippets/s_color_blocks_2/000.scss b/addons/website/static/src/snippets/s_color_blocks_2/000.scss
index 555cab58f55..9928677954e 100644
--- a/addons/website/static/src/snippets/s_color_blocks_2/000.scss
+++ b/addons/website/static/src/snippets/s_color_blocks_2/000.scss
@@ -23,7 +23,7 @@
         padding-top: 8vw; // A flex item cannot have % padding top and bottom (even if it works on chrome)
         padding-bottom: 8vw; // Solution is vw units but we keep 8% as a fallback
     }
-    @include media-breakpoint-down(md) {
+    @include media-breakpoint-down(lg) {
         [class*="col-lg-"] {
             flex: 1 1 100%;
         }
diff --git a/addons/website/static/src/snippets/s_company_team/000.scss b/addons/website/static/src/snippets/s_company_team/000.scss
index 7947b831094..7f1c8f866ae 100644
--- a/addons/website/static/src/snippets/s_company_team/000.scss
+++ b/addons/website/static/src/snippets/s_company_team/000.scss
@@ -1,6 +1,6 @@
 
 .s_company_team {
-    @include media-breakpoint-down(md) {
+    @include media-breakpoint-down(lg) {
         img {
             max-width: 50%;
         }
diff --git a/addons/website/static/src/snippets/s_masonry_block/000.scss b/addons/website/static/src/snippets/s_masonry_block/000.scss
index 19e10320971..4f3a0f3b489 100644
--- a/addons/website/static/src/snippets/s_masonry_block/000.scss
+++ b/addons/website/static/src/snippets/s_masonry_block/000.scss
@@ -13,7 +13,7 @@
     .container-fluid > .row {
         flex-flow: row nowrap;
 
-        @include media-breakpoint-down(md) {
+        @include media-breakpoint-down(lg) {
             flex-flow: column nowrap;
         }
 
@@ -26,7 +26,7 @@
                 min-height: 100%;
                 margin: 0;
 
-                @include media-breakpoint-down(sm) {
+                @include media-breakpoint-down(md) {
                     flex-flow: column nowrap;
                 }
 
diff --git a/addons/website/static/src/snippets/s_popup/001.scss b/addons/website/static/src/snippets/s_popup/001.scss
index b7bac9cd5e4..550827e5bef 100644
--- a/addons/website/static/src/snippets/s_popup/001.scss
+++ b/addons/website/static/src/snippets/s_popup/001.scss
@@ -10,7 +10,7 @@
     .modal-dialog {
         height: auto;
         min-height: 100%;
-        @include media-breakpoint-down(xs) {
+        @include media-breakpoint-down(sm) {
             min-height: calc(100% - 2 * #{$modal-dialog-margin});
         }
     }
diff --git a/addons/website/static/src/snippets/s_process_steps/001.scss b/addons/website/static/src/snippets/s_process_steps/001.scss
index b0686c7c500..3741c0da0dd 100644
--- a/addons/website/static/src/snippets/s_process_steps/001.scss
+++ b/addons/website/static/src/snippets/s_process_steps/001.scss
@@ -50,7 +50,7 @@
         stroke: transparent;
     }
 
-    @include media-breakpoint-down(md) {
+    @include media-breakpoint-down(lg) {
         .s_process_step_connector {
             display: none;
         }
diff --git a/addons/website/static/src/snippets/s_quotes_carousel/001.scss b/addons/website/static/src/snippets/s_quotes_carousel/001.scss
index c26dff12a6e..2c3d23d888b 100644
--- a/addons/website/static/src/snippets/s_quotes_carousel/001.scss
+++ b/addons/website/static/src/snippets/s_quotes_carousel/001.scss
@@ -1,7 +1,7 @@
 .s_quotes_carousel_wrapper[data-vcss='001'] {
     .s_blockquote {
         margin-bottom: 0;
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             width: 100% !important; // TODO add the right class in the xml when it's possible
         }
     }
diff --git a/addons/website/static/src/snippets/s_showcase/000.scss b/addons/website/static/src/snippets/s_showcase/000.scss
index 8970e7e262b..f4897bb1cbc 100644
--- a/addons/website/static/src/snippets/s_showcase/000.scss
+++ b/addons/website/static/src/snippets/s_showcase/000.scss
@@ -47,7 +47,7 @@
     }
 }
 
-@include media-breakpoint-down(md) {
+@include media-breakpoint-down(lg) {
     #wrapwrap .s_showcase:not([data-vcss]) {
         .text-right, .text-left {
             text-align: center;
diff --git a/addons/website/static/src/snippets/s_timeline/000.scss b/addons/website/static/src/snippets/s_timeline/000.scss
index 2c0d03f904a..0b52cb47f97 100644
--- a/addons/website/static/src/snippets/s_timeline/000.scss
+++ b/addons/website/static/src/snippets/s_timeline/000.scss
@@ -52,7 +52,7 @@
             left: 0%;
             right: 0%;
         }
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             position: relative;
             margin: 20px 0px;
         }
diff --git a/addons/website/static/src/snippets/s_website_form/000.scss b/addons/website/static/src/snippets/s_website_form/000.scss
index 0ba43a0c6e4..9da9abfc31c 100644
--- a/addons/website/static/src/snippets/s_website_form/000.scss
+++ b/addons/website/static/src/snippets/s_website_form/000.scss
@@ -30,12 +30,12 @@
             flex-basis: 33%;
 
             // col-md-6
-            @include media-breakpoint-down(md) {
+            @include media-breakpoint-down(lg) {
                 flex-basis: 50%;
             }
 
             // col-12
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 flex-basis: 100%;
             }
         }
diff --git a/addons/website/static/src/snippets/s_website_form/001.scss b/addons/website/static/src/snippets/s_website_form/001.scss
index 445c7e9cd54..cc5dd2751c1 100644
--- a/addons/website/static/src/snippets/s_website_form/001.scss
+++ b/addons/website/static/src/snippets/s_website_form/001.scss
@@ -26,7 +26,7 @@
 
 .s_website_form[data-vcss="001"] {
     .s_website_form_label {
-        @include media-breakpoint-down(xs) {
+        @include media-breakpoint-down(sm) {
             width: auto !important;
         }
     }
diff --git a/addons/website_blog/static/src/snippets/s_blog_posts/000.scss b/addons/website_blog/static/src/snippets/s_blog_posts/000.scss
index 4ac02b7e82f..71e8e66d324 100644
--- a/addons/website_blog/static/src/snippets/s_blog_posts/000.scss
+++ b/addons/website_blog/static/src/snippets/s_blog_posts/000.scss
@@ -250,7 +250,7 @@
                     width: 100%;
                 }
             }
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 display: block;
             }
         }
diff --git a/addons/website_event/static/src/scss/event_templates_list.scss b/addons/website_event/static/src/scss/event_templates_list.scss
index eaf6f8d9172..8349c794492 100644
--- a/addons/website_event/static/src/scss/event_templates_list.scss
+++ b/addons/website_event/static/src/scss/event_templates_list.scss
@@ -38,7 +38,7 @@
             }
         }
         .opt_events_list_rows {
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 header {
                     height: 200px;
                 }
diff --git a/addons/website_profile/static/src/scss/website_profile.scss b/addons/website_profile/static/src/scss/website_profile.scss
index 94cc7eefbb7..c0547b54270 100644
--- a/addons/website_profile/static/src/scss/website_profile.scss
+++ b/addons/website_profile/static/src/scss/website_profile.scss
@@ -84,7 +84,7 @@ $owprofile-color-bg: mix($body-bg, #efeff4);
 }
 
 .o_wprofile_tabs_content {
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         background-color: $nav-tabs-link-active-bg;
         padding:0 ($grid-gutter-width * 0.5);
     }
@@ -161,7 +161,7 @@ $owprofile-color-bg: mix($body-bg, #efeff4);
     }
 
     .o_wprofile_all_users_nav_btn_container {
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             ~ .o_wprofile_user_profile_sub_nav_mobile_col {
                 padding-left: 0;
             }
diff --git a/addons/website_sale/static/src/scss/website_sale.scss b/addons/website_sale/static/src/scss/website_sale.scss
index 5df260bb235..4a3d680c0aa 100644
--- a/addons/website_sale/static/src/scss/website_sale.scss
+++ b/addons/website_sale/static/src/scss/website_sale.scss
@@ -84,7 +84,7 @@ $o-wsale-products-layout-grid-gutter-width: min($grid-gutter-width / 2, $o-wsale
         font-weight: $font-weight-bold;
     }
 
-    @include media-breakpoint-down(sm) {
+    @include media-breakpoint-down(md) {
         .td-img {
             display: none;
         }
@@ -295,7 +295,7 @@ $o-wsale-products-layout-grid-gutter-width: min($grid-gutter-width / 2, $o-wsale
 }
 
 #products_grid:not(.o_wsale_layout_list) {
-    @include media-breakpoint-down(md) {
+    @include media-breakpoint-down(lg) {
         @include wsale-break-table-to-list();
     }
 
@@ -553,7 +553,7 @@ a.no-decoration {
             border: 1px solid gray('400');
             border-radius: 50%;
         }
-        @include media-breakpoint-down(md) {
+        @include media-breakpoint-down(lg) {
             > span {
                 width: 2rem;
                 height: 2rem;
@@ -610,7 +610,7 @@ a.no-decoration {
         }
     }
 
-    @include media-breakpoint-down(md) {
+    @include media-breakpoint-down(lg) {
         &.o_carousel_product_left_indicators {
             flex-direction: column-reverse;
         }
@@ -716,7 +716,7 @@ a.no-decoration {
 .o_carousel_product_card {
     .o_carousel_product_card_img_top {
         object-fit: scale-down;
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             height: 12rem;
         }
         @include media-breakpoint-up(md) {
diff --git a/addons/website_sale/static/src/scss/website_sale_frontend.scss b/addons/website_sale/static/src/scss/website_sale_frontend.scss
index 613f247a780..a4aba636202 100644
--- a/addons/website_sale/static/src/scss/website_sale_frontend.scss
+++ b/addons/website_sale/static/src/scss/website_sale_frontend.scss
@@ -41,7 +41,7 @@ $o-wsale-wizard-label-completed: $success;
                 width: percentage(1/4);
             }
         }
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             &.disabled, &.complete {
                 display:none;
             }
@@ -71,7 +71,7 @@ $o-wsale-wizard-label-completed: $success;
                 display: block;
                 margin: (0.625rem + $tmp-dot-radius) 0 20px 0;
             }
-            @include media-breakpoint-down(sm) {
+            @include media-breakpoint-down(md) {
                 margin-left: -15px;
                 font-size: 24px;
             }
diff --git a/addons/website_sale/static/src/snippets/s_dynamic_snippet_products/000.scss b/addons/website_sale/static/src/snippets/s_dynamic_snippet_products/000.scss
index a6bbb472e6b..c3ca97375bc 100644
--- a/addons/website_sale/static/src/snippets/s_dynamic_snippet_products/000.scss
+++ b/addons/website_sale/static/src/snippets/s_dynamic_snippet_products/000.scss
@@ -28,7 +28,7 @@
     }
 }
 
-@include media-breakpoint-down(md) {
+@include media-breakpoint-down(lg) {
     .s_product_product_horizontal_card img {
         height: 12rem;
     }
diff --git a/addons/website_sale_delivery/static/src/scss/website_sale_delivery.scss b/addons/website_sale_delivery/static/src/scss/website_sale_delivery.scss
index c0a0cb4a2f4..9e0d5feabf1 100644
--- a/addons/website_sale_delivery/static/src/scss/website_sale_delivery.scss
+++ b/addons/website_sale_delivery/static/src/scss/website_sale_delivery.scss
@@ -1,4 +1,4 @@
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .o_wsale_delivery_badge_price {
         max-width: 130px;
         text-overflow: ellipsis;
diff --git a/addons/website_sale_product_configurator/static/src/scss/website_sale_options.scss b/addons/website_sale_product_configurator/static/src/scss/website_sale_options.scss
index da8455060b6..bc88ece0dee 100644
--- a/addons/website_sale_product_configurator/static/src/scss/website_sale_options.scss
+++ b/addons/website_sale_product_configurator/static/src/scss/website_sale_options.scss
@@ -8,7 +8,7 @@ div#modal_optional_products table tr td {
     border: 0;
 }
 
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     div#modal_optional_products .td-qty {
         display: none;
     }
diff --git a/addons/website_sale_wishlist/static/src/scss/website_sale_wishlist.scss b/addons/website_sale_wishlist/static/src/scss/website_sale_wishlist.scss
index 7f9b3b81399..ff4ccf86c72 100644
--- a/addons/website_sale_wishlist/static/src/scss/website_sale_wishlist.scss
+++ b/addons/website_sale_wishlist/static/src/scss/website_sale_wishlist.scss
@@ -13,7 +13,7 @@
 }
 
 // XS size
-@include media-breakpoint-down(sm) {
+@include media-breakpoint-down(md) {
     .oe_website_sale {
         .td-wish-btn {
             width: 100px;
diff --git a/addons/website_slides/static/src/scss/website_slides.scss b/addons/website_slides/static/src/scss/website_slides.scss
index 25affd2a73a..19b046d1325 100644
--- a/addons/website_slides/static/src/scss/website_slides.scss
+++ b/addons/website_slides/static/src/scss/website_slides.scss
@@ -401,7 +401,7 @@ $truncate-limits: 2, 3, 10;
     }
 
     .o_wslides_tabs_content {
-        @include media-breakpoint-down(sm) {
+        @include media-breakpoint-down(md) {
             background-color: $nav-tabs-link-active-bg;
             padding:0 ($grid-gutter-width * 0.5);
         }