@cfpb/cfpb-design-system 3.9.0 → 3.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/CHANGELOG.md +33 -1
  2. package/dist/base/index.css +1 -1
  3. package/dist/base/index.css.map +2 -2
  4. package/dist/base/index.js +1 -1
  5. package/dist/base/index.js.map +1 -1
  6. package/dist/components/cfpb-buttons/index.css +1 -1
  7. package/dist/components/cfpb-buttons/index.css.map +2 -2
  8. package/dist/components/cfpb-buttons/index.js +1 -1
  9. package/dist/components/cfpb-buttons/index.js.map +1 -1
  10. package/dist/components/cfpb-expandables/index.css +1 -1
  11. package/dist/components/cfpb-expandables/index.css.map +2 -2
  12. package/dist/components/cfpb-expandables/index.js +1 -1
  13. package/dist/components/cfpb-expandables/index.js.map +1 -1
  14. package/dist/components/cfpb-forms/index.css +1 -1
  15. package/dist/components/cfpb-forms/index.css.map +2 -2
  16. package/dist/components/cfpb-forms/index.js +1 -1
  17. package/dist/components/cfpb-forms/index.js.map +1 -1
  18. package/dist/components/cfpb-icons/index.css +1 -1
  19. package/dist/components/cfpb-icons/index.css.map +2 -2
  20. package/dist/components/cfpb-icons/index.js +1 -1
  21. package/dist/components/cfpb-icons/index.js.map +1 -1
  22. package/dist/components/cfpb-layout/index.css +1 -1
  23. package/dist/components/cfpb-layout/index.css.map +2 -2
  24. package/dist/components/cfpb-layout/index.js +1 -1
  25. package/dist/components/cfpb-layout/index.js.map +1 -1
  26. package/dist/components/cfpb-notifications/index.css +1 -1
  27. package/dist/components/cfpb-notifications/index.css.map +2 -2
  28. package/dist/components/cfpb-notifications/index.js +1 -1
  29. package/dist/components/cfpb-notifications/index.js.map +1 -1
  30. package/dist/components/cfpb-pagination/index.css +1 -1
  31. package/dist/components/cfpb-pagination/index.css.map +2 -2
  32. package/dist/components/cfpb-pagination/index.js +1 -1
  33. package/dist/components/cfpb-pagination/index.js.map +1 -1
  34. package/dist/components/cfpb-tables/index.css +1 -1
  35. package/dist/components/cfpb-tables/index.css.map +2 -2
  36. package/dist/components/cfpb-tables/index.js +1 -1
  37. package/dist/components/cfpb-tables/index.js.map +1 -1
  38. package/dist/components/cfpb-tooltips/index.css +1 -1
  39. package/dist/components/cfpb-tooltips/index.css.map +2 -2
  40. package/dist/components/cfpb-tooltips/index.js +1 -1
  41. package/dist/components/cfpb-tooltips/index.js.map +1 -1
  42. package/dist/components/cfpb-typography/index.css +1 -1
  43. package/dist/components/cfpb-typography/index.css.map +2 -2
  44. package/dist/components/cfpb-typography/index.js +1 -1
  45. package/dist/components/cfpb-typography/index.js.map +1 -1
  46. package/dist/index.css +1 -1
  47. package/dist/index.css.map +2 -2
  48. package/dist/index.js +1 -1
  49. package/dist/index.js.map +1 -1
  50. package/dist/utilities/index.css +1 -1
  51. package/dist/utilities/index.css.map +2 -2
  52. package/dist/utilities/index.js +1 -1
  53. package/dist/utilities/index.js.map +1 -1
  54. package/package.json +1 -1
  55. package/src/abstracts/vars.scss +12 -4
  56. package/src/components/cfpb-buttons/button.scss +0 -1
  57. package/src/components/cfpb-forms/form-field.scss +9 -5
  58. package/src/components/cfpb-forms/multiselect.scss +3 -4
  59. package/src/components/cfpb-forms/select.scss +25 -11
  60. package/src/components/cfpb-typography/list.scss +0 -11
  61. package/src/utilities/utilities.scss +3 -5
