diff --git a/.stylelintrc b/.stylelintrc
index dac9edbf4386..fce97867fc27 100644
--- a/.stylelintrc
+++ b/.stylelintrc
@@ -261,7 +261,14 @@
       "fill",
       "stroke"
     ],
-    "property-blacklist": ["transition"],
+    "property-blacklist": [
+      "border-radius",
+      "border-top-left-radius",
+      "border-top-right-radius",
+      "border-bottom-right-radius",
+      "border-bottom-left-radius",
+      "transition"
+    ],
     "property-no-vendor-prefix": true,
     "rule-empty-line-before": null,
     "scss/at-function-named-arguments": "never",
diff --git a/_config.yml b/_config.yml
index 1cb0c816da29..10c4b4a58e40 100644
--- a/_config.yml
+++ b/_config.yml
@@ -38,6 +38,7 @@ current_ruby_version: 4.2.1
 docs_version:         4.2
 repo:                 "https://github.com/twbs/bootstrap"
 slack:                "https://bootstrap-slack.herokuapp.com"
+opencollective:       "https://opencollective.com/bootstrap"
 blog:                 "https://blog.getbootstrap.com"
 expo:                 "https://expo.getbootstrap.com"
 themes:               "https://themes.getbootstrap.com"
diff --git a/js/src/util.js b/js/src/util.js
index 0d434c4c515c..c3e23e81747b 100644
--- a/js/src/util.js
+++ b/js/src/util.js
@@ -82,7 +82,11 @@ const Util = {
       selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : ''
     }
 
