pcoptimum/public/static/css/011f6c1996a28b3efa2d.css

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(1turn)
    }
}

@keyframes fadeInBlockFromNone {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: .01
    }
    to {
        display: block;
        opacity: 1
    }
}

.button--theme-visible-only-onfocus,
.visually-hidden,
.visually-hidden--focusable {
    visibility: hidden
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto
}

sup {
    font-size: .5rem
}

a {
    color: #333
}

body,
html {
    height: 100%;
    margin: 0;
    font-size: 16px;
    font-weight: 400;
    color: #333
}

.button,
body,
html {
    padding: 0;
    font-family: Noir, sans-serif
}

.button {
    font-size: 1rem;
    cursor: pointer;
    border: 0;
    background: transparent;
    transition: color 0, background 0, border 0, fill 0
}

.button:active {
    outline: 0
}

.button:focus {
    outline: 2px solid rgba(33, 96, 169, .5)
}

.button--inline {
    display: inline-block
}

.button--block {
    display: block;
    width: 100%;
    box-sizing: border-box
}

.button--small {
    font-size: .8rem;
    padding: 5px 10px
}

.button--theme-base {
    font-size: 1rem;
    line-height: 1.125;
    min-width: 160px;
    padding: 16px 20px;
    text-decoration: none;
    text-align: center;
    white-space: nowrap;
    color: #fff;
    fill: #fff;
    background: #333;
    border: 1px solid #333;
    border-radius: 0
}

.button--theme-base:focus,
.button--theme-base:hover {
    color: #fff;
    fill: #fff;
    border-color: #888;
    background: #888
}

.button--theme-base:active {
    color: #fff;
    fill: #fff;
    border-color: #333;
    background: #333
}

.button--theme-base:disabled,
.button--theme-base:disabled:active,
.button--theme-base:disabled:hover {
    background: #333;
    border-color: #333;
    cursor: not-allowed;
    opacity: .1
}

.button--theme-base .sprite {
    fill: #fff
}

.button--theme-transparent {
    color: #333;
    fill: #333;
    background: transparent;
    border-color: #666
}

.button--theme-transparent:active,
.button--theme-transparent:focus,
.button--theme-transparent:hover {
    border-color: #333;
    background: #333
}

.button--theme-white {
    color: #333;
    fill: #333;
    background: #fff;
    border-color: #fff
}

.button--theme-white:focus,
.button--theme-white:hover {
    border-color: #666;
    background: #666
}

.button--theme-white:active {
    border-color: #333;
    background: #333
}

.button--theme-transparent-white {
    background: transparent;
    border-color: #fff
}

.button--theme-transparent-white:focus,
.button--theme-transparent-white:hover {
    color: #333;
    fill: #333;
    border-color: #fff;
    background: #fff
}

.button--theme-transparent-white:active {
    color: #333;
    fill: #333;
    border-color: #aaa;
    background: #aaa
}

.button--theme-red {
    background: #333;
    border-color: #333
}

.button--theme-red:focus,
.button--theme-red:hover {
    border-color: #970012;
    background: #970012
}

.button--theme-red:active {
    border-color: #64000c;
    background: #64000c
}

.button--theme-grey {
    background: #ccc;
    border-color: #ccc;
    color: #333;
    fill: #333
}

.button--theme-grey:focus,
.button--theme-grey:hover {
    color: #333;
    fill: #333;
    border-color: #aaa;
    background: #aaa
}

.button--theme-grey:active {
    color: #333;
    fill: #333;
    border-color: #999;
    background: #999
}

.button--theme-link-grey {
    text-decoration: underline;
    color: #333;
    fill: #333
}

.button--theme-link-black {
    color: #191919;
    font-weight: 600
}

.button--theme-link {
    text-decoration: underline;
    color: #2160a9;
    fill: #2160a9
}

.button--theme-link,
.button--theme-link-grey {
    font-size: .875rem
}

.button--theme-link-grey:disabled,
.button--theme-link-grey:disabled:active,
.button--theme-link-grey:disabled:hover,
.button--theme-link:disabled,
.button--theme-link:disabled:active,
.button--theme-link:disabled:hover {
    cursor: not-allowed;
    color: #888;
    fill: #888
}

.button--submitting:disabled,
.button--submitting:disabled:hover {
    opacity: 1;
    background: transparent;
    border: none
}

.button .loading-animation,
.button .password-mask {
    margin: 1px 0
}

.lds__select-atom {
    box-sizing: border-box;
    width: 100%;
    height: 3rem;
    padding: 8px;
    min-width: 40px;
    min-height: 40px;
    text-overflow: ellipsis
}

