@clayui/css 3.81.0 → 3.83.0

package/lib/css/atlas.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /**
- * Clay 3.81.0
+ * Clay 3.83.0
  *
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -866,9 +866,10 @@ pre code {
 }
 .spinner-border {
   animation: spinner-border 0.75s linear infinite;
+  border-color: currentColor transparent currentColor currentColor;
   border-radius: 50%;
-  border-right-color: transparent;
-  border: 0.25em solid currentColor;
+  border-style: solid;
+  border-width: 0.25em;
   display: inline-block;
   height: 2rem;
   vertical-align: text-bottom;
@@ -6398,12 +6399,12 @@ input[type=button].btn-block {
   word-wrap: break-word;
   font-size: inherit;
 }
-.dropdown-item:hover {
+.dropdown-item:hover, .dropdown-item.hover {
   background-color: #f0f5ff;
   color: #272833;
   text-decoration: none;
 }
-.dropdown-item:focus {
+.dropdown-item:focus, .dropdown-item.focus {
   background-color: #f0f5ff;
   color: #272833;
   text-decoration: none;
@@ -6612,6 +6613,51 @@ input[type=button].btn-block {
   margin-bottom: 0;
 }
 
+.dropdown-menu-select.dropdown-menu .dropdown-header {
+  padding-bottom: 0.375rem;
+  padding-left: 1.75rem;
+  padding-right: 1.75rem;
+  padding-top: 0.3125rem;
+}
+.dropdown-menu-select.dropdown-menu .dropdown-subheader {
+  padding-bottom: 0.4375rem;
+  padding-left: 1.75rem;
+  padding-right: 1.75rem;
+  padding-top: 0.4375rem;
+}
+.dropdown-menu-select.dropdown-menu .dropdown-section {
+  padding-left: 1.75rem;
+  padding-right: 1.75rem;
+}
+.dropdown-menu-select.dropdown-menu .dropdown-item {
+  padding-bottom: 0.375rem;
+  padding-left: 1.75rem;
+  padding-right: 1.75rem;
+  padding-top: 0.3125rem;
+}
+.dropdown-menu-select.dropdown-menu .dropdown-item .c-inner {
+  flex-grow: 1;
+  margin-bottom: -0.375rem;
+  margin-left: -1.75rem;
+  margin-right: -1.75rem;
+  margin-top: -0.3125rem;
+  width: auto;
+}
+.dropdown-menu-select.dropdown-menu .dropdown-item.autofit-row {
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+}
+.dropdown-menu-select.dropdown-menu .dropdown-divider {
+  margin: 0.3125rem 0;
+}
+.dropdown-menu-select.dropdown-menu.dropdown-menu-indicator-start .dropdown-item-indicator-start {
+  left: 0.5rem;
+  top: 0.5rem;
+}
+.dropdown-menu-select.dropdown-menu.dropdown-menu-indicator-end .dropdown-item-indicator-end {
+  right: 0.5rem;
+  top: 0.5rem;
+}
 .dropdown-menu-left {
   left: 0;
   right: auto;
@@ -7543,9 +7589,6 @@ select.form-control:disabled, select.form-control.disabled {
 select.form-control:disabled > option, select.form-control.disabled > option {
   cursor: not-allowed;
 }
-select.form-control option {
-  cursor: pointer;
-}
 select.form-control::-ms-expand {
   display: none;
 }
@@ -7565,6 +7608,7 @@ select.form-control:focus::-ms-value {
   background-size: 1.5em 1.5em;
   padding-right: 2em;
   overflow: hidden;
+  text-align: left;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
@@ -7592,12 +7636,6 @@ select.form-control[size]:focus > option:checked, select.form-control[size].focu
   color: #fff;
   filter: invert(100%);
 }
-select.form-control[size] option {
-  padding: 0.4375rem 0.5rem;
-}
-select.form-control[size] option:checked {
-  background-image: linear-gradient(#e7e7ed, #e7e7ed);
-}
 @-moz-document url-prefix() {
   select.form-control[size]:focus > option:checked, select.form-control[size].focus > option:checked {
     background-image: linear-gradient(#004ad7, #004ad7);
@@ -7624,12 +7662,6 @@ select.form-control[multiple]:focus > option:checked, select.form-control[multip
   color: #fff;
   filter: invert(100%);
 }
-select.form-control[multiple] option {
-  padding: 0.4375rem 0.5rem;
-}
-select.form-control[multiple] option:checked {
-  background-image: linear-gradient(#e7e7ed, #e7e7ed);
-}
 @-moz-document url-prefix() {
   select.form-control[multiple]:focus > option:checked, select.form-control[multiple].focus > option:checked {
     background-image: linear-gradient(#004ad7, #004ad7);
@@ -7640,6 +7672,27 @@ select.form-control[multiple] option:checked {
   }
 }
 
+.form-control-select-secondary {
+  background-color: #fff;
+  color: #6b6c7e;
+}
+.form-control-select-secondary:hover, .form-control-select-secondary.hover {
+  color: #6b6c7e;
+}
+.form-control-select-secondary:focus, .form-control-select-secondary.focus {
+  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-top'%20d='m347.913%20199.336-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664z'%20fill='%23272833'/%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-bottom'%20d='m165.236%20312.664%2081.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%23272833'/%3E%3C/svg%3E");
+  color: #272833;
+}
+.form-control-select-secondary.show {
+  background-color: #f1f2f5;
+  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-top'%20d='m347.913%20199.336-81.538-85c-5.413-5.642-14.188-5.642-19.6%200l-81.538%2085c-8.731%209.101-2.548%2024.664%209.8%2024.664h163.077c12.348%200%2018.531-15.563%209.8-24.664z'%20fill='%23272833'/%3E%3Cpath%20class='lexicon-icon-outline%20caret-double-l-bottom'%20d='m165.236%20312.664%2081.538%2085c5.412%205.642%2014.188%205.642%2019.6%200l81.538-85c8.731-9.101%202.548-24.664-9.8-24.664H175.035c-12.347%200-18.531%2015.563-9.8%2024.664z'%20fill='%23272833'/%3E%3C/svg%3E");
+  color: #272833;
+}
+.form-control-select-secondary:disabled, .form-control-select-secondary.disabled {
+  background-color: #fff;
+  color: #6b6c7e;
+  opacity: 0.4;
+}
 textarea.form-control,
 textarea.form-control-plaintext,
 .form-control.form-control-textarea {
@@ -8783,6 +8836,7 @@ button.link-outline {
   border-color: #e7e7ed;
 }
 .clay-color-pointer {
+  background-color: transparent;
   border-radius: 100px;
   border-color: #fff;
   border-style: solid;
@@ -8795,7 +8849,6 @@ button.link-outline {
   position: absolute;
   transition: box-shadow 0.15s ease-in-out;
   width: 0.875rem;
-  background-color: transparent;
 }
 @media (prefers-reduced-motion: reduce) {
   .clay-color-pointer {
@@ -9623,11 +9676,11 @@ label.custom-control-label {
   margin-top: -2px;
 }
 .date-picker .input-group-text {
+  background-color: transparent;
   border-color: transparent;
   min-width: 2rem;
   padding-left: 0.25rem;
   padding-right: 0.25rem;
-  background-color: transparent;
 }
 .date-picker-dropdown-menu {
   max-height: none;
@@ -9657,15 +9710,15 @@ label.custom-control-label {
   color: #272833;
 }
 .date-picker-nav .nav-btn:focus, .date-picker-nav .nav-btn.focus {
+  box-shadow: 0 0 0 0.2rem rgba(11, 95, 255, 0.25);
   background-color: #f1f2f5;
-  box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #80acff;
   color: #272833;
 }
 .date-picker-nav .nav-btn:active {
   background-color: #f1f2f5;
 }
 .date-picker-nav .nav-btn:active:focus {
-  box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #80acff;
+  box-shadow: 0 0 0 0.2rem rgba(11, 95, 255, 0.25);
 }
 .date-picker-nav .nav-btn.active {
   background-color: #f1f2f5;
@@ -9693,7 +9746,7 @@ label.custom-control-label {
   padding-left: 0.5rem;
   padding-top: 0;
 }
-.date-picker-nav select.form-control:hover {
+.date-picker-nav select.form-control:hover, .date-picker-nav select.form-control.hover {
   background-color: #f1f2f5;
   color: #272833;
 }
@@ -9751,6 +9804,7 @@ label.custom-control-label {
 
 .date-picker-calendar-item {
   align-items: center;
+  background-color: transparent;
   border-width: 0px;
   display: inline-flex;
   flex-shrink: 0;
@@ -9772,7 +9826,6 @@ label.custom-control-label {
   vertical-align: middle;
   white-space: nowrap;
   width: 2rem;
-  background-color: transparent;
 }
 @media (prefers-reduced-motion: reduce) {
   .date-picker-calendar-item {
@@ -9841,17 +9894,17 @@ label.custom-control-label {
   color: #272833;
 }
 .date-picker-date:focus, .date-picker-date.focus {
+  box-shadow: 0 0 0 0.2rem rgba(11, 95, 255, 0.25);
+  outline: 0;
   background-color: #f1f2f5;
-  box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #80acff;
   color: #272833;
-  outline: 0;
 }
 .date-picker-date:active {
   background-color: #0b5fff;
   color: #fff;
 }
 .date-picker-date:active:focus {
-  box-shadow: 0 0 0 0.125rem #fff, 0 0 0 0.25rem #80acff;
+  box-shadow: 0 0 0 0.2rem rgba(11, 95, 255, 0.25);
 }
 .date-picker-date.active {
   background-color: #0b5fff;
@@ -11988,81 +12041,21 @@ label.custom-control-label {
   }
 }
 
-.modal-success .btn-monospaced {
-  color: #287d3c;
-}
-.modal-success .close {
-  color: #287d3c;
-}
-.modal-success .close:hover {
-  color: inherit;
-}
-.modal-success .close:focus {
-  color: inherit;
-}
-.modal-success .close:disabled, .modal-success .close.disabled {
-  color: inherit;
-}
 .modal-success .modal-header {
   background-color: #edf9f0;
   border-color: #5aca75;
   color: #287d3c;
 }
-.modal-info .btn-monospaced {
-  color: #2e5aac;
-}
-.modal-info .close {
-  color: #2e5aac;
-}
-.modal-info .close:hover {
-  color: inherit;
-}
-.modal-info .close:focus {
-  color: inherit;
-}
-.modal-info .close:disabled, .modal-info .close.disabled {
-  color: inherit;
-}
 .modal-info .modal-header {
   background-color: #eef2fa;
   border-color: #89a7e0;
   color: #2e5aac;
 }
-.modal-warning .btn-monospaced {
-  color: #b95000;
-}
-.modal-warning .close {
-  color: #b95000;
-}
-.modal-warning .close:hover {
-  color: inherit;
-}
-.modal-warning .close:focus {
-  color: inherit;
-}
-.modal-warning .close:disabled, .modal-warning .close.disabled {
-  color: inherit;
-}
 .modal-warning .modal-header {
   background-color: #fff4ec;
   border-color: #ff8f39;
   color: #b95000;
 }
-.modal-danger .btn-monospaced {
-  color: #da1414;
-}
-.modal-danger .close {
-  color: #da1414;
-}
-.modal-danger .close:hover {
-  color: inherit;
-}
-.modal-danger .close:focus {
-  color: inherit;
-}
-.modal-danger .close:disabled, .modal-danger .close.disabled {
-  color: inherit;
-}
 .modal-danger .modal-header {
   background-color: #feefef;
   border-color: #f48989;
@@ -18729,19 +18722,20 @@ a.sheet-subtitle:focus {
   overflow: auto;
   -webkit-overflow-scrolling: touch;
 }
+.sidebar:focus, .sidebar.focus {
+  box-shadow: inset 0 0 0 0.125rem #80acff, inset 0 0 0 0.25rem #fff;
+}
 .sidebar .container-fluid {
   padding-left: 1rem;
   padding-right: 1rem;
 }
 
-.sidebar-header,
-.sidebar-footer {
+.sidebar-header {
   padding-bottom: 1rem;
   padding-left: 1rem;
   padding-right: 1rem;
   padding-top: 1rem;
 }
-
 .sidebar-header .component-title {
   font-size: 1.25rem;
   font-weight: 600;
@@ -18759,6 +18753,13 @@ a.sheet-subtitle:focus {
   overflow-wrap: break-word;
   word-wrap: break-word;
 }
+.sidebar-footer {
+  padding-bottom: 1rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  padding-top: 1rem;
+}
+
 .sidebar-body {
   overflow: auto;
   -webkit-overflow-scrolling: touch;
@@ -20346,8 +20347,8 @@ caption {
     display: inline;
   }
   .tbar-inline-xs-down .tbar-item {
-    display: inline;
     padding-left: 0;
+    display: inline;
   }
 }
 
@@ -20365,8 +20366,8 @@ caption {
     display: inline;
   }
   .tbar-inline-sm-down .tbar-item {
-    display: inline;
     padding-left: 0;
+    display: inline;
   }
 }
 
@@ -20384,8 +20385,8 @@ caption {
     display: inline;
   }
   .tbar-inline-md-down .tbar-item {
-    display: inline;
     padding-left: 0;
+    display: inline;
   }
 }
 
@@ -20403,8 +20404,8 @@ caption {
     display: inline;
   }
   .tbar-inline-lg-down .tbar-item {
-    display: inline;
     padding-left: 0;
+    display: inline;
   }
 }
 
@@ -20421,8 +20422,8 @@ caption {
   display: inline;
 }
 .tbar-inline-xl-down .tbar-item {
-  display: inline;
   padding-left: 0;
+  display: inline;
 }
 
 .component-tbar {
@@ -20432,6 +20433,9 @@ caption {
   height: 3.5rem;
   color: #6b6c7e;
 }
+.component-tbar .tbar-label {
+  border-width: 0.0625rem;
+}
 .subnav-tbar {
   font-size: 0.875rem;
 }
@@ -20453,6 +20457,9 @@ caption {
 .subnav-tbar .component-link:hover {
   color: #004ad7;
 }
+.subnav-tbar .component-link:disabled, .subnav-tbar .component-link.disabled {
+  box-shadow: none;
+}
 .subnav-tbar .tbar-item {
   padding-left: 0.5rem;
   padding-right: 0.5rem;
@@ -20462,16 +20469,16 @@ caption {
   line-height: 1;
   margin-bottom: 0.125rem;
   margin-top: 0.125rem;
-  padding-bottom: 0;
-  padding-top: 0;
+  padding-left: 0;
+  padding-right: 0;
 }
 .subnav-tbar .tbar-btn .c-inner {
-  margin-bottom: 0;
-  margin-top: 0;
+  margin-left: 0;
+  margin-right: 0;
 }
 .subnav-tbar .tbar-btn .c-inner {
-  margin-bottom: 0;
-  margin-top: 0;
+  margin-left: 0;
+  margin-right: 0;
 }
 .subnav-tbar .tbar-link {
   margin-bottom: 0.125rem;
@@ -20494,10 +20501,10 @@ caption {
   margin-top: -0.09375rem;
 }
 .subnav-tbar .tbar-btn-monospaced {
-  height: 1.5rem;
   margin-bottom: 0.125rem;
   margin-top: 0.125rem;
   padding: 0.25rem;
+  height: 1.5rem;
   width: 1.5rem;
 }
 .subnav-tbar .tbar-btn-monospaced .c-inner {
@@ -20531,6 +20538,9 @@ caption {
 .subnav-tbar .component-label {
   font-weight: 400;
 }
+.subnav-tbar .tbar-label {
+  border-width: 0.0625rem;
+}
 .subnav-tbar-primary {
   background-color: #b3cdff;
   padding-bottom: 0.625rem;
@@ -20573,12 +20583,12 @@ caption {
 .subnav-tbar-primary .tbar-label {
   font-size: 0.75rem;
   margin-right: 0;
-  text-transform: none;
-  border-width: 0.0625rem;
   padding-bottom: 0.3125rem;
   padding-left: 0.625rem;
   padding-right: 0.625rem;
   padding-top: 0.3125rem;
+  text-transform: none;
+  border-width: 0.0625rem;
 }
 .subnav-tbar-primary .tbar-label > .c-inner {
   margin-bottom: -0.3125rem;
@@ -20587,18 +20597,24 @@ caption {
   margin-top: -0.3125rem;
 }
 .subnav-tbar-primary.subnav-tbar-disabled {
-  color: #8e94aa;
   background-color: #cfddf8;
+  color: #8e94aa;
 }
 .subnav-tbar-primary.subnav-tbar-disabled .component-label {
   border-color: #8e94aa;
 }
+.subnav-tbar-primary.subnav-tbar-disabled .tbar-label {
+  border-width: 0.0625rem;
+}
 .subnav-tbar-light {
-  color: #6b6c7e;
   background-color: white;
+  color: #6b6c7e;
   padding-bottom: 0.125rem;
   padding-top: 0.125rem;
 }
+.subnav-tbar-light .tbar-label {
+  border-width: 0.0625rem;
+}
 .tbar-stacked {
   display: inline-flex;
   height: 100%;
@@ -20665,6 +20681,9 @@ caption {
   margin-right: 0;
   margin-top: 0;
 }
+.tbar-stacked .tbar-label {
+  border-width: 0.0625rem;
+}
 .tbar-light {
   background-color: #fff;
   box-shadow: inset 1px 0 0 0 #f1f2f5, inset -1px 0 0 0 #f1f2f5;
@@ -20697,6 +20716,9 @@ caption {
   background-color: #f1f2f5;
   color: #272833;
 }
+.tbar-light .tbar-label {
+  border-width: 0.0625rem;
+}
 .tbar-dark-l2 {
   background-color: #393a4a;
   box-shadow: inset 1px 0 0 0 rgba(255, 255, 255, 0.06), inset -1px 0 0 0 rgba(255, 255, 255, 0.06);
@@ -20730,6 +20752,9 @@ caption {
   background-color: rgba(255, 255, 255, 0.06);
   color: #fff;
 }
+.tbar-dark-l2 .tbar-label {
+  border-width: 0.0625rem;
+}
 .tbar-dark-d1 {
   background-color: #1c1c24;
   box-shadow: inset 1px 0 0 0 rgba(255, 255, 255, 0.06), inset -1px 0 0 0 rgba(255, 255, 255, 0.06);
@@ -20755,16 +20780,6 @@ caption {
   background-color: rgba(255, 255, 255, 0.06);
   color: #fff;
 }
-.tbar-dark-d1 .tbar-btn-monospaced.active::after {
-  background-color: #80acff;
-  bottom: 0;
-  content: "";
-  display: block;
-  left: 0;
-  position: absolute;
-  top: 0;
-  width: 0.25rem;
-}
 .tbar-dark-d1 .tbar-btn-monospaced:disabled, .tbar-dark-d1 .tbar-btn-monospaced.disabled {
   color: inherit;
 }
@@ -20772,6 +20787,9 @@ caption {
   background-color: rgba(255, 255, 255, 0.06);
   color: #fff;
 }
+.tbar-dark-d1 .tbar-label {
+  border-width: 0.0625rem;
+}
 .timeline {
   list-style: none;
   padding-left: 0;
@@ -22204,6 +22222,370 @@ ul.autofit-row {
   background-color: #fff;
 }
 
+.c-gap-0 {
+  gap: 0;
+}
+
+.c-gapx-0 {
+  column-gap: 0;
+}
+
+.c-gapy-0 {
+  row-gap: 0;
+}
+
+.c-gap-1 {
+  gap: 0.25rem;
+}
+
+.c-gapx-1 {
+  column-gap: 0.25rem;
+}
+
+.c-gapy-1 {
+  row-gap: 0.25rem;
+}
+
+.c-gap-2 {
+  gap: 0.5rem;
+}
+
+.c-gapx-2 {
+  column-gap: 0.5rem;
+}
+
+.c-gapy-2 {
+  row-gap: 0.5rem;
+}
+
+.c-gap-3 {
+  gap: 1rem;
+}
+
+.c-gapx-3 {
+  column-gap: 1rem;
+}
+
+.c-gapy-3 {
+  row-gap: 1rem;
+}
+
+.c-gap-4 {
+  gap: 1.5rem;
+}
+
+.c-gapx-4 {
+  column-gap: 1.5rem;
+}
+
+.c-gapy-4 {
+  row-gap: 1.5rem;
+}
+
+.c-gap-5 {
+  gap: 3rem;
+}
+
+.c-gapx-5 {
+  column-gap: 3rem;
+}
+
+.c-gapy-5 {
+  row-gap: 3rem;
+}
+
+@media (min-width: 576px) {
+  .c-gap-sm-0 {
+    gap: 0;
+  }
+
+  .c-gapx-sm-0 {
+    column-gap: 0;
+  }
+
+  .c-gapy-sm-0 {
+    row-gap: 0;
+  }
+
+  .c-gap-sm-1 {
+    gap: 0.25rem;
+  }
+
+  .c-gapx-sm-1 {
+    column-gap: 0.25rem;
+  }
+
+  .c-gapy-sm-1 {
+    row-gap: 0.25rem;
+  }
+
+  .c-gap-sm-2 {
+    gap: 0.5rem;
+  }
+
+  .c-gapx-sm-2 {
+    column-gap: 0.5rem;
+  }
+
+  .c-gapy-sm-2 {
+    row-gap: 0.5rem;
+  }
+
+  .c-gap-sm-3 {
+    gap: 1rem;
+  }
+
+  .c-gapx-sm-3 {
+    column-gap: 1rem;
+  }
+
+  .c-gapy-sm-3 {
+    row-gap: 1rem;
+  }
+
+  .c-gap-sm-4 {
+    gap: 1.5rem;
+  }
+
+  .c-gapx-sm-4 {
+    column-gap: 1.5rem;
+  }
+
+  .c-gapy-sm-4 {
+    row-gap: 1.5rem;
+  }
+
+  .c-gap-sm-5 {
+    gap: 3rem;
+  }
+
+  .c-gapx-sm-5 {
+    column-gap: 3rem;
+  }
+
+  .c-gapy-sm-5 {
+    row-gap: 3rem;
+  }
+}
+@media (min-width: 768px) {
+  .c-gap-md-0 {
+    gap: 0;
+  }
+
+  .c-gapx-md-0 {
+    column-gap: 0;
+  }
+
+  .c-gapy-md-0 {
+    row-gap: 0;
+  }
+
+  .c-gap-md-1 {
+    gap: 0.25rem;
+  }
+
+  .c-gapx-md-1 {
+    column-gap: 0.25rem;
+  }
+
+  .c-gapy-md-1 {
+    row-gap: 0.25rem;
+  }
+
+  .c-gap-md-2 {
+    gap: 0.5rem;
+  }
+
+  .c-gapx-md-2 {
+    column-gap: 0.5rem;
+  }
+
+  .c-gapy-md-2 {
+    row-gap: 0.5rem;
+  }
+
+  .c-gap-md-3 {
+    gap: 1rem;
+  }
+
+  .c-gapx-md-3 {
+    column-gap: 1rem;
+  }
+
+  .c-gapy-md-3 {
+    row-gap: 1rem;
+  }
+
+  .c-gap-md-4 {
+    gap: 1.5rem;
+  }
+
+  .c-gapx-md-4 {
+    column-gap: 1.5rem;
+  }
+
+  .c-gapy-md-4 {
+    row-gap: 1.5rem;
+  }
+
+  .c-gap-md-5 {
+    gap: 3rem;
+  }
+
+  .c-gapx-md-5 {
+    column-gap: 3rem;
+  }
+
+  .c-gapy-md-5 {
+    row-gap: 3rem;
+  }
+}
+@media (min-width: 992px) {
+  .c-gap-lg-0 {
+    gap: 0;
+  }
+
+  .c-gapx-lg-0 {
+    column-gap: 0;
+  }
+
+  .c-gapy-lg-0 {
+    row-gap: 0;
+  }
+
+  .c-gap-lg-1 {
+    gap: 0.25rem;
+  }
+
+  .c-gapx-lg-1 {
+    column-gap: 0.25rem;
+  }
+
+  .c-gapy-lg-1 {
+    row-gap: 0.25rem;
+  }
+
+  .c-gap-lg-2 {
+    gap: 0.5rem;
+  }
+
+  .c-gapx-lg-2 {
+    column-gap: 0.5rem;
+  }
+
+  .c-gapy-lg-2 {
+    row-gap: 0.5rem;
+  }
+
+  .c-gap-lg-3 {
+    gap: 1rem;
+  }
+
+  .c-gapx-lg-3 {
+    column-gap: 1rem;
+  }
+
+  .c-gapy-lg-3 {
+    row-gap: 1rem;
+  }
+
+  .c-gap-lg-4 {
+    gap: 1.5rem;
+  }
+
+  .c-gapx-lg-4 {
+    column-gap: 1.5rem;
+  }
+
+  .c-gapy-lg-4 {
+    row-gap: 1.5rem;
+  }
+
+  .c-gap-lg-5 {
+    gap: 3rem;
+  }
+
+  .c-gapx-lg-5 {
+    column-gap: 3rem;
+  }
+
+  .c-gapy-lg-5 {
+    row-gap: 3rem;
+  }
+}
+@media (min-width: 1280px) {
+  .c-gap-xl-0 {
+    gap: 0;
+  }
+
+  .c-gapx-xl-0 {
+    column-gap: 0;
+  }
+
+  .c-gapy-xl-0 {
+    row-gap: 0;
+  }
+
+  .c-gap-xl-1 {
+    gap: 0.25rem;
+  }
+
+  .c-gapx-xl-1 {
+    column-gap: 0.25rem;
+  }
+
+  .c-gapy-xl-1 {
+    row-gap: 0.25rem;
+  }
+
+  .c-gap-xl-2 {
+    gap: 0.5rem;
+  }
+
+  .c-gapx-xl-2 {
+    column-gap: 0.5rem;
+  }
+
+  .c-gapy-xl-2 {
+    row-gap: 0.5rem;
+  }
+
+  .c-gap-xl-3 {
+    gap: 1rem;
+  }
+
+  .c-gapx-xl-3 {
+    column-gap: 1rem;
+  }
+
+  .c-gapy-xl-3 {
+    row-gap: 1rem;
+  }
+
+  .c-gap-xl-4 {
+    gap: 1.5rem;
+  }
+
+  .c-gapx-xl-4 {
+    column-gap: 1.5rem;
+  }
+
+  .c-gapy-xl-4 {
+    row-gap: 1.5rem;
+  }
+
+  .c-gap-xl-5 {
+    gap: 3rem;
+  }
+
+  .c-gapx-xl-5 {
+    column-gap: 3rem;
+  }
+
+  .c-gapy-xl-5 {
+    row-gap: 3rem;
+  }
+}
 .c-m-0 {
   margin: 0;
 }
@@ -26422,6 +26804,14 @@ button.bg-dark:focus {
   display: block !important;
 }
 
+.d-grid {
+  display: grid !important;
+}
+
+.d-contents {
+  display: contents !important;
+}
+
 .d-table {
   display: table !important;
 }
@@ -26459,6 +26849,14 @@ button.bg-dark:focus {
     display: block !important;
   }
 
+  .d-sm-grid {
+    display: grid !important;
+  }
+
+  .d-sm-contents {
+    display: contents !important;
+  }
+
   .d-sm-table {
     display: table !important;
   }
@@ -26496,6 +26894,14 @@ button.bg-dark:focus {
     display: block !important;
   }
 
+  .d-md-grid {
+    display: grid !important;
+  }
+
+  .d-md-contents {
+    display: contents !important;
+  }
+
   .d-md-table {
     display: table !important;
   }
@@ -26533,6 +26939,14 @@ button.bg-dark:focus {
     display: block !important;
   }
 
+  .d-lg-grid {
+    display: grid !important;
+  }
+
+  .d-lg-contents {
+    display: contents !important;
+  }
+
   .d-lg-table {
     display: table !important;
   }
@@ -26570,6 +26984,14 @@ button.bg-dark:focus {
     display: block !important;
   }
 
+  .d-xl-grid {
+    display: grid !important;
+  }
+
+  .d-xl-contents {
+    display: contents !important;
+  }
+
   .d-xl-table {
     display: table !important;
   }
@@ -26611,6 +27033,14 @@ button.bg-dark:focus {
     display: block !important;
   }
 
+  .d-print-grid {
+    display: grid !important;
+  }
+
+  .d-print-contents {
+    display: contents !important;
+  }
+
   .d-print-table {
     display: table !important;
   }