@fundamental-styles/theming-preview 0.23.0-rc.3 → 0.23.0-rc.6

package/fundamental-styles.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /*!
- * Fundamental Library Styles v0.23.0-rc.3
+ * Fundamental Library Styles v0.23.0-rc.6
  * Copyright (c) 2022 SAP SE or an SAP affiliate company.
  * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)
  */
@@ -85,6 +85,12 @@
 [class*=sap-icon].sap-icon--background-positive::before {
   background-color: var(--sapPositiveElementColor)
 }
+[class*=sap-icon].sap-icon--color-information {
+  color: var(--sapInformativeElementColor)
+}
+[class*=sap-icon].sap-icon--background-information::before {
+  background-color: var(--sapInformativeElementColor)
+}
 [class*=sap-icon].is-focus,
 [class*=sap-icon]:focus {
   outline-width: var(--sapContent_FocusWidth);
@@ -148,6 +154,12 @@
 [class*=sap-icon-businessSuiteInAppSymbols].sap-icon-businessSuiteInAppSymbols--background-positive::before {
   background-color: var(--sapPositiveElementColor)
 }
+[class*=sap-icon-businessSuiteInAppSymbols].sap-icon-businessSuiteInAppSymbols--color-information {
+  color: var(--sapInformativeElementColor)
+}
+[class*=sap-icon-businessSuiteInAppSymbols].sap-icon-businessSuiteInAppSymbols--background-information::before {
+  background-color: var(--sapInformativeElementColor)
+}
 [class*=sap-icon-TNT]::before {
   font-family: SAP-icons-TNT
 }
@@ -205,6 +217,12 @@
 [class*=sap-icon-TNT].sap-icon-TNT--background-positive::before {
   background-color: var(--sapPositiveElementColor)
 }
+[class*=sap-icon-TNT].sap-icon-TNT--color-information {
+  color: var(--sapInformativeElementColor)
+}
+[class*=sap-icon-TNT].sap-icon-TNT--background-information::before {
+  background-color: var(--sapInformativeElementColor)
+}
 .sap-icon--accidental-leave::before {
   content: "\e000"
 }
@@ -4061,44 +4079,54 @@
   border: .0625rem solid var(--sapGroup_ContentBorderColor)
 }
 .fd-avatar--accent-color-1 {
-  background-color: var(--sapAccentColor1);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_1);
+  color: var(--fdAvatar_Accent_Color_1_Text);
+  border: var(--fdAvatar_Accent_Color_1_Border)
 }
 .fd-avatar--accent-color-2 {
-  background-color: var(--sapAccentColor2);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_2);
+  color: var(--fdAvatar_Accent_Color_2_Text);
+  border: var(--fdAvatar_Accent_Color_2_Border)
 }
 .fd-avatar--accent-color-3 {
-  background-color: var(--sapAccentColor3);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_3);
+  color: var(--fdAvatar_Accent_Color_3_Text);
+  border: var(--fdAvatar_Accent_Color_3_Border)
 }
 .fd-avatar--accent-color-4 {
-  background-color: var(--sapAccentColor4);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_4);
+  color: var(--fdAvatar_Accent_Color_4_Text);
+  border: var(--fdAvatar_Accent_Color_4_Border)
 }
 .fd-avatar--accent-color-5 {
-  background-color: var(--sapAccentColor5);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_5);
+  color: var(--fdAvatar_Accent_Color_5_Text);
+  border: var(--fdAvatar_Accent_Color_5_Border)
 }
 .fd-avatar--accent-color-6 {
-  background-color: var(--sapAccentColor6);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_6);
+  color: var(--fdAvatar_Accent_Color_6_Text);
+  border: var(--fdAvatar_Accent_Color_6_Border)
 }
 .fd-avatar--accent-color-7 {
-  background-color: var(--sapAccentColor7);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_7);
+  color: var(--fdAvatar_Accent_Color_7_Text);
+  border: var(--fdAvatar_Accent_Color_7_Border)
 }
 .fd-avatar--accent-color-8 {
-  background-color: var(--sapAccentColor8);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_8);
+  color: var(--fdAvatar_Accent_Color_8_Text);
+  border: var(--fdAvatar_Accent_Color_8_Border)
 }
 .fd-avatar--accent-color-9 {
-  background-color: var(--sapAccentColor9);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_9);
+  color: var(--fdAvatar_Accent_Color_9_Text);
+  border: var(--fdAvatar_Accent_Color_9_Border)
 }
 .fd-avatar--accent-color-10 {
-  background-color: var(--sapAccentColor10);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_10);
+  color: var(--fdAvatar_Accent_Color_10_Text);
+  border: var(--fdAvatar_Accent_Color_10_Border)
 }
 .fd-avatar--xs {
   padding: 0;
@@ -4411,44 +4439,54 @@
   border: .0625rem solid var(--sapGroup_ContentBorderColor)
 }
 .fd-avatar--accent-color-1 {
-  background-color: var(--sapAccentColor1);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_1);
+  color: var(--fdAvatar_Accent_Color_1_Text);
+  border: var(--fdAvatar_Accent_Color_1_Border)
 }
 .fd-avatar--accent-color-2 {
-  background-color: var(--sapAccentColor2);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_2);
+  color: var(--fdAvatar_Accent_Color_2_Text);
+  border: var(--fdAvatar_Accent_Color_2_Border)
 }
 .fd-avatar--accent-color-3 {
-  background-color: var(--sapAccentColor3);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_3);
+  color: var(--fdAvatar_Accent_Color_3_Text);
+  border: var(--fdAvatar_Accent_Color_3_Border)
 }
 .fd-avatar--accent-color-4 {
-  background-color: var(--sapAccentColor4);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_4);
+  color: var(--fdAvatar_Accent_Color_4_Text);
+  border: var(--fdAvatar_Accent_Color_4_Border)
 }
 .fd-avatar--accent-color-5 {
-  background-color: var(--sapAccentColor5);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_5);
+  color: var(--fdAvatar_Accent_Color_5_Text);
+  border: var(--fdAvatar_Accent_Color_5_Border)
 }
 .fd-avatar--accent-color-6 {
-  background-color: var(--sapAccentColor6);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_6);
+  color: var(--fdAvatar_Accent_Color_6_Text);
+  border: var(--fdAvatar_Accent_Color_6_Border)
 }
 .fd-avatar--accent-color-7 {
-  background-color: var(--sapAccentColor7);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_7);
+  color: var(--fdAvatar_Accent_Color_7_Text);
+  border: var(--fdAvatar_Accent_Color_7_Border)
 }
 .fd-avatar--accent-color-8 {
-  background-color: var(--sapAccentColor8);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_8);
+  color: var(--fdAvatar_Accent_Color_8_Text);
+  border: var(--fdAvatar_Accent_Color_8_Border)
 }
 .fd-avatar--accent-color-9 {
-  background-color: var(--sapAccentColor9);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_9);
+  color: var(--fdAvatar_Accent_Color_9_Text);
+  border: var(--fdAvatar_Accent_Color_9_Border)
 }
 .fd-avatar--accent-color-10 {
-  background-color: var(--sapAccentColor10);
-  color: var(--fdAvatar_Accent_Color)
+  background-color: var(--fdAvatar_Accent_Color_10);
+  color: var(--fdAvatar_Accent_Color_10_Text);
+  border: var(--fdAvatar_Accent_Color_10_Border)
 }
 .fd-avatar--xs {
   padding: 0;
@@ -5466,7 +5504,7 @@
   position: relative;
   display: block;
   font-size: 0;
-  color: var(--sapContent_IconColor);
+  color: var(--fdBusy_Indicator_Dot_Color);
   text-align: center
 }
 .fd-busy-indicator--l::after,