.lds__select-atom.lds__select-atom--error {
    border-color: #bb192c;
    background-color: #ffebea
}

.lds__select-atom.lds__select-atom--full-width {
    width: 100%
}

.lds__select-atom.lds__select-atom--not-full-width {
    width: auto
}

.lds__select-atom.lds__select-atom:disabled {
    border-color: rgba(71, 71, 71, .8);
    border-style: solid;
    background-color: rgba(71, 71, 71, .2);
    color: rgba(71, 71, 71, .8)
}

.lds__text-input-atom {
    box-sizing: border-box;
    height: 3rem;
    width: 100%;
    border: 1px solid;
    border-color: initial;
    min-height: 40px;
    min-width: 40px;
    display: inline-flex;
    align-items: stretch
}

.lds__text-input-atom input {
    padding: 0 0 0 1rem;
    min-height: 38px;
    min-width: 38px
}

.lds__text-input-atom.lds__text-input-atom--error,
.lds__text-input-atom.lds__text-input-atom:focus:invalid {
    background-color: #ffebea;
    border-color: #bb192c
}

.lds__text-input-atom.lds__text-input-atom--focused {
    box-shadow: 0 0 0 3px #5e9ed6
}

.lds__text-input-atom.lds__text-input-atom--full-width {
    width: 100%
}

.lds__text-input-atom.lds__text-input-atom--not-full-width {
    width: auto
}

.lds__text-input-atom.lds__text-input-atom--disabled {
    border-color: rgba(71, 71, 71, .8);
    border-style: solid;
    background-color: rgba(71, 71, 71, .2);
    color: rgba(71, 71, 71, .8)
}

.lds__text-input-atom input,
.lds__text-input-atom input:focus {
    border: none;
    outline: none;
    flex: 1;
    background-color: inherit
}

.lds__text-input-atom__append-content,
.lds__text-input-atom__prepend-content {
    display: flex;
    align-items: center
}

.enterMobileNumberPage__select-list {
    font: 1rem Noir, sans-serif;
    margin: .625rem 0 1.625rem
}

.enterMobileNumberPage__number-input {
    margin: .625rem 0 .875rem
}

.enterMobileNumberPage__number-input input {
    font: 1rem Noir, sans-serif
}

.enterMobileNumberPage__number-input-description {
    margin-bottom: 2rem
}

.expandable-list {
    list-style: none;
    padding-left: 0;
    margin-top: 1rem
}

.expandable-list .button {
    border-bottom: 1px solid #333
}

.expandable-list__toggle-button.button {
    text-align: left;
    display: flex;
    align-items: center
}

.expandable-list__title {
    flex-grow: 1;
    font-size: .875rem;
    color: #333
}

.expandable-list__icon {
    position: relative;
    font-size: .5rem
}

.expandable-list__list {
    display: none
}

.expandable-list--expanded .expandable-list__list {
    display: block;
    list-style: none;
    padding-left: 0
}

.expandable-list--expanded .expandable-list__list>li {
    padding-left: 1.25rem;
    margin-top: .75rem
}

.footer {
    border-top: 1px solid #ccc;
    padding: 0 1rem;
    font-size: .75rem
}

.enterNumber__divider,
.footer__divider,
.footer__section,
.loginSuccess__divider {
    margin: 1.5rem auto;
    display: flex;
    max-width: 1040px
}

.enterNumber__divider,
.footer__divider,
.loginSuccess__divider {
    border: none;
    border-top: 1px solid #ccc
}

.footer__pcid-logo {
    flex-basis: 2.75rem;
    width: 2.75rem;
    min-width: 2.75rem;
    margin-right: .5rem;
    margin-top: -.375rem;
    height: 1.375rem
}

.footer__tagline {
    display: flex;
    align-items: center;
    line-height: 1.2
}

.footer__help-and-support-link-list {
    display: flex;
    flex-grow: 1;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: baseline
}

.footer__help-and-support-link {
    margin-right: 1rem
}

.footer__language-toggle {
    display: block;
    margin-left: 3rem
}

.footer__copyright {
    color: #666;
    font-weight: 200
}

@media screen and (max-width:859px) {
    .enterNumber__divider,
    .footer__divider,
    .footer__section,
    .loginSuccess__divider {
        margin: 1.5rem auto;
        max-width: 22.5rem;
        flex-direction: column;
        align-items: center
    }
    .footer__copyright,
    .footer__help-and-support-link-list,
    .footer__language-toggle {
        flex-grow: unset;
        margin: 0 auto;
        text-align: center
    }
    .footer__help-and-support-link-list {
        margin: -.5rem auto
    }
    .footer__copyright {
        margin: 1.5rem auto
    }
    .footer__help-and-support-link {
        margin: .5rem
    }
}