package/dist/components/cfpb-layout/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-layout/card.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-layout/card-group.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-layout/email-signup.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-layout/featured-content-module.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-layout/hero.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-layout/layout.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-layout/text-introduction.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-layout/well.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-card {\n position: relative;\n}\n.m-card:not(.m-card--breakout) > a {\n padding: 1.875em;\n}\n.m-card:not(.m-card--breakout) .m-card__footer {\n margin-top: auto;\n}\n.m-card:not(.m-card--breakout, .m-card--topic) {\n background: var(--white);\n border: 1px solid var(--gray-20);\n border-bottom-width: 3px;\n padding: 1.875em;\n}\n.m-card:not(.m-card--breakout, .m-card--topic), .m-card > a {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n flex-basis: 0;\n box-sizing: border-box;\n height: 100%;\n}\n.m-card a:focus {\n outline-offset: 2px;\n}\n.m-card__footer > a {\n font-weight: 500;\n border-bottom-width: 1px;\n}\n@media only screen and (max-width: 56.3125em) {\n .m-card__heading {\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n }\n p + .m-card__heading, ul + .m-card__heading, ol + .m-card__heading, dl + .m-card__heading, figure + .m-card__heading, img + .m-card__heading, table + .m-card__heading, blockquote + .m-card__heading, h1 + .m-card__heading, .h1 + .m-card__heading, h2 + .m-card__heading, .h2 + .m-card__heading, h4 + .m-card__heading, .h4 + .m-card__heading, h5 + .m-card__heading, .h5 + .m-card__heading, h6 + .m-card__heading, .h6 + .m-card__heading {\n margin-top: 1.3636363636em;\n }\n}\n@media only screen and (max-width: 56.3125em) and (max-width: 37.5em) {\n .m-card__heading {\n font-size: 1.125em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.8333333333em;\n }\n p + .m-card__heading, ul + .m-card__heading, ol + .m-card__heading, dl + .m-card__heading, figure + .m-card__heading, img + .m-card__heading, table + .m-card__heading, blockquote + .m-card__heading, h1 + .m-card__heading, .h1 + .m-card__heading, h2 + .m-card__heading, .h2 + .m-card__heading, h3 + .m-card__heading, .h3 + .m-card__heading, h5 + .m-card__heading, .h5 + .m-card__heading, h6 + .m-card__heading, .h6 + .m-card__heading {\n margin-top: 1.6666666667em;\n }\n}\n.m-card__heading > a {\n color: var(--black);\n}\n.m-card__heading > a:hover {\n color: var(--pacific);\n}\n.m-card__heading > a .m-card__icon {\n font-size: 1em;\n margin-bottom: 0;\n padding-right: 0.46875em;\n}\n.m-card__heading > a .m-card__icon, .m-card__heading > a span {\n display: table-cell;\n}\n.m-card > .m-list {\n margin-top: 10px;\n margin-bottom: 30px;\n}\n.m-card--topic {\n text-align: center;\n width: 170px;\n background: var(--white);\n}\n.m-card--topic > a {\n border: 1px solid var(--gray-20);\n border-bottom-width: 3px;\n}\n.m-card--topic .m-card__icon {\n font-size: 1.875em;\n color: var(--green);\n margin-bottom: 0.3125em;\n}\n.m-card--topic:hover > a {\n box-shadow: 0 2px 0 0 inset var(--gray-20), 2px 0 0 0 inset var(--gray-20), -2px 0 0 0 inset var(--gray-20);\n}\n.m-card--topic:hover::after {\n content: \"\";\n position: absolute;\n left: 0;\n bottom: 1px;\n height: 5px;\n width: 100%;\n background: var(--green);\n}\n.m-card--topic .m-card__footer > span {\n display: inline;\n border-width: 0;\n border-bottom-width: 1px;\n border-color: var(--pacific);\n border-style: dotted;\n font-weight: 500;\n color: var(--pacific);\n text-decoration: none;\n}\n.m-card--topic > a:visited .m-card__footer > span {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-card--topic:hover .m-card__footer > span {\n border-style: solid;\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-card--topic > a:focus .m-card__footer > span {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-card--topic > a:active .m-card__footer > span {\n border-color: var(--pacific-dark);\n border-style: solid;\n color: var(--pacific-dark);\n}\n.m-card--topic-action .m-card__icon {\n color: var(--pacific);\n}\n.m-card--breakout {\n min-width: 210px;\n text-align: center;\n}\n.m-card--breakout > a {\n padding-top: 60px;\n}\n.m-card--breakout .m-card__inner-wrapper {\n position: relative;\n z-index: 0;\n min-height: 135px;\n background: var(--gray-5);\n border: 1px solid var(--gray-20);\n border-bottom-width: 3px;\n}\n.m-card--breakout .m-card__img {\n position: absolute;\n z-index: 1;\n top: 0;\n left: 50%;\n width: 210px;\n height: 120px;\n margin-left: -105px;\n}\n.m-card--breakout .m-card__footer {\n margin-top: 84px;\n}\n.m-card--breakout:hover .m-card__inner-wrapper {\n box-shadow: 0 2px 0 0 inset var(--gray-20), 2px 0 0 0 inset var(--gray-20), -2px 0 0 0 inset var(--gray-20);\n}\n.m-card--breakout:hover::after {\n content: \"\";\n position: absolute;\n left: 0;\n bottom: 1px;\n height: 5px;\n width: 100%;\n background: var(--green);\n}\n.m-card--breakout .m-card__footer > span {\n display: inline;\n border-width: 0;\n border-bottom-width: 1px;\n border-color: var(--pacific);\n border-style: dotted;\n font-weight: 500;\n color: var(--pacific);\n text-decoration: none;\n}\n.m-card--breakout > a:visited .m-card__footer > span {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-card--breakout:hover .m-card__footer > span {\n border-style: solid;\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-card--breakout > a:focus .m-card__footer > span {\n border-color: var(--pacific);\n color: var(--pacific);\n}\n.m-card--breakout > a:active .m-card__footer > span {\n border-color: var(--navy);\n border-style: solid;\n color: var(--navy);\n}\n.m-card--breakout .m-card__footer > span {\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n}\np + .m-card--breakout .m-card__footer > span, ul + .m-card--breakout .m-card__footer > span, ol + .m-card--breakout .m-card__footer > span, dl + .m-card--breakout .m-card__footer > span, figure + .m-card--breakout .m-card__footer > span, img + .m-card--breakout .m-card__footer > span, table + .m-card--breakout .m-card__footer > span, blockquote + .m-card--breakout .m-card__footer > span, h1 + .m-card--breakout .m-card__footer > span, .h1 + .m-card--breakout .m-card__footer > span, h2 + .m-card--breakout .m-card__footer > span, .h2 + .m-card--breakout .m-card__footer > span, h4 + .m-card--breakout .m-card__footer > span, .h4 + .m-card--breakout .m-card__footer > span, h5 + .m-card--breakout .m-card__footer > span, .h5 + .m-card--breakout .m-card__footer > span, h6 + .m-card--breakout .m-card__footer > span, .h6 + .m-card--breakout .m-card__footer > span {\n margin-top: 1.3636363636em;\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-card-group > h2 {\n margin-bottom: 1.875rem;\n}\n.o-card-group--column-2 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n}\n.o-card-group--column-3 .o-card-group__cards {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n@media only screen and (max-width: 63.8125em) {\n .o-card-group--column-3 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n }\n}\n.o-card-group__cards {\n display: grid;\n grid-column-gap: 1.25em;\n grid-row-gap: 1.25em;\n}\n@media only screen and (max-width: 37.5em) {\n .o-card-group__cards {\n grid-template-columns: 100% !important;\n }\n}\n.o-card-group--bg-green {\n padding: 1.875em;\n background: var(--green-20);\n}\n\n/* stylelint-disable selector-type-no-unknown */\n_:-ms-lang(x),\n.o-card-group__cards {\n display: block;\n}\n_:-ms-lang(x) .m-card,\n.o-card-group__cards .m-card {\n display: block;\n float: left;\n margin-bottom: 10px;\n}\n\n_:-ms-lang(x) .o-card-group__cards .m-card,\n.o-card-group--column-2 .o-card-group__cards .m-card {\n width: 48%;\n margin-right: 2%;\n}\n_:-ms-lang(x) .o-card-group__cards .m-card:last-child,\n.o-card-group--column-2 .o-card-group__cards .m-card:last-child {\n margin-right: 0;\n}\n\n_:-ms-lang(x) .o-card-group__cards .m-card,\n.o-card-group--column-3 .o-card-group__cards .m-card {\n width: 32%;\n margin-right: 1%;\n}\n_:-ms-lang(x) .o-card-group__cards .m-card:last-child,\n.o-card-group--column-3 .o-card-group__cards .m-card:last-child {\n margin-right: 0;\n}\n\n_:-ms-lang(x),\n.o-card-group::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n/* stylelint-enable selector-type-no-unknown */\n/* stylelint-disable no-duplicate-selectors */\n.o-card-group {\n /* stylelint-enable no-duplicate-selectors */\n}\n.o-card-group--count-2 .m-card:nth-of-type(1), .o-card-group--count-3 .m-card:nth-of-type(1), .o-card-group--count-4 .m-card:nth-of-type(1) {\n grid-area: card1;\n}\n.o-card-group--count-2 .m-card:nth-of-type(2), .o-card-group--count-3 .m-card:nth-of-type(2), .o-card-group--count-4 .m-card:nth-of-type(2) {\n grid-area: card2;\n}\n.o-card-group--count-2 .m-card:nth-of-type(3), .o-card-group--count-3 .m-card:nth-of-type(3), .o-card-group--count-4 .m-card:nth-of-type(3) {\n grid-area: card3;\n}\n.o-card-group--count-2 .m-card:nth-of-type(4), .o-card-group--count-3 .m-card:nth-of-type(4), .o-card-group--count-4 .m-card:nth-of-type(4) {\n grid-area: card4;\n}\n.o-card-group--count-2 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card2\";\n}\n.o-card-group--count-3 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card2\" \"card1 card3\";\n}\n.o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n font-size: 1.625em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.5769230769em;\n}\np + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ul + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ol + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, dl + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, figure + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, img + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, table + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, blockquote + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.7307692308em;\n}\nh1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h3 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h3 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.1538461538em;\n}\n@media only screen and (max-width: 37.5em) {\n p + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ul + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ol + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, dl + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, figure + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, img + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, table + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, blockquote + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.3636363636em;\n }\n}\n@media only screen and (max-width: 37.5em) {\n .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n font-size: 1.375em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n }\n p + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ul + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ol + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, dl + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, figure + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, img + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, table + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, blockquote + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h2 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h2 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.3636363636em;\n }\n}\n.o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) > a {\n justify-content: center;\n}\n.o-card-group--count-4 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card2\" \"card3 card4\";\n}\n.o-card-group--flow .o-card-group__cards {\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n}\n\n@media only screen and (min-width: 37.5625em) and (max-width: 56.25em) {\n .o-card-group--count-3 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card1\" \"card2 card3\";\n }\n}\n@media only screen and (max-width: 37.5em) {\n .o-card-group--count-2 .o-card-group__cards {\n grid-template-columns: 1fr;\n grid-template-areas: \"card1\" \"card2\";\n }\n .o-card-group--count-3 .o-card-group__cards {\n grid-template-columns: 1fr;\n grid-template-areas: \"card1\" \"card2\" \"card3\";\n }\n .o-card-group--count-4 .o-card-group__cards {\n grid-template-columns: 1fr;\n grid-template-areas: \"card1\" \"card2\" \"card3\" \"card4\";\n }\n .o-card-group--flow .o-card-group__cards {\n display: block;\n }\n .o-card-group--flow .o-card-group__cards .m-card {\n width: 100%;\n margin-bottom: 1.875em;\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-email-signup .m-notification {\n margin-bottom: 0.9375em;\n}\n.o-email-signup .a-text-input {\n max-width: 23.125rem;\n}\n.o-email-signup__buttons {\n display: flex;\n margin-top: 0.9375em;\n align-items: center;\n flex-wrap: wrap-reverse;\n gap: 0.9375em;\n}\n.o-email-signup .a-btn {\n text-align: inherit;\n}\n@media only screen and (max-width: 37.5em) {\n .o-email-signup .a-label--heading {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-featured-content-module {\n min-height: 220px;\n position: relative;\n border: 1px solid var(--gray-40);\n background-color: var(--gray-5);\n}\n.o-featured-content-module__text {\n padding-top: 1.875em;\n padding-bottom: 1.875em;\n}\n.o-featured-content-module__img {\n display: block;\n}\n@media only screen and (max-width: 37.5em) {\n .o-featured-content-module__text {\n padding-right: 0.9375em;\n padding-left: 0.9375em;\n }\n .o-featured-content-module__visual {\n padding-right: 0.9375em;\n padding-bottom: 0.9375em;\n padding-left: 0.9375em;\n }\n .o-featured-content-module__img {\n margin-right: auto;\n margin-left: auto;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .o-featured-content-module__text {\n padding-right: 300px;\n padding-left: 1.875em;\n }\n .o-featured-content-module__visual {\n height: 100%;\n overflow: hidden;\n position: absolute;\n top: 0;\n right: 0;\n width: 270px;\n }\n .o-featured-content-module__img {\n max-width: none;\n height: 100%;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-hero {\n background-color: var(--gray-5);\n}\n.m-hero__wrapper {\n display: grid;\n max-width: 1200px;\n margin: 0 auto;\n padding-top: 30px;\n padding-bottom: 30px;\n}\n.m-hero__text {\n padding-right: 15px;\n padding-left: 15px;\n}\n.m-hero__heading {\n font-size: 2.125em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.4411764706em;\n}\np + .m-hero__heading, ul + .m-hero__heading, ol + .m-hero__heading, dl + .m-hero__heading, figure + .m-hero__heading, img + .m-hero__heading, table + .m-hero__heading, blockquote + .m-hero__heading {\n margin-top: 1.7647058824em;\n}\n.m-hero__subhead {\n font-size: 22px;\n line-height: 1.25;\n}\n.m-hero__image-wrapper {\n box-sizing: border-box;\n overflow: hidden;\n}\n.m-hero__image {\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n width: 100%;\n display: none;\n}\n@supports (display: grid) {\n .m-hero__image {\n display: block;\n }\n}\n.m-hero--knockout {\n background-color: var(--gray);\n color: var(--white);\n}\n.m-hero--overlay .m-hero__wrapper {\n background-position: center;\n background-repeat: no-repeat;\n background-size: cover;\n}\n.m-hero--jumbo, .m-hero--50-50 {\n background-color: var(--white);\n}\n.m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n margin-top: 0;\n margin-bottom: 15px;\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n}\n@media only screen and (max-width: 37.5em) {\n .m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n font-size: 1.125em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n }\n p + .m-hero--jumbo .m-hero__subhead, ul + .m-hero--jumbo .m-hero__subhead, ol + .m-hero--jumbo .m-hero__subhead, dl + .m-hero--jumbo .m-hero__subhead, figure + .m-hero--jumbo .m-hero__subhead, img + .m-hero--jumbo .m-hero__subhead, table + .m-hero--jumbo .m-hero__subhead, blockquote + .m-hero--jumbo .m-hero__subhead, h1 + .m-hero--jumbo .m-hero__subhead, .h1 + .m-hero--jumbo .m-hero__subhead, h2 + .m-hero--jumbo .m-hero__subhead, .h2 + .m-hero--jumbo .m-hero__subhead, h4 + .m-hero--jumbo .m-hero__subhead, .h4 + .m-hero--jumbo .m-hero__subhead, h5 + .m-hero--jumbo .m-hero__subhead, .h5 + .m-hero--jumbo .m-hero__subhead, h6 + .m-hero--jumbo .m-hero__subhead, .h6 + .m-hero--jumbo .m-hero__subhead, p + .m-hero--50-50 .m-hero__subhead, ul + .m-hero--50-50 .m-hero__subhead, ol + .m-hero--50-50 .m-hero__subhead, dl + .m-hero--50-50 .m-hero__subhead, figure + .m-hero--50-50 .m-hero__subhead, img + .m-hero--50-50 .m-hero__subhead, table + .m-hero--50-50 .m-hero__subhead, blockquote + .m-hero--50-50 .m-hero__subhead, h1 + .m-hero--50-50 .m-hero__subhead, .h1 + .m-hero--50-50 .m-hero__subhead, h2 + .m-hero--50-50 .m-hero__subhead, .h2 + .m-hero--50-50 .m-hero__subhead, h4 + .m-hero--50-50 .m-hero__subhead, .h4 + .m-hero--50-50 .m-hero__subhead, h5 + .m-hero--50-50 .m-hero__subhead, .h5 + .m-hero--50-50 .m-hero__subhead, h6 + .m-hero--50-50 .m-hero__subhead, .h6 + .m-hero--50-50 .m-hero__subhead {\n margin-top: 1.3636363636em;\n }\n}\n@media only screen and (min-width: 63.8125em) {\n .m-hero--jumbo .m-hero__wrapper, .m-hero--50-50 .m-hero__wrapper {\n min-height: 285px;\n }\n .m-hero--jumbo .m-hero__heading, .m-hero--50-50 .m-hero__heading {\n margin-bottom: 0.4166666667em;\n font-size: 3em;\n font-weight: normal;\n line-height: 1.25;\n }\n .m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n font-size: 1.625em;\n font-weight: 400;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.5769230769em;\n }\n p + .m-hero--jumbo .m-hero__subhead, ul + .m-hero--jumbo .m-hero__subhead, ol + .m-hero--jumbo .m-hero__subhead, dl + .m-hero--jumbo .m-hero__subhead, figure + .m-hero--jumbo .m-hero__subhead, img + .m-hero--jumbo .m-hero__subhead, table + .m-hero--jumbo .m-hero__subhead, blockquote + .m-hero--jumbo .m-hero__subhead, p + .m-hero--50-50 .m-hero__subhead, ul + .m-hero--50-50 .m-hero__subhead, ol + .m-hero--50-50 .m-hero__subhead, dl + .m-hero--50-50 .m-hero__subhead, figure + .m-hero--50-50 .m-hero__subhead, img + .m-hero--50-50 .m-hero__subhead, table + .m-hero--50-50 .m-hero__subhead, blockquote + .m-hero--50-50 .m-hero__subhead {\n margin-top: 1.7307692308em;\n }\n h1 + .m-hero--jumbo .m-hero__subhead, .h1 + .m-hero--jumbo .m-hero__subhead, h3 + .m-hero--jumbo .m-hero__subhead, .h3 + .m-hero--jumbo .m-hero__subhead, h4 + .m-hero--jumbo .m-hero__subhead, .h4 + .m-hero--jumbo .m-hero__subhead, h5 + .m-hero--jumbo .m-hero__subhead, .h5 + .m-hero--jumbo .m-hero__subhead, h6 + .m-hero--jumbo .m-hero__subhead, .h6 + .m-hero--jumbo .m-hero__subhead, h1 + .m-hero--50-50 .m-hero__subhead, .h1 + .m-hero--50-50 .m-hero__subhead, h3 + .m-hero--50-50 .m-hero__subhead, .h3 + .m-hero--50-50 .m-hero__subhead, h4 + .m-hero--50-50 .m-hero__subhead, .h4 + .m-hero--50-50 .m-hero__subhead, h5 + .m-hero--50-50 .m-hero__subhead, .h5 + .m-hero--50-50 .m-hero__subhead, h6 + .m-hero--50-50 .m-hero__subhead, .h6 + .m-hero--50-50 .m-hero__subhead {\n margin-top: 1.1538461538em;\n }\n}\n\n@media only screen and (max-width: 37.5em) {\n .m-hero__image-wrapper {\n margin-top: 1.875em;\n }\n .m-hero--overlay .m-hero__wrapper {\n background-image: none !important;\n }\n .m-hero--jumbo .m-hero__wrapper {\n padding-bottom: 0;\n }\n}\n@media only screen and (max-width: 56.25em) {\n .m-hero__heading {\n font-size: 1.625em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.5769230769em;\n }\n p + .m-hero__heading, ul + .m-hero__heading, ol + .m-hero__heading, dl + .m-hero__heading, figure + .m-hero__heading, img + .m-hero__heading, table + .m-hero__heading, blockquote + .m-hero__heading {\n margin-top: 1.7307692308em;\n }\n h1 + .m-hero__heading, .h1 + .m-hero__heading, h3 + .m-hero__heading, .h3 + .m-hero__heading, h4 + .m-hero__heading, .h4 + .m-hero__heading, h5 + .m-hero__heading, .h5 + .m-hero__heading, h6 + .m-hero__heading, .h6 + .m-hero__heading {\n margin-top: 1.1538461538em;\n }\n .m-hero__subhead {\n font-size: 18px;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .m-hero__wrapper {\n grid-template-columns: 7fr 5fr;\n padding-right: 15px;\n padding-left: 15px;\n min-height: 225px;\n }\n .m-hero__text {\n margin: auto 0;\n }\n .m-hero__image-wrapper {\n padding-right: 15px;\n padding-left: 15px;\n display: flex;\n align-items: center;\n }\n .m-hero--bleeding .m-hero__image-wrapper {\n width: 100%;\n margin-top: -2.8125em;\n margin-bottom: -2.8125em;\n }\n .m-hero--bleeding .m-hero__image {\n padding-bottom: 0 !important;\n height: 100%;\n width: 100%;\n background-size: cover;\n }\n .m-hero--overlay .m-hero__image {\n display: none;\n }\n .m-hero--jumbo .m-hero__wrapper {\n background-position: 50%;\n background-repeat: no-repeat;\n background-size: cover;\n }\n .m-hero--jumbo .m-hero__image {\n display: none;\n }\n .m-hero--50-50 .m-hero__wrapper {\n grid-template-columns: 1fr 1fr;\n border: 1px solid var(--gray-40);\n border-top: none;\n background-position: 100% center;\n background-repeat: no-repeat;\n background-size: 50%;\n }\n .m-hero--50-50 .m-hero__image {\n display: none;\n }\n}\n@media only screen and (min-width: 63.8125em) {\n .m-hero__wrapper {\n padding-top: 2.8125em;\n padding-bottom: 2.8125em;\n min-height: 195px;\n }\n .m-hero--bleeding .m-hero__image-wrapper {\n margin-top: -2.8125em;\n margin-bottom: -2.8125em;\n }\n .m-hero--50-50 .m-hero__wrapper {\n min-height: 345px;\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Layout Helpers\n ========================================================================== */\n.content-l {\n position: relative;\n}\n@media only screen and (min-width: 37.5625em) {\n .content-l {\n display: block;\n position: relative;\n margin-left: -15px;\n margin-right: -15px;\n }\n}\n\n@media only screen and (max-width: 37.5em) {\n .content-l__col + .content-l__col {\n margin-top: 1.875em;\n }\n}\n\n@media only screen and (min-width: 37.5625em) {\n .content-l__col-1 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 100%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-1-2 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 50%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-1-3 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 33.3333333333%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-2-3 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 66.6666666667%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-3-8 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 37.5%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-5-8 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 62.5%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-1-4 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 25%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-3-4 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 75%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n}\n.content__line {\n height: 1px;\n background: var(--gray-40);\n}\n\n.content__main dd,\n.content__main dt,\n.content__main h3,\n.content__main h4,\n.content__main h5,\n.content__main h6,\n.content__main li,\n.content__main p,\n.content__main label,\n.content__intro dd,\n.content__intro dt,\n.content__intro h3,\n.content__intro h4,\n.content__intro h5,\n.content__intro h6,\n.content__intro li,\n.content__intro p,\n.content__intro label {\n max-width: 41.875rem;\n}\n\n.content__intro,\n.content__main,\n.content__sidebar {\n padding: 1.875em 0.9375em;\n}\n@media only screen and (min-width: 37.5625em) {\n .content__intro,\n .content__main,\n .content__sidebar {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 100%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n padding: 2.8125em 0.9375em;\n }\n}\n@media only screen and (min-width: 56.3125em) {\n .content__intro,\n .content__main,\n .content__sidebar {\n padding: 2.8125em 0;\n }\n}\n\n@media only screen and (min-width: 56.3125em) {\n .content__intro {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 100%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n}\n@media only screen and (min-width: 56.3125em) {\n .content--1-3 .content__sidebar {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 25%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n padding-right: 1.875em;\n }\n .content--1-3 .content__main {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 75%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n position: relative;\n }\n .content--1-3 .content__main::after {\n content: \"\";\n border-left: 1px solid var(--gray-40);\n position: absolute;\n top: 2.8125em;\n bottom: 0;\n left: -1.875em;\n }\n .content--2-1 .content__main {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 66.6666666667%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content--2-1 .content__main::after {\n right: -1.875em;\n }\n .content--2-1 .content__sidebar {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 33.3333333333%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n padding-left: 1.875em;\n }\n}\n.content--flush-bottom {\n padding-bottom: 0;\n}\n\n@media only screen and (max-width: 56.25em) {\n .content--flush-top-on-small {\n padding-top: 0;\n }\n}\n\n@media only screen and (max-width: 56.25em) {\n .content--flush-all-on-small {\n padding: 0;\n border: none;\n }\n}\n\n.block {\n margin-top: 3.75em;\n margin-bottom: 3.75em;\n}\n.block--border-top {\n border-top: 1px solid var(--gray-40);\n}\n.block--border-right {\n border-right: 1px solid var(--gray-40);\n}\n.block--border-bottom {\n border-bottom: 1px solid var(--gray-40);\n}\n.block--border-left {\n border-left: 1px solid var(--gray-40);\n}\n.block--border {\n border: 1px solid var(--gray-40);\n}\n.block--flush-top {\n margin-top: 0 !important;\n}\n.block--flush-top.block--border, .block--flush-top.block--border-top {\n border-top: none;\n}\n.block--flush-bottom {\n margin-bottom: 0 !important;\n}\n.block--flush-bottom.block--border, .block--flush-bottom.block--border-bottom {\n border-bottom: none;\n}\n.block--flush-sides {\n margin-right: -15px;\n margin-left: -15px;\n}\n@media only screen and (max-width: 37.5em) {\n .block--flush-sides.block--border, .block--flush-sides.block--border-right, .block--flush-sides.block--border-left {\n border-right: none;\n border-left: none;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .block--flush-sides {\n margin-right: -30px;\n margin-left: -30px;\n }\n}\n.block--flush {\n margin-top: 0 !important;\n margin-right: -15px;\n margin-bottom: 0 !important;\n margin-left: -15px;\n}\n.block--flush.block--border, .block--flush.block--border-top, .block--flush.block--border-bottom {\n border-top: none;\n border-bottom: none;\n}\n@media only screen and (max-width: 37.5em) {\n .block--flush.block--border, .block--flush.block--border-right, .block--flush.block--border-left {\n border-right: none;\n border-left: none;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .block--flush {\n margin-right: -30px;\n margin-left: -30px;\n }\n}\n.block--bg {\n padding: 1.875em 0.9375em;\n padding-bottom: 3.75em;\n background: var(--gray-5);\n}\n@media only screen and (min-width: 37.5625em) {\n .block--bg {\n padding: 2.8125em 1.875em;\n }\n}\n.block--padded-top {\n padding-top: 1.875em;\n margin-top: 1.875em;\n}\n.block--padded-bottom {\n padding-bottom: 1.875em;\n margin-bottom: 1.875em;\n}\n.block--sub {\n margin-top: 1.875em;\n margin-bottom: 1.875em;\n}\n\n@media only screen and (min-width: 56.3125em) {\n .wrapper {\n /* stylelint-enable */\n max-width: 1200px;\n padding-right: 15px;\n padding-left: 15px;\n margin: 0 auto;\n clear: both;\n }\n}\n.wrapper--match-content {\n padding-left: 15px;\n padding-right: 15px;\n}\n@media only screen and (min-width: 37.5625em) {\n .wrapper--match-content {\n padding-left: 30px;\n padding-right: 30px;\n max-width: 1200px;\n }\n}", ".o-text-introduction {\n margin-top: 0;\n margin-bottom: 60px;\n}\n.o-text-introduction > * {\n margin-top: 0;\n margin-bottom: 15px;\n max-width: 41.875rem;\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-well {\n box-sizing: border-box;\n padding: 1.875em 0.9375em;\n border: 1px solid var(--gray-40);\n background-color: var(--gray-5);\n}\n@media only screen and (min-width: 37.5625em) {\n .o-well {\n padding-left: 1.875em;\n padding-right: 1.875em;\n }\n}"],
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-card {\n position: relative;\n}\n.m-card:not(.m-card--breakout) > a {\n padding: 1.875em;\n}\n.m-card:not(.m-card--breakout) .m-card__footer {\n margin-top: auto;\n}\n.m-card:not(.m-card--breakout, .m-card--topic) {\n background: var(--white);\n border: 1px solid var(--gray-20);\n border-bottom-width: 3px;\n padding: 1.875em;\n}\n.m-card:not(.m-card--breakout, .m-card--topic), .m-card > a {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n flex-basis: 0;\n box-sizing: border-box;\n height: 100%;\n}\n.m-card a:focus {\n outline-offset: 2px;\n}\n.m-card__footer > a {\n font-weight: 500;\n border-bottom-width: 1px;\n}\n@media only screen and (max-width: 56.3125em) {\n .m-card__heading {\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n }\n p + .m-card__heading, ul + .m-card__heading, ol + .m-card__heading, dl + .m-card__heading, figure + .m-card__heading, img + .m-card__heading, table + .m-card__heading, blockquote + .m-card__heading, h1 + .m-card__heading, .h1 + .m-card__heading, h2 + .m-card__heading, .h2 + .m-card__heading, h4 + .m-card__heading, .h4 + .m-card__heading, h5 + .m-card__heading, .h5 + .m-card__heading, h6 + .m-card__heading, .h6 + .m-card__heading {\n margin-top: 1.3636363636em;\n }\n}\n@media only screen and (max-width: 56.3125em) and (max-width: 37.5em) {\n .m-card__heading {\n font-size: 1.125em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.8333333333em;\n }\n p + .m-card__heading, ul + .m-card__heading, ol + .m-card__heading, dl + .m-card__heading, figure + .m-card__heading, img + .m-card__heading, table + .m-card__heading, blockquote + .m-card__heading, h1 + .m-card__heading, .h1 + .m-card__heading, h2 + .m-card__heading, .h2 + .m-card__heading, h3 + .m-card__heading, .h3 + .m-card__heading, h5 + .m-card__heading, .h5 + .m-card__heading, h6 + .m-card__heading, .h6 + .m-card__heading {\n margin-top: 1.6666666667em;\n }\n}\n.m-card__heading > a {\n color: var(--black);\n}\n.m-card__heading > a:hover {\n color: var(--pacific);\n}\n.m-card__heading > a .m-card__icon {\n font-size: 1em;\n margin-bottom: 0;\n padding-right: 0.46875em;\n}\n.m-card__heading > a .m-card__icon, .m-card__heading > a span {\n display: table-cell;\n}\n.m-card > .m-list {\n margin-top: 10px;\n margin-bottom: 30px;\n}\n.m-card--topic {\n text-align: center;\n width: 170px;\n background: var(--white);\n}\n.m-card--topic > a {\n border: 1px solid var(--gray-20);\n border-bottom-width: 3px;\n}\n.m-card--topic .m-card__icon {\n font-size: 1.875em;\n color: var(--green);\n margin-bottom: 0.3125em;\n}\n.m-card--topic:hover > a {\n box-shadow: 0 2px 0 0 inset var(--gray-20), 2px 0 0 0 inset var(--gray-20), -2px 0 0 0 inset var(--gray-20);\n}\n.m-card--topic:hover::after {\n content: \"\";\n position: absolute;\n left: 0;\n bottom: 1px;\n height: 5px;\n width: 100%;\n background: var(--green);\n}\n.m-card--topic .m-card__footer > span {\n display: inline;\n border-width: 0;\n border-bottom-width: 1px;\n border-color: var(--pacific);\n border-style: dotted;\n font-weight: 500;\n color: var(--pacific);\n text-decoration: none;\n}\n.m-card--topic > a:visited .m-card__footer > span {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-card--topic:hover .m-card__footer > span {\n border-style: solid;\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-card--topic > a:focus .m-card__footer > span {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-card--topic > a:active .m-card__footer > span {\n border-color: var(--pacific-dark);\n border-style: solid;\n color: var(--pacific-dark);\n}\n.m-card--topic-action .m-card__icon {\n color: var(--pacific);\n}\n.m-card--breakout {\n min-width: 210px;\n text-align: center;\n}\n.m-card--breakout > a {\n padding-top: 60px;\n}\n.m-card--breakout .m-card__inner-wrapper {\n position: relative;\n z-index: 0;\n min-height: 135px;\n background: var(--gray-5);\n border: 1px solid var(--gray-20);\n border-bottom-width: 3px;\n}\n.m-card--breakout .m-card__img {\n position: absolute;\n z-index: 1;\n top: 0;\n left: 50%;\n width: 210px;\n height: 120px;\n margin-left: -105px;\n}\n.m-card--breakout .m-card__footer {\n margin-top: 84px;\n}\n.m-card--breakout:hover .m-card__inner-wrapper {\n box-shadow: 0 2px 0 0 inset var(--gray-20), 2px 0 0 0 inset var(--gray-20), -2px 0 0 0 inset var(--gray-20);\n}\n.m-card--breakout:hover::after {\n content: \"\";\n position: absolute;\n left: 0;\n bottom: 1px;\n height: 5px;\n width: 100%;\n background: var(--green);\n}\n.m-card--breakout .m-card__footer > span {\n display: inline;\n border-width: 0;\n border-bottom-width: 1px;\n border-color: var(--pacific);\n border-style: dotted;\n font-weight: 500;\n color: var(--pacific);\n text-decoration: none;\n}\n.m-card--breakout > a:visited .m-card__footer > span {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-card--breakout:hover .m-card__footer > span {\n border-style: solid;\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-card--breakout > a:focus .m-card__footer > span {\n border-color: var(--pacific);\n color: var(--pacific);\n}\n.m-card--breakout > a:active .m-card__footer > span {\n border-color: var(--navy);\n border-style: solid;\n color: var(--navy);\n}\n.m-card--breakout .m-card__footer > span {\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n}\np + .m-card--breakout .m-card__footer > span, ul + .m-card--breakout .m-card__footer > span, ol + .m-card--breakout .m-card__footer > span, dl + .m-card--breakout .m-card__footer > span, figure + .m-card--breakout .m-card__footer > span, img + .m-card--breakout .m-card__footer > span, table + .m-card--breakout .m-card__footer > span, blockquote + .m-card--breakout .m-card__footer > span, h1 + .m-card--breakout .m-card__footer > span, .h1 + .m-card--breakout .m-card__footer > span, h2 + .m-card--breakout .m-card__footer > span, .h2 + .m-card--breakout .m-card__footer > span, h4 + .m-card--breakout .m-card__footer > span, .h4 + .m-card--breakout .m-card__footer > span, h5 + .m-card--breakout .m-card__footer > span, .h5 + .m-card--breakout .m-card__footer > span, h6 + .m-card--breakout .m-card__footer > span, .h6 + .m-card--breakout .m-card__footer > span {\n margin-top: 1.3636363636em;\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-card-group > h2 {\n margin-bottom: 1.875rem;\n}\n.o-card-group--column-2 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n}\n.o-card-group--column-3 .o-card-group__cards {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n@media only screen and (max-width: 63.8125em) {\n .o-card-group--column-3 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n }\n}\n.o-card-group__cards {\n display: grid;\n grid-column-gap: 1.25em;\n grid-row-gap: 1.25em;\n}\n@media only screen and (max-width: 37.5em) {\n .o-card-group__cards {\n grid-template-columns: 100% !important;\n }\n}\n.o-card-group--bg-green {\n padding: 1.875em;\n background: var(--green-20);\n}\n\n/* stylelint-disable selector-type-no-unknown */\n_:-ms-lang(x),\n.o-card-group__cards {\n display: block;\n}\n_:-ms-lang(x) .m-card,\n.o-card-group__cards .m-card {\n display: block;\n float: left;\n margin-bottom: 10px;\n}\n\n_:-ms-lang(x) .o-card-group__cards .m-card,\n.o-card-group--column-2 .o-card-group__cards .m-card {\n width: 48%;\n margin-right: 2%;\n}\n_:-ms-lang(x) .o-card-group__cards .m-card:last-child,\n.o-card-group--column-2 .o-card-group__cards .m-card:last-child {\n margin-right: 0;\n}\n\n_:-ms-lang(x) .o-card-group__cards .m-card,\n.o-card-group--column-3 .o-card-group__cards .m-card {\n width: 32%;\n margin-right: 1%;\n}\n_:-ms-lang(x) .o-card-group__cards .m-card:last-child,\n.o-card-group--column-3 .o-card-group__cards .m-card:last-child {\n margin-right: 0;\n}\n\n_:-ms-lang(x),\n.o-card-group::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n/* stylelint-enable selector-type-no-unknown */\n/* stylelint-disable no-duplicate-selectors */\n.o-card-group {\n /* stylelint-enable no-duplicate-selectors */\n}\n.o-card-group--count-2 .m-card:nth-of-type(1), .o-card-group--count-3 .m-card:nth-of-type(1), .o-card-group--count-4 .m-card:nth-of-type(1) {\n grid-area: card1;\n}\n.o-card-group--count-2 .m-card:nth-of-type(2), .o-card-group--count-3 .m-card:nth-of-type(2), .o-card-group--count-4 .m-card:nth-of-type(2) {\n grid-area: card2;\n}\n.o-card-group--count-2 .m-card:nth-of-type(3), .o-card-group--count-3 .m-card:nth-of-type(3), .o-card-group--count-4 .m-card:nth-of-type(3) {\n grid-area: card3;\n}\n.o-card-group--count-2 .m-card:nth-of-type(4), .o-card-group--count-3 .m-card:nth-of-type(4), .o-card-group--count-4 .m-card:nth-of-type(4) {\n grid-area: card4;\n}\n.o-card-group--count-2 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card2\";\n}\n.o-card-group--count-3 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card2\" \"card1 card3\";\n}\n.o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n font-size: 1.625em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.5769230769em;\n}\np + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ul + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ol + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, dl + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, figure + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, img + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, table + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, blockquote + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.7307692308em;\n}\nh1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h3 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h3 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.1538461538em;\n}\n@media only screen and (max-width: 37.5em) {\n p + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ul + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ol + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, dl + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, figure + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, img + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, table + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, blockquote + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.3636363636em;\n }\n}\n@media only screen and (max-width: 37.5em) {\n .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n font-size: 1.375em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n }\n p + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ul + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, ol + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, dl + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, figure + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, img + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, table + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, blockquote + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h1 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h2 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h2 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h4 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h5 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3, .h6 + .o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) h3 {\n margin-top: 1.3636363636em;\n }\n}\n.o-card-group--count-3 .o-card-group__cards .m-card:nth-of-type(1) > a {\n justify-content: center;\n}\n.o-card-group--count-4 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card2\" \"card3 card4\";\n}\n.o-card-group--flow .o-card-group__cards {\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n}\n\n@media only screen and (min-width: 37.5625em) and (max-width: 56.25em) {\n .o-card-group--count-3 .o-card-group__cards {\n grid-template-columns: 1fr 1fr;\n grid-template-areas: \"card1 card1\" \"card2 card3\";\n }\n}\n@media only screen and (max-width: 37.5em) {\n .o-card-group--count-2 .o-card-group__cards {\n grid-template-columns: 1fr;\n grid-template-areas: \"card1\" \"card2\";\n }\n .o-card-group--count-3 .o-card-group__cards {\n grid-template-columns: 1fr;\n grid-template-areas: \"card1\" \"card2\" \"card3\";\n }\n .o-card-group--count-4 .o-card-group__cards {\n grid-template-columns: 1fr;\n grid-template-areas: \"card1\" \"card2\" \"card3\" \"card4\";\n }\n .o-card-group--flow .o-card-group__cards {\n display: block;\n }\n .o-card-group--flow .o-card-group__cards .m-card {\n width: 100%;\n margin-bottom: 1.875em;\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-email-signup .m-notification {\n margin-bottom: 0.9375em;\n}\n.o-email-signup .a-text-input {\n max-width: 23.125rem;\n}\n.o-email-signup__buttons {\n display: flex;\n margin-top: 0.9375em;\n align-items: center;\n flex-wrap: wrap-reverse;\n gap: 0.9375em;\n}\n.o-email-signup .a-btn {\n text-align: inherit;\n}\n@media only screen and (max-width: 37.5em) {\n .o-email-signup .a-label--heading {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-featured-content-module {\n min-height: 220px;\n position: relative;\n border: 1px solid var(--gray-40);\n background-color: var(--gray-5);\n}\n.o-featured-content-module__text {\n padding-top: 1.875em;\n padding-bottom: 1.875em;\n}\n.o-featured-content-module__img {\n display: block;\n}\n@media only screen and (max-width: 37.5em) {\n .o-featured-content-module__text {\n padding-right: 0.9375em;\n padding-left: 0.9375em;\n }\n .o-featured-content-module__visual {\n padding-right: 0.9375em;\n padding-bottom: 0.9375em;\n padding-left: 0.9375em;\n }\n .o-featured-content-module__img {\n margin-right: auto;\n margin-left: auto;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .o-featured-content-module__text {\n padding-right: 300px;\n padding-left: 1.875em;\n }\n .o-featured-content-module__visual {\n height: 100%;\n overflow: hidden;\n position: absolute;\n top: 0;\n right: 0;\n width: 270px;\n }\n .o-featured-content-module__img {\n max-width: none;\n height: 100%;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-hero {\n background-color: var(--gray-5);\n}\n.m-hero__wrapper {\n display: grid;\n max-width: 1200px;\n margin: 0 auto;\n padding-top: 30px;\n padding-bottom: 30px;\n}\n.m-hero__text {\n padding-right: 15px;\n padding-left: 15px;\n}\n.m-hero__heading {\n font-size: 2.125em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.4411764706em;\n}\np + .m-hero__heading, ul + .m-hero__heading, ol + .m-hero__heading, dl + .m-hero__heading, figure + .m-hero__heading, img + .m-hero__heading, table + .m-hero__heading, blockquote + .m-hero__heading {\n margin-top: 1.7647058824em;\n}\n.m-hero__subhead {\n font-size: 22px;\n line-height: 1.25;\n}\n.m-hero__image-wrapper {\n box-sizing: border-box;\n overflow: hidden;\n}\n.m-hero__image {\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n width: 100%;\n display: none;\n}\n@supports (display: grid) {\n .m-hero__image {\n display: block;\n }\n}\n.m-hero--knockout {\n background-color: var(--gray);\n color: var(--white);\n}\n.m-hero--overlay .m-hero__wrapper {\n background-position: center;\n background-repeat: no-repeat;\n background-size: cover;\n}\n.m-hero--jumbo, .m-hero--50-50 {\n background-color: var(--white);\n}\n.m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n margin-top: 0;\n margin-bottom: 15px;\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n}\n@media only screen and (max-width: 37.5em) {\n .m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n font-size: 1.125em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n font-size: 1.375em;\n font-weight: normal;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.6818181818em;\n }\n p + .m-hero--jumbo .m-hero__subhead, ul + .m-hero--jumbo .m-hero__subhead, ol + .m-hero--jumbo .m-hero__subhead, dl + .m-hero--jumbo .m-hero__subhead, figure + .m-hero--jumbo .m-hero__subhead, img + .m-hero--jumbo .m-hero__subhead, table + .m-hero--jumbo .m-hero__subhead, blockquote + .m-hero--jumbo .m-hero__subhead, h1 + .m-hero--jumbo .m-hero__subhead, .h1 + .m-hero--jumbo .m-hero__subhead, h2 + .m-hero--jumbo .m-hero__subhead, .h2 + .m-hero--jumbo .m-hero__subhead, h4 + .m-hero--jumbo .m-hero__subhead, .h4 + .m-hero--jumbo .m-hero__subhead, h5 + .m-hero--jumbo .m-hero__subhead, .h5 + .m-hero--jumbo .m-hero__subhead, h6 + .m-hero--jumbo .m-hero__subhead, .h6 + .m-hero--jumbo .m-hero__subhead, p + .m-hero--50-50 .m-hero__subhead, ul + .m-hero--50-50 .m-hero__subhead, ol + .m-hero--50-50 .m-hero__subhead, dl + .m-hero--50-50 .m-hero__subhead, figure + .m-hero--50-50 .m-hero__subhead, img + .m-hero--50-50 .m-hero__subhead, table + .m-hero--50-50 .m-hero__subhead, blockquote + .m-hero--50-50 .m-hero__subhead, h1 + .m-hero--50-50 .m-hero__subhead, .h1 + .m-hero--50-50 .m-hero__subhead, h2 + .m-hero--50-50 .m-hero__subhead, .h2 + .m-hero--50-50 .m-hero__subhead, h4 + .m-hero--50-50 .m-hero__subhead, .h4 + .m-hero--50-50 .m-hero__subhead, h5 + .m-hero--50-50 .m-hero__subhead, .h5 + .m-hero--50-50 .m-hero__subhead, h6 + .m-hero--50-50 .m-hero__subhead, .h6 + .m-hero--50-50 .m-hero__subhead {\n margin-top: 1.3636363636em;\n }\n}\n@media only screen and (min-width: 63.8125em) {\n .m-hero--jumbo .m-hero__wrapper, .m-hero--50-50 .m-hero__wrapper {\n min-height: 285px;\n }\n .m-hero--jumbo .m-hero__heading, .m-hero--50-50 .m-hero__heading {\n margin-bottom: 0.4166666667em;\n font-size: 3em;\n font-weight: normal;\n line-height: 1.25;\n }\n .m-hero--jumbo .m-hero__subhead, .m-hero--50-50 .m-hero__subhead {\n font-size: 1.625em;\n font-weight: 400;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.5769230769em;\n }\n p + .m-hero--jumbo .m-hero__subhead, ul + .m-hero--jumbo .m-hero__subhead, ol + .m-hero--jumbo .m-hero__subhead, dl + .m-hero--jumbo .m-hero__subhead, figure + .m-hero--jumbo .m-hero__subhead, img + .m-hero--jumbo .m-hero__subhead, table + .m-hero--jumbo .m-hero__subhead, blockquote + .m-hero--jumbo .m-hero__subhead, p + .m-hero--50-50 .m-hero__subhead, ul + .m-hero--50-50 .m-hero__subhead, ol + .m-hero--50-50 .m-hero__subhead, dl + .m-hero--50-50 .m-hero__subhead, figure + .m-hero--50-50 .m-hero__subhead, img + .m-hero--50-50 .m-hero__subhead, table + .m-hero--50-50 .m-hero__subhead, blockquote + .m-hero--50-50 .m-hero__subhead {\n margin-top: 1.7307692308em;\n }\n h1 + .m-hero--jumbo .m-hero__subhead, .h1 + .m-hero--jumbo .m-hero__subhead, h3 + .m-hero--jumbo .m-hero__subhead, .h3 + .m-hero--jumbo .m-hero__subhead, h4 + .m-hero--jumbo .m-hero__subhead, .h4 + .m-hero--jumbo .m-hero__subhead, h5 + .m-hero--jumbo .m-hero__subhead, .h5 + .m-hero--jumbo .m-hero__subhead, h6 + .m-hero--jumbo .m-hero__subhead, .h6 + .m-hero--jumbo .m-hero__subhead, h1 + .m-hero--50-50 .m-hero__subhead, .h1 + .m-hero--50-50 .m-hero__subhead, h3 + .m-hero--50-50 .m-hero__subhead, .h3 + .m-hero--50-50 .m-hero__subhead, h4 + .m-hero--50-50 .m-hero__subhead, .h4 + .m-hero--50-50 .m-hero__subhead, h5 + .m-hero--50-50 .m-hero__subhead, .h5 + .m-hero--50-50 .m-hero__subhead, h6 + .m-hero--50-50 .m-hero__subhead, .h6 + .m-hero--50-50 .m-hero__subhead {\n margin-top: 1.1538461538em;\n }\n}\n\n@media only screen and (max-width: 37.5em) {\n .m-hero__image-wrapper {\n margin-top: 1.875em;\n }\n .m-hero--overlay .m-hero__wrapper {\n background-image: none !important;\n }\n .m-hero--jumbo .m-hero__wrapper {\n padding-bottom: 0;\n }\n}\n@media only screen and (max-width: 56.25em) {\n .m-hero__heading {\n font-size: 1.625em;\n font-weight: 600;\n letter-spacing: inherit;\n line-height: 1.25;\n text-transform: inherit;\n margin-bottom: 0.5769230769em;\n }\n p + .m-hero__heading, ul + .m-hero__heading, ol + .m-hero__heading, dl + .m-hero__heading, figure + .m-hero__heading, img + .m-hero__heading, table + .m-hero__heading, blockquote + .m-hero__heading {\n margin-top: 1.7307692308em;\n }\n h1 + .m-hero__heading, .h1 + .m-hero__heading, h3 + .m-hero__heading, .h3 + .m-hero__heading, h4 + .m-hero__heading, .h4 + .m-hero__heading, h5 + .m-hero__heading, .h5 + .m-hero__heading, h6 + .m-hero__heading, .h6 + .m-hero__heading {\n margin-top: 1.1538461538em;\n }\n .m-hero__subhead {\n font-size: 18px;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .m-hero__wrapper {\n grid-template-columns: 7fr 5fr;\n padding-right: 15px;\n padding-left: 15px;\n min-height: 225px;\n }\n .m-hero__text {\n margin: auto 0;\n }\n .m-hero__image-wrapper {\n padding-right: 15px;\n padding-left: 15px;\n display: flex;\n align-items: center;\n }\n .m-hero--bleeding .m-hero__image-wrapper {\n width: 100%;\n margin-top: -2.8125em;\n margin-bottom: -2.8125em;\n }\n .m-hero--bleeding .m-hero__image {\n padding-bottom: 0 !important;\n height: 100%;\n width: 100%;\n background-size: cover;\n }\n .m-hero--overlay .m-hero__image {\n display: none;\n }\n .m-hero--jumbo .m-hero__wrapper {\n background-position: 50%;\n background-repeat: no-repeat;\n background-size: cover;\n }\n .m-hero--jumbo .m-hero__image {\n display: none;\n }\n .m-hero--50-50 .m-hero__wrapper {\n grid-template-columns: 1fr 1fr;\n border: 1px solid var(--gray-40);\n border-top: none;\n background-position: 100% center;\n background-repeat: no-repeat;\n background-size: 50%;\n }\n .m-hero--50-50 .m-hero__image {\n display: none;\n }\n}\n@media only screen and (min-width: 63.8125em) {\n .m-hero__wrapper {\n padding-top: 2.8125em;\n padding-bottom: 2.8125em;\n min-height: 195px;\n }\n .m-hero--bleeding .m-hero__image-wrapper {\n margin-top: -2.8125em;\n margin-bottom: -2.8125em;\n }\n .m-hero--50-50 .m-hero__wrapper {\n min-height: 345px;\n }\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Layout Helpers\n ========================================================================== */\n.content-l {\n position: relative;\n}\n@media only screen and (min-width: 37.5625em) {\n .content-l {\n display: block;\n position: relative;\n margin-left: -15px;\n margin-right: -15px;\n }\n}\n\n@media only screen and (max-width: 37.5em) {\n .content-l__col + .content-l__col {\n margin-top: 1.875em;\n }\n}\n\n@media only screen and (min-width: 37.5625em) {\n .content-l__col-1 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 100%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-1-2 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 50%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-1-3 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 33.3333333333%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-2-3 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 66.6666666667%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-3-8 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 37.5%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-5-8 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 62.5%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-1-4 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 25%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content-l__col-3-4 {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 75%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n}\n.content__line {\n height: 1px;\n background: var(--gray-40);\n}\n\n.content__main dd,\n.content__main dt,\n.content__main h3,\n.content__main h4,\n.content__main h5,\n.content__main h6,\n.content__main li,\n.content__main p,\n.content__main label,\n.content__intro dd,\n.content__intro dt,\n.content__intro h3,\n.content__intro h4,\n.content__intro h5,\n.content__intro h6,\n.content__intro li,\n.content__intro p,\n.content__intro label {\n max-width: 41.875rem;\n}\n\n.content__intro,\n.content__main,\n.content__sidebar {\n padding: 1.875em 0.9375em;\n}\n@media only screen and (min-width: 37.5625em) {\n .content__intro,\n .content__main,\n .content__sidebar {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 100%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n padding: 2.8125em 0.9375em;\n }\n}\n@media only screen and (min-width: 56.3125em) {\n .content__intro,\n .content__main,\n .content__sidebar {\n padding: 2.8125em 0;\n }\n}\n\n@media only screen and (min-width: 56.3125em) {\n .content__intro {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 100%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n}\n@media only screen and (min-width: 56.3125em) {\n .content--1-3 .content__sidebar {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 25%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n padding-right: 1.875em;\n }\n .content--1-3 .content__main {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 75%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n position: relative;\n }\n .content--1-3 .content__main::after {\n content: \"\";\n border-left: 1px solid var(--gray-40);\n position: absolute;\n top: 2.8125em;\n bottom: 0;\n left: -1.875em;\n }\n .content--2-1 .content__main {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 66.6666666667%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n }\n .content--2-1 .content__main::after {\n right: -1.875em;\n }\n .content--2-1 .content__sidebar {\n /* stylelint-enable */\n display: inline-block;\n box-sizing: border-box;\n width: 33.3333333333%;\n border: solid transparent;\n border-width: 0 15px;\n margin-right: -0.25em;\n vertical-align: top;\n padding-left: 1.875em;\n }\n}\n.content--flush-bottom {\n padding-bottom: 0;\n}\n\n@media only screen and (max-width: 56.25em) {\n .content--flush-top-on-small {\n padding-top: 0;\n }\n}\n\n@media only screen and (max-width: 56.25em) {\n .content--flush-all-on-small {\n padding: 0;\n border: none;\n }\n}\n\n.block {\n margin-top: 3.75em;\n margin-bottom: 3.75em;\n}\n.block--border-top {\n border-top: 1px solid var(--gray-40);\n}\n.block--border-right {\n border-right: 1px solid var(--gray-40);\n}\n.block--border-bottom {\n border-bottom: 1px solid var(--gray-40);\n}\n.block--border-left {\n border-left: 1px solid var(--gray-40);\n}\n.block--border {\n border: 1px solid var(--gray-40);\n}\n.block--flush-top {\n margin-top: 0 !important;\n}\n.block--flush-top.block--border, .block--flush-top.block--border-top {\n border-top: none;\n}\n.block--flush-bottom {\n margin-bottom: 0 !important;\n}\n.block--flush-bottom.block--border, .block--flush-bottom.block--border-bottom {\n border-bottom: none;\n}\n.block--flush-sides {\n margin-right: -15px;\n margin-left: -15px;\n}\n@media only screen and (max-width: 37.5em) {\n .block--flush-sides.block--border, .block--flush-sides.block--border-right, .block--flush-sides.block--border-left {\n border-right: none;\n border-left: none;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .block--flush-sides {\n margin-right: -30px;\n margin-left: -30px;\n }\n}\n.block--flush {\n margin-top: 0 !important;\n margin-right: -15px;\n margin-bottom: 0 !important;\n margin-left: -15px;\n}\n.block--flush.block--border, .block--flush.block--border-top, .block--flush.block--border-bottom {\n border-top: none;\n border-bottom: none;\n}\n@media only screen and (max-width: 37.5em) {\n .block--flush.block--border, .block--flush.block--border-right, .block--flush.block--border-left {\n border-right: none;\n border-left: none;\n }\n}\n@media only screen and (min-width: 37.5625em) {\n .block--flush {\n margin-right: -30px;\n margin-left: -30px;\n }\n}\n.block--bg {\n padding: 1.875em 0.9375em;\n padding-bottom: 3.75em;\n background: var(--gray-5);\n}\n@media only screen and (min-width: 37.5625em) {\n .block--bg {\n padding: 2.8125em 1.875em;\n }\n}\n.block--padded-top {\n padding-top: 1.875em;\n margin-top: 1.875em;\n}\n.block--padded-bottom {\n padding-bottom: 1.875em;\n margin-bottom: 1.875em;\n}\n.block--sub {\n margin-top: 1.875em;\n margin-bottom: 1.875em;\n}\n\n@media only screen and (min-width: 56.3125em) {\n .wrapper {\n /* stylelint-enable */\n max-width: 1200px;\n padding-right: 15px;\n padding-left: 15px;\n margin: 0 auto;\n clear: both;\n }\n}\n.wrapper--match-content {\n padding-left: 15px;\n padding-right: 15px;\n}\n@media only screen and (min-width: 37.5625em) {\n .wrapper--match-content {\n padding-left: 30px;\n padding-right: 30px;\n max-width: 1200px;\n }\n}", ".o-text-introduction {\n margin-top: 0;\n margin-bottom: 60px;\n}\n.o-text-introduction > * {\n margin-top: 0;\n margin-bottom: 15px;\n max-width: 41.875rem;\n}", "/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.o-well {\n box-sizing: border-box;\n padding: 1.875em 0.9375em;\n border: 1px solid var(--gray-40);\n background-color: var(--gray-5);\n}\n@media only screen and (min-width: 37.5625em) {\n .o-well {\n padding-left: 1.875em;\n padding-right: 1.875em;\n }\n}"],
5
5
  "mappings": "gGAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA",
