diff --git a/theme/boost/scss/moodle/drawer.scss b/theme/boost/scss/moodle/drawer.scss
index 303d22f4ed5..9d7c5300f08 100644
--- a/theme/boost/scss/moodle/drawer.scss
+++ b/theme/boost/scss/moodle/drawer.scss
@@ -10,6 +10,7 @@ $drawer-offscreen-gutter: 20px !default;
 $drawer-bg-color: $gray-100 !default;
 $drawer-scroll-bg-track: $gray-100 !default;
 $drawer-shadow-color: rgba(0, 0, 0, .25) !default;
+$drawer-transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease !default;
 
 :target {
     scroll-margin-top: $fixed-header-y + 10px;
@@ -40,9 +41,7 @@ $drawer-bg: darken($body-bg, 5%) !default;
     -webkit-overflow-scrolling: touch;
     z-index: $zindex-dropdown - 1;
     background-color: $drawer-bg;
-    -webkit-transition: right 0.5s ease, left 0.5s ease;
-    -moz-transition: right 0.5s ease, left 0.5s ease;
-    transition: right 0.5s ease, left 0.5s ease;
+    @include transition(right 0.5s ease, left 0.5s ease);
 }
 
 @include media-breakpoint-up(sm) {
@@ -50,7 +49,7 @@ $drawer-bg: darken($body-bg, 5%) !default;
         padding: $drawer-padding-x $drawer-padding-y;
     }
     .jsenabled .btn-footer-popover {
-        transition: 0.2s;
+        @include transition($drawer-transition);
     }
 }
 #nav-drawer {
@@ -91,9 +90,7 @@ $drawer-bg: darken($body-bg, 5%) !default;
     margin-top: 0;
 }
 body.drawer-ease {
-    -webkit-transition: margin-left 0.5s ease, margin-right 0.5s ease;
-    -moz-transition: margin-left 0.5s ease, margin-right 0.5s ease;
-    transition: margin-left 0.5s ease, margin-right 0.5s ease;
+    @include transition(margin-left 0.5s ease, margin-right 0.5s ease);
 }
 
 body:not(.uses-drawers).drawer-open-left {
@@ -168,7 +165,7 @@ $right-drawer-width: 320px;
 }
 
 @mixin drawer() {
-    transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease;
+    @include transition($drawer-transition);
     background-color: $drawer-bg-color;
     z-index: $zindex-modal;
     position: fixed;
diff --git a/theme/boost/scss/moodle/layout.scss b/theme/boost/scss/moodle/layout.scss
index 4fc96d96f32..2021517cf4d 100644
--- a/theme/boost/scss/moodle/layout.scss
+++ b/theme/boost/scss/moodle/layout.scss
@@ -5,7 +5,7 @@
         top: 0;
         left: 0;
         z-index: $zindex-modal-backdrop;
-        transition: 0.5s;
+        @include transition(0.5s);
         width: 100vw;
         margin: 0;
         opacity: 1;
@@ -151,7 +151,7 @@
     #page.drawers {
         position: relative;
         overflow-y: auto;
-        transition: 0.2s;
+        @include transition(0.2s);
         height: calc(100vh - #{$navbar-height});
         margin-top: $navbar-height;
         left: 0;
diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
index 4b446a39f9d..e13a53ff4a6 100644
--- a/theme/boost/style/moodle.css
+++ b/theme/boost/style/moodle.css
@@ -14660,15 +14660,19 @@ span.editinstructions {
   -webkit-overflow-scrolling: touch;
   z-index: 999;
   background-color: #f2f2f2;
-  -webkit-transition: right 0.5s ease, left 0.5s ease;
-  -moz-transition: right 0.5s ease, left 0.5s ease;
   transition: right 0.5s ease, left 0.5s ease; }
+  @media (prefers-reduced-motion: reduce) {
+    [data-region="drawer"] {
+      transition: none; } }
 
 @media (min-width: 576px) {
   [data-region="drawer"] {
     padding: 20px 20px; }
   .jsenabled .btn-footer-popover {
-    transition: 0.2s; } }
+    transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease; } }
+  @media (min-width: 576px) and (prefers-reduced-motion: reduce) {
+    .jsenabled .btn-footer-popover {
+      transition: none; } }
 
 #nav-drawer {
   right: auto;
@@ -14697,9 +14701,10 @@ span.editinstructions {
   margin-top: 0; }
 
 body.drawer-ease {
-  -webkit-transition: margin-left 0.5s ease, margin-right 0.5s ease;
-  -moz-transition: margin-left 0.5s ease, margin-right 0.5s ease;
   transition: margin-left 0.5s ease, margin-right 0.5s ease; }
