@cfpb/cfpb-design-system 3.10.0 → 3.12.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.
- package/CHANGELOG.md +94 -51
- package/dist/base/index.css +1 -1
- package/dist/base/index.css.map +2 -2
- package/dist/base/index.js +1 -1
- package/dist/base/index.js.map +1 -1
- package/dist/components/cfpb-buttons/index.css +1 -1
- package/dist/components/cfpb-buttons/index.css.map +2 -2
- package/dist/components/cfpb-buttons/index.js +1 -1
- package/dist/components/cfpb-buttons/index.js.map +1 -1
- package/dist/components/cfpb-expandables/index.css +1 -1
- package/dist/components/cfpb-expandables/index.css.map +2 -2
- package/dist/components/cfpb-expandables/index.js +1 -1
- package/dist/components/cfpb-expandables/index.js.map +1 -1
- package/dist/components/cfpb-forms/index.css +1 -1
- package/dist/components/cfpb-forms/index.css.map +2 -2
- package/dist/components/cfpb-forms/index.js +1 -1
- package/dist/components/cfpb-forms/index.js.map +1 -1
- package/dist/components/cfpb-icons/index.css +1 -1
- package/dist/components/cfpb-icons/index.css.map +2 -2
- package/dist/components/cfpb-icons/index.js +1 -1
- package/dist/components/cfpb-icons/index.js.map +1 -1
- package/dist/components/cfpb-layout/index.css +1 -1
- package/dist/components/cfpb-layout/index.css.map +2 -2
- package/dist/components/cfpb-layout/index.js +1 -1
- package/dist/components/cfpb-layout/index.js.map +1 -1
- package/dist/components/cfpb-notifications/index.css +1 -1
- package/dist/components/cfpb-notifications/index.css.map +2 -2
- package/dist/components/cfpb-notifications/index.js +1 -1
- package/dist/components/cfpb-notifications/index.js.map +1 -1
- package/dist/components/cfpb-pagination/index.css +1 -1
- package/dist/components/cfpb-pagination/index.css.map +2 -2
- package/dist/components/cfpb-pagination/index.js +1 -1
- package/dist/components/cfpb-pagination/index.js.map +1 -1
- package/dist/components/cfpb-tables/index.css +1 -1
- package/dist/components/cfpb-tables/index.css.map +2 -2
- package/dist/components/cfpb-tables/index.js +1 -1
- package/dist/components/cfpb-tables/index.js.map +1 -1
- package/dist/components/cfpb-tooltips/index.css +1 -1
- package/dist/components/cfpb-tooltips/index.css.map +2 -2
- package/dist/components/cfpb-tooltips/index.js +1 -1
- package/dist/components/cfpb-tooltips/index.js.map +1 -1
- package/dist/components/cfpb-typography/index.css +1 -1
- package/dist/components/cfpb-typography/index.css.map +2 -2
- package/dist/components/cfpb-typography/index.js +1 -1
- package/dist/components/cfpb-typography/index.js.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.css.map +2 -2
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/utilities/index.css +1 -1
- package/dist/utilities/index.css.map +2 -2
- package/dist/utilities/index.js +1 -1
- package/dist/utilities/index.js.map +1 -1
- package/package.json +1 -1
- package/src/abstracts/vars.scss +51 -40
- package/src/components/cfpb-forms/form-alert.scss +8 -6
- package/src/components/cfpb-forms/form-field.scss +76 -156
- package/src/components/cfpb-forms/multiselect.scss +4 -5
- package/src/components/cfpb-forms/select.scss +25 -11
- package/src/components/cfpb-forms/text-input.scss +34 -98
- package/src/utilities/utilities.scss +18 -5
|
@@ -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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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
|
}
|
|
@@ -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}}
|
|
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{--input-text-default: var(--black);--input-text-disabled-default: var(--gray-dark);--input-text-placeholder-default: var(--gray-dark);--input-border-default: var(--gray-60);--input-border-disabled: var(--gray-60);--input-border-success: var(--green);--input-border-warning: var(--gold);--input-border-error: var(--red);--input-border-hover-default: var(--pacific);--input-border-focus-default: var(--pacific);--input-bg-default: var(--white);--input-bg-disabled-default: var(--gray-10);--form-alert-icon-color-default: var(--gray);--form-alert-icon-color-success: var(--green);--form-alert-icon-color-warning: var(--gold);--form-alert-icon-color-error: var(--red);--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);--choice-border-default: var(--gray-60);--choice-border-disabled: var(--gray-60);--choice-border-success: var(--green);--choice-border-warning: var(--gold);--choice-border-error: var(--red);--choice-border-hover-default: var(--pacific);--choice-border-focus-default: var(--pacific);--choice-outline-focus-default: var(--pacific);--choice-bg-default: var(--white);--choice-bg-disabled: var(--gray-10);--choice-bg-selected-default: var(--pacific);--choice-bg-selected-disabled: var(--gray-40);--choice-bg-selected-focus-default: var(--pacific);--choice-label-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}@media screen{.u-print-only{display:none}}@media print{.u-screen-only{display:none}}.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 */
|
|
@@ -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": "
|
|
4
|
+
"sourcesContent": ["/* ==========================================================================\n Design System\n Notifications Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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@media screen {\n .u-print-only {\n display: none;\n }\n}\n\n@media print {\n .u-screen-only {\n display: none;\n }\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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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@media screen {\n .u-print-only {\n display: none;\n }\n}\n\n@media print {\n .u-screen-only {\n display: none;\n }\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": "AA8YA,CAAC,SA9YD,QA+YW,QAAS,EAClB,WAAY,IAAI,WAChB,cAAe,IAAI,MAAM,IAAI,WAC7B,UAAW,MACb,CACA,CANC,SAMS,CAAC,eACT,OAAQ,KArZV,QAsZW,CACX,CACA,CAVC,SAUS,CAAC,qBACT,KAAM,EACN,IAAK,CACP,CACA,CAAC,eACC,WAAY,IAAI,aAChB,aAAc,IAAI,aAClB,MAAO,IAAI,QACb,CACA,CALC,eAKe,CAbL,eAcT,WAAY,IAAI,YAClB,CACA,CARC,eAQe,CAhBL,eAgBqB,CAAC,YAC/B,KAAM,IAAI,QACZ,CACA,CAXC,eAWe,CAnBL,eAmBqB,EAC9B,MAAO,IAAI,SACX,aAAc,IAAI,QACpB,CACA,CAfC,eAee,CAvBL,eAuBqB,CAAC,SAAU,CAf1C,eAe0D,CAvBhD,eAuBgE,CAAC,CAAC,QAC3E,aAAc,IAAI,WAClB,MAAO,IAAI,UACb,CACA,CAnBC,eAmBe,CA3BL,eA2BqB,CAAC,OAAQ,CAnBxC,eAmBwD,CA3B9C,eA2B8D,CAAC,CAAC,MACzE,aAAc,IAAI,WAClB,MAAO,IAAI,UACb,CACA,CAvBC,eAuBe,CA/BL,eA+BqB,CAAC,OAAQ,CAvBxC,eAuBwD,CA/B9C,eA+B8D,CAAC,CAAC,MACzE,aAAc,IAAI,SAClB,MAAO,IAAI,QACb,CACA,CA3BC,eA2Be,CAnCL,eAmCqB,CAAC,QAAS,CA3BzC,eA2ByD,CAnC/C,eAmC+D,CAAC,CAAC,OAC1E,aAAc,IAAI,WAClB,MAAO,IAAI,UACb,CACA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CA9CD,SA+CG,UAAW,GACb,CACF,CCvbA,MACE,sBAAsB,IAAI,SAC1B,+BAA+B,IAAI,aACnC,kCAAkC,IAAI,aACtC,wBAAwB,IAAI,WAC5B,yBAAyB,IAAI,WAC7B,wBAAwB,IAAI,SAC5B,wBAAwB,IAAI,QAC5B,sBAAsB,IAAI,OAC1B,8BAA8B,IAAI,WAClC,8BAA8B,IAAI,WAClC,oBAAoB,IAAI,SACxB,6BAA6B,IAAI,WACjC,iCAAiC,IAAI,QACrC,iCAAiC,IAAI,SACrC,iCAAiC,IAAI,QACrC,+BAA+B,IAAI,OACnC,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,aACpC,yBAAyB,IAAI,WAC7B,0BAA0B,IAAI,WAC9B,yBAAyB,IAAI,SAC7B,yBAAyB,IAAI,QAC7B,uBAAuB,IAAI,OAC3B,+BAA+B,IAAI,WACnC,+BAA+B,IAAI,WACnC,gCAAgC,IAAI,WACpC,qBAAqB,IAAI,SACzB,sBAAsB,IAAI,WAC1B,8BAA8B,IAAI,WAClC,+BAA+B,IAAI,WACnC,oCAAoC,IAAI,WACxC,iCAAiC,IAAI,YACvC,CA6BA,CAAC,MAAM,CAAC,UAIR,CAAC,aAHC,QAAS,cACX,CAKA,CAPC,MAOM,CAHN,aAIC,QAAS,eACX,CAEA,OAAO,OACL,CAAC,aACC,QAAS,IACX,CACF,CAEA,OAAO,MACL,CAAC,cACC,QAAS,IACX,CACF,CAEA,CAAC,UAAU,OACT,QAAS,GACT,QAAS,MACT,MAAO,IACT,CAEA,CAAC,kBACC,SAAU,SACV,MAAO,IACP,OAAQ,IACR,OAAQ,EA9GV,OA+GU,KA/GV,QAgHW,EACT,SAAU,OACV,KAAM,KAAK,EAAE,EAAE,EAAE,EACnB,CAEA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,QACjC,CAAC,iBACC,QAAS,IACX,CACF,CAEA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CAAC,iBACC,QAAS,IACX,CACF,CAEA,CAAC,SACC,QAAS,cACX,CAEA,CAAC,YACC,WAAY,MACd,CAEA,CAAC,QACC,MAAO,KACT,CAEA,CAAC,SACC,YAAa,MACf,CAGA,CAAC,qBAEC,SAAU,SACV,eAAgB,OAChB,OAAQ,CACV,CACA,CAAC,4BACC,SAAU,SACV,IAAK,EACL,KAAM,EACN,MAAO,KACP,OAAQ,IACV,CACA,CAAC,0BAEC,SAAU,SACV,eAAgB,IAChB,OAAQ,CACV,CAmBA,CAAC,MACC,WAAY,WACd,CAEA,CAAC,MACC,cAAe,WACjB,CAEA,CAAC,MACC,WAAY,aACd,CAEA,CAAC,MACC,cAAe,aACjB,CAEA,CAAC,OACC,WAAY,cACd,CAEA,CAAC,OACC,cAAe,cACjB,CAEA,CAAC,OACC,WAAY,cACd,CAEA,CAAC,OACC,cAAe,cACjB,CAEA,CAAC,OACC,WAAY,cACd,CAEA,CAAC,OACC,cAAe,cACjB,CAEA,CAAC,OACC,WAAY,cACd,CAEA,CAAC,OACC,cAAe,cACjB,CAEA,CAAC,OACC,WAAY,cACd,CAEA,CAAC,OACC,cAAe,cACjB,CAEA,CAAC,OACC,WAAY,cACd,CAEA,CAAC,OACC,cAAe,cACjB,CAEA,CAAC,UACC,MAAO,IACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,GACT,CAEA,CAAC,SACC,MAAO,cACT,CAEA,CAAC,SACC,MAAO,cACT,CAGA,MACA,CAAC,aAEC,UAAW,MACb,CACA,cACA,CAAC,qBACC,MAAO,IAAI,OACb,CAQA,CAAC,eACC,oBAAqB,YACvB,CAEA,CAAC,kBACC,WAAY,UAAU,KAAM,QAC9B,CAEA,CAAC,iBACC,UAAW,WAAkB,EAC/B,CAEA,CAAC,YACC,UAAW,YAAY,KAAK,CAAE,CAAC,CAAE,EACnC,CAEA,CAAC,eACC,UAAW,YAAY,KAAK,CAAE,CAAC,CAAE,EACnC,CAEA,CAAC,eACC,UAAW,YAAY,KAAK,CAAE,CAAC,CAAE,EACnC,CAEA,CAAC,aACC,UAAW,YAAY,IAAI,CAAE,CAAC,CAAE,EAClC,CAEA,CAAC,UACC,UAAW,YAAY,CAAC,CAAE,KAAK,CAAE,EACnC,CAEA,CAAC,mBACC,WAAY,QAAQ,KAAM,MAC5B,CAEA,CAAC,YACC,QAAS,CACX,CAEA,CAAC,UACC,QAAS,CACX,CAEA,CAAC,wBACC,SAAU,OACV,QAAS,MACT,WAAY,WAAW,IAAK,QAC9B,CASA,CAAC,kBACC,WAAY,WACd,CAEA,CAAC,qBAMC,WAAY,cACd,CAEA,CAAC,eACC,QAAS,KA/YX,QAgZW,SACT,WAAY,IAAI,UAChB,OAAQ,IAAI,MAAM,IAAI,UACxB,CACA,CANC,cAMe,CAAE,CAAC,YACjB,KAAM,KACN,KAAM,IAAI,OACZ,CACA,CAAC,wBACC,WAAY,IAAI,YAChB,aAAc,IAAI,QACpB,CACA,CAJC,uBAIwB,CAAE,CARR,YASjB,KAAM,IAAI,QACZ,CACA,CAAC,wBACC,WAAY,IAAI,WAChB,aAAc,IAAI,OACpB,CACA,CAJC,uBAIwB,CAAE,CAfR,YAgBjB,KAAM,IAAI,OACZ,CACA,CAAC,sBACC,WAAY,IAAI,UAChB,aAAc,IAAI,MACpB,CACA,CAJC,qBAIsB,CAAE,CAtBN,YAuBjB,KAAM,IAAI,MACZ,CACA,CArBC,wBAqBwB,EAAG,CAd3B,wBAcoD,EAAG,CAPvD,sBAO8E,EAC7E,MAAO,IAAI,oBACX,aAAc,IAAI,mBACpB,CACA,CAzBC,wBAyBwB,CAAC,SAAU,CAzBnC,wBAyB4D,CAAC,CAAC,QAAS,CAlBvE,wBAkBgG,CAAC,SAAU,CAlB3G,wBAkBoI,CAAC,CAAvE,QAAiF,CAX/I,sBAWsK,CAAC,SAAU,CAXjL,sBAWwM,CAAC,CAA3I,QAC7D,aAAc,IAAI,QAClB,MAAO,IAAI,OACb,CACA,CA7BC,wBA6BwB,CAAC,OAAQ,CA7BjC,wBA6B0D,CAAC,CAAC,MAAO,CAtBnE,wBAsB4F,CAAC,OAAQ,CAtBrG,wBAsB8H,CAAC,CAAnE,MAA2E,CAfvI,sBAe8J,CAAC,OAAQ,CAfvK,sBAe8L,CAAC,CAAnI,MAC3D,aAAc,IAAI,gBAClB,MAAO,IAAI,eACb,CACA,CAjCC,wBAiCwB,CAAC,OAAQ,CAjCjC,wBAiC0D,CAAC,CAAC,MAAO,CA1BnE,wBA0B4F,CAAC,OAAQ,CA1BrG,wBA0B8H,CAAC,CAAnE,MAA2E,CAnBvI,sBAmB8J,CAAC,OAAQ,CAnBvK,sBAmB8L,CAAC,CAAnI,MAC3D,aAAc,IAAI,oBAClB,MAAO,IAAI,mBACb,CACA,CArCC,wBAqCwB,CAAC,QAAS,CArClC,wBAqC2D,CAAC,CAAC,OAAQ,CA9BrE,wBA8B8F,CAAC,QAAS,CA9BxG,wBA8BiI,CAAC,CAArE,OAA8E,CAvB3I,sBAuBkK,CAAC,QAAS,CAvB5K,sBAuBmM,CAAC,CAAvI,OAC5D,aAAc,IAAI,aAClB,MAAO,IAAI,YACb,CACA,CAAC,wBACC,QAAS,KACT,IAAK,QACP,CACA,CAAC,wBACC,UAAW,SACb,CACA,CApDmB,WAoDN,CAAE,CAHd,wBAIC,UAAW,CACb,CACA,CAAC,wBACC,UAAW,KACX,YAAa,KACb,YAAa,GACf,CACA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CAND,wBAOG,UAAW,QACb,CACF,CACA,CAAC,4BACC,WAAY,SACZ,cAAe,QACjB,CACA,CAdC,uBAcwB,CAAE,CAAC,OAC1B,WAAY,QACd,CACA,OAAO,KAAK,OAAO,IAAI,CAAC,SAAS,EAAE,WACjC,CA/ED,eA+EiB,CAzEC,YA0Ef,UAAW,QACb,CACA,CAXD,4BAYG,cAAe,CACjB,CACA,CArFD,eAqFiB,CAVU,OAWxB,WAAY,QACd,CACA,CAxFD,eAwFiB,CAAC,aACf,cAAe,QACjB,CACF,CAEA,IAAI,CAAC,SAAS,CA7Fb,eA6F6B,CAvFX,WAuFwB,CAAE,CAtC5C,wBAuCC,aAAc,QACd,cAAe,SACjB,CACA,IAAI,CAAC,SAAS,CAjGb,eAiG6B,CAtBF,OAuB1B,cAAe,CACjB",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(()=>{var
|
|
1
|
+
(()=>{var n=Object.defineProperty;var r=(o,e)=>{for(var a in e)n(o,a,{get:e[a],enumerable:!0})};var t={};r(t,{default:()=>l});var l={};var i={};r(i,{default:()=>d});var d={};})();
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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@media screen {\n .u-print-only {\n display: none;\n }\n}\n\n@media print {\n .u-screen-only {\n display: none;\n }\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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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@media screen {\n .u-print-only {\n display: none;\n }\n}\n\n@media print {\n .u-screen-only {\n display: none;\n }\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
|
}
|
|
@@ -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{--input-text-default: var(--black);--input-text-disabled-default: var(--gray-dark);--input-text-placeholder-default: var(--gray-dark);--input-border-default: var(--gray-60);--input-border-disabled: var(--gray-60);--input-border-success: var(--green);--input-border-warning: var(--gold);--input-border-error: var(--red);--input-border-hover-default: var(--pacific);--input-border-focus-default: var(--pacific);--input-bg-default: var(--white);--input-bg-disabled-default: var(--gray-10);--form-alert-icon-color-default: var(--gray);--form-alert-icon-color-success: var(--green);--form-alert-icon-color-warning: var(--gold);--form-alert-icon-color-error: var(--red);--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);--choice-border-default: var(--gray-60);--choice-border-disabled: var(--gray-60);--choice-border-success: var(--green);--choice-border-warning: var(--gold);--choice-border-error: var(--red);--choice-border-hover-default: var(--pacific);--choice-border-focus-default: var(--pacific);--choice-outline-focus-default: var(--pacific);--choice-bg-default: var(--white);--choice-bg-disabled: var(--gray-10);--choice-bg-selected-default: var(--pacific);--choice-bg-selected-disabled: var(--gray-40);--choice-bg-selected-focus-default: var(--pacific);--choice-label-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 */
|
|
@@ -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": "
|
|
4
|
+
"sourcesContent": ["/* ==========================================================================\n Design System\n Pagination Styling\n ========================================================================== */\n/* ==========================================================================\n Design System\n Variables\n ========================================================================== */\n:root {\n --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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,sBAAsB,IAAI,SAC1B,+BAA+B,IAAI,aACnC,kCAAkC,IAAI,aACtC,wBAAwB,IAAI,WAC5B,yBAAyB,IAAI,WAC7B,wBAAwB,IAAI,SAC5B,wBAAwB,IAAI,QAC5B,sBAAsB,IAAI,OAC1B,8BAA8B,IAAI,WAClC,8BAA8B,IAAI,WAClC,oBAAoB,IAAI,SACxB,6BAA6B,IAAI,WACjC,iCAAiC,IAAI,QACrC,iCAAiC,IAAI,SACrC,iCAAiC,IAAI,QACrC,+BAA+B,IAAI,OACnC,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,aACpC,yBAAyB,IAAI,WAC7B,0BAA0B,IAAI,WAC9B,yBAAyB,IAAI,SAC7B,yBAAyB,IAAI,QAC7B,uBAAuB,IAAI,OAC3B,+BAA+B,IAAI,WACnC,+BAA+B,IAAI,WACnC,gCAAgC,IAAI,WACpC,qBAAqB,IAAI,SACzB,sBAAsB,IAAI,WAC1B,8BAA8B,IAAI,WAClC,+BAA+B,IAAI,WACnC,oCAAoC,IAAI,WACxC,iCAAiC,IAAI,YACvC,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,QApFP,QAqFW,SArFX,cAsFiB,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
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(()=>{var
|
|
1
|
+
(()=>{var i=Object.defineProperty;var o=(t,r)=>{for(var a in r)i(t,a,{get:r[a],enumerable:!0})};var e={};o(e,{default:()=>l});var l={};})();
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -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 --input-text-default: var(--black);\n --input-text-disabled-default: var(--gray-dark);\n --input-text-placeholder-default: var(--gray-dark);\n --input-border-default: var(--gray-60);\n --input-border-disabled: var(--gray-60);\n --input-border-success: var(--green);\n --input-border-warning: var(--gold);\n --input-border-error: var(--red);\n --input-border-hover-default: var(--pacific);\n --input-border-focus-default: var(--pacific);\n --input-bg-default: var(--white);\n --input-bg-disabled-default: var(--gray-10);\n --form-alert-icon-color-default: var(--gray);\n --form-alert-icon-color-success: var(--green);\n --form-alert-icon-color-warning: var(--gold);\n --form-alert-icon-color-error: var(--red);\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 --choice-border-default: var(--gray-60);\n --choice-border-disabled: var(--gray-60);\n --choice-border-success: var(--green);\n --choice-border-warning: var(--gold);\n --choice-border-error: var(--red);\n --choice-border-hover-default: var(--pacific);\n --choice-border-focus-default: var(--pacific);\n --choice-outline-focus-default: var(--pacific);\n --choice-bg-default: var(--white);\n --choice-bg-disabled: var(--gray-10);\n --choice-bg-selected-default: var(--pacific);\n --choice-bg-selected-disabled: var(--gray-40);\n --choice-bg-selected-focus-default: var(--pacific);\n --choice-label-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
|
}
|