@media screen and (max-width:479px) {
    .footer__help-and-support-link-list {
        flex-direction: column;
        align-items: center
    }
}

.form-message {
    position: relative;
    padding: .5rem 1.5rem .5rem 2.5rem;
    border-right: 8px solid;
    border-radius: 0 2px 2px 0;
    margin-bottom: 1.5em
}

.form-message__icon {
    margin: 0;
    left: .5em;
    top: .5em;
    width: 1.5rem;
    height: 1.5rem;
    position: absolute
}

.form-message--error {
    background-color: #ffebea;
    border-color: #970012;
    color: #970012
}

.form-message--success {
    background-color: #e7f3ed;
    border-color: #00853d;
    color: #00421f
}

.form-message--warning {
    background-color: #fff0df;
    border-color: #ffaf4e;
    color: #333
}

.form-message__content {
    min-height: 1.75rem
}

.form-message__content .button--inline,
.form-message__content .link--inline {
    font: inherit;
    color: inherit;
    fill: inherit
}

.form-message__text--bold {
    font-weight: 500
}

.form-message__text--margin-top {
    margin: 1em 0 0
}

@media screen and (max-width:859px) {
    .form-message {
        padding-right: 1.25rem
    }
}

@media screen and (max-width:479px) {
    .form-message {
        padding-right: 1rem
    }
}

.form__fieldset {
    border: none;
    padding: 0;
    margin: 0;
    min-width: inherit
}

.form__legend {
    margin: 0 0 .5rem;
    padding: 0;
    width: 100%
}

.form__message {
    margin: 1.5rem 0 1rem
}

.form__description {
    margin-top: 1.5rem
}

.form .button--submit,
.form .input-group {
    margin: 1.5rem 0
}

.checkbox-group {
    margin: 1.25rem 0;
    display: flex;
    align-items: flex-start
}

.checkbox-group__icon,
.checkbox-group__input-wrapper,
.checkbox-group__label,
.checkbox-group__text {
    display: inline-block
}

.checkbox-group .input-label__optional-text {
    text-transform: none;
    font-style: italic;
    color: #666;
    letter-spacing: 0
}

.checkbox-group .input-label__optional-text:before {
    content: " "
}

.checkbox-group__label {
    margin-top: .25rem
}

.checkbox-group__text {
    margin-left: .75rem
}

.checkbox-group__input {
    opacity: 0;
    position: absolute;
    margin: 0
}

.checkbox-group__icon {
    vertical-align: text-bottom;
    width: 1.25rem;
    height: 1.25rem;
    overflow: hidden;
    border: 1px solid #666;
    outline: 2px solid transparent;
    outline-offset: -1px
}

.checkbox-group__checkmark {
    position: relative;
    width: 1rem;
    height: 1rem;
    margin: 2px;
    stroke: #333;
    stroke-width: 2px;
    stroke-linecap: round;
    fill: transparent
}

.checkbox-group--disabled .checkbox-group__icon {
    outline-color: #ccc;
    background: #f5f5f5
}

.checkbox-group--error .checkbox-group__icon {
    outline-color: #970012
}

.checkbox-group--warning .checkbox-group__icon {
    outline-color: #ffaf4e
}

.checkbox-group__input:active+.checkbox-group__icon,
.checkbox-group__input:focus+.checkbox-group__icon {
    outline-color: #2160a9;
    box-shadow: 0 0 4px #2160a9
}

.checkbox-group__error {
    display: block;
    margin-top: 6px;
    color: #970012
}

.checkbox-group--disabled {
    color: #888;
    fill: #888;
    cursor: not-allowed
}

.checkbox-group--disabled .checkbox-group__checkmark {
    fill: transparent;
    stroke: #888
}

.checkbox-group--disabled .checkbox-group__input:active+.checkbox-group__icon {
    outline-color: #ccc;
    box-shadow: none
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    appearance: none
}

.input-icon--success {
    fill: #00421f
}

.input-icon--spinner circle {
    fill-opacity: 0
}

.input-icon--spinner circle:first-child {
    stroke: rgba(204, 204, 204, .75)
}

.input-icon--spinner circle:last-child {
    stroke: #aaa;
    stroke-dasharray: 42 14;
    stroke-dashoffset: -56;
    animation: rotate 1.5s linear infinite
}

@keyframes rotate {
    0% {
        stroke-dasharray: 33 36;
        stroke-dashoffset: -69
    }
    33% {
        stroke-dasharray: 9 60;
        stroke-dashoffset: -46
    }
    to {
        stroke-dasharray: 33 36;
        stroke-dashoffset: 0
    }
}

