diff -u b/core/modules/outside_in/css/off-canvas.css b/core/modules/outside_in/css/off-canvas.css
--- b/core/modules/outside_in/css/off-canvas.css
+++ b/core/modules/outside_in/css/off-canvas.css
@@ -24,20 +24,20 @@
 
 /* Position the dialog-off-canvas tray container outside the right of the viewport. */
 .ui-dialog-off-canvas {
-    box-sizing: border-box;
-    height: 100%;
-    overflow: visible;
+  box-sizing: border-box;
+  height: 100%;
+  overflow: visible;
 }
 
 /* Wrap the form that's inside the dialog-off-canvas tray. */
 .ui-dialog-off-canvas #drupal-off-canvas {
-    padding: 0 20px;
-    /* Prevent horizontal scrollbar. */
-    overflow-x: hidden;
-    overflow-y: auto;
+  padding: 0 20px;
+  /* Prevent horizontal scrollbar. */
+  overflow-x: hidden;
+  overflow-y: auto;
 }
 [dir="rtl"] .ui-dialog-off-canvas #drupal-off-canvas {
-    text-align: right;
+  text-align: right;
 }
 
 /*
@@ -47,10 +47,10 @@
 @media all and (max-width: 48em) { /* 768px */
-    .ui-dialog.ui-dialog-off-canvas {
-        width: 100% !important;
-    }
-    /* When tray is at 100% width stop the body from scrolling */
-    .js-tray-open {
-        height: 100%;
-        overflow-y: hidden;
-    }
+  .ui-dialog.ui-dialog-off-canvas {
+    width: 100% !important;
+  }
+  /* When tray is at 100% width stop the body from scrolling */
+  .js-tray-open {
+    height: 100%;
+    overflow-y: hidden;
+  }
 }
reverted:
--- b/core/modules/outside_in/css/off-canvas.motion.css
+++ a/core/modules/outside_in/css/off-canvas.motion.css
@@ -12,17 +12,17 @@
 
 /* Transition the off-canvas dialog container, with 2s delay to match main canvas speed. */
 .ui-dialog-off-canvas .ui-dialog-content {
+    -webkit-transition: all .7s ease 2s;
+    -moz-transition: all .7s ease 2s;
+    transition: all .7s ease 2s;
-  -webkit-transition: all .7s ease 2s;
-  -moz-transition: all .7s ease 2s;
-  transition: all .7s ease 2s;
 }
 
 @media (max-width: 700px) {
+    .ui-dialog-off-canvas .ui-dialog-content {
+        -webkit-transition: all .7s ease;
+        -moz-transition: all .7s ease;
+        transition: all .7s ease;
+    }
-  .ui-dialog-off-canvas .ui-dialog-content {
-    -webkit-transition: all .7s ease;
-    -moz-transition: all .7s ease;
-    transition: all .7s ease;
-  }
 }
 
 .dialog-off-canvas__main-canvas {
diff -u b/core/modules/outside_in/css/off-canvas.theme.css b/core/modules/outside_in/css/off-canvas.theme.css
--- b/core/modules/outside_in/css/off-canvas.theme.css
+++ b/core/modules/outside_in/css/off-canvas.theme.css
@@ -90,7 +90,7 @@
 #drupal-off-canvas details,
 #drupal-off-canvas .form-item {
   color: #ddd;
-  font-family: "Lucida Grande", 'Lucida Sans Unicode','liberation sans', sans-serif;
+  font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
   font-size: 14px;
   font-weight: normal;
   background-color: transparent;
@@ -100,7 +100,7 @@
 #drupal-off-canvas a,
 #drupal-off-canvas .link {
   border-bottom: none;
-  font-family: "Lucida Grande", 'Lucida Sans Unicode','liberation sans', sans-serif;
+  font-family: "Lucida Grande", 'Lucida Sans Unicode', 'liberation sans', sans-serif;
   font-size: 14px;
   font-weight: normal;
   color: #85bef4;