diff --git a/core/themes/bartik/css/components/site-footer.css b/core/themes/bartik/css/components/site-footer.css
index 06708c1..9d2dfba 100644
--- a/core/themes/bartik/css/components/site-footer.css
+++ b/core/themes/bartik/css/components/site-footer.css
@@ -26,10 +26,18 @@
     float: right;
   }
   .site-footer__top .region:nth-child(2n+1) {
-    padding-right: 10px;
+    padding-right: 10px; /* LTR */
   }
-  .site-footer__top .region:nth-child(2n) {
+  [dir="rtl"] .site-footer__top .region:nth-child(2n+1) {
     padding-left: 10px;
+    padding-right: 0;
+  }
+  .site-footer__top .region:nth-child(2n) {
+    padding-left: 10px; /* LTR */
+  }
+  [dir="rtl"] .site-footer__top .region:nth-child(2n) {
+    padding-left: 0;
+    padding-right: 10px;
   }
   .region-footer-third {
     clear: both;
@@ -41,11 +49,30 @@
     padding: 10px;
   }
   .site-footer__top .region:first-child {
-    padding-left: 0;
+    padding-left: 0; /* LTR */
   }
-  .site-footer__top .region:last-child {
+  [dir="rtl"] .site-footer__top .region:first-child {
+    padding-left: 10px;
     padding-right: 0;
   }
+  .site-footer__top .region:last-child {
+    padding-right: 0; /* LTR */
+  }
+  [dir="rtl"] .site-footer__top .region:last-child {
+    padding-left: 0;
+    padding-right: 10px;
+  }
+
+  /**
+   * Suppress the padding from @media all and (min-width: 560px), which
+   * overrides the padding: 10px; rule from .site-footer__top .region.
+   */
+  [dir="rtl"] .site-footer__top .region:nth-child(2n+1) {
+    padding-right: 10px;
+  }
+  [dir="rtl"] .site-footer__top .region:nth-child(2n) {
+    padding-left: 10px;
+  }
   .region-footer-third {
     clear: none;
   }
@@ -174,7 +201,9 @@
 .site-footer__bottom .block {
   clear: both;
 }
-.site-footer__bottom .menu {
+
+/* We need to be specific to overwrite [dir="rtl"] .block ul in block.css. */
+.site-footer__bottom .block .menu {
   padding: 0;
 }
 .site-footer__bottom .menu-item a {
@@ -205,3 +234,11 @@
   padding-right: 12px;
   border-left: none;
 }
+
+/**
+ * When the item is both first and last, :last-child overrides the right padding
+ * when using [dir="rtl"]. We need this rule to remove the right padding.
+ */
+[dir="rtl"] .site-footer__bottom .menu-item:first-child:last-child a {
+  padding-right: 0;
+}