.password-group {
    position: relative
}

.password-group__toggle-button {
    z-index: 10;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 1
}

.password-group__forgot-password {
    margin-top: 1.5rem
}

.password-group--disabled .password-group__toggle-button {
    color: #888;
    text-decoration: none
}

.text-group__input-container {
    position: relative
}

.text-group__input {
    font-size: 1rem;
    line-height: 1.4444444444;
    padding: 14px 1rem;
    background: none;
    border: 1px solid #666;
    border-radius: 0;
    font-family: inherit;
    appearance: none;
    box-sizing: border-box;
    margin-bottom: .25rem;
    outline: 2px solid transparent;
    outline-offset: -1px
}

.text-group__input::-ms-reveal {
    display: none
}

.text-group__input:-ms-input-placeholder {
    color: #666
}

.text-group__input::placeholder {
    color: #666
}

.text-group__input:focus {
    outline-color: #2160a9;
    box-shadow: 0 0 4px #2160a9
}

.text-group__input-addon {
    position: absolute;
    font-size: 1.125rem;
    line-height: 1.4444444444;
    height: 1.625rem;
    left: 1rem;
    top: 0;
    bottom: 0;
    margin: auto;
    pointer-events: none;
    white-space: nowrap
}

.text-group__input-icon {
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 0;
    width: 1.75rem;
    height: 1.75rem;
    margin: .75rem
}

.text-group__input-icon+.text-group__input {
    padding-right: 3.25rem
}

.text-group__label {
    display: inline-block;
    text-transform: uppercase;
    margin-bottom: .5rem;
    font-size: .875rem
}

.text-group__label .input-label__optional-text {
    text-transform: none;
    font-style: italic;
    color: #666
}

.text-group__label .input-label__optional-text:before {
    content: " "
}

.text-group__error {
    color: #970012;
    position: relative
}

.text-group__subtext {
    margin-top: 1rem
}

.text-group--block,
.text-group--block .text-group__input {
    display: block;
    width: 100%
}

.text-group--disabled .text-group__input {
    background: #f5f5f5;
    border-color: #ccc;
    outline-color: #ccc;
    color: #888;
    cursor: not-allowed
}

.input-icon--success+.text-group__input:not(:focus) {
    outline-color: #00853d
}

.text-group--warning .text-group__input:not(:focus) {
    outline-color: #ffaf4e
}

.text-group--error .text-group__input:not(:focus) {
    outline-color: #970012
}

.text-group--warning .text-group__error {
    color: #ffaf4e
}

.text-group--disabled {
    color: #888
}

.mfa-challenge-form__authFactor {
    font-weight: 500
}

.mfa-challenge-form__image-container {
    width: 100%;
    text-align: center;
    margin-top: 1rem
}

.mfa-challenge-form .form__heading {
    text-align: center
}

.mfa-challenge-form .form__heading h2 {
    margin: auto
}

.password-strength {
    margin: 1.5rem 0
}

.password-strength__meter {
    display: flex;
    align-items: center
}

.password-strength__bar {
    display: inline-block;
    margin: -.125rem .5rem 0;
    height: .75rem;
    background: #aaa;
    flex-basis: .25rem;
    transition: all .3s ease
}

.password-strength__bar--0,
.password-strength__bar--1 {
    background: #ee1e29
}

.password-strength__bar--2,
.password-strength__bar--3,
.password-strength__bar--4 {
    background: #00853d
}

.password-strength__bar--0 {
    flex-basis: 5%
}

.password-strength__bar--1 {
    flex-basis: 15%
}

.password-strength__bar--2 {
    flex-basis: 25%
}

.password-strength__bar--3 {
    flex-basis: 35%
}

.password-strength__bar--4 {
    flex-basis: 100%;
    flex-grow: 1
}

.password-strength__text {
    white-space: nowrap;
    transition: color .3s ease
}

.password-strength__label {
    white-space: nowrap
}

.password-strength__tip {
    margin: 1rem 0
}

.password-strength__tip strong {
    font-weight: 500;
    display: block;
    margin-bottom: .5rem
}

.password-strength__requirement-list {
    margin: .5rem 0 0;
    padding-left: 1.75rem
}

.password-strength__requirement {
    margin: .25rem 0
}

.password-strength__requirement>span {
    position: relative;
    left: .375rem
}

.password-strength--disabled {
    color: #888
}

.password-strength--disabled .password-strength__bar {
    background: #ccc
}

.notification {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 1;
    min-height: 2.5em;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5em 0
}

.notification--success {
    color: #00421f;
    background-color: #e7f3ed
}

.notification--error {
    color: #970012;
    background-color: #ffebea
}