6
6
  "names": ["card_exports", "__export", "card_default", "card_group_exports", "__export", "card_group_default", "email_signup_exports", "__export", "email_signup_default", "featured_content_module_exports", "__export", "featured_content_module_default", "hero_exports", "__export", "hero_default", "layout_exports", "__export", "layout_default", "text_introduction_exports", "__export", "text_introduction_default", "well_exports", "__export", "well_default"]
7
7
  }
package/dist/components/cfpb-notifications/index.css CHANGED
@@ -1,2 +1,2 @@
1
- .o-banner{padding:.9375em 0;background:var(--gold-10);border-bottom:1px solid var(--gray-40);font-size:.875em}.o-banner .m-notification{border:none;padding:0}.o-banner .m-notification__icon{left:0;top:0}.o-banner--dark{background:var(--teal-dark);border-color:var(--teal-dark);color:var(--white)}.o-banner--dark .m-notification{background:var(--teal-dark)}.o-banner--dark .m-notification .cf-icon-svg{fill:var(--white)}.o-banner--dark .m-notification a{color:var(--white);border-color:var(--white)}.o-banner--dark .m-notification a:visited,.o-banner--dark .m-notification a.visited{border-color:var(--teal-40);color:var(--teal-40)}.o-banner--dark .m-notification a:hover,.o-banner--dark .m-notification a.hover{border-color:var(--gray-15);color:var(--gray-15)}.o-banner--dark .m-notification a:focus,.o-banner--dark .m-notification a.focus{border-color:var(--white);color:var(--white)}.o-banner--dark .m-notification a:active,.o-banner--dark .m-notification a.active{border-color:var(--gray-15);color:var(--gray-15)}@media only screen and (min-width: 37.5625em){.o-banner{font-size:1em}}.no-js .u-js-only,.u-hide-if-js{display:none!important}.no-js .u-hide-if-js{display:block!important}.u-clearfix:after{content:"";display:table;clear:both}.u-visually-hidden{position:absolute;width:1px;height:1px;border:0;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0)}@media only screen and (max-width: 37.5em){.u-hide-on-mobile{display:none}}.u-show-on-mobile{display:none}@media only screen and (max-width: 37.5em){.u-show-on-mobile{display:block}}.u-hidden{display:none!important}.u-invisible{visibility:hidden}.u-right{float:right}.u-nowrap{white-space:nowrap}.u-flexible-container{position:relative;padding-bottom:56.25%;height:0}.u-flexible-container__inner{position:absolute;top:0;left:0;width:100%;height:100%}.u-flexible-container--4-3{position:relative;padding-bottom:75%;height:0}.u-mt0{margin-top:0!important}.u-mb0{margin-bottom:0!important}.u-mt5{margin-top:5px!important}.u-mb5{margin-bottom:5px!important}.u-mt10{margin-top:10px!important}.u-mb10{margin-bottom:10px!important}.u-mt15{margin-top:15px!important}.u-mb15{margin-bottom:15px!important}.u-mt20{margin-top:20px!important}.u-mb20{margin-bottom:20px!important}.u-mt30{margin-top:30px!important}.u-mb30{margin-bottom:30px!important}.u-mt45{margin-top:45px!important}.u-mb45{margin-bottom:45px!important}.u-mt60{margin-top:60px!important}.u-mb60{margin-bottom:60px!important}.u-w100pct{width:100%}.u-w90pct{width:90%}.u-w80pct{width:80%}.u-w70pct{width:70%}.u-w60pct{width:60%}.u-w50pct{width:50%}.u-w40pct{width:40%}.u-w30pct{width:30%}.u-w20pct{width:20%}.u-w10pct{width:10%}.u-w75pct{width:75%}.u-w65pct{width:65%}.u-w25pct{width:25%}.u-w15pct{width:15%}.u-w66pct{width:66.6666666667%}.u-w33pct{width:33.3333333333%}small,.u-small-text{font-size:.875em}small--subtle,.u-small-text--subtle{color:var(--gray)}.u-no-animation{transition-duration:0s!important}.u-move-transition{transition:transform .25s ease-out}.u-move-to-origin{transform:translateZ(0)}.u-move-left{transform:translate3d(-100%,0,0)}.u-move-left-2x{transform:translate3d(-200%,0,0)}.u-move-left-3x{transform:translate3d(-300%,0,0)}.u-move-right{transform:translate3d(100%,0,0)}.u-move-up{transform:translate3d(0,-100%,0)}.u-alpha-transition{transition:opacity .25s linear}.u-alpha-100{opacity:1}.u-alpha-0{opacity:0}.u-max-height-transition{overflow:hidden;contain:paint;transition:max-height .2s ease-out}.u-max-height-zero{max-height:0!important}.u-max-height-summary{max-height:88px!important}.m-notification{display:none;padding:.9375rem;background:var(--gray-5);border:1px solid var(--gray-40)}.m-notification>.cf-icon-svg{flex:none;fill:var(--gray)}.m-notification--success{background:var(--green-10);border-color:var(--green)}.m-notification--success>.cf-icon-svg{fill:var(--green)}.m-notification--warning{background:var(--gold-10);border-color:var(--gold)}.m-notification--warning>.cf-icon-svg{fill:var(--gold)}.m-notification--error{background:var(--red-10);border-color:var(--red)}.m-notification--error>.cf-icon-svg{fill:var(--red)}.m-notification--success a,.m-notification--warning a,.m-notification--error a{color:var(--pacific-mid-dark);border-color:var(--pacific-mid-dark)}.m-notification--success a:visited,.m-notification--success a.visited,.m-notification--warning a:visited,.m-notification--warning a.visited,.m-notification--error a:visited,.m-notification--error a.visited{border-color:var(--teal);color:var(--teal)}.m-notification--success a:hover,.m-notification--success a.hover,.m-notification--warning a:hover,.m-notification--warning a.hover,.m-notification--error a:hover,.m-notification--error a.hover{border-color:var(--pacific-dark);color:var(--pacific-dark)}.m-notification--success a:focus,.m-notification--success a.focus,.m-notification--warning a:focus,.m-notification--warning a.focus,.m-notification--error a:focus,.m-notification--error a.focus{border-color:var(--pacific-mid-dark);color:var(--pacific-mid-dark)}.m-notification--success a:active,.m-notification--success a.active,.m-notification--warning a:active,.m-notification--warning a.active,.m-notification--error a:active,.m-notification--error a.active{border-color:var(--navy-dark);color:var(--navy-dark)}.m-notification--visible{display:flex;gap:.3125rem}.m-notification__content{max-width:41.875rem}.cf-icon-svg+.m-notification__content{flex-grow:1}.m-notification__message{font-size:1rem;line-height:1.25;font-weight:500}@media only screen and (min-width: 37.5625em){.m-notification__message{font-size:1.125rem}}.m-notification__explanation{margin-top:.3125rem;margin-bottom:.9375rem}.m-notification__message+.m-list{margin-top:.9375rem}@media only screen and (min-width: 37.5625em){.m-notification .cf-icon-svg{font-size:1.125rem}.m-notification__explanation{margin-bottom:0}.m-notification .m-list{margin-top:.3125rem}.m-notification .m-list__item{margin-bottom:.3125rem}}html[lang=ar] .m-notification .cf-icon-svg+.m-notification__content{padding-left:initial;padding-right:1.5625rem}html[lang=ar] .m-notification .m-list{padding-right:0}
1
+ .o-banner{padding:.9375em 0;background:var(--gold-10);border-bottom:1px solid var(--gray-40);font-size:.875em}.o-banner .m-notification{border:none;padding:0}.o-banner .m-notification__icon{left:0;top:0}.o-banner--dark{background:var(--teal-dark);border-color:var(--teal-dark);color:var(--white)}.o-banner--dark .m-notification{background:var(--teal-dark)}.o-banner--dark .m-notification .cf-icon-svg{fill:var(--white)}.o-banner--dark .m-notification a{color:var(--white);border-color:var(--white)}.o-banner--dark .m-notification a:visited,.o-banner--dark .m-notification a.visited{border-color:var(--teal-40);color:var(--teal-40)}.o-banner--dark .m-notification a:hover,.o-banner--dark .m-notification a.hover{border-color:var(--gray-15);color:var(--gray-15)}.o-banner--dark .m-notification a:focus,.o-banner--dark .m-notification a.focus{border-color:var(--white);color:var(--white)}.o-banner--dark .m-notification a:active,.o-banner--dark .m-notification a.active{border-color:var(--gray-15);color:var(--gray-15)}@media only screen and (min-width: 37.5625em){.o-banner{font-size:1em}}:root{--select-border-default: var(--gray-60);--select-border-width-default: 1px;--select-border-error: var(--red);--select-border-width-error: 2px;--select-border-hover-default: var(--pacific);--select-border-focus-default: var(--pacific);--select-bg-disabled-default: var(--gray-10);--select-icon-bg-default: var(--gray-10);--select-text-disabled-default: var(--gray-dark)}.no-js .u-js-only,.u-hide-if-js{display:none!important}.no-js .u-hide-if-js{display:block!important}.u-clearfix:after{content:"";display:table;clear:both}.u-visually-hidden{position:absolute;width:1px;height:1px;border:0;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0)}@media only screen and (max-width: 37.5em){.u-hide-on-mobile{display:none}}@media only screen and (min-width: 37.5625em){.u-show-on-mobile{display:none}}.u-hidden{display:none!important}.u-invisible{visibility:hidden}.u-right{float:right}.u-nowrap{white-space:nowrap}.u-flexible-container{position:relative;padding-bottom:56.25%;height:0}.u-flexible-container__inner{position:absolute;top:0;left:0;width:100%;height:100%}.u-flexible-container--4-3{position:relative;padding-bottom:75%;height:0}.u-mt0{margin-top:0!important}.u-mb0{margin-bottom:0!important}.u-mt5{margin-top:5px!important}.u-mb5{margin-bottom:5px!important}.u-mt10{margin-top:10px!important}.u-mb10{margin-bottom:10px!important}.u-mt15{margin-top:15px!important}.u-mb15{margin-bottom:15px!important}.u-mt20{margin-top:20px!important}.u-mb20{margin-bottom:20px!important}.u-mt30{margin-top:30px!important}.u-mb30{margin-bottom:30px!important}.u-mt45{margin-top:45px!important}.u-mb45{margin-bottom:45px!important}.u-mt60{margin-top:60px!important}.u-mb60{margin-bottom:60px!important}.u-w100pct{width:100%}.u-w90pct{width:90%}.u-w80pct{width:80%}.u-w70pct{width:70%}.u-w60pct{width:60%}.u-w50pct{width:50%}.u-w40pct{width:40%}.u-w30pct{width:30%}.u-w20pct{width:20%}.u-w10pct{width:10%}.u-w75pct{width:75%}.u-w65pct{width:65%}.u-w25pct{width:25%}.u-w15pct{width:15%}.u-w66pct{width:66.6666666667%}.u-w33pct{width:33.3333333333%}small,.u-small-text{font-size:.875em}small--subtle,.u-small-text--subtle{color:var(--gray)}.u-no-animation{transition-duration:0s!important}.u-move-transition{transition:transform .25s ease-out}.u-move-to-origin{transform:translateZ(0)}.u-move-left{transform:translate3d(-100%,0,0)}.u-move-left-2x{transform:translate3d(-200%,0,0)}.u-move-left-3x{transform:translate3d(-300%,0,0)}.u-move-right{transform:translate3d(100%,0,0)}.u-move-up{transform:translate3d(0,-100%,0)}.u-alpha-transition{transition:opacity .25s linear}.u-alpha-100{opacity:1}.u-alpha-0{opacity:0}.u-max-height-transition{overflow:hidden;contain:paint;transition:max-height .2s ease-out}.u-max-height-zero{max-height:0!important}.u-max-height-summary{max-height:88px!important}.m-notification{display:none;padding:.9375rem;background:var(--gray-5);border:1px solid var(--gray-40)}.m-notification>.cf-icon-svg{flex:none;fill:var(--gray)}.m-notification--success{background:var(--green-10);border-color:var(--green)}.m-notification--success>.cf-icon-svg{fill:var(--green)}.m-notification--warning{background:var(--gold-10);border-color:var(--gold)}.m-notification--warning>.cf-icon-svg{fill:var(--gold)}.m-notification--error{background:var(--red-10);border-color:var(--red)}.m-notification--error>.cf-icon-svg{fill:var(--red)}.m-notification--success a,.m-notification--warning a,.m-notification--error a{color:var(--pacific-mid-dark);border-color:var(--pacific-mid-dark)}.m-notification--success a:visited,.m-notification--success a.visited,.m-notification--warning a:visited,.m-notification--warning a.visited,.m-notification--error a:visited,.m-notification--error a.visited{border-color:var(--teal);color:var(--teal)}.m-notification--success a:hover,.m-notification--success a.hover,.m-notification--warning a:hover,.m-notification--warning a.hover,.m-notification--error a:hover,.m-notification--error a.hover{border-color:var(--pacific-dark);color:var(--pacific-dark)}.m-notification--success a:focus,.m-notification--success a.focus,.m-notification--warning a:focus,.m-notification--warning a.focus,.m-notification--error a:focus,.m-notification--error a.focus{border-color:var(--pacific-mid-dark);color:var(--pacific-mid-dark)}.m-notification--success a:active,.m-notification--success a.active,.m-notification--warning a:active,.m-notification--warning a.active,.m-notification--error a:active,.m-notification--error a.active{border-color:var(--navy-dark);color:var(--navy-dark)}.m-notification--visible{display:flex;gap:.3125rem}.m-notification__content{max-width:41.875rem}.cf-icon-svg+.m-notification__content{flex-grow:1}.m-notification__message{font-size:1rem;line-height:1.25;font-weight:500}@media only screen and (min-width: 37.5625em){.m-notification__message{font-size:1.125rem}}.m-notification__explanation{margin-top:.3125rem;margin-bottom:.9375rem}.m-notification__message+.m-list{margin-top:.9375rem}@media only screen and (min-width: 37.5625em){.m-notification .cf-icon-svg{font-size:1.125rem}.m-notification__explanation{margin-bottom:0}.m-notification .m-list{margin-top:.3125rem}.m-notification .m-list__item{margin-bottom:.3125rem}}html[lang=ar] .m-notification .cf-icon-svg+.m-notification__content{padding-left:initial;padding-right:1.5625rem}html[lang=ar] .m-notification .m-list{padding-right:0}
2
2
  /*# sourceMappingURL=index.css.map */
