UNPKG

@cfpb/cfpb-design-system

Version:

CFPB's UI framework

3 lines (2 loc) 6.06 kB
.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 all 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 all and (max-width: 37.5em){.u-hide-on-mobile{display:none}}.u-show-on-mobile{display:none}@media only all and (max-width: 37.5em){.u-show-on-mobile{display:block}}.u-hidden{display:none!important}.u-invisible{visibility:hidden}.u-inline-block{display:inline-block}.u-right{float:right}.u-break-word{word-break:break-all}.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-w25pct{width:25%}.u-w66pct{width:66.6666666667%}.u-w33pct{width:33.3333333333%}small,.u-small-text{font-size:.875em}.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;position:relative;padding:15px;background:var(--gray-5);border:1px solid var(--gray-40)}.m-notification>.cf-icon-svg{position:absolute;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:block}.cf-icon-svg+.m-notification__content{padding-left:1.5625rem}.m-notification__message{font-size:1rem;line-height:1.25;font-weight:500}@media only all 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 all 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} /*# sourceMappingURL=index.css.map */