-    return selector && document.querySelector(selector) ? selector : null
+    try {
+      return document.querySelector(selector) ? selector : null
+    } catch (err) {
+      return null
+    }
   },
 
   getTransitionDurationFromElement(element) {
diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js
index 782a86eea09f..4d7682aaa7db 100644
--- a/js/tests/unit/modal.js
+++ b/js/tests/unit/modal.js
@@ -619,40 +619,37 @@ $(function () {
     assert.expect(1)
     var done = assert.async()
 
-    try {
-      var $toggleBtn = $('<button data-toggle="modal" data-target="&lt;div id=&quot;modal-test&quot;&gt;&lt;div class=&quot;contents&quot;&lt;div&lt;div id=&quot;close&quot; data-dismiss=&quot;modal&quot;/&gt;&lt;/div&gt;&lt;/div&gt;"/>')
-        .appendTo('#qunit-fixture')
+    var $toggleBtn = $('<button data-toggle="modal" data-target="&lt;div id=&quot;modal-test&quot;&gt;&lt;div class=&quot;contents&quot;&lt;div&lt;div id=&quot;close&quot; data-dismiss=&quot;modal&quot;/&gt;&lt;/div&gt;&lt;/div&gt;"/>')
+      .appendTo('#qunit-fixture')
 
-      $toggleBtn.trigger('click')
-    } catch (e) {
+    $toggleBtn.trigger('click')
+    setTimeout(function () {
       assert.strictEqual($('#modal-test').length, 0, 'target has not been parsed and added to the document')
       done()
-    }
+    }, 0)
   })
 
   QUnit.test('should not execute js from target', function (assert) {
     assert.expect(0)
     var done = assert.async()
 
-    try {
-      // This toggle button contains XSS payload in its data-target
-      // Note: it uses the onerror handler of an img element to execute the js, because a simple script element does not work here
-      //       a script element works in manual tests though, so here it is likely blocked by the qunit framework
-      var $toggleBtn = $('<button data-toggle="modal" data-target="&lt;div&gt;&lt;image src=&quot;missing.png&quot; onerror=&quot;$(&apos;#qunit-fixture button.control&apos;).trigger(&apos;click&apos;)&quot;&gt;&lt;/div&gt;"/>')
-        .appendTo('#qunit-fixture')
-      // The XSS payload above does not have a closure over this function and cannot access the assert object directly
-      // However, it can send a click event to the following control button, which will then fail the assert
-      $('<button>')
-        .addClass('control')
-        .on('click', function () {
-          assert.notOk(true, 'XSS payload is not executed as js')
-        })
-        .appendTo('#qunit-fixture')
+    // This toggle button contains XSS payload in its data-target
+    // Note: it uses the onerror handler of an img element to execute the js, because a simple script element does not work here
+    //       a script element works in manual tests though, so here it is likely blocked by the qunit framework
+    var $toggleBtn = $('<button data-toggle="modal" data-target="&lt;div&gt;&lt;image src=&quot;missing.png&quot; onerror=&quot;$(&apos;#qunit-fixture button.control&apos;).trigger(&apos;click&apos;)&quot;&gt;&lt;/div&gt;"/>')
+      .appendTo('#qunit-fixture')
+    // The XSS payload above does not have a closure over this function and cannot access the assert object directly
+    // However, it can send a click event to the following control button, which will then fail the assert
+    $('<button>')
+      .addClass('control')
+      .on('click', function () {
+        assert.notOk(true, 'XSS payload is not executed as js')
+      })
+      .appendTo('#qunit-fixture')
 
-      $toggleBtn.trigger('click')
-    } catch (e) {
-      done()
-    }
+    $toggleBtn.trigger('click')
+
+    setTimeout(done, 500)
   })
 
   QUnit.test('should not try to open a modal which is already visible', function (assert) {
diff --git a/js/tests/unit/util.js b/js/tests/unit/util.js
index cb938314330b..858fee6f4d02 100644
--- a/js/tests/unit/util.js
+++ b/js/tests/unit/util.js
@@ -20,17 +20,16 @@ $(function () {
     assert.strictEqual(Util.getSelectorFromElement($el2[0]), null)
   })
 
-  QUnit.test('Util.getSelectorFromElement should throw error when there is a bad selector', function (assert) {
+  QUnit.test('Util.getSelectorFromElement should return null when there is a bad selector', function (assert) {
     assert.expect(2)
 
     var $el = $('<div data-target="#1"></div>').appendTo($('#qunit-fixture'))
 
-    try {
-      assert.ok(true, 'trying to use a bad selector')
-      Util.getSelectorFromElement($el[0])
-    } catch (e) {
-      assert.ok(e instanceof DOMException)
-    }
+    assert.strictEqual(Util.getSelectorFromElement($el[0]), null)
+
+    var $el2 = $('<a href="/posts"></a>').appendTo($('#qunit-fixture'))
+
+    assert.strictEqual(Util.getSelectorFromElement($el2[0]), null)
   })
 
   QUnit.test('Util.typeCheckConfig should thrown an error when a bad config is passed', function (assert) {
diff --git a/nuget/MyGet.ps1 b/nuget/MyGet.ps1
index 71110b5c1e3d..e1e990467080 100644
--- a/nuget/MyGet.ps1
+++ b/nuget/MyGet.ps1
@@ -1,16 +1,17 @@
 # set env vars usually set by MyGet (enable for local testing)
 #$env:SourcesPath = '..'
-#$env:NuGet = "./nuget.exe" #https://dist.nuget.org/win-x86-commandline/latest/nuget.exe
+#$env:NuGet = "./nuget.exe" # https://dist.nuget.org/win-x86-commandline/latest/nuget.exe
 
 $nuget = $env:NuGet
 
+Copy-Item $env:SourcesPath\LICENSE $env:SourcesPath\LICENSE.txt # has to be .txt extension, don't check in
+
 # parse the version number out of package.json
 $bsversionParts = ((Get-Content $env:SourcesPath\package.json) -join "`n" | ConvertFrom-Json).version.split('-', 2) # split the version on the '-'
 $bsversion = $bsversionParts[0]
 
-if ($bsversionParts.Length -gt 1)
-{
-    $bsversion += '-' + $bsversionParts[1].replace('.', '').replace('-', '_')   # strip out invalid chars from the PreRelease part
+if ($bsversionParts.Length -gt 1) {
+  $bsversion += '-' + $bsversionParts[1].replace('.', '').replace('-', '_') # strip out invalid chars from the PreRelease part
 }
 
 # create packages
diff --git a/nuget/bootstrap.nuspec b/nuget/bootstrap.nuspec
index 1af72d399f84..7f31af1a8193 100644
--- a/nuget/bootstrap.nuspec
+++ b/nuget/bootstrap.nuspec
@@ -12,7 +12,7 @@
     <language>en-us</language>
     <projectUrl>https://getbootstrap.com/</projectUrl>
     <iconUrl>https://getbootstrap.com/docs/4.2/assets/img/favicons/apple-touch-icon.png</iconUrl>
-    <licenseUrl>https://github.com/twbs/bootstrap/blob/master/LICENSE</licenseUrl>
+    <license type="file">LICENSE.txt</license>
     <copyright>Copyright 2017-2018</copyright>
     <requireLicenseAcceptance>false</requireLicenseAcceptance>
     <dependencies>
@@ -22,6 +22,8 @@
     <tags>css mobile-first responsive front-end framework web</tags>
   </metadata>
   <files>
+    <file src="LICENSE.txt" target="" />
+
     <file src="dist\css\*.*" target="content\Content" />
     <file src="dist\js\bootstrap*.js" target="content\Scripts" />
     <file src="dist\js\bootstrap*.js.map" target="content\Scripts" />
diff --git a/nuget/bootstrap.sass.nuspec b/nuget/bootstrap.sass.nuspec
index 0e71eb6f7cc4..1793d58bf9ce 100644
--- a/nuget/bootstrap.sass.nuspec
+++ b/nuget/bootstrap.sass.nuspec
@@ -12,7 +12,7 @@
     <language>en-us</language>
     <projectUrl>https://getbootstrap.com/</projectUrl>
     <iconUrl>https://getbootstrap.com/docs/4.2/assets/img/favicons/apple-touch-icon.png</iconUrl>
-    <licenseUrl>https://github.com/twbs/bootstrap/blob/master/LICENSE</licenseUrl>
+    <license type="file">LICENSE.txt</license>
     <copyright>Copyright 2017-2018</copyright>
     <requireLicenseAcceptance>false</requireLicenseAcceptance>
     <dependencies>
@@ -22,6 +22,8 @@
     <tags>css sass mobile-first responsive front-end framework web</tags>
   </metadata>
   <files>
+    <file src="LICENSE.txt" target="" />
+
     <file src="scss\**\*.scss" target="content\Content\bootstrap" />
     <file src="dist\js\bootstrap*.js" target="content\Scripts" />
     <file src="dist\js\bootstrap*.js.map" target="content\Scripts" />
diff --git a/scss/_card.scss b/scss/_card.scss
index 377bec0f1a43..9ed6ee129a09 100644
--- a/scss/_card.scss
+++ b/scss/_card.scss
@@ -195,55 +195,35 @@
 
       // Handle rounded corners
       @if $enable-rounded {
-        &:first-child {
+        &:not(:last-child) {
           @include border-right-radius(0);
 
           .card-img-top,
           .card-header {
+            // stylelint-disable-next-line property-blacklist
             border-top-right-radius: 0;
           }
           .card-img-bottom,
           .card-footer {
+            // stylelint-disable-next-line property-blacklist
             border-bottom-right-radius: 0;
           }
         }
 
-        &:last-child {
+        &:not(:first-child) {
           @include border-left-radius(0);
 
           .card-img-top,
           .card-header {
+            // stylelint-disable-next-line property-blacklist
             border-top-left-radius: 0;
           }
           .card-img-bottom,
           .card-footer {
+            // stylelint-disable-next-line property-blacklist
             border-bottom-left-radius: 0;
           }
         }
-
-        &:only-child {
-          @include border-radius($card-border-radius);
-
-          .card-img-top,
-          .card-header {
-            @include border-top-radius($card-border-radius);
-          }
-          .card-img-bottom,
-          .card-footer {
-            @include border-bottom-radius($card-border-radius);
-          }
-        }
-
-        &:not(:first-child):not(:last-child):not(:only-child) {
-          @include border-radius(0);
-
-          .card-img-top,
-          .card-img-bottom,
-          .card-header,
-          .card-footer {
-            @include border-radius(0);
-          }
-        }
       }
     }
   }
@@ -283,24 +263,22 @@
 
     &:not(:first-of-type) {
       .card-header:first-child {
-        border-radius: 0;
+        @include border-radius(0);
       }
 
       &:not(:last-of-type) {
         border-bottom: 0;
-        border-radius: 0;
+        @include border-radius(0);
       }
     }
 
     &:first-of-type {
       border-bottom: 0;
-      border-bottom-right-radius: 0;
-      border-bottom-left-radius: 0;
+      @include border-bottom-radius(0);
     }
 
     &:last-of-type {
-      border-top-left-radius: 0;
-      border-top-right-radius: 0;
+      @include border-top-radius(0);
     }
 
     .card-header {
diff --git a/scss/_custom-forms.scss b/scss/_custom-forms.scss
index e6bf7ad6f53f..985dddba42db 100644
--- a/scss/_custom-forms.scss
+++ b/scss/_custom-forms.scss
@@ -144,6 +144,7 @@
 
 .custom-radio {
   .custom-control-label::before {
+    // stylelint-disable-next-line property-blacklist
     border-radius: $custom-radio-indicator-border-radius;
   }
 
@@ -173,6 +174,7 @@
       left: -($custom-switch-width + $custom-control-gutter);
       width: $custom-switch-width;
       pointer-events: all;
+      // stylelint-disable-next-line property-blacklist
       border-radius: $custom-switch-indicator-border-radius;
     }
 
@@ -182,6 +184,7 @@
       width: $custom-switch-indicator-size;
       height: $custom-switch-indicator-size;
       background-color: $custom-control-indicator-border-color;
+      // stylelint-disable-next-line property-blacklist
       border-radius: $custom-switch-indicator-border-radius;
       @include transition(transform .15s ease-in-out, $custom-forms-transition);
     }
@@ -220,11 +223,7 @@
   background: $custom-select-background;
   background-color: $custom-select-bg;
   border: $custom-select-border-width solid $custom-select-border-color;
-  @if $enable-rounded {
-    border-radius: $custom-select-border-radius;
-  } @else {
-    border-radius: 0;
-  }
+  @include border-radius($custom-select-border-radius, 0);
   @include box-shadow($custom-select-box-shadow);
   appearance: none;
 
diff --git a/scss/_forms.scss b/scss/_forms.scss
index 2db6d834cd24..92175b09027e 100644
--- a/scss/_forms.scss
+++ b/scss/_forms.scss
@@ -18,13 +18,7 @@
   border: $input-border-width solid $input-border-color;
 
   // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
-  @if $enable-rounded {
-    // Manually use the if/else instead of the mixin to account for iOS override
-    border-radius: $input-border-radius;
-  } @else {
-    // Otherwise undo the iOS default
-    border-radius: 0;
-  }
+  @include border-radius($input-border-radius, 0);
 
   @include box-shadow($input-box-shadow);
   @include transition($input-transition);
diff --git a/scss/_reboot.scss b/scss/_reboot.scss
index d4167cc8ecf5..b5c15d53c933 100644
--- a/scss/_reboot.scss
+++ b/scss/_reboot.scss
@@ -297,6 +297,7 @@ label {
 //
 // Details at https://github.com/twbs/bootstrap/issues/24093
 button {
+  // stylelint-disable-next-line property-blacklist
   border-radius: 0;
 }
 
@@ -421,7 +422,7 @@ progress {
 }
 
 //
-// Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
+// Remove the inner padding in Chrome and Safari on macOS.
 //
 
 [type="search"]::-webkit-search-decoration {
diff --git a/scss/_spinners.scss b/scss/_spinners.scss
index ed7e2bc65005..364a5c1a65f7 100644
--- a/scss/_spinners.scss
+++ b/scss/_spinners.scss
@@ -13,6 +13,7 @@
   vertical-align: text-bottom;
   border: $spinner-border-width solid currentColor;
   border-right-color: transparent;
+  // stylelint-disable-next-line property-blacklist
   border-radius: 50%;
   animation: spinner-border .75s linear infinite;
 }
@@ -42,6 +43,7 @@
   height: $spinner-height;
   vertical-align: text-bottom;
   background-color: currentColor;
+  // stylelint-disable-next-line property-blacklist
   border-radius: 50%;
   opacity: 0;
   animation: spinner-grow .75s linear infinite;
diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index 913fb852d58e..a5de31ba6a50 100644
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -11,6 +11,7 @@
 @import "utilities/screenreaders";
 @import "utilities/shadows";
 @import "utilities/sizing";
+@import "utilities/stretched-link";
 @import "utilities/spacing";
 @import "utilities/text";
 @import "utilities/visibility";
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 26a2df81d642..0a30d9663cec 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -264,7 +264,7 @@ $embed-responsive-aspect-ratios: join(
   (
     (21 9),
     (16 9),
-    (3 4),
+    (4 3),
     (1 1),
   ),
   $embed-responsive-aspect-ratios
@@ -652,7 +652,7 @@ $form-feedback-invalid-color:       theme-color("danger") !default;
 $form-feedback-icon-valid-color:    $form-feedback-valid-color !default;
 $form-feedback-icon-valid:          str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"), "#", "%23") !default;
 $form-feedback-icon-invalid-color:  $form-feedback-invalid-color !default;
-$form-feedback-icon-invalid:        str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$form-feedback-icon-invalid-color}' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E"), "#", "%23") !default;
+$form-feedback-icon-invalid:        str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$form-feedback-icon-invalid-color}' viewBox='-2 -2 7 7'%3e%3cpath stroke='#{$form-feedback-icon-invalid-color}' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E"), "#", "%23") !default;
 
 
 // Z-index master list
diff --git a/scss/mixins/_border-radius.scss b/scss/mixins/_border-radius.scss
index 2024febcfa82..f32feca90c99 100644
--- a/scss/mixins/_border-radius.scss
+++ b/scss/mixins/_border-radius.scss
@@ -1,9 +1,13 @@
+// stylelint-disable property-blacklist
 // Single side border-radius
 
-@mixin border-radius($radius: $border-radius) {
+@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
   @if $enable-rounded {
     border-radius: $radius;
   }
+  @else if $fallback-border-radius != false {
+    border-radius: $fallback-border-radius;
+  }
 }
 
 @mixin border-top-radius($radius) {
diff --git a/scss/mixins/_buttons.scss b/scss/mixins/_buttons.scss
index 3e1e2c09d059..64cc482f6950 100644
--- a/scss/mixins/_buttons.scss
+++ b/scss/mixins/_buttons.scss
@@ -103,9 +103,5 @@
   font-size: $font-size;
   line-height: $line-height;
   // Manually declare to provide an override to the browser default
-  @if $enable-rounded {
-    border-radius: $border-radius;
-  } @else {
-    border-radius: 0;
-  }
+  @include border-radius($border-radius, 0);
 }
diff --git a/scss/utilities/_borders.scss b/scss/utilities/_borders.scss
index fb759c9ba017..78c9cb5b2d87 100644
--- a/scss/utilities/_borders.scss
+++ b/scss/utilities/_borders.scss
@@ -1,4 +1,4 @@
-// stylelint-disable declaration-no-important
+// stylelint-disable property-blacklist, declaration-no-important
 
 //
 // Border
diff --git a/scss/utilities/_stretched-link.scss b/scss/utilities/_stretched-link.scss
new file mode 100644
index 000000000000..fb5066bf55dd
--- /dev/null
+++ b/scss/utilities/_stretched-link.scss
@@ -0,0 +1,19 @@
+//
+// Stretched link
+//
+
+.stretched-link {
+  &::after {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 1;
+    // Just in case `pointer-events: none` is set on a parent
+    pointer-events: auto;
+    content: "";
+    // IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color
+    background-color: rgba(0, 0, 0, 0);
+  }
+}
diff --git a/site/_data/nav.yml b/site/_data/nav.yml
index 7b6ff7cd977e..3c101760742d 100644
--- a/site/_data/nav.yml
+++ b/site/_data/nav.yml
@@ -70,6 +70,7 @@
     - title: Shadows
     - title: Sizing
     - title: Spacing
+    - title: Stretched link
     - title: Text
     - title: Vertical align
     - title: Visibility
diff --git a/site/_includes/docs-navbar.html b/site/_includes/docs-navbar.html
index 5589ef8b5945..21c481c50878 100644
--- a/site/_includes/docs-navbar.html
+++ b/site/_includes/docs-navbar.html
@@ -60,6 +60,11 @@
         {%- include icons/slack.svg class="navbar-nav-svg" -%}
       </a>
     </li>
+    <li class="nav-item">
+      <a class="nav-link p-2" href="{{ site.opencollective }}/" target="_blank" rel="noopener" aria-label="Open Collective">
+        {%- include icons/opencollective.svg class="navbar-nav-svg" -%}
+      </a>
+    </li>
   </ul>
 
   <a class="btn btn-bd-download d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/download/">Download</a>
diff --git a/site/_includes/header.html b/site/_includes/header.html
index 83d051fa807b..6e91a1f42909 100644
--- a/site/_includes/header.html
+++ b/site/_includes/header.html
@@ -4,6 +4,9 @@
 <meta name="author" content="{{ site.authors }}">
 <meta name="generator" content="Jekyll v{{ jekyll.version }}">
 
+<meta name="docsearch:language" content="en">
+<meta name="docsearch:version" content="{{ site.docs_version }}">
+
 <title>
   {%- if page.title -%}
     {{ page.title | smartify }} · {{ site.title | smartify }}
diff --git a/site/_includes/icons/bootstrap-stack.svg b/site/_includes/icons/bootstrap-stack.svg
index 6b3535449000..91ef8c376d7f 100644
--- a/site/_includes/icons/bootstrap-stack.svg
+++ b/site/_includes/icons/bootstrap-stack.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" {% if include.class %} class="{{ include.class }}"{% endif %}{% if include.width %} width="{{ include.width }}"{% endif %}{% if include.height %} height="{{ include.height }}"{% endif %} viewBox="0 0 1024 860" focusable="false" role="img"><title>Bootstrap</title><defs><linearGradient id="c" x1="50%" x2="50%" y1="0%" y2="100%"><stop offset="0%" stop-color="#5C24AE"/><stop offset="100%" stop-color="#30135A"/></linearGradient><path id="b" d="M355.967 242.807l-322 216.395c-44.275 29.754-44.275 78.443 0 108.197l322 216.395c44.275 29.754 116.725 29.754 161 0l322-216.395c44.275-29.754 44.275-78.443 0-108.197l-322-216.395c-44.275-29.754-116.725-29.754-161 0z"/><filter id="a" width="108%" height="112%" x="-4%" y="-4.3%" filterUnits="objectBoundingBox"><feOffset dy="10" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="10"/><feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/></filter><linearGradient id="f" x1="50%" x2="50%" y1="-17.303%" y2="100%"><stop offset="0%" stop-color="#7331D4"/><stop offset="100%" stop-color="#461B84"/></linearGradient><path id="e" d="M355.967 132.807l-322 216.395c-44.275 29.754-44.275 78.443 0 108.197l322 216.395c44.275 29.754 116.725 29.754 161 0l322-216.395c44.275-29.754 44.275-78.443 0-108.197l-322-216.395c-44.275-29.754-116.725-29.754-161 0z"/><filter id="d" width="108%" height="112%" x="-4%" y="-4.3%" filterUnits="objectBoundingBox"><feOffset dy="10" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="10"/><feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/></filter><linearGradient id="i" x1="50%" x2="50%" y1="0%" y2="100%"><stop offset="0%" stop-color="#905BDD"/><stop offset="100%" stop-color="#5521A0"/></linearGradient><path id="h" d="M355.967 22.807l-322 216.395c-44.275 29.754-44.275 78.443 0 108.197l322 216.395c44.275 29.754 116.725 29.754 161 0l322-216.395c44.275-29.754 44.275-78.443 0-108.197l-322-216.395c-44.275-29.754-116.725-29.754-161 0z"/><filter id="g" width="108%" height="112%" x="-4%" y="-4.3%" filterUnits="objectBoundingBox"><feOffset dy="10" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="10"/><feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/></filter></defs><g fill="none"><g transform="translate(75 23)"><use fill="#000" filter="url(#a)" xlink:href="#b"/><use fill="url(#c)" xlink:href="#b"/></g><g transform="translate(75 23)"><use fill="#000" filter="url(#d)" xlink:href="#e"/><use fill="url(#f)" xlink:href="#e"/></g><g transform="translate(75 23)"><use fill="#000" filter="url(#g)" xlink:href="#h"/><use fill="url(#i)" xlink:href="#h"/></g><path fill="#FFF" d="M558.273 447.667L308.036 279.5l97.982-65.847c42.83-28.784 96.789-31.483 134.245-6.311 26.044 17.502 31.214 46.615 11.444 65.724l1.389.934c38.324-19.932 84.107-18.527 117.396 3.845 44.046 29.6 38.671 68.419-14.561 104.193l-97.658 65.629zM447.112 331.01l49.942-33.562c36.935-24.822 42.31-48.249 15.224-66.451-24.798-16.665-55.49-14.453-85.851 5.95l-59.641 40.081 80.326 53.982zm176.532 35.663c37.63-25.289 42.136-48.832 13.203-68.276-28.932-19.444-64.163-15.614-104.042 11.186l-58.789 39.508 87.92 59.084 61.708-41.502z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"{% if include.class %} class="{{ include.class }}"{% endif %}{% if include.width %} width="{{ include.width }}"{% endif %}{% if include.height %} height="{{ include.height }}"{% endif %} viewBox="0 0 1024 860" focusable="false" role="img"><title>Bootstrap</title><defs><linearGradient id="c" x1="50%" x2="50%" y1="0%" y2="100%"><stop offset="0%" stop-color="#5C24AE"/><stop offset="100%" stop-color="#30135A"/></linearGradient><path id="b" d="M355.967 242.807l-322 216.395c-44.275 29.754-44.275 78.443 0 108.197l322 216.395c44.275 29.754 116.725 29.754 161 0l322-216.395c44.275-29.754 44.275-78.443 0-108.197l-322-216.395c-44.275-29.754-116.725-29.754-161 0z"/><filter id="a" width="108%" height="112%" x="-4%" y="-4.3%" filterUnits="objectBoundingBox"><feOffset dy="10" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="10"/><feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/></filter><linearGradient id="f" x1="50%" x2="50%" y1="-17.303%" y2="100%"><stop offset="0%" stop-color="#7331D4"/><stop offset="100%" stop-color="#461B84"/></linearGradient><path id="e" d="M355.967 132.807l-322 216.395c-44.275 29.754-44.275 78.443 0 108.197l322 216.395c44.275 29.754 116.725 29.754 161 0l322-216.395c44.275-29.754 44.275-78.443 0-108.197l-322-216.395c-44.275-29.754-116.725-29.754-161 0z"/><filter id="d" width="108%" height="112%" x="-4%" y="-4.3%" filterUnits="objectBoundingBox"><feOffset dy="10" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="10"/><feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/></filter><linearGradient id="i" x1="50%" x2="50%" y1="0%" y2="100%"><stop offset="0%" stop-color="#905BDD"/><stop offset="100%" stop-color="#5521A0"/></linearGradient><path id="h" d="M355.967 22.807l-322 216.395c-44.275 29.754-44.275 78.443 0 108.197l322 216.395c44.275 29.754 116.725 29.754 161 0l322-216.395c44.275-29.754 44.275-78.443 0-108.197l-322-216.395c-44.275-29.754-116.725-29.754-161 0z"/><filter id="g" width="108%" height="112%" x="-4%" y="-4.3%" filterUnits="objectBoundingBox"><feOffset dy="10" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="10"/><feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/></filter></defs><g fill="none"><g transform="translate(75 23)"><use fill="#000" filter="url(#a)" xlink:href="#b"/><use fill="url(#c)" xlink:href="#b"/></g><g transform="translate(75 23)"><use fill="#000" filter="url(#d)" xlink:href="#e"/><use fill="url(#f)" xlink:href="#e"/></g><g transform="translate(75 23)"><use fill="#000" filter="url(#g)" xlink:href="#h"/><use fill="url(#i)" xlink:href="#h"/></g><path fill="#FFF" d="M558.273 447.667L308.036 279.5l97.982-65.847c42.83-28.784 96.789-31.483 134.245-6.311 26.044 17.502 31.214 46.615 11.444 65.724l1.389.934c38.324-19.932 84.107-18.527 117.396 3.845 44.046 29.6 38.671 68.419-14.561 104.193l-97.658 65.629zM447.112 331.01l49.942-33.562c36.935-24.822 42.31-48.249 15.224-66.451-24.798-16.665-55.49-14.453-85.851 5.95l-59.641 40.081 80.326 53.982zm176.532 35.663c37.63-25.289 42.136-48.832 13.203-68.276-28.932-19.444-64.163-15.614-104.042 11.186l-58.789 39.508 87.92 59.084 61.708-41.502z"/></g></svg>
diff --git a/site/_includes/icons/opencollective.svg b/site/_includes/icons/opencollective.svg
new file mode 100644
index 000000000000..cc17db800d9a
--- /dev/null
+++ b/site/_includes/icons/opencollective.svg
@@ -0,0 +1 @@
+<svg{% if include.class %} class="{{ include.class }}"{% endif %} xmlns="http://www.w3.org/2000/svg" viewbox="0 0 40 41"{% if include.width %} width="{{ include.width }}"{% endif %}{% if include.height %} height="{{ include.height }}"{% endif %} focusable="false" role="img" fill="currentColor" fill-rule="evenodd"><title>Open Collective</title><path d="M32.8 21c0 2.4-.8 4.9-2 6.9l5.1 5.1c2.5-3.4 4.1-7.6 4.1-12 0-4.6-1.6-8.8-4-12.2L30.7 14c1.2 2 2 4.3 2 7z" fill-opacity=".4"/><path d="M20 33.7a12.8 12.8 0 0 1 0-25.6c2.6 0 5 .7 7 2.1L32 5a20 20 0 1 0 .1 31.9l-5-5.2a13 13 0 0 1-7 2z"/></svg>
diff --git a/site/docs/4.2/assets/scss/_ads.scss b/site/docs/4.2/assets/scss/_ads.scss
index 375a9e01fa38..c207f1682fbd 100644
--- a/site/docs/4.2/assets/scss/_ads.scss
+++ b/site/docs/4.2/assets/scss/_ads.scss
@@ -23,7 +23,7 @@
 
   @include media-breakpoint-up(sm) {
     max-width: 330px;
-    border-radius: 4px;
+    @include border-radius(4px);
   }
 }
 
diff --git a/site/docs/4.2/assets/scss/_brand.scss b/site/docs/4.2/assets/scss/_brand.scss
index c8c5c2d56626..d7d9f1f09ba5 100644
--- a/site/docs/4.2/assets/scss/_brand.scss
+++ b/site/docs/4.2/assets/scss/_brand.scss
@@ -10,7 +10,7 @@
   overflow: hidden;
   color: $bd-purple;
   background-color: #f9f9f9;
-  border-radius: .25rem;
+  @include border-radius;
 
   .inverse {
     color: $white;
@@ -79,7 +79,7 @@
   height: 4rem;
   margin-right: .25rem;
   margin-left: .25rem;
-  border-radius: .25rem;
+  @include border-radius;
 
   @include media-breakpoint-up(md) {
     width: 6rem;
diff --git a/site/docs/4.2/assets/scss/_callouts.scss b/site/docs/4.2/assets/scss/_callouts.scss
index b11e370c6418..a10fc05b8d77 100644
--- a/site/docs/4.2/assets/scss/_callouts.scss
+++ b/site/docs/4.2/assets/scss/_callouts.scss
@@ -8,7 +8,7 @@
   margin-bottom: 1.25rem;
   border: 1px solid #eee;
   border-left-width: .25rem;
-  border-radius: .25rem;
+  @include border-radius;
 
   h4 {
     margin-top: 0;
@@ -20,7 +20,7 @@
   }
 
   code {
-    border-radius: .25rem;
+    @include border-radius;
   }
 
   + .bd-callout {
diff --git a/site/docs/4.2/assets/scss/_clipboard-js.scss b/site/docs/4.2/assets/scss/_clipboard-js.scss
index 001a6b01e29e..0cf39964464a 100644
--- a/site/docs/4.2/assets/scss/_clipboard-js.scss
+++ b/site/docs/4.2/assets/scss/_clipboard-js.scss
@@ -28,7 +28,7 @@
   cursor: pointer;
   background-color: transparent;
   border: 0;
-  border-radius: .25rem;
+  @include border-radius;
 
   &:hover {
     color: $white;
diff --git a/site/docs/4.2/assets/scss/_component-examples.scss b/site/docs/4.2/assets/scss/_component-examples.scss
index bb31b3155e6f..773dabc5a40d 100644
--- a/site/docs/4.2/assets/scss/_component-examples.scss
+++ b/site/docs/4.2/assets/scss/_component-examples.scss
@@ -87,7 +87,7 @@
   height: 3rem;
   margin-bottom: .5rem;
   background-color: lighten($blue, 50%);
-  border-radius: .25rem;
+  @include border-radius;
 }
 
 .bd-example-container-sidebar {
@@ -95,14 +95,14 @@
   width: 4rem;
   height: 8rem;
   background-color: lighten($blue, 25%);
-  border-radius: .25rem;
+  @include border-radius;
 }
 
 .bd-example-container-body {
   height: 8rem;
   margin-right: 4.5rem;
   background-color: lighten($bd-purple, 25%);
-  border-radius: .25rem;
+  @include border-radius;
 }
 
 .bd-example-container-fluid {
diff --git a/site/docs/4.2/components/card.md b/site/docs/4.2/components/card.md
index 221c9da54a9f..fa9c6ffc151b 100644
--- a/site/docs/4.2/components/card.md
+++ b/site/docs/4.2/components/card.md
@@ -397,6 +397,28 @@ Note that content should not be larger than the height of the image. If content
 {% endcapture %}
 {% include callout.html content=callout type="info" %}
 
+## Horizontal
+
+Using a combination of grid and utility classes, cards can be made horizontal in a mobile-friendly and responsive way. In the example below, we remove the grid gutters with `.no-gutters` and use `.col-md-*` classes to make the card horizontal at the `md` breakpoint. Further adjustments may be needed depending on your card content.
+
+{% capture example %}
+<div class="card mb-3" style="max-width: 540px;">
+  <div class="row no-gutters">
+    <div class="col-md-4">
+      {% include icons/placeholder.svg width="100%" height="250" class="" text="Image" %}
+    </div>
+    <div class="col-md-8">
+      <div class="card-body">
+        <h5 class="card-title">Card title</h5>
+        <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
+        <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
+      </div>
+    </div>
+  </div>
+</div>
+{% endcapture %}
+{% include example.html content=example %}
+
 ## Card styles
 
 Cards include various options for customizing their backgrounds, borders, and color.
diff --git a/site/docs/4.2/components/toasts.md b/site/docs/4.2/components/toasts.md
index f9d0d7e4cef4..ac02ee9692e4 100644
--- a/site/docs/4.2/components/toasts.md
+++ b/site/docs/4.2/components/toasts.md
@@ -14,6 +14,7 @@ Things to know when using the toast plugin:
 
 - If you're building our JavaScript from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
 - Toasts are opt-in for performance reasons, so **you must initialize them yourself**.
+- **Please note that you are responsible for positioning toasts.**
 - Toasts will automatically hide if you do not specify `autohide: false`.
 
 ## Examples
diff --git a/site/docs/4.2/examples/index.html b/site/docs/4.2/examples/index.html
index d47151252491..28f94dfb544a 100644
--- a/site/docs/4.2/examples/index.html
+++ b/site/docs/4.2/examples/index.html
@@ -4,8 +4,6 @@
 description: Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.
 redirect_from:
   - "/examples/"
-  - "/docs/4.0/examples/tooltip-viewport/"
-  - "/docs/4.1/examples/tooltip-viewport/"
 ---
 
 {% for entry in site.data.examples %}
diff --git a/site/docs/4.2/utilities/embed.md b/site/docs/4.2/utilities/embed.md
index de4105fb8267..1f6868074678 100644
--- a/site/docs/4.2/utilities/embed.md
+++ b/site/docs/4.2/utilities/embed.md
@@ -55,7 +55,7 @@ Within `_variables.scss`, you can change the aspect ratios you want to use. Here
 $embed-responsive-aspect-ratios: (
   (21 9),
   (16 9),
-  (3 4),
+  (4 3),
   (1 1)
 ) !default;
 {% endhighlight %}
diff --git a/site/docs/4.2/utilities/stretched-link.md b/site/docs/4.2/utilities/stretched-link.md
new file mode 100644
index 000000000000..1d4d2ad317cc
--- /dev/null
+++ b/site/docs/4.2/utilities/stretched-link.md
@@ -0,0 +1,80 @@
+---
+layout: docs
+title: Stretched link
+description: Make any HTML element or Bootstrap component clickable by "stretching" a nested link via CSS.
+group: utilities
+---
+
+Add `.stretched-link` to a link to make its [containing block](https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block) clickable via a `::after` pseudo element. In most cases, this means that an element with `position: relative;` that contains a link with the `.stretched-link` class is clickable.
+
+Cards have `position: relative` by default in Bootstrap, so in this case you can safely add the `.stretched-link` class to a link in the card without any other HTML changes.
+
+Multiple links and tap targets are not recommended with stretched links. However, some `position` and `z-index` styles can help should this be required.
+
+{% capture example %}
+<div class="card" style="width: 18rem;">
+  {% include icons/placeholder.svg width="100%" height="180" class="card-img-top" text=" " title="Card image cap" %}
+  <div class="card-body">
+    <h5 class="card-title">Card with stretched link</h5>
+    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
+    <a href="#" class="btn btn-primary stretched-link">Go somewhere</a>
+  </div>
+</div>
+{% endcapture %}
+{% include example.html content=example %}
+
+Media objects do not have `position: relative` by default, so we need to add the `.position-relative` here to prevent the link from stretching outside the media object.
+
+{% capture example %}
+<div class="media position-relative">
+  {% include icons/placeholder.svg width="144" height="144" class="mr-3" text=" " title="Generic placeholder image" %}
+  <div class="media-body">
+    <h5 class="mt-0">Media with stretched link</h5>
+    <p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.</p>
+    <a href="#" class="stretched-link">Go somewhere</a>
+  </div>
+</div>
+{% endcapture %}
+{% include example.html content=example %}
+
+Columns are `position: relative` by default, so clickable columns only require the `.stretched-link` class on a link. However, stretching a link over an entire `.row` requires `.position-static` on the column and `.position-relative` on the row.
+
+{% capture example %}
+<div class="row no-gutters bg-light position-relative">
+  <div class="col-md-6 mb-md-0 p-md-4">
+    {% include icons/placeholder.svg width="100%" height="200" class="w-100" text=" " title="Generic placeholder image" %}
+  </div>
+  <div class="col-md-6 position-static p-4 pl-md-0">
+    <h5 class="mt-0">Columns with stretched link</h5>
+    <p>Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.</p>
+    <a href="#" class="stretched-link">Go somewhere</a>
+  </div>
+</div>
+{% endcapture %}
+{% include example.html content=example %}
+
+## Identifying the containing block
+
+If the stretched link doesn't seem to work, the [containing block](https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#Identifying_the_containing_block) will probably be the cause. The following CSS properties will make an element the containing block:
+
+- A `position` value other than `static`
+- A `transform` or `perspective` value other than `none`
+- A `will-change` value of `transform` or `perspective`
+- A `filter` value other than `none` or a `will-change` value of `filter` (only works on Firefox)
+
+{% capture example %}
+<div class="card" style="width: 18rem;">
+  {% include icons/placeholder.svg width="100%" height="180" class="card-img-top" text=" " title="Card image cap" %}
+  <div class="card-body">
+    <h5 class="card-title">Card with stretched links</h5>
+    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
+    <p class="card-text">
+      <a href="#" class="stretched-link text-danger" style="position: relative;">Stretched link will not work here, because <code>position: relative</code> is added to the link</a>
+    </p>
+    <p class="card-text bg-light" style="transform: rotate(0);">
+      This <a href="#" class="text-warning stretched-link">stretched link</a> will only be spread over the <code>p</code>-tag, because a transform is applied to it.
+    </p>
+  </div>
+</div>
+{% endcapture %}
+{% include example.html content=example %}
diff --git a/site/docs/versions.html b/site/docs/versions.html
index f883f52854fd..4f8f4ea3ac84 100644
--- a/site/docs/versions.html
+++ b/site/docs/versions.html
@@ -9,18 +9,19 @@
   <div class="col-md">
     <h2>{{ release.group }}</h2>
     <p>{{ release.description }}</p>
-    {% for version in release.versions %}
+    {% assign versions = release.versions | reverse %}
+    {% for version in versions %}
       {% if forloop.first %}<div class="list-group">{% endif %}
-        {% if version.v == site.docs_version %}
-          <a class="list-group-item list-group-item-action py-2 text-primary d-flex justify-content-between align-items-center" href="{{ release.baseurl }}/{{ version.v }}/">
-            {{ version.v }}
-            <span class="badge badge-primary">Latest</span>
-          </a>
-        {% else %}
-          <a class="list-group-item list-group-item-action py-2 text-primary" href="{{ release.baseurl }}/{{ version.v }}/">
-            {{ version.v }}
-          </a>
-        {% endif %}
+      {% if version.v == site.docs_version %}
+        <a class="list-group-item list-group-item-action py-2 text-primary d-flex justify-content-between align-items-center" href="{{ release.baseurl }}/{{ version.v }}/">
+          {{ version.v }}
+          <span class="badge badge-primary">Latest</span>
+        </a>
+      {% else %}
+        <a class="list-group-item list-group-item-action py-2 text-primary" href="{{ release.baseurl }}/{{ version.v }}/">
+          {{ version.v }}
+        </a>
+      {% endif %}
       {% if forloop.last %}</div>{% endif %}
     {% endfor %}
   </div>