@@ -5482,7 +5520,7 @@
 .fd-busy-indicator--l.contrast,
 .fd-busy-indicator--m.contrast,
 .fd-busy-indicator.contrast {
-  color: var(--sapContent_ContrastIconColor)
+  color: var(--fdBusy_Indicator_Dot_Contrast_Color)
 }
 .fd-busy-indicator--l.contrast .fd-busy-indicator--circle-0,
 .fd-busy-indicator--l.contrast .fd-busy-indicator--circle-1,
@@ -5493,7 +5531,7 @@
 .fd-busy-indicator.contrast .fd-busy-indicator--circle-0,
 .fd-busy-indicator.contrast .fd-busy-indicator--circle-1,
 .fd-busy-indicator.contrast .fd-busy-indicator--circle-2 {
-  color: var(--sapContent_ContrastIconColor)
+  color: var(--fdBusy_Indicator_Dot_Contrast_Color)
 }
 .fd-busy-indicator--circle-0,
 .fd-busy-indicator--circle-1,
@@ -5508,7 +5546,7 @@
   padding: 0;
   margin: 0;
   border: 0;
-  color: var(--sapContent_IconColor);
+  color: var(--fdBusy_Indicator_Dot_Color);
   position: relative;
   width: .5rem;
   height: .5rem;