+  @media (prefers-reduced-motion: reduce) {
+    body.drawer-ease {
+      transition: none; } }
 
 @media (min-width: 768px) {
   body:not(.uses-drawers).drawer-open-left {
@@ -14761,6 +14766,9 @@ body.drawer-ease {
   position: fixed;
   height: 100vh;
   top: 0; }
+  @media (prefers-reduced-motion: reduce) {
+    .drawer {
+      transition: none; } }
   .drawer.drawer-right {
     width: 315px;
     max-width: 315px;
@@ -14809,7 +14817,12 @@ body.drawer-ease {
     z-index: 1050;
     position: fixed;
     height: 100vh;
-    top: 0; }
+    top: 0; } }
+  @media (max-width: 991.98px) and (prefers-reduced-motion: reduce) {
+    .drawer-md {
+      transition: none; } }
+
+@media (max-width: 991.98px) {
     .drawer-md.drawer-right {
       width: 315px;
       max-width: 315px;
@@ -14841,7 +14854,12 @@ body.drawer-ease {
     z-index: 1050;
     position: fixed;
     height: 100vh;
-    top: 0; }
+    top: 0; } }
+  @media (max-width: 767.98px) and (prefers-reduced-motion: reduce) {
+    .drawer-sm {
+      transition: none; } }
+
+@media (max-width: 767.98px) {
     .drawer-sm.drawer-right {
       width: 315px;
       max-width: 315px;
@@ -20026,6 +20044,9 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
   margin: 0;
   opacity: 1;
   background-color: #fff; }
+  @media (prefers-reduced-motion: reduce) {
+    .layout.fullscreen {
+      transition: none; } }
   .layout.fullscreen > div {
     height: 100%;
     width: 100%; }
@@ -20127,7 +20148,12 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
     height: calc(100vh - 60px);
     margin-top: 60px;
     left: 0;
-    right: 0; }
+    right: 0; } }
+  @media (min-width: 992px) and (prefers-reduced-motion: reduce) {
+    #page.drawers {
+      transition: none; } }
+
+@media (min-width: 992px) {
     #page.drawers.show-drawer-left {
       margin-left: 285px;
       margin-right: 0;
diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
index 6261051a7e4..fdac1d624c3 100644
--- a/theme/classic/style/moodle.css
+++ b/theme/classic/style/moodle.css
@@ -14660,15 +14660,19 @@ span.editinstructions {
   -webkit-overflow-scrolling: touch;
   z-index: 999;
   background-color: #f2f2f2;
-  -webkit-transition: right 0.5s ease, left 0.5s ease;
-  -moz-transition: right 0.5s ease, left 0.5s ease;
   transition: right 0.5s ease, left 0.5s ease; }
+  @media (prefers-reduced-motion: reduce) {
+    [data-region="drawer"] {
+      transition: none; } }
 
 @media (min-width: 576px) {
   [data-region="drawer"] {
     padding: 20px 20px; }
   .jsenabled .btn-footer-popover {
-    transition: 0.2s; } }
+    transition: left 0.2s ease, right 0.2s ease, top 0.2s ease, bottom 0.2s ease; } }
+  @media (min-width: 576px) and (prefers-reduced-motion: reduce) {
+    .jsenabled .btn-footer-popover {
+      transition: none; } }
 
 #nav-drawer {
   right: auto;
@@ -14697,9 +14701,10 @@ span.editinstructions {
   margin-top: 0; }
 
 body.drawer-ease {
-  -webkit-transition: margin-left 0.5s ease, margin-right 0.5s ease;
-  -moz-transition: margin-left 0.5s ease, margin-right 0.5s ease;
   transition: margin-left 0.5s ease, margin-right 0.5s ease; }
+  @media (prefers-reduced-motion: reduce) {
+    body.drawer-ease {
+      transition: none; } }
 
 @media (min-width: 768px) {
   body:not(.uses-drawers).drawer-open-left {
@@ -14761,6 +14766,9 @@ body.drawer-ease {
   position: fixed;
   height: 100vh;
   top: 0; }
+  @media (prefers-reduced-motion: reduce) {
+    .drawer {
+      transition: none; } }
   .drawer.drawer-right {
     width: 315px;
     max-width: 315px;
@@ -14809,7 +14817,12 @@ body.drawer-ease {
     z-index: 1050;
     position: fixed;
     height: 100vh;
-    top: 0; }
+    top: 0; } }
+  @media (max-width: 991.98px) and (prefers-reduced-motion: reduce) {
+    .drawer-md {
+      transition: none; } }
+
+@media (max-width: 991.98px) {
     .drawer-md.drawer-right {
       width: 315px;
       max-width: 315px;
@@ -14841,7 +14854,12 @@ body.drawer-ease {
     z-index: 1050;
     position: fixed;
     height: 100vh;
-    top: 0; }
+    top: 0; } }
+  @media (max-width: 767.98px) and (prefers-reduced-motion: reduce) {
+    .drawer-sm {
+      transition: none; } }
+
+@media (max-width: 767.98px) {
     .drawer-sm.drawer-right {
       width: 315px;
       max-width: 315px;
@@ -19972,6 +19990,9 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
   margin: 0;
   opacity: 1;
   background-color: #fff; }
+  @media (prefers-reduced-motion: reduce) {
+    .layout.fullscreen {
+      transition: none; } }
   .layout.fullscreen > div {
     height: 100%;
     width: 100%; }
@@ -20073,7 +20094,12 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
     height: calc(100vh - 50px);
     margin-top: 50px;
     left: 0;
-    right: 0; }
+    right: 0; } }
+  @media (min-width: 992px) and (prefers-reduced-motion: reduce) {
+    #page.drawers {
+      transition: none; } }
+
+@media (min-width: 992px) {
     #page.drawers.show-drawer-left {
       margin-left: 285px;
       margin-right: 0;