.notification--maintenance {
    color: #333;
    background-color: #fff0e0
}

.notification--above {
    top: 0
}

.notification--below {
    top: 4rem
}

.notification-content {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 2.75em
}

.notification-content__icon {
    height: 2.5em;
    align-self: baseline
}

.notification-content__text {
    margin-left: .5em
}

.notification__icon {
    height: 2.5em;
    margin-top: -.25em
}

.notification__icon--status {
    width: 1.375em
}

.notification__icon--close {
    cursor: pointer;
    width: .75em
}

.notification-close {
    position: absolute;
    display: flex;
    right: 0;
    height: 100%;
    align-items: flex-end
}

.notification-close__icon {
    align-self: center
}

.notification-close__rectangle {
    width: 8px;
    height: 100%;
    margin-left: 8px;
    border-top-right-radius: .125em;
    border-bottom-right-radius: .125em
}

.notification-close__rectangle--success {
    background-color: #00853d
}

.notification-close__rectangle--error {
    background-color: #970012
}

.header--branded {
    border-bottom: 1px solid #ccc;
    margin-bottom: -4rem;
    height: 4rem;
    display: flex
}

.header--pink {
    background: #f9dada;
    border-bottom: none
}

.header--black {
    background: #121212
}

.header--red {
    background: #cb333b
}

.header--lightblue {
    background: #d9ebf9
}

.header--orange {
    background: #fa4616
}

.header__logo {
    margin: auto;
    height: 1.75rem
}

@media screen and (max-width:479px) {
    .header {
        margin-bottom: -1.5rem
    }
    .header--unbranded {
        margin-bottom: 0
    }
}

.language-toggle {
    appearance: none;
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: none;
    padding: 0
}

.language-toggle__option {
    text-transform: uppercase;
    color: #666;
    padding: .375rem 0 .25rem;
    font-weight: 200;
    font-size: .75rem
}

.language-toggle__option:first-child {
    border-right: 1px solid #ccc;
    padding-right: .75rem;
    margin-right: .75rem
}

.language-toggle__option--active {
    font-weight: 500;
    color: #333
}

.layout,
.layout__main,
.mfa-method-list__mfa-method-container,
.mfa-method-list__mfa-method-container--active,
.mfa-method-list__mfa-method-container--active:focus,
.mfa-method-list__mfa-method-container:focus {
    text-align: left;
    font: .875rem Noir, sans-serif;
    line-height: 1.2;
    color: #333;
    position: relative;
    box-sizing: border-box;
    padding: 3rem 3.75rem;
    border: 1px solid #ccc;
    max-width: 525px;
    min-width: 290px;
    margin: 6rem auto 3rem
}

.layout-container--top-margin {
    margin-top: 3.5rem
}

.form__heading,
.layout__heading {
    display: flex;
    margin-bottom: .875rem;
    align-items: center
}

.form__heading h2,
.layout__heading h2 {
    font-size: 1.5em;
    font-weight: 500;
    margin: 0
}

.form__heading h2 sup,
.layout__heading h2 sup {
    font-size: .875rem
}

.layout__pcid-logo {
    flex-basis: 4rem;
    width: 4rem;
    min-width: 4rem;
    display: block;
    height: 1.75rem;
    margin: 0 .25rem .5rem -.125rem
}

.form__description,
.layout__message {
    text-align: left
}

.layout__secondary-cta {
    display: flex;
    margin-bottom: 1rem
}

.layout__secondary-cta>* {
    margin: auto
}

.layout__secondary-cta:last-of-type {
    margin-bottom: 0
}

.layout__main {
    margin-top: 0
}

.layout__back-button {
    font-weight: 500;
    max-width: 525px;
    min-width: 290px;
    margin: 7.3rem auto 0;
    padding-bottom: 1rem
}

.layout__back-button-link {
    text-decoration: none
}

.layout__back-button-icon {
    max-width: 1.1rem;
    max-height: 1.1rem;
    vertical-align: sub;
    padding-right: .2rem
}

#__next {
    height: 100%
}