@@ -11637,13 +11675,16 @@ fd-carousel:focus {
 }
 .fd-container.fd-container--no-gap .fd-row .fd-col,
 .fd-container.fd-container--no-vertical-gap .fd-row .fd-col {
-  padding-top: 0
+  padding-top: 0;
+  padding-bottom: 0
 }
 .fd-container[dir=rtl],
 [dir=rtl] .fd-container {
   direction: rtl
 }
 .fd-row {
+  margin-left: -.25rem;
+  margin-right: -.25rem;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -11653,15 +11694,11 @@ fd-carousel:focus {
   -ms-flex: 0 0 100%;
   flex: 0 0 100%;
   position: relative;
-  margin-left: -.25rem;
-  margin-right: -.25rem;
   min-width: calc(100% + .25rem * 2)
 }
-.fd-row:first-child {
-  margin-top: -.5rem
-}
 .fd-row .fd-col {
-  padding-top: .5rem
+  padding-top: .25rem;
+  padding-bottom: .25rem
 }
 .fd-col {
   padding: 0 .25rem;
@@ -11677,8 +11714,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-0[dir=rtl],
 [dir=rtl] .fd-col--offset-0 {
-  margin-left: 0;
-  margin-right: 0
+  margin-right: 0;
+  margin-left: 0
 }
 .fd-col--offset-after-0 {
   margin-right: 0
@@ -11697,8 +11734,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-1[dir=rtl],
 [dir=rtl] .fd-col--offset-1 {
-  margin-left: 0;
-  margin-right: 8.3333333333%
+  margin-right: 8.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-1 {
   margin-right: 8.3333333333%
@@ -11717,8 +11754,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-2[dir=rtl],
 [dir=rtl] .fd-col--offset-2 {
-  margin-left: 0;
-  margin-right: 16.6666666667%
+  margin-right: 16.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-2 {
   margin-right: 16.6666666667%
@@ -11737,8 +11774,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-3[dir=rtl],
 [dir=rtl] .fd-col--offset-3 {
-  margin-left: 0;
-  margin-right: 25%
+  margin-right: 25%;
+  margin-left: 0
 }
 .fd-col--offset-after-3 {
   margin-right: 25%
@@ -11757,8 +11794,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-4[dir=rtl],
 [dir=rtl] .fd-col--offset-4 {
-  margin-left: 0;
-  margin-right: 33.3333333333%
+  margin-right: 33.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-4 {
   margin-right: 33.3333333333%
@@ -11777,8 +11814,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-5[dir=rtl],
 [dir=rtl] .fd-col--offset-5 {
-  margin-left: 0;
-  margin-right: 41.6666666667%
+  margin-right: 41.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-5 {
   margin-right: 41.6666666667%
@@ -11797,8 +11834,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-6[dir=rtl],
 [dir=rtl] .fd-col--offset-6 {
-  margin-left: 0;
-  margin-right: 50%
+  margin-right: 50%;
+  margin-left: 0
 }
 .fd-col--offset-after-6 {
   margin-right: 50%
@@ -11817,8 +11854,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-7[dir=rtl],
 [dir=rtl] .fd-col--offset-7 {
-  margin-left: 0;
-  margin-right: 58.3333333333%
+  margin-right: 58.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-7 {
   margin-right: 58.3333333333%
@@ -11837,8 +11874,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-8[dir=rtl],
 [dir=rtl] .fd-col--offset-8 {
-  margin-left: 0;
-  margin-right: 66.6666666667%
+  margin-right: 66.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-8 {
   margin-right: 66.6666666667%
@@ -11857,8 +11894,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-9[dir=rtl],
 [dir=rtl] .fd-col--offset-9 {
-  margin-left: 0;
-  margin-right: 75%
+  margin-right: 75%;
+  margin-left: 0
 }
 .fd-col--offset-after-9 {
   margin-right: 75%
@@ -11877,8 +11914,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-10[dir=rtl],
 [dir=rtl] .fd-col--offset-10 {
-  margin-left: 0;
-  margin-right: 83.3333333333%
+  margin-right: 83.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-10 {
   margin-right: 83.3333333333%
@@ -11897,8 +11934,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-11[dir=rtl],
 [dir=rtl] .fd-col--offset-11 {
-  margin-left: 0;
-  margin-right: 91.6666666667%
+  margin-right: 91.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-11 {
   margin-right: 91.6666666667%
@@ -11917,8 +11954,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-12[dir=rtl],
 [dir=rtl] .fd-col--offset-12 {
-  margin-left: 0;
-  margin-right: 100%
+  margin-right: 100%;
+  margin-left: 0
 }
 .fd-col--offset-after-12 {
   margin-right: 100%
@@ -11944,15 +11981,13 @@ fd-carousel:focus {
     padding: 0 .5rem
   }
   .fd-row {
-    min-width: calc(100% + .5rem * 2);
     margin-left: -.5rem;
-    margin-right: -.5rem
-  }
-  .fd-row:first-child {
-    margin-top: -1rem
+    margin-right: -.5rem;
+    min-width: calc(100% + .5rem * 2)
   }
   .fd-row .fd-col {
-    padding-top: 1rem
+    padding-top: .5rem;
+    padding-bottom: .5rem
   }
   .fd-col {
     padding: 0 .5rem
@@ -11966,8 +12001,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-0[dir=rtl],
   [dir=rtl] .fd-col-md--offset-0 {
-    margin-left: 0;
-    margin-right: 0
+    margin-right: 0;
+    margin-left: 0
   }
   .fd-col-md--offset-after-0 {
     margin-right: 0
@@ -11986,8 +12021,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-1[dir=rtl],
   [dir=rtl] .fd-col-md--offset-1 {
-    margin-left: 0;
-    margin-right: 8.3333333333%
+    margin-right: 8.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-1 {
     margin-right: 8.3333333333%
@@ -12006,8 +12041,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-2[dir=rtl],
   [dir=rtl] .fd-col-md--offset-2 {
-    margin-left: 0;
-    margin-right: 16.6666666667%
+    margin-right: 16.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-2 {
     margin-right: 16.6666666667%
@@ -12026,8 +12061,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-3[dir=rtl],
   [dir=rtl] .fd-col-md--offset-3 {
-    margin-left: 0;
-    margin-right: 25%
+    margin-right: 25%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-3 {
     margin-right: 25%
@@ -12046,8 +12081,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-4[dir=rtl],
   [dir=rtl] .fd-col-md--offset-4 {
-    margin-left: 0;
-    margin-right: 33.3333333333%
+    margin-right: 33.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-4 {
     margin-right: 33.3333333333%
@@ -12066,8 +12101,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-5[dir=rtl],
   [dir=rtl] .fd-col-md--offset-5 {
-    margin-left: 0;
-    margin-right: 41.6666666667%
+    margin-right: 41.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-5 {
     margin-right: 41.6666666667%
@@ -12086,8 +12121,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-6[dir=rtl],
   [dir=rtl] .fd-col-md--offset-6 {
-    margin-left: 0;
-    margin-right: 50%
+    margin-right: 50%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-6 {
     margin-right: 50%
@@ -12106,8 +12141,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-7[dir=rtl],
   [dir=rtl] .fd-col-md--offset-7 {
-    margin-left: 0;
-    margin-right: 58.3333333333%
+    margin-right: 58.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-7 {
     margin-right: 58.3333333333%
@@ -12126,8 +12161,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-8[dir=rtl],
   [dir=rtl] .fd-col-md--offset-8 {
-    margin-left: 0;
-    margin-right: 66.6666666667%
+    margin-right: 66.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-8 {
     margin-right: 66.6666666667%
@@ -12146,8 +12181,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-9[dir=rtl],
   [dir=rtl] .fd-col-md--offset-9 {
-    margin-left: 0;
-    margin-right: 75%
+    margin-right: 75%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-9 {
     margin-right: 75%
@@ -12166,8 +12201,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-10[dir=rtl],
   [dir=rtl] .fd-col-md--offset-10 {
-    margin-left: 0;
-    margin-right: 83.3333333333%
+    margin-right: 83.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-10 {
     margin-right: 83.3333333333%
@@ -12186,8 +12221,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-11[dir=rtl],
   [dir=rtl] .fd-col-md--offset-11 {
-    margin-left: 0;
-    margin-right: 91.6666666667%
+    margin-right: 91.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-11 {
     margin-right: 91.6666666667%
@@ -12206,8 +12241,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-12[dir=rtl],
   [dir=rtl] .fd-col-md--offset-12 {
-    margin-left: 0;
-    margin-right: 100%
+    margin-right: 100%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-12 {
     margin-right: 100%
@@ -12228,8 +12263,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-0[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-0 {
-    margin-left: 0;
-    margin-right: 0
+    margin-right: 0;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-0 {
     margin-right: 0
@@ -12248,8 +12283,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-1[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-1 {
-    margin-left: 0;
-    margin-right: 8.3333333333%
+    margin-right: 8.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-1 {
     margin-right: 8.3333333333%
@@ -12268,8 +12303,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-2[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-2 {
-    margin-left: 0;
-    margin-right: 16.6666666667%
+    margin-right: 16.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-2 {
     margin-right: 16.6666666667%
@@ -12288,8 +12323,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-3[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-3 {
-    margin-left: 0;
-    margin-right: 25%
+    margin-right: 25%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-3 {
     margin-right: 25%
@@ -12308,8 +12343,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-4[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-4 {
-    margin-left: 0;
-    margin-right: 33.3333333333%
+    margin-right: 33.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-4 {
     margin-right: 33.3333333333%
@@ -12328,8 +12363,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-5[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-5 {
-    margin-left: 0;
-    margin-right: 41.6666666667%
+    margin-right: 41.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-5 {
     margin-right: 41.6666666667%
@@ -12348,8 +12383,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-6[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-6 {
-    margin-left: 0;
-    margin-right: 50%
+    margin-right: 50%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-6 {
     margin-right: 50%
@@ -12368,8 +12403,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-7[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-7 {
-    margin-left: 0;
-    margin-right: 58.3333333333%
+    margin-right: 58.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-7 {
     margin-right: 58.3333333333%
@@ -12388,8 +12423,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-8[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-8 {
-    margin-left: 0;
-    margin-right: 66.6666666667%
+    margin-right: 66.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-8 {
     margin-right: 66.6666666667%
@@ -12408,8 +12443,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-9[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-9 {
-    margin-left: 0;
-    margin-right: 75%
+    margin-right: 75%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-9 {
     margin-right: 75%
@@ -12428,8 +12463,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-10[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-10 {
-    margin-left: 0;
-    margin-right: 83.3333333333%
+    margin-right: 83.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-10 {
     margin-right: 83.3333333333%
@@ -12448,8 +12483,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-11[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-11 {
-    margin-left: 0;
-    margin-right: 91.6666666667%
+    margin-right: 91.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-11 {
     margin-right: 91.6666666667%
@@ -12468,8 +12503,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-12[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-12 {
-    margin-left: 0;
-    margin-right: 100%
+    margin-right: 100%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-12 {
     margin-right: 100%
@@ -12490,8 +12525,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-0[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-0 {
-    margin-left: 0;
-    margin-right: 0
+    margin-right: 0;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-0 {
     margin-right: 0
@@ -12510,8 +12545,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-1[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-1 {
-    margin-left: 0;
-    margin-right: 8.3333333333%
+    margin-right: 8.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-1 {
     margin-right: 8.3333333333%
@@ -12530,8 +12565,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-2[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-2 {
-    margin-left: 0;
-    margin-right: 16.6666666667%
+    margin-right: 16.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-2 {
     margin-right: 16.6666666667%
@@ -12550,8 +12585,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-3[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-3 {
-    margin-left: 0;
-    margin-right: 25%
+    margin-right: 25%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-3 {
     margin-right: 25%
@@ -12570,8 +12605,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-4[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-4 {
-    margin-left: 0;
-    margin-right: 33.3333333333%
+    margin-right: 33.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-4 {
     margin-right: 33.3333333333%
@@ -12590,8 +12625,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-5[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-5 {
-    margin-left: 0;
-    margin-right: 41.6666666667%
+    margin-right: 41.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-5 {
     margin-right: 41.6666666667%
@@ -12610,8 +12645,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-6[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-6 {
-    margin-left: 0;
-    margin-right: 50%
+    margin-right: 50%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-6 {
     margin-right: 50%
@@ -12630,8 +12665,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-7[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-7 {
-    margin-left: 0;
-    margin-right: 58.3333333333%
+    margin-right: 58.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-7 {
     margin-right: 58.3333333333%
@@ -12650,8 +12685,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-8[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-8 {
-    margin-left: 0;
-    margin-right: 66.6666666667%
+    margin-right: 66.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-8 {
     margin-right: 66.6666666667%
@@ -12670,8 +12705,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-9[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-9 {
-    margin-left: 0;
-    margin-right: 75%
+    margin-right: 75%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-9 {
     margin-right: 75%
@@ -12690,8 +12725,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-10[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-10 {
-    margin-left: 0;
-    margin-right: 83.3333333333%
+    margin-right: 83.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-10 {
     margin-right: 83.3333333333%
@@ -12710,8 +12745,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-11[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-11 {
-    margin-left: 0;
-    margin-right: 91.6666666667%
+    margin-right: 91.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-11 {
     margin-right: 91.6666666667%
@@ -12730,8 +12765,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-12[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-12 {
-    margin-left: 0;
-    margin-right: 100%
+    margin-right: 100%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-12 {
     margin-right: 100%
@@ -17226,13 +17261,16 @@ fd-carousel:focus {
 }
 .fd-container.fd-container--no-gap .fd-row .fd-col,
 .fd-container.fd-container--no-vertical-gap .fd-row .fd-col {
-  padding-top: 0
+  padding-top: 0;
+  padding-bottom: 0
 }
 .fd-container[dir=rtl],
 [dir=rtl] .fd-container {
   direction: rtl
 }
 .fd-row {
+  margin-left: -.25rem;
+  margin-right: -.25rem;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -17242,15 +17280,11 @@ fd-carousel:focus {
   -ms-flex: 0 0 100%;
   flex: 0 0 100%;
   position: relative;
-  margin-left: -.25rem;
-  margin-right: -.25rem;
   min-width: calc(100% + .25rem * 2)
 }
-.fd-row:first-child {
-  margin-top: -.5rem
-}
 .fd-row .fd-col {
-  padding-top: .5rem
+  padding-top: .25rem;
+  padding-bottom: .25rem
 }
 .fd-col {
   padding: 0 .25rem;
@@ -17266,8 +17300,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-0[dir=rtl],
 [dir=rtl] .fd-col--offset-0 {
-  margin-left: 0;
-  margin-right: 0
+  margin-right: 0;
+  margin-left: 0
 }
 .fd-col--offset-after-0 {
   margin-right: 0
@@ -17286,8 +17320,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-1[dir=rtl],
 [dir=rtl] .fd-col--offset-1 {
-  margin-left: 0;
-  margin-right: 8.3333333333%
+  margin-right: 8.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-1 {
   margin-right: 8.3333333333%
@@ -17306,8 +17340,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-2[dir=rtl],
 [dir=rtl] .fd-col--offset-2 {
-  margin-left: 0;
-  margin-right: 16.6666666667%
+  margin-right: 16.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-2 {
   margin-right: 16.6666666667%
@@ -17326,8 +17360,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-3[dir=rtl],
 [dir=rtl] .fd-col--offset-3 {
-  margin-left: 0;
-  margin-right: 25%
+  margin-right: 25%;
+  margin-left: 0
 }
 .fd-col--offset-after-3 {
   margin-right: 25%
@@ -17346,8 +17380,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-4[dir=rtl],
 [dir=rtl] .fd-col--offset-4 {
-  margin-left: 0;
-  margin-right: 33.3333333333%
+  margin-right: 33.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-4 {
   margin-right: 33.3333333333%
@@ -17366,8 +17400,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-5[dir=rtl],
 [dir=rtl] .fd-col--offset-5 {
-  margin-left: 0;
-  margin-right: 41.6666666667%
+  margin-right: 41.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-5 {
   margin-right: 41.6666666667%
@@ -17386,8 +17420,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-6[dir=rtl],
 [dir=rtl] .fd-col--offset-6 {
-  margin-left: 0;
-  margin-right: 50%
+  margin-right: 50%;
+  margin-left: 0
 }
 .fd-col--offset-after-6 {
   margin-right: 50%
@@ -17406,8 +17440,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-7[dir=rtl],
 [dir=rtl] .fd-col--offset-7 {
-  margin-left: 0;
-  margin-right: 58.3333333333%
+  margin-right: 58.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-7 {
   margin-right: 58.3333333333%
@@ -17426,8 +17460,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-8[dir=rtl],
 [dir=rtl] .fd-col--offset-8 {
-  margin-left: 0;
-  margin-right: 66.6666666667%
+  margin-right: 66.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-8 {
   margin-right: 66.6666666667%
@@ -17446,8 +17480,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-9[dir=rtl],
 [dir=rtl] .fd-col--offset-9 {
-  margin-left: 0;
-  margin-right: 75%
+  margin-right: 75%;
+  margin-left: 0
 }
 .fd-col--offset-after-9 {
   margin-right: 75%
@@ -17466,8 +17500,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-10[dir=rtl],
 [dir=rtl] .fd-col--offset-10 {
-  margin-left: 0;
-  margin-right: 83.3333333333%
+  margin-right: 83.3333333333%;
+  margin-left: 0
 }
 .fd-col--offset-after-10 {
   margin-right: 83.3333333333%
@@ -17486,8 +17520,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-11[dir=rtl],
 [dir=rtl] .fd-col--offset-11 {
-  margin-left: 0;
-  margin-right: 91.6666666667%
+  margin-right: 91.6666666667%;
+  margin-left: 0
 }
 .fd-col--offset-after-11 {
   margin-right: 91.6666666667%
@@ -17506,8 +17540,8 @@ fd-carousel:focus {
 }
 .fd-col--offset-12[dir=rtl],
 [dir=rtl] .fd-col--offset-12 {
-  margin-left: 0;
-  margin-right: 100%
+  margin-right: 100%;
+  margin-left: 0
 }
 .fd-col--offset-after-12 {
   margin-right: 100%
@@ -17533,15 +17567,13 @@ fd-carousel:focus {
     padding: 0 .5rem
   }
   .fd-row {
-    min-width: calc(100% + .5rem * 2);
     margin-left: -.5rem;
-    margin-right: -.5rem
-  }
-  .fd-row:first-child {
-    margin-top: -1rem
+    margin-right: -.5rem;
+    min-width: calc(100% + .5rem * 2)
   }
   .fd-row .fd-col {
-    padding-top: 1rem
+    padding-top: .5rem;
+    padding-bottom: .5rem
   }
   .fd-col {
     padding: 0 .5rem
@@ -17555,8 +17587,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-0[dir=rtl],
   [dir=rtl] .fd-col-md--offset-0 {
-    margin-left: 0;
-    margin-right: 0
+    margin-right: 0;
+    margin-left: 0
   }
   .fd-col-md--offset-after-0 {
     margin-right: 0
@@ -17575,8 +17607,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-1[dir=rtl],
   [dir=rtl] .fd-col-md--offset-1 {
-    margin-left: 0;
-    margin-right: 8.3333333333%
+    margin-right: 8.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-1 {
     margin-right: 8.3333333333%
@@ -17595,8 +17627,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-2[dir=rtl],
   [dir=rtl] .fd-col-md--offset-2 {
-    margin-left: 0;
-    margin-right: 16.6666666667%
+    margin-right: 16.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-2 {
     margin-right: 16.6666666667%
@@ -17615,8 +17647,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-3[dir=rtl],
   [dir=rtl] .fd-col-md--offset-3 {
-    margin-left: 0;
-    margin-right: 25%
+    margin-right: 25%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-3 {
     margin-right: 25%
@@ -17635,8 +17667,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-4[dir=rtl],
   [dir=rtl] .fd-col-md--offset-4 {
-    margin-left: 0;
-    margin-right: 33.3333333333%
+    margin-right: 33.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-4 {
     margin-right: 33.3333333333%
@@ -17655,8 +17687,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-5[dir=rtl],
   [dir=rtl] .fd-col-md--offset-5 {
-    margin-left: 0;
-    margin-right: 41.6666666667%
+    margin-right: 41.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-5 {
     margin-right: 41.6666666667%
@@ -17675,8 +17707,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-6[dir=rtl],
   [dir=rtl] .fd-col-md--offset-6 {
-    margin-left: 0;
-    margin-right: 50%
+    margin-right: 50%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-6 {
     margin-right: 50%
@@ -17695,8 +17727,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-7[dir=rtl],
   [dir=rtl] .fd-col-md--offset-7 {
-    margin-left: 0;
-    margin-right: 58.3333333333%
+    margin-right: 58.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-7 {
     margin-right: 58.3333333333%
@@ -17715,8 +17747,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-8[dir=rtl],
   [dir=rtl] .fd-col-md--offset-8 {
-    margin-left: 0;
-    margin-right: 66.6666666667%
+    margin-right: 66.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-8 {
     margin-right: 66.6666666667%
@@ -17735,8 +17767,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-9[dir=rtl],
   [dir=rtl] .fd-col-md--offset-9 {
-    margin-left: 0;
-    margin-right: 75%
+    margin-right: 75%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-9 {
     margin-right: 75%
@@ -17755,8 +17787,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-10[dir=rtl],
   [dir=rtl] .fd-col-md--offset-10 {
-    margin-left: 0;
-    margin-right: 83.3333333333%
+    margin-right: 83.3333333333%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-10 {
     margin-right: 83.3333333333%
@@ -17775,8 +17807,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-11[dir=rtl],
   [dir=rtl] .fd-col-md--offset-11 {
-    margin-left: 0;
-    margin-right: 91.6666666667%
+    margin-right: 91.6666666667%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-11 {
     margin-right: 91.6666666667%
@@ -17795,8 +17827,8 @@ fd-carousel:focus {
   }
   .fd-col-md--offset-12[dir=rtl],
   [dir=rtl] .fd-col-md--offset-12 {
-    margin-left: 0;
-    margin-right: 100%
+    margin-right: 100%;
+    margin-left: 0
   }
   .fd-col-md--offset-after-12 {
     margin-right: 100%
@@ -17817,8 +17849,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-0[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-0 {
-    margin-left: 0;
-    margin-right: 0
+    margin-right: 0;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-0 {
     margin-right: 0
@@ -17837,8 +17869,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-1[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-1 {
-    margin-left: 0;
-    margin-right: 8.3333333333%
+    margin-right: 8.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-1 {
     margin-right: 8.3333333333%
@@ -17857,8 +17889,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-2[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-2 {
-    margin-left: 0;
-    margin-right: 16.6666666667%
+    margin-right: 16.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-2 {
     margin-right: 16.6666666667%
@@ -17877,8 +17909,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-3[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-3 {
-    margin-left: 0;
-    margin-right: 25%
+    margin-right: 25%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-3 {
     margin-right: 25%
@@ -17897,8 +17929,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-4[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-4 {
-    margin-left: 0;
-    margin-right: 33.3333333333%
+    margin-right: 33.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-4 {
     margin-right: 33.3333333333%
@@ -17917,8 +17949,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-5[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-5 {
-    margin-left: 0;
-    margin-right: 41.6666666667%
+    margin-right: 41.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-5 {
     margin-right: 41.6666666667%
@@ -17937,8 +17969,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-6[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-6 {
-    margin-left: 0;
-    margin-right: 50%
+    margin-right: 50%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-6 {
     margin-right: 50%
@@ -17957,8 +17989,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-7[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-7 {
-    margin-left: 0;
-    margin-right: 58.3333333333%
+    margin-right: 58.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-7 {
     margin-right: 58.3333333333%
@@ -17977,8 +18009,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-8[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-8 {
-    margin-left: 0;
-    margin-right: 66.6666666667%
+    margin-right: 66.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-8 {
     margin-right: 66.6666666667%
@@ -17997,8 +18029,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-9[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-9 {
-    margin-left: 0;
-    margin-right: 75%
+    margin-right: 75%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-9 {
     margin-right: 75%
@@ -18017,8 +18049,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-10[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-10 {
-    margin-left: 0;
-    margin-right: 83.3333333333%
+    margin-right: 83.3333333333%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-10 {
     margin-right: 83.3333333333%
@@ -18037,8 +18069,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-11[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-11 {
-    margin-left: 0;
-    margin-right: 91.6666666667%
+    margin-right: 91.6666666667%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-11 {
     margin-right: 91.6666666667%
@@ -18057,8 +18089,8 @@ fd-carousel:focus {
   }
   .fd-col-lg--offset-12[dir=rtl],
   [dir=rtl] .fd-col-lg--offset-12 {
-    margin-left: 0;
-    margin-right: 100%
+    margin-right: 100%;
+    margin-left: 0
   }
   .fd-col-lg--offset-after-12 {
     margin-right: 100%
@@ -18079,8 +18111,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-0[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-0 {
-    margin-left: 0;
-    margin-right: 0
+    margin-right: 0;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-0 {
     margin-right: 0
@@ -18099,8 +18131,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-1[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-1 {
-    margin-left: 0;
-    margin-right: 8.3333333333%
+    margin-right: 8.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-1 {
     margin-right: 8.3333333333%
@@ -18119,8 +18151,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-2[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-2 {
-    margin-left: 0;
-    margin-right: 16.6666666667%
+    margin-right: 16.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-2 {
     margin-right: 16.6666666667%
@@ -18139,8 +18171,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-3[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-3 {
-    margin-left: 0;
-    margin-right: 25%
+    margin-right: 25%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-3 {
     margin-right: 25%
@@ -18159,8 +18191,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-4[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-4 {
-    margin-left: 0;
-    margin-right: 33.3333333333%
+    margin-right: 33.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-4 {
     margin-right: 33.3333333333%
@@ -18179,8 +18211,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-5[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-5 {
-    margin-left: 0;
-    margin-right: 41.6666666667%
+    margin-right: 41.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-5 {
     margin-right: 41.6666666667%
@@ -18199,8 +18231,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-6[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-6 {
-    margin-left: 0;
-    margin-right: 50%
+    margin-right: 50%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-6 {
     margin-right: 50%
@@ -18219,8 +18251,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-7[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-7 {
-    margin-left: 0;
-    margin-right: 58.3333333333%
+    margin-right: 58.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-7 {
     margin-right: 58.3333333333%
@@ -18239,8 +18271,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-8[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-8 {
-    margin-left: 0;
-    margin-right: 66.6666666667%
+    margin-right: 66.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-8 {
     margin-right: 66.6666666667%
@@ -18259,8 +18291,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-9[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-9 {
-    margin-left: 0;
-    margin-right: 75%
+    margin-right: 75%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-9 {
     margin-right: 75%
@@ -18279,8 +18311,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-10[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-10 {
-    margin-left: 0;
-    margin-right: 83.3333333333%
+    margin-right: 83.3333333333%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-10 {
     margin-right: 83.3333333333%
@@ -18299,8 +18331,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-11[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-11 {
-    margin-left: 0;
-    margin-right: 91.6666666667%
+    margin-right: 91.6666666667%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-11 {
     margin-right: 91.6666666667%
@@ -18319,8 +18351,8 @@ fd-carousel:focus {
   }
   .fd-col-xl--offset-12[dir=rtl],
   [dir=rtl] .fd-col-xl--offset-12 {
-    margin-left: 0;
-    margin-right: 100%
+    margin-right: 100%;
+    margin-left: 0
   }
   .fd-col-xl--offset-after-12 {
     margin-right: 100%