package/dist/components/cfpb-notifications/index.css.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/banner.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/notification.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only screen and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only screen and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only screen and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n padding: 0.9375rem;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n flex: none;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: flex;\n gap: 0.3125rem;\n}\n.m-notification__content {\n max-width: 41.875rem;\n}\n.cf-icon-svg + .m-notification__content {\n flex-grow: 1;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n@media only screen and (min-width: 37.5625em) {\n .u-show-on-mobile {\n display: none;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only screen and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n@media only screen and (min-width: 37.5625em) {\n .u-show-on-mobile {\n display: none;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n padding: 0.9375rem;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n flex: none;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: flex;\n gap: 0.3125rem;\n}\n.m-notification__content {\n max-width: 41.875rem;\n}\n.cf-icon-svg + .m-notification__content {\n flex-grow: 1;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/components/cfpb-notifications/index.js CHANGED
@@ -1,2 +1,2 @@
1
- (()=>{var r=Object.defineProperty;var n=(e,o)=>{for(var a in o)r(e,a,{get:o[a],enumerable:!0})};var t={};n(t,{default:()=>l});var l={};var i={};n(i,{default:()=>c});var c={};})();
1
+ (()=>{var r=Object.defineProperty;var o=(n,e)=>{for(var a in e)r(n,a,{get:e[a],enumerable:!0})};var t={};o(t,{default:()=>l});var l={};var i={};o(i,{default:()=>m});var m={};})();
2
2
  //# sourceMappingURL=index.js.map
package/dist/components/cfpb-notifications/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/banner.scss", "../../../../../packages/cfpb-design-system/src/components/cfpb-notifications/notification.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only screen and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only screen and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n.u-show-on-mobile {\n display: none;\n}\n@media only screen and (max-width: 37.5em) {\n .u-show-on-mobile {\n display: block;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n padding: 0.9375rem;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n flex: none;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: flex;\n gap: 0.3125rem;\n}\n.m-notification__content {\n max-width: 41.875rem;\n}\n.cf-icon-svg + .m-notification__content {\n flex-grow: 1;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n@media only screen and (min-width: 37.5625em) {\n .u-show-on-mobile {\n display: none;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.o-banner {\n padding: 0.9375em 0;\n background: var(--gold-10);\n border-bottom: 1px solid var(--gray-40);\n font-size: 0.875em;\n}\n.o-banner .m-notification {\n border: none;\n padding: 0;\n}\n.o-banner .m-notification__icon {\n left: 0;\n top: 0;\n}\n.o-banner--dark {\n background: var(--teal-dark);\n border-color: var(--teal-dark);\n color: var(--white);\n}\n.o-banner--dark .m-notification {\n background: var(--teal-dark);\n}\n.o-banner--dark .m-notification .cf-icon-svg {\n fill: var(--white);\n}\n.o-banner--dark .m-notification a {\n color: var(--white);\n border-color: var(--white);\n}\n.o-banner--dark .m-notification a:visited, .o-banner--dark .m-notification a.visited {\n border-color: var(--teal-40);\n color: var(--teal-40);\n}\n.o-banner--dark .m-notification a:hover, .o-banner--dark .m-notification a.hover {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n.o-banner--dark .m-notification a:focus, .o-banner--dark .m-notification a.focus {\n border-color: var(--white);\n color: var(--white);\n}\n.o-banner--dark .m-notification a:active, .o-banner--dark .m-notification a.active {\n border-color: var(--gray-15);\n color: var(--gray-15);\n}\n@media only screen and (min-width: 37.5625em) {\n .o-banner {\n font-size: 1em;\n }\n}", "/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Utilities\n ========================================================================== */\n.no-js .u-js-only {\n display: none !important;\n}\n\n.u-hide-if-js {\n display: none !important;\n}\n.no-js .u-hide-if-js {\n display: block !important;\n}\n\n.u-clearfix::after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.u-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n border: 0;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n}\n\n@media only screen and (max-width: 37.5em) {\n .u-hide-on-mobile {\n display: none;\n }\n}\n\n@media only screen and (min-width: 37.5625em) {\n .u-show-on-mobile {\n display: none;\n }\n}\n\n.u-hidden {\n display: none !important;\n}\n\n.u-invisible {\n visibility: hidden;\n}\n\n.u-right {\n float: right;\n}\n\n.u-nowrap {\n white-space: nowrap;\n}\n\n/* stylelint-disable selector-class-pattern */\n.u-flexible-container {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n}\n.u-flexible-container__inner {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n.u-flexible-container--4-3 {\n /* stylelint-enable */\n position: relative;\n padding-bottom: 75%;\n height: 0;\n}\n\n/*\nLink text and underline, unless otherwise specified.\n$c: Link color.\n$v: Link visited color.\n$h: Link hover color.\n$f: Link focus color.\n$a: Link active color.\n\n// Separate out a different underline color.\n$bc: Link underline color.\n$bv: Link underline visited color.\n$bh: Link underline hover color.\n$bf: Link underline focus color.\n$ba: Link underline active color.\n*/\n/* stylelint-disable selector-class-pattern */\n/* stylelint-enable */\n.u-mt0 {\n margin-top: 0 !important;\n}\n\n.u-mb0 {\n margin-bottom: 0 !important;\n}\n\n.u-mt5 {\n margin-top: 5px !important;\n}\n\n.u-mb5 {\n margin-bottom: 5px !important;\n}\n\n.u-mt10 {\n margin-top: 10px !important;\n}\n\n.u-mb10 {\n margin-bottom: 10px !important;\n}\n\n.u-mt15 {\n margin-top: 15px !important;\n}\n\n.u-mb15 {\n margin-bottom: 15px !important;\n}\n\n.u-mt20 {\n margin-top: 20px !important;\n}\n\n.u-mb20 {\n margin-bottom: 20px !important;\n}\n\n.u-mt30 {\n margin-top: 30px !important;\n}\n\n.u-mb30 {\n margin-bottom: 30px !important;\n}\n\n.u-mt45 {\n margin-top: 45px !important;\n}\n\n.u-mb45 {\n margin-bottom: 45px !important;\n}\n\n.u-mt60 {\n margin-top: 60px !important;\n}\n\n.u-mb60 {\n margin-bottom: 60px !important;\n}\n\n.u-w100pct {\n width: 100%;\n}\n\n.u-w90pct {\n width: 90%;\n}\n\n.u-w80pct {\n width: 80%;\n}\n\n.u-w70pct {\n width: 70%;\n}\n\n.u-w60pct {\n width: 60%;\n}\n\n.u-w50pct {\n width: 50%;\n}\n\n.u-w40pct {\n width: 40%;\n}\n\n.u-w30pct {\n width: 30%;\n}\n\n.u-w20pct {\n width: 20%;\n}\n\n.u-w10pct {\n width: 10%;\n}\n\n.u-w75pct {\n width: 75%;\n}\n\n.u-w65pct {\n width: 65%;\n}\n\n.u-w25pct {\n width: 25%;\n}\n\n.u-w15pct {\n width: 15%;\n}\n\n.u-w66pct {\n width: 66.6666666667%;\n}\n\n.u-w33pct {\n width: 33.3333333333%;\n}\n\n/* stylelint-disable selector-class-pattern */\nsmall,\n.u-small-text {\n /* stylelint-enable */\n font-size: 0.875em;\n}\nsmall--subtle,\n.u-small-text--subtle {\n color: var(--gray);\n}\n\n/* ==========================================================================\n Utility classes for transitions.\n\n Adds transitions utilty classes for transform, opacity,\n and for the removing the transition duration.\n ========================================================================== */\n.u-no-animation {\n transition-duration: 0s !important;\n}\n\n.u-move-transition {\n transition: transform 0.25s ease-out;\n}\n\n.u-move-to-origin {\n transform: translate3d(0, 0, 0);\n}\n\n.u-move-left {\n transform: translate3d(-100%, 0, 0);\n}\n\n.u-move-left-2x {\n transform: translate3d(-200%, 0, 0);\n}\n\n.u-move-left-3x {\n transform: translate3d(-300%, 0, 0);\n}\n\n.u-move-right {\n transform: translate3d(100%, 0, 0);\n}\n\n.u-move-up {\n transform: translate3d(0, -100%, 0);\n}\n\n.u-alpha-transition {\n transition: opacity 0.25s linear;\n}\n\n.u-alpha-100 {\n opacity: 1;\n}\n\n.u-alpha-0 {\n opacity: 0;\n}\n\n.u-max-height-transition {\n overflow: hidden;\n contain: paint;\n transition: max-height 0.2s ease-out;\n}\n\n/*\n.u-max-height-default {\n This class is kept for documentation completeness.\n The actual max-height is set in the JavaScript,\n so that we know what the actual height of the content is for easing purposes.\n}\n*/\n.u-max-height-zero {\n max-height: 0 !important;\n}\n\n.u-max-height-summary {\n /* The value set here should show 4 lines of text at our standard 16px\n base font size. The calculation comes from the following:\n 88px = 16 * 5.5em.\n 5.5em = base-line-height (22px) * 4 / base-font-size (16px)\n */\n max-height: 88px !important;\n}\n\n.m-notification {\n display: none;\n padding: 0.9375rem;\n background: var(--gray-5);\n border: 1px solid var(--gray-40);\n}\n.m-notification > .cf-icon-svg {\n flex: none;\n fill: var(--gray);\n}\n.m-notification--success {\n background: var(--green-10);\n border-color: var(--green);\n}\n.m-notification--success > .cf-icon-svg {\n fill: var(--green);\n}\n.m-notification--warning {\n background: var(--gold-10);\n border-color: var(--gold);\n}\n.m-notification--warning > .cf-icon-svg {\n fill: var(--gold);\n}\n.m-notification--error {\n background: var(--red-10);\n border-color: var(--red);\n}\n.m-notification--error > .cf-icon-svg {\n fill: var(--red);\n}\n.m-notification--success a, .m-notification--warning a, .m-notification--error a {\n color: var(--pacific-mid-dark);\n border-color: var(--pacific-mid-dark);\n}\n.m-notification--success a:visited, .m-notification--success a.visited, .m-notification--warning a:visited, .m-notification--warning a.visited, .m-notification--error a:visited, .m-notification--error a.visited {\n border-color: var(--teal);\n color: var(--teal);\n}\n.m-notification--success a:hover, .m-notification--success a.hover, .m-notification--warning a:hover, .m-notification--warning a.hover, .m-notification--error a:hover, .m-notification--error a.hover {\n border-color: var(--pacific-dark);\n color: var(--pacific-dark);\n}\n.m-notification--success a:focus, .m-notification--success a.focus, .m-notification--warning a:focus, .m-notification--warning a.focus, .m-notification--error a:focus, .m-notification--error a.focus {\n border-color: var(--pacific-mid-dark);\n color: var(--pacific-mid-dark);\n}\n.m-notification--success a:active, .m-notification--success a.active, .m-notification--warning a:active, .m-notification--warning a.active, .m-notification--error a:active, .m-notification--error a.active {\n border-color: var(--navy-dark);\n color: var(--navy-dark);\n}\n.m-notification--visible {\n display: flex;\n gap: 0.3125rem;\n}\n.m-notification__content {\n max-width: 41.875rem;\n}\n.cf-icon-svg + .m-notification__content {\n flex-grow: 1;\n}\n.m-notification__message {\n font-size: 1rem;\n line-height: 1.25;\n font-weight: 500;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification__message {\n font-size: 1.125rem;\n }\n}\n.m-notification__explanation {\n margin-top: 0.3125rem;\n margin-bottom: 0.9375rem;\n}\n.m-notification__message + .m-list {\n margin-top: 0.9375rem;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-notification .cf-icon-svg {\n font-size: 1.125rem;\n }\n .m-notification__explanation {\n margin-bottom: 0;\n }\n .m-notification .m-list {\n margin-top: 0.3125rem;\n }\n .m-notification .m-list__item {\n margin-bottom: 0.3125rem;\n }\n}\n\nhtml[lang=ar] .m-notification .cf-icon-svg + .m-notification__content {\n padding-left: initial;\n padding-right: 1.5625rem;\n}\nhtml[lang=ar] .m-notification .m-list {\n padding-right: 0;\n}"],
5
5
  "mappings": "gGAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA,GCAA,IAAAC,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA",
6
6
  "names": ["banner_exports", "__export", "banner_default", "notification_exports", "__export", "notification_default"]
7
7
  }
package/dist/components/cfpb-pagination/index.css CHANGED
@@ -1,2 +1,2 @@
1
- .m-pagination{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"pag-btn-prev . pag-btn-next" "pag-form pag-form pag-form";row-gap:.9375rem}.m-pagination__form{grid-area:pag-form;display:flex;flex-flow:wrap;place-content:center;gap:.625rem;padding:.3125rem;border-radius:.25rem;background:var(--gray-5);color:var(--gray)}.m-pagination__current-page{width:2.8125rem;font-weight:500;text-align:right}.m-pagination__label{display:contents;white-space:nowrap}.m-pagination__btn-prev{grid-area:pag-btn-prev;z-index:1}.m-pagination__btn-next{grid-area:pag-btn-next;z-index:1}@media only screen and (min-width: 37.5625em){.m-pagination{grid-template-areas:"pag-btn-prev pag-form pag-btn-next"}.m-pagination__btn-prev{border-top-right-radius:0;border-bottom-right-radius:0}.m-pagination__btn-next{border-top-left-radius:0;border-bottom-left-radius:0}}
1
+ :root{--select-border-default: var(--gray-60);--select-border-width-default: 1px;--select-border-error: var(--red);--select-border-width-error: 2px;--select-border-hover-default: var(--pacific);--select-border-focus-default: var(--pacific);--select-bg-disabled-default: var(--gray-10);--select-icon-bg-default: var(--gray-10);--select-text-disabled-default: var(--gray-dark)}.m-pagination{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"pag-btn-prev . pag-btn-next" "pag-form pag-form pag-form";row-gap:.9375rem}.m-pagination__form{grid-area:pag-form;display:flex;flex-flow:wrap;place-content:center;gap:.625rem;padding:.3125rem;border-radius:.25rem;background:var(--gray-5);color:var(--gray)}.m-pagination__current-page{width:2.8125rem;font-weight:500;text-align:right}.m-pagination__label{display:contents;white-space:nowrap}.m-pagination__btn-prev{grid-area:pag-btn-prev;z-index:1}.m-pagination__btn-next{grid-area:pag-btn-next;z-index:1}@media only screen and (min-width: 37.5625em){.m-pagination{grid-template-areas:"pag-btn-prev pag-form pag-btn-next"}.m-pagination__btn-prev{border-top-right-radius:0;border-bottom-right-radius:0}.m-pagination__btn-next{border-top-left-radius:0;border-bottom-left-radius:0}}
2
2
  /*# sourceMappingURL=index.css.map */
package/dist/components/cfpb-pagination/index.css.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-pagination/pagination.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Pagination Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-pagination {\n display: grid;\n grid-template-columns: auto 1fr auto;\n grid-template-areas: \"pag-btn-prev . pag-btn-next\" \"pag-form pag-form pag-form\";\n row-gap: 0.9375rem;\n}\n.m-pagination__form {\n grid-area: pag-form;\n display: flex;\n flex-flow: wrap;\n place-content: center;\n gap: 0.625rem;\n padding: 0.3125rem;\n border-radius: 0.25rem;\n background: var(--gray-5);\n color: var(--gray);\n}\n.m-pagination__current-page {\n width: 2.8125rem;\n font-weight: 500;\n text-align: right;\n}\n.m-pagination__label {\n display: contents;\n white-space: nowrap;\n}\n.m-pagination__btn-prev {\n grid-area: pag-btn-prev;\n z-index: 1;\n}\n.m-pagination__btn-next {\n grid-area: pag-btn-next;\n z-index: 1;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-pagination {\n grid-template-areas: \"pag-btn-prev pag-form pag-btn-next\";\n }\n .m-pagination__btn-prev {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n .m-pagination__btn-next {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n}"],
5
- "mappings": "AA+BA,CAAC,aACC,QAAS,KACT,sBAAuB,KAAK,IAAI,KAChC,oBAAqB,8BAA8B,6BACnD,QAAS,QACX,CACA,CAAC,mBACC,UAAW,SACX,QAAS,KACT,UAAW,KACX,cAAe,OACf,IAAK,QA1CP,QA2CW,SA3CX,cA4CiB,OACf,WAAY,IAAI,UAChB,MAAO,IAAI,OACb,CACA,CAAC,2BACC,MAAO,UACP,YAAa,IACb,WAAY,KACd,CACA,CAAC,oBACC,QAAS,SACT,YAAa,MACf,CACA,CAAC,uBACC,UAAW,aACX,QAAS,CACX,CACA,CAAC,uBACC,UAAW,aACX,QAAS,CACX,CACA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CAnCD,aAoCG,oBAAqB,oCACvB,CACA,CAZD,uBAaG,wBAAyB,EACzB,2BAA4B,CAC9B,CACA,CAZD,uBAaG,uBAAwB,EACxB,0BAA2B,CAC7B,CACF",
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Pagination Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-pagination {\n display: grid;\n grid-template-columns: auto 1fr auto;\n grid-template-areas: \"pag-btn-prev . pag-btn-next\" \"pag-form pag-form pag-form\";\n row-gap: 0.9375rem;\n}\n.m-pagination__form {\n grid-area: pag-form;\n display: flex;\n flex-flow: wrap;\n place-content: center;\n gap: 0.625rem;\n padding: 0.3125rem;\n border-radius: 0.25rem;\n background: var(--gray-5);\n color: var(--gray);\n}\n.m-pagination__current-page {\n width: 2.8125rem;\n font-weight: 500;\n text-align: right;\n}\n.m-pagination__label {\n display: contents;\n white-space: nowrap;\n}\n.m-pagination__btn-prev {\n grid-area: pag-btn-prev;\n z-index: 1;\n}\n.m-pagination__btn-next {\n grid-area: pag-btn-next;\n z-index: 1;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-pagination {\n grid-template-areas: \"pag-btn-prev pag-form pag-btn-next\";\n }\n .m-pagination__btn-prev {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n .m-pagination__btn-next {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n}"],
5
+ "mappings": "AAQA,MACE,yBAAyB,IAAI,WAC7B,+BAA+B,IAC/B,uBAAuB,IAAI,OAC3B,6BAA6B,IAC7B,+BAA+B,IAAI,WACnC,+BAA+B,IAAI,WACnC,8BAA8B,IAAI,WAClC,0BAA0B,IAAI,WAC9B,gCAAgC,IAAI,YACtC,CAyBA,CAAC,aACC,QAAS,KACT,sBAAuB,KAAK,IAAI,KAChC,oBAAqB,8BAA8B,6BACnD,QAAS,QACX,CACA,CAAC,mBACC,UAAW,SACX,QAAS,KACT,UAAW,KACX,cAAe,OACf,IAAK,QAtDP,QAuDW,SAvDX,cAwDiB,OACf,WAAY,IAAI,UAChB,MAAO,IAAI,OACb,CACA,CAAC,2BACC,MAAO,UACP,YAAa,IACb,WAAY,KACd,CACA,CAAC,oBACC,QAAS,SACT,YAAa,MACf,CACA,CAAC,uBACC,UAAW,aACX,QAAS,CACX,CACA,CAAC,uBACC,UAAW,aACX,QAAS,CACX,CACA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CAnCD,aAoCG,oBAAqB,oCACvB,CACA,CAZD,uBAaG,wBAAyB,EACzB,2BAA4B,CAC9B,CACA,CAZD,uBAaG,uBAAwB,EACxB,0BAA2B,CAC7B,CACF",
6
6
  "names": []
7
7
  }
package/dist/components/cfpb-pagination/index.js CHANGED
@@ -1,2 +1,2 @@
1
- (()=>{var r=Object.defineProperty;var n=(i,a)=>{for(var t in a)r(i,t,{get:a[t],enumerable:!0})};var e={};n(e,{default:()=>o});var o={};})();
1
+ (()=>{var i=Object.defineProperty;var n=(r,a)=>{for(var t in a)i(r,t,{get:a[t],enumerable:!0})};var e={};n(e,{default:()=>l});var l={};})();
2
2
  //# sourceMappingURL=index.js.map
package/dist/components/cfpb-pagination/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-pagination/pagination.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Pagination Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-pagination {\n display: grid;\n grid-template-columns: auto 1fr auto;\n grid-template-areas: \"pag-btn-prev . pag-btn-next\" \"pag-form pag-form pag-form\";\n row-gap: 0.9375rem;\n}\n.m-pagination__form {\n grid-area: pag-form;\n display: flex;\n flex-flow: wrap;\n place-content: center;\n gap: 0.625rem;\n padding: 0.3125rem;\n border-radius: 0.25rem;\n background: var(--gray-5);\n color: var(--gray);\n}\n.m-pagination__current-page {\n width: 2.8125rem;\n font-weight: 500;\n text-align: right;\n}\n.m-pagination__label {\n display: contents;\n white-space: nowrap;\n}\n.m-pagination__btn-prev {\n grid-area: pag-btn-prev;\n z-index: 1;\n}\n.m-pagination__btn-next {\n grid-area: pag-btn-next;\n z-index: 1;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-pagination {\n grid-template-areas: \"pag-btn-prev pag-form pag-btn-next\";\n }\n .m-pagination__btn-prev {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n .m-pagination__btn-next {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n}"],
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Pagination Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n.m-pagination {\n display: grid;\n grid-template-columns: auto 1fr auto;\n grid-template-areas: \"pag-btn-prev . pag-btn-next\" \"pag-form pag-form pag-form\";\n row-gap: 0.9375rem;\n}\n.m-pagination__form {\n grid-area: pag-form;\n display: flex;\n flex-flow: wrap;\n place-content: center;\n gap: 0.625rem;\n padding: 0.3125rem;\n border-radius: 0.25rem;\n background: var(--gray-5);\n color: var(--gray);\n}\n.m-pagination__current-page {\n width: 2.8125rem;\n font-weight: 500;\n text-align: right;\n}\n.m-pagination__label {\n display: contents;\n white-space: nowrap;\n}\n.m-pagination__btn-prev {\n grid-area: pag-btn-prev;\n z-index: 1;\n}\n.m-pagination__btn-next {\n grid-area: pag-btn-next;\n z-index: 1;\n}\n@media only screen and (min-width: 37.5625em) {\n .m-pagination {\n grid-template-areas: \"pag-btn-prev pag-form pag-btn-next\";\n }\n .m-pagination__btn-prev {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n .m-pagination__btn-next {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n}"],
5
5
  "mappings": "gGAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,IAAAA,EAAA",
6
6
  "names": ["pagination_exports", "__export", "pagination_default"]
7
7
  }
package/dist/components/cfpb-tables/index.css CHANGED
@@ -1,2 +1,2 @@
1
- .o-table__cell--right-align{text-align:right}.o-table--scrolling{box-sizing:border-box;overflow-y:hidden}.o-table--scrolling table{border:1px solid var(--gray-40)}.o-table--scrolling table>tbody>tr:nth-child(2n)>th,.o-table--scrolling table>tbody>tr:nth-child(2n)>td{background:var(--gray-5)}@media only screen and (min-width: 37.5625em){.o-table--striped>tbody>tr:nth-child(2n)>th,.o-table--striped>tbody>tr:nth-child(2n)>td{background:var(--gray-5)}}@media only screen and (max-width: 600px){.o-table{width:100%}.o-table--striped tr:nth-child(2n)>th,.o-table--striped tr:nth-child(2n)>td{background:var(--white)}.o-table--stack-on-small{border-top:1px solid var(--gray-40)}.o-table--stack-on-small tr,.o-table--stack-on-small td,.o-table--stack-on-small [data-display-table=row],.o-table--stack-on-small [data-display-table=cell]{display:block}.o-table--stack-on-small th,.o-table--stack-on-small td,.o-table--stack-on-small [data-display-table=cell]{padding-right:0;padding-left:0;width:100%}.o-table--stack-on-small>thead,.o-table--stack-on-small [data-display-table=thead]{display:none}.o-table--stack-on-small td[data-label]:before{display:block;margin-top:0;margin-bottom:.3125em;content:attr(data-label);line-height:1.83333333;font-size:.875em;font-weight:600;letter-spacing:1px;text-transform:uppercase}.o-table--stack-on-small td:last-child,.o-table--stack-on-small [data-display-table=cell]:last-child{margin-bottom:1.875em}}
1
+ :root{--select-border-default: var(--gray-60);--select-border-width-default: 1px;--select-border-error: var(--red);--select-border-width-error: 2px;--select-border-hover-default: var(--pacific);--select-border-focus-default: var(--pacific);--select-bg-disabled-default: var(--gray-10);--select-icon-bg-default: var(--gray-10);--select-text-disabled-default: var(--gray-dark)}.o-table__cell--right-align{text-align:right}.o-table--scrolling{box-sizing:border-box;overflow-y:hidden}.o-table--scrolling table{border:1px solid var(--gray-40)}.o-table--scrolling table>tbody>tr:nth-child(2n)>th,.o-table--scrolling table>tbody>tr:nth-child(2n)>td{background:var(--gray-5)}@media only screen and (min-width: 37.5625em){.o-table--striped>tbody>tr:nth-child(2n)>th,.o-table--striped>tbody>tr:nth-child(2n)>td{background:var(--gray-5)}}@media only screen and (max-width: 600px){.o-table{width:100%}.o-table--striped tr:nth-child(2n)>th,.o-table--striped tr:nth-child(2n)>td{background:var(--white)}.o-table--stack-on-small{border-top:1px solid var(--gray-40)}.o-table--stack-on-small tr,.o-table--stack-on-small td,.o-table--stack-on-small [data-display-table=row],.o-table--stack-on-small [data-display-table=cell]{display:block}.o-table--stack-on-small th,.o-table--stack-on-small td,.o-table--stack-on-small [data-display-table=cell]{padding-right:0;padding-left:0;width:100%}.o-table--stack-on-small>thead,.o-table--stack-on-small [data-display-table=thead]{display:none}.o-table--stack-on-small td[data-label]:before{display:block;margin-top:0;margin-bottom:.3125em;content:attr(data-label);line-height:1.83333333;font-size:.875em;font-weight:600;letter-spacing:1px;text-transform:uppercase}.o-table--stack-on-small td:last-child,.o-table--stack-on-small [data-display-table=cell]:last-child{margin-bottom:1.875em}}
2
2
  /*# sourceMappingURL=index.css.map */
package/dist/components/cfpb-tables/index.css.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../packages/cfpb-design-system/src/components/cfpb-tables/table.scss"],
4
- "sourcesContent": ["/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Table Styling\n ========================================================================== */\n.o-table__cell--right-align {\n text-align: right;\n}\n\n.o-table--scrolling {\n box-sizing: border-box;\n overflow-y: hidden;\n}\n.o-table--scrolling table {\n border: 1px solid var(--gray-40);\n}\n.o-table--scrolling table > tbody > tr:nth-child(even) > th, .o-table--scrolling table > tbody > tr:nth-child(even) > td {\n background: var(--gray-5);\n}\n\n@media only screen and (min-width: 37.5625em) {\n .o-table--striped > tbody > tr:nth-child(even) > th, .o-table--striped > tbody > tr:nth-child(even) > td {\n background: var(--gray-5);\n }\n}\n@media only screen and (max-width: 600px) {\n .o-table {\n width: 100%;\n }\n .o-table--striped tr:nth-child(even) > th, .o-table--striped tr:nth-child(even) > td {\n background: var(--white);\n }\n .o-table--stack-on-small {\n border-top: 1px solid var(--gray-40);\n }\n .o-table--stack-on-small tr,\n .o-table--stack-on-small td,\n .o-table--stack-on-small [data-display-table=row],\n .o-table--stack-on-small [data-display-table=cell] {\n display: block;\n }\n .o-table--stack-on-small th,\n .o-table--stack-on-small td,\n .o-table--stack-on-small [data-display-table=cell] {\n padding-right: 0;\n padding-left: 0;\n width: 100%;\n }\n .o-table--stack-on-small > thead,\n .o-table--stack-on-small [data-display-table=thead] {\n display: none;\n }\n .o-table--stack-on-small td[data-label]::before {\n display: block;\n margin-top: 0;\n margin-bottom: 0.3125em;\n content: attr(data-label);\n line-height: 1.83333333;\n font-size: 0.875em;\n font-weight: 600;\n letter-spacing: 1px;\n text-transform: uppercase;\n }\n .o-table--stack-on-small td:last-child,\n .o-table--stack-on-small [data-display-table=cell]:last-child {\n margin-bottom: 1.875em;\n }\n}"],
5
- "mappings": "AA+BA,CAAC,2BACC,WAAY,KACd,CAEA,CAAC,mBACC,WAAY,WACZ,WAAY,MACd,CACA,CAJC,mBAImB,MAClB,OAAQ,IAAI,MAAM,IAAI,UACxB,CACA,CAPC,mBAOmB,KAAM,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GAAI,CAP5D,mBAOgF,KAAM,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GACpH,WAAY,IAAI,SAClB,CAEA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CAAC,gBAAiB,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GAAI,CAApD,gBAAsE,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GACpG,WAAY,IAAI,SAClB,CACF,CACA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,OACjC,CAAC,QACC,MAAO,IACT,CACA,CARC,iBAQiB,EAAE,cAAiB,CAAE,GAAI,CAR1C,iBAQ4D,EAAE,cAAiB,CAAE,GAChF,WAAY,IAAI,QAClB,CACA,CAAC,wBACC,WAAY,IAAI,MAAM,IAAI,UAC5B,CACA,CAHC,wBAGwB,GACzB,CAJC,wBAIwB,GACzB,CALC,wBAKwB,CAAC,wBAC1B,CANC,wBAMwB,CAAC,yBACxB,QAAS,KACX,CACA,CATC,wBASwB,GACzB,CAVC,wBAUwB,GACzB,CAXC,wBAWwB,CAAC,yBACxB,cAAe,EACf,aAAc,EACd,MAAO,IACT,CACA,CAhBC,uBAgBwB,CAAE,MAC3B,CAjBC,wBAiBwB,CAAC,0BACxB,QAAS,IACX,CACA,CApBC,wBAoBwB,EAAE,CAAC,WAAW,QACrC,QAAS,MACT,WAAY,EACZ,cAAe,QACf,QAAS,KAAK,YACd,YAAa,WACb,UAAW,OACX,YAAa,IACb,eAAgB,IAChB,eAAgB,SAClB,CACA,CA/BC,wBA+BwB,EAAE,YAC3B,CAhCC,wBAgCwB,CAAC,wBAAwB,YAChD,cAAe,OACjB,CACF",
4
+ "sourcesContent": ["/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --select-border-default: var(--gray-60);\n --select-border-width-default: 1px;\n --select-border-error: var(--red);\n --select-border-width-error: 2px;\n --select-border-hover-default: var(--pacific);\n --select-border-focus-default: var(--pacific);\n --select-bg-disabled-default: var(--gray-10);\n --select-icon-bg-default: var(--gray-10);\n --select-text-disabled-default: var(--gray-dark);\n}\n\n/* ==========================================================================\n Design System\n Breakpoint variables.\n\n NOTE: If any of the values in this file are adjusted,\n they need to be adjusted in vars-breakpoints.js as well.\n ========================================================================== */\n/* ==========================================================================\n Design System\n Grid mixins\n ========================================================================== */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable selector-class-pattern */\n/* ==========================================================================\n Design System\n Media queries\n ========================================================================== */\n/* ==========================================================================\n Design System\n Base styles\n ========================================================================== */\n/* ==========================================================================\n Design System\n Table Styling\n ========================================================================== */\n.o-table__cell--right-align {\n text-align: right;\n}\n\n.o-table--scrolling {\n box-sizing: border-box;\n overflow-y: hidden;\n}\n.o-table--scrolling table {\n border: 1px solid var(--gray-40);\n}\n.o-table--scrolling table > tbody > tr:nth-child(even) > th, .o-table--scrolling table > tbody > tr:nth-child(even) > td {\n background: var(--gray-5);\n}\n\n@media only screen and (min-width: 37.5625em) {\n .o-table--striped > tbody > tr:nth-child(even) > th, .o-table--striped > tbody > tr:nth-child(even) > td {\n background: var(--gray-5);\n }\n}\n@media only screen and (max-width: 600px) {\n .o-table {\n width: 100%;\n }\n .o-table--striped tr:nth-child(even) > th, .o-table--striped tr:nth-child(even) > td {\n background: var(--white);\n }\n .o-table--stack-on-small {\n border-top: 1px solid var(--gray-40);\n }\n .o-table--stack-on-small tr,\n .o-table--stack-on-small td,\n .o-table--stack-on-small [data-display-table=row],\n .o-table--stack-on-small [data-display-table=cell] {\n display: block;\n }\n .o-table--stack-on-small th,\n .o-table--stack-on-small td,\n .o-table--stack-on-small [data-display-table=cell] {\n padding-right: 0;\n padding-left: 0;\n width: 100%;\n }\n .o-table--stack-on-small > thead,\n .o-table--stack-on-small [data-display-table=thead] {\n display: none;\n }\n .o-table--stack-on-small td[data-label]::before {\n display: block;\n margin-top: 0;\n margin-bottom: 0.3125em;\n content: attr(data-label);\n line-height: 1.83333333;\n font-size: 0.875em;\n font-weight: 600;\n letter-spacing: 1px;\n text-transform: uppercase;\n }\n .o-table--stack-on-small td:last-child,\n .o-table--stack-on-small [data-display-table=cell]:last-child {\n margin-bottom: 1.875em;\n }\n}"],
5
+ "mappings": "AAIA,MACE,yBAAyB,IAAI,WAC7B,+BAA+B,IAC/B,uBAAuB,IAAI,OAC3B,6BAA6B,IAC7B,+BAA+B,IAAI,WACnC,+BAA+B,IAAI,WACnC,8BAA8B,IAAI,WAClC,0BAA0B,IAAI,WAC9B,gCAAgC,IAAI,YACtC,CA6BA,CAAC,2BACC,WAAY,KACd,CAEA,CAAC,mBACC,WAAY,WACZ,WAAY,MACd,CACA,CAJC,mBAImB,MAClB,OAAQ,IAAI,MAAM,IAAI,UACxB,CACA,CAPC,mBAOmB,KAAM,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GAAI,CAP5D,mBAOgF,KAAM,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GACpH,WAAY,IAAI,SAClB,CAEA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CAAC,gBAAiB,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GAAI,CAApD,gBAAsE,CAAE,KAAM,CAAE,EAAE,cAAiB,CAAE,GACpG,WAAY,IAAI,SAClB,CACF,CACA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,OACjC,CAAC,QACC,MAAO,IACT,CACA,CARC,iBAQiB,EAAE,cAAiB,CAAE,GAAI,CAR1C,iBAQ4D,EAAE,cAAiB,CAAE,GAChF,WAAY,IAAI,QAClB,CACA,CAAC,wBACC,WAAY,IAAI,MAAM,IAAI,UAC5B,CACA,CAHC,wBAGwB,GACzB,CAJC,wBAIwB,GACzB,CALC,wBAKwB,CAAC,wBAC1B,CANC,wBAMwB,CAAC,yBACxB,QAAS,KACX,CACA,CATC,wBASwB,GACzB,CAVC,wBAUwB,GACzB,CAXC,wBAWwB,CAAC,yBACxB,cAAe,EACf,aAAc,EACd,MAAO,IACT,CACA,CAhBC,uBAgBwB,CAAE,MAC3B,CAjBC,wBAiBwB,CAAC,0BACxB,QAAS,IACX,CACA,CApBC,wBAoBwB,EAAE,CAAC,WAAW,QACrC,QAAS,MACT,WAAY,EACZ,cAAe,QACf,QAAS,KAAK,YACd,YAAa,WACb,UAAW,OACX,YAAa,IACb,eAAgB,IAChB,eAAgB,SAClB,CACA,CA/BC,wBA+BwB,EAAE,YAC3B,CAhCC,wBAgCwB,CAAC,wBAAwB,YAChD,cAAe,OACjB,CACF",
6
6
  "names": []
7
7
  }
package/dist/components/cfpb-tables/index.js CHANGED
@@ -1,2 +1,2 @@
1
- (()=>{var s=Object.defineProperty;var o=(l,a)=>{for(var e in a)s(l,e,{get:a[e],enumerable:!0})};var t={};o(t,{default:()=>n});var n={};})();
1
+ (()=>{var s=Object.defineProperty;var r=(l,t)=>{for(var a in t)s(l,a,{get:t[a],enumerable:!0})};var e={};r(e,{default:()=>d});var d={};})();
2
2
  //# sourceMappingURL=index.js.map