.loading-page {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

.loading-page .loading-animation__dot {
    background: #333
}

.mfaSetupProcess__button {
    border: 1px solid #000;
    display: flex;
    justify-content: center;
    position: absolute;
    right: 1em;
    padding-top: .5em;
    padding-bottom: .5em
}

.mfaSetupProcess__button--mobile-menu {
    position: unset;
    right: unset;
    height: 3em
}

.mfaSetupProcess__button--mobile-menu>span {
    align-self: center
}

.mfaSetupProcess__secondary-cta-button {
    margin-top: 1.5em
}

.logout {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 3rem;
    max-width: 25rem
}

.logout__logo {
    height: 1.75rem;
    margin-bottom: 1rem;
    margin-top: 1rem
}

.logout__description,
.logout__logo {
    max-width: 16rem
}

@media screen and (max-width:859px) {
    .layout,
    .layout__main,
    .mfa-method-list__mfa-method-container,
    .mfa-method-list__mfa-method-container--active,
    .mfa-method-list__mfa-method-container--active:focus,
    .mfa-method-list__mfa-method-container:focus {
        max-width: 22.5rem;
        border: none;
        padding: 0
    }
    .layout__back-button {
        max-width: 22.5rem;
        margin-top: 6rem;
        padding-bottom: 2.5rem
    }
}

@media only screen and (max-width:859px) {
    .mfaSetupProcess__button--mobile-menu {
        border: 1px solid #000
    }
}

@media screen and (max-width:479px) {
    .layout,
    .layout__main,
    .mfa-method-list__mfa-method-container,
    .mfa-method-list__mfa-method-container--active,
    .mfa-method-list__mfa-method-container--active:focus,
    .mfa-method-list__mfa-method-container:focus {
        max-width: unset;
        margin: 3rem 1rem
    }
    .form__heading h1,
    .layout__heading h1 {
        font-size: 1.25rem
    }
    .form__heading h1 sup,
    .layout__heading h1 sup {
        font-size: .625rem
    }
    .layout__pcid-logo {
        flex-basis: 2.75rem;
        width: 2.75rem;
        min-width: 2.75rem;
        display: block;
        height: 1.375rem;
        margin-right: .5rem;
        margin-top: -.375rem
    }
    .layout__back-button {
        margin: 3.5rem auto 0
    }
    .layout__main {
        max-width: 22.5rem;
        margin: 0 auto 3rem
    }
}

.loading-animation,
.password-mask {
    justify-content: center;
    align-items: center;
    display: flex;
    height: 1rem
}

@keyframes dot-animation {
    0% {
        opacity: .5
    }
    45% {
        opacity: 0
    }
    55% {
        opacity: 1
    }
    to {
        opacity: .5
    }
}

.loading-animation__dot {
    width: 6px;
    height: 6px;
    display: block;
    background: #333;
    margin: 3px;
    border-radius: 1000px;
    animation: dot-animation 1.2s linear infinite
}

.loading-animation__dot:first-child {
    animation-delay: .1333333333s
}

.loading-animation__dot:nth-child(2) {
    animation-delay: .2666666667s
}

.loading-animation__dot:nth-child(3) {
    animation-delay: .4s
}

.loading-animation__dot:nth-child(4) {
    animation-delay: .5333333333s
}

.loading-animation__dot:nth-child(5) {
    animation-delay: .6666666667s
}

.loading-animation__dot:nth-child(6) {
    animation-delay: .8s
}

.loading-animation__dot:nth-child(7) {
    animation-delay: .9333333333s
}

.loading-animation__dot:nth-child(8) {
    animation-delay: 1.0666666667s
}

.loading-animation__dot:nth-child(9) {
    animation-delay: 1.2s
}

.mfa-challenge-page .mfa-method-list__mfa-method-container,
.mfa-challenge-page .mfa-method-list__mfa-method-container--active,
.mfa-challenge-page .mfa-method-list__mfa-method-container:focus {
    margin-bottom: 1.15em
}

.mfa-method-list {
    padding: 0;
    margin: 0;
    list-style-type: none
}

.mfa-method-list__mfa-method-label,
.mfa-method-list__mfa-method-label--active,
.mfa-method-list__mfa-method-title {
    font-weight: 500
}

.mfa-method-list__mfa-method-label--active {
    margin-top: 2.1875em;
    color: #00853d
}

.mfa-method-list__mfa-method-title {
    display: inline-flex;
    margin: 0
}

.mfa-method-list__mfa-method-subtitle {
    font-size: .8em;
    color: #666;
    margin-bottom: 0
}

.mfa-method-list__mfa-method-container,
.mfa-method-list__mfa-method-container--active,
.mfa-method-list__mfa-method-container--active:focus,
.mfa-method-list__mfa-method-container:focus {
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 -1px;
    background: transparent;
    border: 1px solid #ccc;
    border-radius: 2px;
    padding: 1.15em 1.15em 1.15em 1.5em;
    cursor: pointer
}

.mfa-method-list__mfa-method-container--active,
.mfa-method-list__mfa-method-container--active:focus,
.mfa-method-list__mfa-method-container:focus {
    border: 1px solid #888;
    border-left: .5em solid #00853d;
    padding-left: 1em;
    outline: 0
}

.mfa-method-list__mfa-method-group {
    display: flex;
    justify-content: space-between
}

.mfa-method-list__mfa-method-inactive-email-add-button {
    font-size: .88em;
    color: #333;
    text-decoration: underline
}

.mfaMethodBar {
    display: flex;
    justify-content: space-between
}

.link .sprite {
    pointer-events: none;
    fill: inherit
}

.link .sprite path {
    fill: inherit
}

.link__caret.sprite {
    height: .6666666667rem;
    width: .6666666667rem;
    vertical-align: middle;
    margin: 0 .25rem
}

.link--block {
    display: block;
    text-align: center
}

.link:active {
    outline: 0
}

.link:focus {
    outline: 2px solid rgba(33, 96, 169, .5)
}

.link:not(.button--theme-base) {
    color: #333;
    fill: #333
}

.link:not(.button--theme-base):focus,
.link:not(.button--theme-base):hover:not(:disabled) {
    color: #ee1e29;
    fill: #ee1e29
}

[class*="--success"] .link:not(.button--theme-base):focus,
[class*="--success"] .link:not(.button--theme-base):hover:not(:disabled) {
    color: green;
    fill: green
}

.link:not(.button--theme-base):not(.button):not([href]),
.link:not(.button--theme-base):not(.button):not([href]):active {
    color: #888;
    fill: #888
}

.password-mask {
    justify-content: left
}

.password-mask__dot {
    width: 6px;
    height: 6px;
    display: block;
    background: #333;
    margin: 3px;
    border-radius: 1000px
}

.rp-list {
    list-style: none;
    padding-left: 0;
    margin-top: 2rem;
    max-width: 18rem
}

.rp-list__item {
    margin-top: 1rem;
    display: block
}

@media screen and (max-width:479px) {
    .rp-list {
        margin-top: 1.5rem
    }
}

.step-indicator {
    display: flex;
    justify-content: space-between;
    column-gap: .25rem;
    height: .25rem;
    width: 100%
}

.step-indicator__bubble {
    flex: 1;
    border-radius: .8rem;
    background: #ccc
}

.step-indicator__bubble--active {
    background: #333
}

.whyMfa__title {
    text-align: center;
    font-size: 1.5em;
    font-weight: 500;
    margin-bottom: 1rem
}

.whyMfa__description {
    text-align: left;
    font-size: .9rem;
    font-weight: 400;
    margin-bottom: 2rem
}

.whyMfa__link {
    font-weight: 500
}

.continue-as-page {
    text-align: center
}

.continue-as-page__pcid-logo {
    max-width: 58px;
    max-height: 32px
}

.continue-as-page__heading {
    font-weight: 500
}

.continue-as-page__description {
    padding: 1rem 0 1.5rem;
    font-size: 1rem
}

.continue-as-page__submit-button {
    background: #333;
    color: #fff;
    font-weight: 500;
    font-size: .9rem;
    padding: .7rem 1rem;
    border-radius: 35px;
    width: 270px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.continue-as-page__submit-button-email-icon {
    max-width: 20px;
    max-height: 20px;
    margin-right: .5rem;
    vertical-align: middle
}

.continue-as-page__submit-button:hover~.continue-as-page__hidden-email {
    visibility: visible
}

.continue-as-page__hidden-email {
    position: relative;
    display: flex;
    justify-content: center;
    transition: visibility .3s ease;
    visibility: hidden
}

.continue-as-page__hidden-email-container {
    position: absolute;
    min-width: 100%
}

.continue-as-page__hidden-email-triangle {
    width: 0;
    border: 8px solid transparent;
    border-bottom-color: #333;
    margin: 0 auto
}

.continue-as-page__hidden-email-display {
    background: #333;
    color: #fff;
    font-size: 1rem;
    margin: 0;
    padding: .7rem 1rem
}

.continue-as-page__hidden-email-text {
    margin: 0
}

.continue-as-page__divider {
    margin: 2rem 0
}

.continue-as-page__secondary-cta {
    font-weight: 500
}

.create-account-form__email .create-account-form__email-description {
    display: none
}

.create-account-form__email.input-group--dirty .create-account-form__email-description,
.create-account-form__new-password .input-group--dirty .password-strength {
    display: block
}

.create-account-form__sign-in-cta {
    margin: 1rem auto;
    max-width: 12rem
}

.create-account-form__name {
    display: flex
}

.create-account-form__firstName.input-group {
    margin: 1.5rem 1.5rem 0 0
}

.create-account-form__lastName.input-group {
    margin-bottom: 0
}

.create-account-form__secondary-cta {
    display: block;
    text-align: center
}

.create-account-form__privacy-terms-description {
    font-weight: 500
}

@media screen and (max-width:479px) {
    .create-account-form__confirm-password #confirmPassword__label,
    .create-account-form__confirm-password button {
        max-width: 50%
    }
    .create-account-form__confirm-password button {
        text-align: right
    }
}

.create-account-success__subheading {
    font-weight: 500;
    margin: 1.5rem 0
}

.create-account-success__email {
    display: flex;
    align-items: center;
    margin-top: 2rem;
    font-weight: 500
}

.create-account-success__email .sprite {
    flex-basis: 1.375rem;
    width: 1.375rem;
    min-width: 1.375rem;
    fill: #00853d;
    height: 1.375rem;
    margin-right: .5rem
}

.create-account-success__image {
    max-width: 100%;
    margin-top: 1.5rem
}

.create-account-success__next-step {
    margin-top: 1.75rem
}

.enterNumber__page-heading {
    margin: 0 0 -.5em;
    font-size: 1.75em;
    font-weight: 500
}

.enterNumber__step-indicator {
    padding-bottom: 2rem
}

.enterNumber__field-heading {
    font-size: 1.5em;
    font-weight: 500
}

.enterNumber__field-heading-mfa {
    text-align: center
}

.enterNumber__no-top-margin {
    margin-block-start: 0
}

.enterNumber__image-container {
    width: 100%;
    text-align: center;
    margin-bottom: 1rem
}

.protectAccount__step-indicator {
    padding-bottom: 2rem
}

.protectAccount__field-heading {
    font-size: 1.5em;
    font-weight: 500;
    margin-block-end: 1em
}

.protectAccount__field-heading-mfa {
    text-align: center
}

.protectAccount__no-top-margin {
    margin-block-start: 0
}

.protectAccount__image-container {
    width: 100%;
    text-align: center
}

.protectAccount__list {
    margin-block-start: 1rem;
    margin-block-end: 1.2rem;
    padding: 0
}

.protectAccount__list-item {
    display: flex;
    align-items: center;
    list-style: none;
    margin-bottom: 1rem
}

.protectAccount__list-item:last-child {
    margin-bottom: 0
}

.protectAccount__list-icon {
    max-width: .6rem;
    max-height: .6rem;
    vertical-align: middle;
    margin-top: -.3rem;
    padding-right: 1rem
}

.protectAccount__mfa-why {
    color: #194b9f;
    text-align: center;
    text-decoration: underline;
    padding-bottom: 2.2rem
}

.protectAccount__mfa-why-icon {
    max-width: 1.4rem;
    max-height: 1.4rem;
    vertical-align: middle;
    margin-right: .6rem
}

.loginSuccess__page-heading {
    margin: 0 0 -.5em;
    font-size: 1.75em;
    font-weight: 500
}

.loginSuccess__description {
    margin-block-start: 2em;
    margin-block-end: 3em
}

.updateSecurity__icon {
    text-align: center;
    margin: 2rem 0
}

.updateSecurity__description1 {
    font-weight: 500
}

.updateSecurity__description2 {
    margin-bottom: 1.5rem
}

.updateSecurity__askForResend {
    margin-top: 1.5rem
}

.updateSecurity__resendButton {
    font-size: .875rem;
    text-decoration: underline;
    font-weight: 400
}

.mfa-challenge-page__step-indicator {
    padding-bottom: 2rem
}

.mfa-challenge-page__email-security-warning {
    display: flex;
    padding-bottom: 1rem
}

.mfa-challenge-page__notice-icon {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    margin-right: .5rem
}

.oops-page {
    border-color: transparent;
    text-align: center
}

.oops-page__link {
    margin-top: 3rem
}

.oops-page__relying-party-list {
    text-align: left
}

.oops-page>.form__heading,
.oops-page>.layout__heading {
    flex-direction: column
}

.oops-page>.form__description,
.oops-page>.layout__message {
    text-align: center
}

@media screen and (max-width:479px) {
    .oops-page__link {
        margin-top: 2rem
    }
}

.reset-password-success-page__back-link {
    margin-top: 1.5rem
}

.terms-page {
    border-color: transparent
}

.terms-page ol {
    line-height: 1.2;
    margin-top: 2rem;
    padding-left: 0
}

.terms-page li {
    list-style-position: inside;
    font-weight: 500
}

.terms-page li>h2 {
    font-size: .875rem;
    display: inline;
    margin: 0;
    font-weight: 500
}

.terms-page li>p {
    font-weight: 400
}

.login-form__forgot-password-link {
    margin: 1.5rem 0
}

/*# sourceMappingURL=011f6c1996a28b3efa2d.css.map*/