:root {
    --ax-blue: #4680bf;
    --ax-light-blue: #75a9e4;
    --ax-lighter-blue: #d3e1f0;
    --ax-lightest-blue: #ebf4ff;
    --ax-dark-blue: #24476c;
    --ax-cyan: #17a9e1;
    --ax-green: #8bc541;
    --ax-green-light: #e8f3da;
    --ax-green-dark: #609f00;
    --ax-purple: #ab55a0;
    --ax-light-purple: #f2e2f0;
    --ax-orange: #f5863b;
    --ax-orange-medium: #f7ac4e;
    --ax-orange-light: #ffeee3;
    --ax-lightest-orange: #fff9f5;
    --ax-red: #e54a48;
    --ax-red-light: #fce8e7;
    --ax-font-medium: #888;
    --ax-font-light: #aaa;
    --ax-font-default: #444;
    --ax-gray-77: #777;
    --ax-gray-dc: #dcdcdc;
    --ax-gray-ef: #efefef;
    --ax-gray-e0: #e0e0e0;
    --ax-gray-80: #808080;
    --ax-gray-33: #333;
    --ax-gray-f8: #f8f8f8;
    --ax-gray-4d: #4d4d4d;
    --ax-gray-9d: #9d9d9d;
    --ax-gray-55: #555;
}
.flex {
    display: flex;
}
.flex-inline {
    display: inline-flex;
}
/*
 * layout direction
 */
.flex-row {
    flex-direction: row; /* default flex behavior */
}
.flex-col {
    flex-direction: column;
}
/*
 * layout wrapping
 */
.flex-wrap {
    flex-wrap: wrap;
}
.flex-wrap-reverse {
    flex-wrap: wrap-reverse;
}
.flex-nowrap {
    flex-wrap: nowrap;
}
/*
 * layout size
 */
.flex-auto {
    flex: 0 1 auto; /* default flex behavior */
}
.flex-grow {
    flex-grow: 1;
    min-width: 0; /* this allows flex children to break words and truncate text  */
}
.flex-grow--max {
    flex-basis: 100%;
}
.flex-nogrow {
    flex-grow: 0; /* default flex behavior */
}
.flex-shrink {
    flex-shrink: 1; /* default flex behavior */
    min-width: 0; /* this allows flex children to break words and truncate text  */
}
.flex-noshrink {
    flex-shrink: 0;
}
.flex-noflex {
    flex-grow: 0;
    flex-shrink: 0;
}
/*
    this allows flex children to shrink down when they have text without breaking whitespaces
    text like an email: someReallyLongEmailThatDoesNotWrap@whyyousolongandnowrap.com
    text like this will force flex children to grow, even with flex-nogrow, especiall in firefox
*/
.flex--break-word .flex > * {
    max-width: 100%;
    min-width: 0;
    word-break: break-word;
    word-wrap: break-word;
}
/*
 * layout position
 */
.flex-start-stretch,
.flex-start-none,
.flex-none-none,
.flex-none-stretch {
    justify-content: flex-start; /* default flex behavior */
    align-items: stretch; /* default flex behavior */
}
.flex-start-start,
.flex-none-start {
    justify-content: flex-start; /* default flex behavior */
    align-items: flex-start;
}
.flex-start-center,
.flex-none-center {
    justify-content: flex-start; /* default flex behavior */
    align-items: center;
}
.flex-start-end,
.flex-none-end {
    justify-content: flex-start; /* default flex behavior */
    align-items: flex-end;
}
.flex-center-stretch,
.flex-center-none {
    justify-content: center;
    align-items: stretch; /* default flex behavior */
}
.flex-center-start {
    justify-content: center;
    align-items: flex-start;
}
.flex-center-center {
    justify-content: center;
    align-items: center;
}
.flex-center-end {
    justify-content: center;
    align-items: flex-end;
}
.flex-end-stretch,
.flex-end-none {
    justify-content: flex-end;
    align-items: stretch; /* default flex behavior */
}
.flex-end-start {
    justify-content: flex-end;
    align-items: flex-start;
}
.flex-end-center {
    justify-content: flex-end;
    align-items: center;
}
.flex-end-end {
    justify-content: flex-end;
    align-items: flex-end;
}
.flex-around-stretch,
.flex-around-none {
    justify-content: space-around;
    align-items: stretch; /* default flex behavior */
}
.flex-around-start {
    justify-content: space-around;
    align-items: flex-start;
}
.flex-around-center {
    justify-content: space-around;
    align-items: center;
}
.flex-around-end {
    justify-content: space-around;
    align-items: flex-end;
}
.flex-between-stretch,
.flex-between-none {
    justify-content: space-between;
    align-items: stretch; /* default flex behavior */
}
.flex-between-start {
    justify-content: space-between;
    align-items: flex-start;
}
.flex-between-center {
    justify-content: space-between;
    align-items: center;
}
.flex-between-end {
    justify-content: space-between;
    align-items: flex-end;
}
.flex-start-baseline {
    justify-content: flex-start;
    align-items: center;
    align-items: baseline;
}
/*
 * flex columns
 */
.flex-10 {
    width: 10%;
}
.flex-20 {
    width: 20%;
}
.flex-25 {
    width: 25%;
}
.flex-30 {
    width: 30%;
}
.flex-33 {
    width: 33.3333333%;
}
.flex-40 {
    width: 40%;
}
.flex-50 {
    width: 50%;
}
.flex-55 {
    width: 55%;
}
@media (max-width: 719px) {
    .flex-50--wrap {
        width: 100%;
    }
}
@media (min-width: 720px) {
    .flex-50--wrap {
        width: 50%;
    }
}
.flex-60 {
    width: 60%;
}
.flex-66 {
    width: 66.6666666%;
}
.flex-70 {
    width: 70%;
}
.flex-75 {
    width: 75%;
}
.flex-80 {
    width: 80%;
}
.flex-90 {
    width: 90%;
}
.flex-100 {
    width: 100%;
}
/*
 * Flex Gap
 */
.flex-gap--xs {
    gap: var(--ax-padding-xs);
}
.flex-gap--sm {
    gap: var(--ax-padding-sm);
}
.flex-gap--md {
    gap: var(--ax-padding-md);
}
.flex-gap--lg {
    gap: var(--ax-padding-lg);
}
.flex-gap--xl {
    gap: var(--ax-padding-xl);
}
.flex-gap--xxl {
    gap: var(--ax-padding-xxl);
}
.flex-gap--xxxl {
    gap: var(--ax-padding-xxxl);
}

.flex-gap--signin {
    gap: 20px;
}
/* overrides to make it look like its own page */
/* .overlay--window { */
.terms-window {
    background-color: #000 !important;
}
.terms-window__content {
    height: 100%; /* this is necessary for IE. Known bug: https://github.com/philipwalton/flexbugs/issues/216 -JLee 5/24/18 */
}
.terms-window__footer {
    align-items: center;
    background-color: #efefef;
    border-top: 0;
    color: var(--ax-font-default);
    flex-direction: column;
    font-size: 14px;
    justify-content: flex-start;
    margin: 0 -10px;
    padding: 20px 10px 10px;
    min-height: 125px;
}
@media (min-width: 720px) {
    .terms-window__footer {
        flex-direction: row;
        font-size: 18px;
        justify-content: space-around;
        margin: 0 -16px;
    }
}
/*
<div class="overlay">
    <div class="overlay__content">
        <button class="overlay__close-button" @click="closeListener">
            <svg class="overlay__close-icon">
                <use xlink:href="/Images/icon-sprite.svg#icon-plus"></use>
            </svg>
        </button>
        <div class="flex flex-col flex-grow">
            <header class="overlay__header flex flex-center-center">
                <h2 class="overlay__heading">Edit Item Name</h2>
            </header>
            <div class="overlay__body">
            </div>
            <footer class="overlay__footer flex flex-between-center">
                <button class="f--14 f--uppercase button-v3--sm button-v3--text-red" tabindex="-1">Cancel</button>
                <button class="button-v3--sm button-v3--solid-blue">Save</button>
            </footer>
        </div>
    </div>
</div>
*/
.overlay {
    background-color: rgba(0, 0, 0, 0.75);
    bottom: 0;
    left: 0;
    overflow: auto;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 2040;
}
@media (min-width: 720px) {
    .overlay {
        padding: 16px;
    }
}
/* prevents nested modals from producing darker and darker background transparency */
.overlay .overlay {
    background-color: transparent;
}
.overlay__content {
    background-color: #fff;
    display: flex;
    position: relative;
}
@media (max-width: 719px) {
    .overlay__content {
        width: 100%;
    }
}
@media (min-width: 720px) {
    .overlay__content {
        margin: auto;
        max-width: 100%;
        width: 960px;
    }
}
@media (min-height: 700px) {
    .overlay__content {
        max-height: 100%;
    }
}
@media (min-width: 720px) {
    .overlay__content--sm {
        width: 640px;
    }
}
@media (min-width: 720px) {
    .overlay__content--md {
        width: 840px;
    }
}
.text-message-ad {
    flex-direction: row;
}
.text-message-ad .text-message-ad__example {
    max-width: 300px;
}
@media (max-width: 720px) {
    .text-message-ad {
        flex-direction: column-reverse;
        align-items: center;
    }

    .text-message-ad .text-message-ad__example {
        max-height: 200px;
        margin-bottom: var(--ax-padding-lg);
    }
}
.overlay__content--full-height {
    min-height: 100%;
}
@media (min-width: 720px) and (min-height: 700px) {
    .overlay__content--full-height {
        height: 100%;
    }
}
@media (min-width: 720px) {
    .overlay__content--full-screen {
        height: 100%;
        width: 100%;
    }
}
.overlay__header {
    border-bottom: 1px solid #e0e0e0;
    flex-shrink: 0;
    min-height: 80px;
    padding: 14px 54px;
}
.overlay__heading {
    color: #4d4d4d;
    font-family: Roboto, sans-serif;
    font-size: 42px;
    font-weight: 100;
}
.overlay__body {
    flex-grow: 1;
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden;
    overflow-y: auto;
}
@media (max-width: 719px) {
    .overlay__body {
        padding: 20px 20px 40px;
    }
}
@media (min-width: 720px) {
    .overlay__body {
        padding: 40px 40px 80px;
    }
}
@media (max-width: 719px) {
    .overlay__fullwidth {
        margin-left: -20px;
        margin-right: -20px;
    }
}
@media (min-width: 720px) {
    .overlay__fullwidth {
        margin-left: -40px;
        margin-right: -40px;
    }
}
.overlay__footer {
    border-top: 1px solid #e0e0e0;
    flex-shrink: 0;
}
@media (max-width: 719px) {
    .overlay__footer {
        padding: 20px;
    }
}
@media (min-width: 720px) {
    .overlay__footer {
        padding: 20px 40px;
    }
}
.overlay__input {
    border: 1px solid #e8e8e8;
    color: #666;
    max-width: 400px;
    padding: 10px;
}
.overlay__input.overlay__input-row {
    width: 100%;
}
.overlay__cancel-button {
    color: var(--ax-red);
    text-transform: uppercase;
}
.overlay__back-button {
    height: 80px;
    padding: 20px 16px;
    position: absolute;
    left: 0;
    top: 0;
}
.overlay__back-icon {
    display: block;
    fill: var(--ax-blue);
    height: 22px;
    width: 22px;
}
.overlay__close-button {
    height: 80px;
    padding: 20px 16px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.overlay__close-icon {
    display: block;
    fill: #dcdcdc;
    height: 22px;
    width: 22px;
    transform: rotate(45deg);
}
.overlay__button-max400 {
    min-width: initial;
    max-width: 400px;
    width: 100%;
}
.overlay__button-180 {
    min-width: 180px;
}
.bg--transparent {
    background-color: transparent;
}
.bg--blue {
    background-color: var(--ax-blue);
}
.bg--lightest-blue {
    background-color: var(--ax-lightest-blue);
}
.bg--lighter-blue {
    background-color: var(--ax-lighter-blue);
}
.bg--light-blue {
    background-color: var(--ax-light-blue);
}
.bg--eagleview-blue {
    background-color: #063d60;
}
.bg--orange {
    background-color: var(--ax-orange);
}
.bg--light-orange {
    background-color: var(--ax-orange-light);
}
.bg--green {
    background-color: var(--ax-green);
}
.bg--light-green {
    background-color: var(--ax-green-light);
}
.bg--yellow {
    background-color: #fd0;
}
.bg--light-yellow {
    background-color: #fff9e3;
}
.bg--red {
    background-color: var(--ax-red);
}
.bg--light-red {
    background-color: var(--ax-red-light);
}
.bg--purple {
    background-color: var(--ax-purple);
}
.bg--light-purple {
    background-color: #fdf3fc;
}
.bg--cyan {
    background-color: var(--ax-cyan);
}
.bg--black {
    background-color: #000;
}
.bg--gray-4d {
    background-color: #4d4d4d;
}
.bg--gray-77 {
    background-color: #777;
}
.bg--gray-9d {
    background-color: #9d9d9d;
}
.bg--gray-cc {
    background-color: #ccc;
}
.bg--gray-dc {
    background-color: #dcdcdc;
}
.bg--gray-ef {
    background-color: #efefef;
}
.bg--gray-f8 {
    background-color: #f8f8f8;
}
.bg--gray-fb {
    background-color: #fbfbfb;
}
.bg--white {
    background-color: #fff;
}
:root {
    --ax-font-weight-bold: 700;
    --font-sans: 'Roboto', sans-serif;
    --font-mono: 'monospace';
}
.f--noselect {
    -webkit-user-select: none;
            user-select: none;
}
/* font families */
.f--sans {
    font-family: var(--font-sans);
}
.f--mono {
    font-family: var(--font-mono);
}
.f--crew-link {
    font-family: 'Crew Link Font', var(--font-sans);
}
/* font decorations */
.f--line-through {
    text-decoration: line-through;
}
/* font transforms */
.f--uppercase {
    text-transform: uppercase;
}
.f--italic {
    font-style: italic;
}
.f--capitalize {
    text-transform: capitalize;
}
.f--underline {
    text-decoration: underline;
}
/* font sizes */
.f--10 {
    font-size: 10px;
}
.f--11 {
    font-size: 11px;
}
.f--12 {
    line-height: 14px;
}
@media (max-width: 719px) {
    .f--12 {
        font-size: 10px;
    }
}
@media (min-width: 720px) {
    .f--12 {
        font-size: 12px;
    }
}
.f--13 {
    font-size: 13px;
}
.f--14 {
    line-height: 16px;
}
@media (max-width: 719px) {
    .f--14 {
        font-size: 12px;
    }
}
@media (min-width: 720px) {
    .f--14 {
        font-size: 14px;
    }
}
.f--15 {
    font-size: 15px;
}
.f--16 {
    line-height: 20px;
}
@media (max-width: 719px) {
    .f--16 {
        font-size: 14px;
    }
}
@media (min-width: 720px) {
    .f--16 {
        font-size: 16px;
    }
}
.f--18 {
    line-height: 22px;
}
@media (max-width: 719px) {
    .f--18 {
        font-size: 16px;
    }
}
@media (min-width: 720px) {
    .f--18 {
        font-size: 18px;
    }
}
.f--20 {
    line-height: 22px;
}
@media (max-width: 719px) {
    .f--20 {
        font-size: 18px;
    }
}
@media (min-width: 720px) {
    .f--20 {
        font-size: 20px;
    }
}
.f--21 {
    font-size: 21px;
}
.f--24 {
    line-height: 30px;
}
@media (max-width: 719px) {
    .f--24 {
        font-size: 20px;
    }
}
@media (min-width: 720px) {
    .f--24 {
        font-size: 24px;
    }
}
@media (max-width: 719px) {
    .f--38 {
        font-size: 32px;
    }
}
@media (min-width: 720px) {
    .f--38 {
        font-size: 38px;
    }
}
@media (max-width: 719px) {
    .f--42 {
        font-size: 34px;
    }
}
@media (min-width: 720px) {
    .f--42 {
        font-size: 42px;
    }
}
/* font weights */
.f--thin {
    font-weight: 100;
}
.f--light {
    font-weight: 300;
}
.f--normal {
    font-weight: 400;
}
.f--semi {
    font-weight: 500;
}
.f--bold {
    font-weight: var(--ax-font-weight-bold);
}
/* font alignment */
.f--left {
    text-align: left;
}
.f--center {
    text-align: center;
}
.f--right {
    text-align: right;
}
/* font colors */
.f--white {
    color: #fff;
    fill: #fff;
}
.f--blue {
    color: var(--ax-blue);
    fill: var(--ax-blue);
}
.f--navy {
    color: var(--ax-dark-blue);
    fill: var(--ax-dark-blue);
}
.f--light-blue {
    color: var(--ax-light-blue);
    fill: var(--ax-light-blue);
}
.f--lightest-blue {
    color: var(--ax-lightest-blue);
    fill: var(--ax-lightest-blue);
}
.f--cyan {
    color: var(--ax-cyan);
    fill: var(--ax-cyan);
}
.f--orange {
    color: var(--ax-orange);
    fill: var(--ax-orange);
}
.f--orange-medium {
    color: var(--ax-orange-medium);
    fill: var(--ax-orange-medium);
}
.f--green {
    color: var(--ax-green);
    fill: var(--ax-green);
}
.f--red {
    color: var(--ax-red);
    fill: var(--ax-red);
}
.f--purple {
    color: var(--ax-purple);
    fill: var(--ax-purple);
}
.f--gray-1f {
    color: #1f1f1f;
    fill: #1f1f1f;
}
.f--gray-4d {
    color: #4d4d4d;
    fill: #4d4d4d;
}
.f--gray-77 {
    color: #777;
    fill: #777;
}
.f--gray-9d {
    color: #9d9d9d;
    fill: #9d9d9d;
}
.f--gray-a8 {
    color: #a8a8a8;
    fill: #a8a8a8;
}
.f--gray-cc {
    color: #ccc;
    fill: #ccc;
}
.f--gray-e0 {
    color: #e0e0e0;
    fill: #e0e0e0;
}
/* Term Highlighting */
.f--highlight {
    background-color: #ffff54;
    color: #000;
    font-weight: 700;
}
/* font wrapping */
.f--break-all {
    word-break: break-all;
}
.f--break-word {
    word-break: break-word;
    word-wrap: break-word;
}
.f--nowrap {
    white-space: nowrap;
}
.f--prewrap {
    white-space: pre-wrap;
}
.f--ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: keep-all;
    white-space: nowrap;
}
/* margin */
.m--none {
    margin: 0;
}
.m--xxs {
    margin: 1px;
}
.m--xs {
    margin: 2px;
}
.m--sm {
    margin: 5px;
}
.m--md {
    margin: 10px;
}
.m--lg {
    margin: 15px;
}
.m--xl {
    margin: 20px;
}
.m--xxl {
    margin: 30px;
}
.m--xxxl {
    margin: 50px;
}
/* margin-top */
.m-t--auto {
    margin-top: auto;
}
.m-t--xxs {
    margin-top: 1px;
}
.m-t--xs {
    margin-top: 2px;
}
.m-t--sm {
    margin-top: 5px;
}
.m-t--md {
    margin-top: 10px;
}
.m-t--lg {
    margin-top: 15px;
}
.m-t--xl {
    margin-top: 20px;
}
.m-t--xxl {
    margin-top: 30px;
}
.m-t--xxxl {
    margin-top: 50px;
}
/* margin-right */
.m-r--auto {
    margin-right: auto;
}
.m-r--xxs {
    margin-right: 1px;
}
.m-r--xs {
    margin-right: 2px;
}
.m-r--sm {
    margin-right: 5px;
}
.m-r--md {
    margin-right: 10px;
}
.m-r--lg {
    margin-right: 15px;
}
.m-r--xl {
    margin-right: 20px;
}
.m-r--xxl {
    margin-right: 30px;
}
.m-r--xxxl {
    margin-right: 50px;
}
/* margin-bottom */
.m-b--auto {
    margin-bottom: auto;
}
.m-b--xxs {
    margin-bottom: 1px;
}
.m-b--xs {
    margin-bottom: 2px;
}
.m-b--sm {
    margin-bottom: 5px;
}
.m-b--md {
    margin-bottom: 10px;
}
.m-b--lg {
    margin-bottom: 15px;
}
.m-b--xl {
    margin-bottom: 20px;
}
.m-b--xxl {
    margin-bottom: 30px;
}
.m-b--xxxl {
    margin-bottom: 50px;
}
/* margin-left */
.m-l--auto {
    margin-left: auto;
}
.m-l--xxs {
    margin-left: 1px;
}
.m-l--xs {
    margin-left: 2px;
}
.m-l--sm {
    margin-left: 5px;
}
.m-l--md {
    margin-left: 10px;
}
.m-l--lg {
    margin-left: 15px;
}
.m-l--xl {
    margin-left: 20px;
}
.m-l--xxl {
    margin-left: 30px;
}
.m-l--xxxl {
    margin-left: 50px;
}
/* margin-x */
.m-x--auto {
    margin-left: auto;
    margin-right: auto;
}
.m-x--xxs {
    margin-left: 1px;
    margin-right: 1px;
}
.m-x--xs {
    margin-left: 2px;
    margin-right: 2px;
}
.m-x--sm {
    margin-left: 5px;
    margin-right: 5px;
}
.m-x--md {
    margin-left: 10px;
    margin-right: 10px;
}
.m-x--lg {
    margin-left: 15px;
    margin-right: 15px;
}
.m-x--xl {
    margin-left: 20px;
    margin-right: 20px;
}
.m-x--xxl {
    margin-left: 30px;
    margin-right: 30px;
}
.m-x--xxxl {
    margin-left: 50px;
    margin-right: 50px;
}
/* margin-y */
.m-y--auto {
    margin-bottom: auto;
    margin-top: auto;
}
.m-y--xxs {
    margin-bottom: 1px;
    margin-top: 1px;
}
.m-y--xs {
    margin-bottom: 2px;
    margin-top: 2px;
}
.m-y--sm {
    margin-bottom: 5px;
    margin-top: 5px;
}
.m-y--md {
    margin-bottom: 10px;
    margin-top: 10px;
}
.m-y--lg {
    margin-bottom: 15px;
    margin-top: 15px;
}
.m-y--xl {
    margin-bottom: 20px;
    margin-top: 20px;
}
.m-y--xxl {
    margin-bottom: 30px;
    margin-top: 30px;
}
.m-y--xxxl {
    margin-bottom: 50px;
    margin-top: 50px;
}
:root {
    --ax-padding-xs: 2px;
    --ax-padding-sm: 5px;
    --ax-padding-md: 10px;
    --ax-padding-lg: 15px;
    --ax-padding-xl: 20px;
    --ax-padding-xxl: 30px;
    --ax-padding-xxxl: 50px;
}
/* padding */
.p--none {
    padding: 0;
}
.p--xs {
    padding: var(--ax-padding-xs);
}
.p--sm {
    padding: var(--ax-padding-sm);
}
.p--md {
    padding: var(--ax-padding-md);
}
.p--lg {
    padding: var(--ax-padding-lg);
}
.p--xl {
    padding: var(--ax-padding-xl);
}
.p--xxl {
    padding: var(--ax-padding-xxl);
}
.p--xxxl {
    padding: var(--ax-padding-xxxl);
}
/* padding-top */
.p-t--xs {
    padding-top: var(--ax-padding-xs);
}
.p-t--sm {
    padding-top: var(--ax-padding-sm);
}
.p-t--md {
    padding-top: var(--ax-padding-md);
}
.p-t--lg {
    padding-top: var(--ax-padding-lg);
}
.p-t--xl {
    padding-top: var(--ax-padding-xl);
}
.p-t--xxl {
    padding-top: var(--ax-padding-xxl);
}
.p-t--xxxl {
    padding-top: var(--ax-padding-xxxl);
}
/* padding-right */
.p-r--xs {
    padding-right: var(--ax-padding-xs);
}
.p-r--sm {
    padding-right: var(--ax-padding-sm);
}
.p-r--md {
    padding-right: var(--ax-padding-md);
}
.p-r--lg {
    padding-right: var(--ax-padding-lg);
}
.p-r--xl {
    padding-right: var(--ax-padding-xl);
}
.p-r--xxl {
    padding-right: var(--ax-padding-xxl);
}
.p-r--xxxl {
    padding-right: var(--ax-padding-xxxl);
}
/* padding-bottom */
.p-b--xs {
    padding-bottom: var(--ax-padding-xs);
}
.p-b--sm {
    padding-bottom: var(--ax-padding-sm);
}
.p-b--md {
    padding-bottom: var(--ax-padding-md);
}
.p-b--lg {
    padding-bottom: var(--ax-padding-lg);
}
.p-b--xl {
    padding-bottom: var(--ax-padding-xl);
}
.p-b--xxl {
    padding-bottom: var(--ax-padding-xxl);
}
.p-b--xxxl {
    padding-bottom: var(--ax-padding-xxxl);
}
/* padding-left */
.p-l--xs {
    padding-left: var(--ax-padding-xs);
}
.p-l--sm {
    padding-left: var(--ax-padding-sm);
}
.p-l--md {
    padding-left: var(--ax-padding-md);
}
.p-l--lg {
    padding-left: var(--ax-padding-lg);
}
.p-l--xl {
    padding-left: var(--ax-padding-xl);
}
.p-l--xxl {
    padding-left: var(--ax-padding-xxl);
}
.p-l--xxxl {
    padding-left: var(--ax-padding-xxxl);
}
.p-l--checkbox,
.p-l--radio {
    padding-left: var(--checkbox-label-padding-left);
}
/* padding-x */
.p-x--xs {
    padding-left: var(--ax-padding-xs);
    padding-right: var(--ax-padding-xs);
}
.p-x--sm {
    padding-left: var(--ax-padding-sm);
    padding-right: var(--ax-padding-sm);
}
.p-x--md {
    padding-left: var(--ax-padding-md);
    padding-right: var(--ax-padding-md);
}
.p-x--lg {
    padding-left: var(--ax-padding-lg);
    padding-right: var(--ax-padding-lg);
}
.p-x--xl {
    padding-left: var(--ax-padding-xl);
    padding-right: var(--ax-padding-xl);
}
.p-x--xxl {
    padding-left: var(--ax-padding-xxl);
    padding-right: var(--ax-padding-xxl);
}
.p-x--xxxl {
    padding-left: var(--ax-padding-xxxl);
    padding-right: var(--ax-padding-xxxl);
}
/* padding-y */
.p-y--xs {
    padding-bottom: var(--ax-padding-xs);
    padding-top: var(--ax-padding-xs);
}
.p-y--sm {
    padding-bottom: var(--ax-padding-sm);
    padding-top: var(--ax-padding-sm);
}
.p-y--md {
    padding-bottom: var(--ax-padding-md);
    padding-top: var(--ax-padding-md);
}
.p-y--lg {
    padding-bottom: var(--ax-padding-lg);
    padding-top: var(--ax-padding-lg);
}
.p-y--xl {
    padding-bottom: var(--ax-padding-xl);
    padding-top: var(--ax-padding-xl);
}
.p-y--xxl {
    padding-bottom: var(--ax-padding-xxl);
    padding-top: var(--ax-padding-xxl);
}
.p-y--xxxl {
    padding-bottom: var(--ax-padding-xxxl);
    padding-top: var(--ax-padding-xxxl);
}
/*

Created By: Craig Harshbarger

Comment Prefixes
* Browser [browser(s)]     something that was added to improve a specific browser(s) support.
* Document                 something that needs documentation
* Remove                   something that has been marked for removal.

When Commenting about browser support or special cases
1. Include detailes of how to reproduce/show the issue being fixed
2. Include your initials with your comment. Sometimes its hard to find who wrote something in git

 */
/*
 * Reusable variables
 */
:root {
    --ax-focus-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
    --ax-form-icon-width: 40px;
    --ax-label-transition: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
/*
 * Styles that apply to all inputs
 */
.form-v3-input,
.form-v3-text,
.form-v3-select,
.form-v3-multiselect {
    background-color: #f8f8f8;
    display: block;
    position: relative;
    font-family: Roboto, sans-serif;
}
.form-v3-input__label,
.form-v3-text__label,
.form-v3-select__label,
.form-v3-multiselect__label {
    color: #999;
    cursor: text;
    font-size: 16px;
    font-weight: 400;
    left: 0;
    padding-left: 10px;
    pointer-events: none;
    position: absolute;
    top: 23px;
    transform-origin: 0 0;
    transition: transform var(--ax-label-transition), color var(--ax-label-transition);
    font-family: inherit;
}
.form-v3-input__input,
.form-v3-text__input,
.form-v3-select__select,
.form-v3-multiselect__button {
    appearance: none;
    background-color: transparent;
    border: 1px solid transparent;
    box-shadow: none;
    color: #313131;
    display: block;
    font-size: 16px;
    min-height: 100%;
    padding: 24px 10px 5px;
    text-align: left;
    width: 100%;
    line-height: 20px;
    font-family: inherit;
}
.form-v3-input__input.focus,
.form-v3-input__input:focus,
.form-v3-text__input.focus,
.form-v3-text__input:focus,
.form-v3-select__select.focus,
.form-v3-select__select:focus,
.form-v3-multiselect__button.focus,
.form-v3-multiselect__button:focus {
    outline: none;
    box-shadow: var(--ax-focus-shadow);
}
/* required styling should only be applied to an input that is not populated or focused. CH */
.form-v3-input__input.required:not(.populated, :focus),
.form-v3-input__input:required:not(.populated, :focus),
.form-v3-text__input.required:not(.populated, :focus),
.form-v3-text__input:required:not(.populated, :focus),
.form-v3-select__select.required:not(.populated, :focus),
.form-v3-select__select:required:not(.populated, :focus),
.form-v3-multiselect__button.required:not(.populated, :focus),
.form-v3-multiselect__button:required:not(.populated, :focus) {
    background-color: var(--ax-orange-light);
    border-color: var(--ax-orange);
}
/* invalid styling should only be applied to a populated input that is not focused. CH */
.form-v3-input__input.invalid.populated:not(:focus),
.form-v3-input__input:invalid.populated:not(:focus),
.form-v3-text__input.invalid.populated:not(:focus),
.form-v3-text__input:invalid.populated:not(:focus),
.form-v3-select__select.invalid.populated:not(:focus),
.form-v3-select__select:invalid.populated:not(:focus),
.form-v3-multiselect__button.invalid.populated:not(:focus),
.form-v3-multiselect__button:invalid.populated:not(:focus) {
    border-color: var(--ax-red);
}
.form-v3-input__clear,
.form-v3-text__clear,
.form-v3-select__clear {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
}
.form-v3-input__clear:focus,
.form-v3-text__clear:focus,
.form-v3-select__clear:focus {
    outline: 0;
}
.form-v3-input__clear-icon,
.form-v3-text__clear-icon,
.form-v3-select__clear-icon {
    fill: var(--ax-blue);
}
/* Documentation needed. CH. */
.flatpickr-mobile {
    min-height: 50px; /* min-height: 100%; isn't working */
}
/*
 * Focus styles that apply to all inputs
 */
.form-v3-input__input.focus + .form-v3-input__label,
.form-v3-input__input:focus + .form-v3-input__label,
.form-v3-text__input.focus + .form-v3-text__label,
.form-v3-text__input:focus + .form-v3-text__label,
.form-v3-select__select.focus + .form-v3-select__label,
.form-v3-select__select:focus + .form-v3-select__label,
.form-v3-multiselect__button.focus + .form-v3-multiselect__label,
.form-v3-multiselect__button:focus + .form-v3-multiselect__label {
    color: var(--ax-orange);
}
/* flatpickr's mobile mode has two inputs, hidden and visible */
.form-v3-input__input.focus + .form-v3-input__label,
.form-v3-input__input:focus + .form-v3-input__label,
.form-v3-input__input.populated + .form-v3-input__label,
.form-v3-input__input[placeholder] + .form-v3-input__label,
.form-v3-text__input.focus + .form-v3-text__label,
.form-v3-text__input:focus + .form-v3-text__label,
.form-v3-text__input.populated + .form-v3-text__label,
.form-v3-text__input[placeholder] + .form-v3-text__label,
.form-v3-select__select.focus + .form-v3-select__label,
.form-v3-select__select:focus + .form-v3-select__label,
.form-v3-select__select.populated + .form-v3-select__label,
.form-v3-select__select.populated + .flatpickr-mobile + .form-v3-select__label,
.form-v3-multiselect__button.focus + .form-v3-multiselect__label,
.form-v3-multiselect__button.populated + .form-v3-multiselect__label {
    transform: scale(0.75) translateY(-26px);
}
.form-v3-text__input:-webkit-autofill + .form-v3-text__label,
.form-v3-select__select:-webkit-autofill + .form-v3-select__label,
.form-v3-multiselect__button:-webkit-autofill + .form-v3-multiselect__label {
    transform: scale(0.75) translateY(-26px);
}
/*
 * Focus styles that apply to textarea's only
 */
/* generally element selectors are bad. But here its necessary because we don't have a textarea specific class. CH. CB. AM. */
textarea + .form-v3-text__label {
    z-index: 1;
}
.form-v3-textarea {
    padding-top: 24px;
}
.form-v3-textarea:focus-within {
    box-shadow: var(--ax-focus-shadow);
}
.form-v3-textarea .form-v3-text__input {
    padding-top: 0;
}
.form-v3-textarea .form-v3-text__input:focus {
    box-shadow: none;
}
/*
 * Disabled styles that apply to all inputs
 */
.form-v3-input__input.disabled,
.form-v3-input__input:disabled,
.form-v3-input__input.disabled + .form-v3-input__label,
.form-v3-input__input:disabled + .form-v3-input__label,
.form-v3-text__input.disabled,
.form-v3-text__input:disabled,
.form-v3-text__input.disabled + .form-v3-text__label,
.form-v3-text__input:disabled + .form-v3-text__label,
.form-v3-select__select.disabled,
.form-v3-select__select:disabled,
.form-v3-select__select.disabled + .form-v3-select__label,
.form-v3-select__select:disabled + .form-v3-select__label,
.form-v3-multiselect__button.disabled,
.form-v3-multiselect__button:disabled,
.form-v3-multiselect__button.disabled + .form-v3-multiselect__label,
.form-v3-multiselect__button:disabled + .form-v3-multiselect__label {
    cursor: default;
    opacity: 0.25;
}
/*
 * Invalid styles that apply to all inputs
 */
.form-v3-input__input.invalid.populated:not(:focus) + .form-v3-input__label,
.form-v3-text__input.invalid.populated:not(:focus) + .form-v3-text__label,
.form-v3-text__input:invalid.populated:not(:focus) + .form-v3-text__label,
.form-v3-select__select.invalid.populated:not(:focus) + .form-v3-select__label,
.form-v3-select__select:invalid.populated:not(:focus) + .form-v3-select__label,
.form-v3-multiselect__button.invalid.populated:not(:focus) + .form-v3-multiselect__label,
.form-v3-multiselect__button:invalid.populated:not(:focus) + .form-v3-multiselect__label {
    color: var(--ax-red);
}
/*
 * select & multiselect specific styles
 */
.form-v3-input__input--select,
.form-v3-select__select,
.form-v3-multiselect__button {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDExIDYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGw9IiM5OTkiIGQ9Ik0wIDBsNS41IDZMMTEgMCIvPgo8L3N2Zz4=');
    background-position: right 8px bottom 14px;
    background-repeat: no-repeat;
    background-size: 11px 6px;
    padding-right: 30px;
    cursor: pointer;
}
.form-v3-input__input--select.form-v3-select__select--calendar-date,
.form-v3-input__input--select.form-v3-multiselect__button--calendar-date,
.form-v3-select__select.form-v3-select__select--calendar-date,
.form-v3-select__select.form-v3-multiselect__button--calendar-date,
.form-v3-multiselect__button.form-v3-select__select--calendar-date,
.form-v3-multiselect__button.form-v3-multiselect__button--calendar-date {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAxOCAyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgICAgICA8cGF0aCBmaWxsPSIjNDY4MGJmIiBkPSJNMi4xIDE3LjJoMTMuMjhWNi45MkgyLjA4VjE3LjJ6bS43LTE1LjI3Yy4xLS43LjE0LTEuMi4yLTEuNjggMS41OC0uNyAxLjk2LjE1IDEuOSAxLjU3aDcuNDZjLjMtLjguMDYtMi40IDEuOTctMS42bC4zIDEuNmMyLjI0IDAgMi44NCAxLjMyIDIuNzggMy40LS4xIDMuNzIgMCA3LjQ1LS4wMiAxMS4xNyAwIDIuMzUtLjUgMi45LTIuOCAyLjktMy45LjAyLTcuODMuMDItMTEuNzUgMC0yLjMgMC0yLjc4LS41LTIuOC0yLjlDMCAxMi41NS4wNSA4LjcgMCA0Ljg1Yy0uMDItMS44Ni42LTMgMi44LTIuOTJ6Ii8+CiAgICAgICAgPHBhdGggZmlsbD0iIzQ2ODBiZiIgZD0iTTQgMTMuMzhoNC42VjguODRINCIvPgogICAgPC9zdmc+');
    background-size: 18px 20px;
}
.form-v3-input__input--select.form-v3-select__select--gift-box,
.form-v3-input__input--select.form-v3-multiselect__button--gift-box,
.form-v3-select__select.form-v3-select__select--gift-box,
.form-v3-select__select.form-v3-multiselect__button--gift-box,
.form-v3-multiselect__button.form-v3-select__select--gift-box,
.form-v3-multiselect__button.form-v3-multiselect__button--gift-box {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxOCAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJNMTIuNDcgMS41MmMtLjQgMC0uNjguMjItLjguMzdMMTAuMiAzLjhoMi4yN2MuNjIgMCAxLjEyLS41IDEuMTItMS4xMyAwLS42My0uNS0xLjE1LTEuMTUtMS4xNXptLTEuNiAxMS42N1Y1LjNINy4xM3Y4LjUzYzAgLjQuMzUuNjIuNzYuNjJoMi4yMmMuNDIgMCAuNzYtLjIuNzYtLjYydi0uNjd6TTcuODMgMy44bC0xLjUtMS45Yy0uMTItLjE2LS40LS4zOC0uOC0uMzgtLjYyIDAtMS4xMi41Mi0xLjEyIDEuMTUgMCAuNjMuNSAxLjE0IDEuMTUgMS4xNGgyLjN6TTE4IDkuNTNjMCAuMjItLjE2LjM4LS4zNy4zOEgxNi41djQuOThjMCAuNjMtLjUgMS4xNC0xLjEyIDEuMTRIMi42MkMyIDE2IDEuNSAxNS41IDEuNSAxNC44N1Y5LjlILjM4Qy4xNiA5LjkgMCA5Ljc0IDAgOS41MnYtMy44YzAtLjIyLjE2LS40LjM4LS40aDUuMTVjLTEuNDUgMC0yLjYyLTEuMTgtMi42Mi0yLjY1UzQuMSAwIDUuNTYgMGMuOCAwIDEuNS4zMyAxLjk3LjkyTDkgMi44OCAxMC41LjkyYy40Ni0uNiAxLjE4LS45MiAxLjk3LS45MiAxLjQ1IDAgMi42MiAxLjIgMi42MiAyLjY3cy0xLjIgMi42Ni0yLjY1IDIuNjZoNS4xNmMuMiAwIC4zOC4xNy4zOC4zOHYzLjg0eiIvPgo8L3N2Zz4=');
    background-size: 18px 16px;
}
/*
 * select specific styles
 */
/* for use on flatpickr datepicker. inline option injects div, breaking css selector for label positioning. JW */
/* deprecated, remove. CH AM */
.form-v3-select.default-open .form-v3-select__label {
    transform: scale(0.75) translateY(-26px);
}
/* hide the native drop down arrow in IE 11 and earlier. CH */
/* Remove: We don't support IE? CH */
.form-v3-input__input--select .form-v3-select__select::-ms-expand {
    display: none;
}
.form-v3-select__clear {
    right: 35px;
}
/*
 * multiselect specific styles
 */
.form-v3-multiselect__dropdown {
    /* start same as .ax-dropdown__panel */
    background-color: #fff;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.4);
    max-height: 430px;
    opacity: 0;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    top: 100%;
    transform: scaleY(0);
    transform-origin: center top 0;
    transition: opacity 120ms ease-in-out, transform 120ms ease-in-out;
    width: 100%;
    z-index: 2;

    /* end same as .ax-dropdown__panel */
}
.form-v3-multiselect__dropdown--reverse {
    top: auto;
    bottom: 100%;
    transform-origin: bottom;
}
.form-v3-multiselect__dropdown.form-v3-multiselect__dropdown--open {
    /* start same as .ax-dropdown__panel--open */
    opacity: 1;
    transform: scaleY(1);

    /* end same as .ax-dropdown__panel--open */
    z-index: 3; /* Browser: [iOS Safari] possibly resolving iPad disappearing open multiselect problem? -JLee 9/18/18 */
}
/*
 * Styles that apply to both checkboxes and radios
 */
:root {
    --checkbox-label-padding-left: 28px;
}
.form-v3-checkbox,
.form-v3-radio {
    overflow: hidden;
    position: relative;
    -webkit-user-select: none;
            user-select: none;
}
.form-v3-checkbox__label,
.form-v3-radio__label {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    color: #484848;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    min-height: 20px;
    min-width: 20px;
    padding: 0 0 0 var(--checkbox-label-padding-left);
}
/* Remove: user-select: none; on .form-v3-checkbox solves this. CH */
.form-v3-checkbox__label::selection,
.form-v3-radio__label::selection {
    background: transparent;
}
.form-v3-checkbox__label--empty,
.form-v3-radio__label--empty {
    padding-left: 20px;
}
.form-v3-checkbox__input,
.form-v3-radio__input {
    opacity: 0;
    left: -20px;
    position: absolute;
}
/* todo: checkbox and radio focus styles. CH */
.form-v3-checkbox__input.focus + .form-v3-checkbox__label,
.form-v3-radio__input.focus + .form-v3-checkbox__label,
.form-v3-checkbox__input.focus + .form-v3-radio__label,
.form-v3-radio__input.focus + .form-v3-radio__label {
}
.form-v3-checkbox__input.disabled + .form-v3-checkbox__label,
.form-v3-checkbox__input.disabled + .form-v3-radio__label,
.form-v3-checkbox__input:disabled + .form-v3-checkbox__label,
.form-v3-checkbox__input:disabled + .form-v3-radio__label,
.form-v3-radio__input.disabled + .form-v3-checkbox__label,
.form-v3-radio__input.disabled + .form-v3-radio__label,
.form-v3-radio__input:disabled + .form-v3-checkbox__label,
.form-v3-radio__input:disabled + .form-v3-radio__label {
    cursor: default;
    opacity: 0.25;
}
/*
 * checkbox specific styles
 */
.form-v3-checkbox {
    overflow: hidden;
    position: relative;
    -webkit-user-select: none;
            user-select: none;
}
.form-v3-checkbox__label {
    /* align-content: center; Remove: .form-v3-checkbox is not flex. CH */
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+CjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik00LjM4LDFDMi41MSwxLDEsMi41MSwxLDQuMzh2MTEuMjVDMSwxNy40OSwyLjUxLDE5LDQuMzgsMTloMTEuMjVjMS44NiwwLDMuMzgtMS41MSwzLjM4LTMuMzhWNC4zOCBDMTksMi41MSwxNy40OSwxLDE1LjYyLDFINC4zOHoiLz4KPHBhdGggZmlsbD0iI0Y1ODYzQiIgZD0iTTE1LDIwSDVjLTIuNzYsMC01LTIuMjQtNS01VjVjMC0yLjc2LDIuMjQtNSw1LTVoMTBjMi43NiwwLDUsMi4yNCw1LDV2MTBDMjAsMTcuNzYsMTcuNzYsMjAsMTUsMjB6IE01LDJDMy4zNSwyLDIsMy4zNSwyLDV2MTBjMCwxLjY1LDEuMzUsMywzLDNoMTBjMS42NSwwLDMtMS4zNSwzLTNWNWMwLTEuNjUtMS4zNS0zLTMtM0g1eiIvPgo8L3N2Zz4=');
    display: block; /* Remove: radio and checkbox should be the same (inline-block). This is existing from previous iteration. CH */
}
.form-v3-checkbox__label--force-checked {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+CjxwYXRoIGZpbGw9IiNmNTg2M2IiIGQ9Ik0xNSAyMEg1Yy0yLjc2IDAtNS0yLjI0LTUtNVY1YzAtMi43NiAyLjI0LTUgNS01aDEwYzIuNzYgMCA1IDIuMjQgNSA1djEwYzAgMi43Ni0yLjI0IDUtNSA1eiIvPgo8cGF0aCBmaWxsPSIjZmZmIiBkPSJNMTUuNyA4LjFsLTUuMSA1LjEtLjk2Ljk2Yy0uMTMuMTMtLjMuMi0uNDguMnMtLjM1LS4wNy0uNDgtLjJsLS45Ni0uOTYtMi41Mi0yLjU1Yy0uMTMtLjEzLS4yLS4zLS4yLS40OCAwLS4xNy4wNy0uMzUuMi0uNDhsLjk2LS45OGMuMTMtLjEzLjMtLjIuNDgtLjJzLjM1LjA3LjQ4LjJMOS4yIDEwLjhsNC42LTQuNjJjLjEzLS4xMy4zLS4yLjQ4LS4ycy4zNS4wNy40OC4ybC45Ni45NmMuMTMuMTMuMi4zLjIuNDgtLjAzLjItLjEuMzYtLjIzLjUiLz4KPC9zdmc+');
}
.form-v3-checkbox__label--partially-checked {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+CjxwYXRoIGZpbGw9IiNmNTg2M2IiIGQ9Ik0xNSAyMEg1Yy0yLjc2IDAtNS0yLjI0LTUtNVY1YzAtMi43NiAyLjI0LTUgNS01aDEwYzIuNzYgMCA1IDIuMjQgNSA1djEwYzAgMi43Ni0yLjI0IDUtNSA1eiIvPgo8cGF0aCBmaWxsPSIjZmZmIiBkPSJNMTQuMjgsMTEuMzVINS43MWMtMC4xOCwwLTAuMzUtMC4wNy0wLjQ4LTAuMmMtMC4xMy0wLjEzLTAuMi0wLjMtMC4yLTAuNDhsMC4wMi0xLjM0CgljMC0wLjE4LDAuMDctMC4zNSwwLjItMC40OGMwLjEyLTAuMTIsMC4zLTAuMiwwLjQ4LTAuMmw4LjU2LDBjMC4xOCwwLDAuMzUsMC4wNywwLjQ4LDAuMmMwLjEzLDAuMTMsMC4yLDAuMywwLjIsMC40OHYxLjM2CgljMCwwLjE4LTAuMDcsMC4zNS0wLjIsMC40OGMtMC4xNiwwLjEyLTAuMzMsMC4xOC0wLjUyLDAuMTkiLz4KPC9zdmc+');
}
.form-v3-checkbox__label--padded {
    background-position: 10px 7px;
    padding: 7px 7px 7px 37px;

    /* width: 100%; Remove|Document: is this needed? display: block; is 100% CH */
}
.form-v3-checkbox__input:checked + .form-v3-checkbox__label {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+CjxwYXRoIGZpbGw9IiNmNTg2M2IiIGQ9Ik0xNSAyMEg1Yy0yLjc2IDAtNS0yLjI0LTUtNVY1YzAtMi43NiAyLjI0LTUgNS01aDEwYzIuNzYgMCA1IDIuMjQgNSA1djEwYzAgMi43Ni0yLjI0IDUtNSA1eiIvPgo8cGF0aCBmaWxsPSIjZmZmIiBkPSJNMTUuNyA4LjFsLTUuMSA1LjEtLjk2Ljk2Yy0uMTMuMTMtLjMuMi0uNDguMnMtLjM1LS4wNy0uNDgtLjJsLS45Ni0uOTYtMi41Mi0yLjU1Yy0uMTMtLjEzLS4yLS4zLS4yLS40OCAwLS4xNy4wNy0uMzUuMi0uNDhsLjk2LS45OGMuMTMtLjEzLjMtLjIuNDgtLjJzLjM1LjA3LjQ4LjJMOS4yIDEwLjhsNC42LTQuNjJjLjEzLS4xMy4zLS4yLjQ4LS4ycy4zNS4wNy40OC4ybC45Ni45NmMuMTMuMTMuMi4zLjIuNDgtLjAzLjItLjEuMzYtLjIzLjUiLz4KPC9zdmc+');
}
/*
 * radio specific styles
 */
.form-v3-radio__label {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMiAyMiI+PGNpcmNsZSBjeD0iMTEiIGN5PSIxMSIgcj0iMTAiIGZpbGw9IiNmZmYiLz48Y2lyY2xlIGN4PSIxMSIgY3k9IjExIiByPSI2IiBmaWxsPSIjZmRlYWRlIi8+PHBhdGggZD0iTTExIDEuNUE5LjUgOS41IDAgMSAxIDEuNSAxMSA5LjUgOS41IDAgMCAxIDExIDEuNU0xMSAwYTExIDExIDAgMSAwIDExIDExQTExIDExIDAgMCAwIDExIDB6IiBmaWxsPSIjZjU5NTU5Ii8+PC9zdmc+');
    background-position: 0 center; /* Remove: radio and checkbox should be the same. This is existing from previous iteration. CH */
}
.form-v3-radio__input:checked + .form-v3-radio__label {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMiAyMiI+PGNpcmNsZSBjeD0iMTEiIGN5PSIxMSIgcj0iMTAiIGZpbGw9IiNmZmYiLz48Y2lyY2xlIGN4PSIxMSIgY3k9IjExIiByPSI2IiBmaWxsPSIjZjU5NTU5Ii8+PHBhdGggZD0iTTExIDEuNUE5LjUgOS41IDAgMSAxIDEuNSAxMSA5LjUgOS41IDAgMCAxIDExIDEuNU0xMSAwYTExIDExIDAgMSAwIDExIDExQTExIDExIDAgMCAwIDExIDB6IiBmaWxsPSIjZjU5NTU5Ii8+PC9zdmc+');
}
/*
 * input groups
 */
.form-v3-group {
    align-items: stretch;
    background-color: #f8f8f8;
    display: flex;
}
.form-v3-group:focus-within {
    box-shadow: var(--ax-focus-shadow);
}
.form-v3-group .form-v3-text__input:focus,
.form-v3-group .form-v3-select__select:focus,
.form-v3-group .form-v3-multiselect__button:focus {
    box-shadow: none;
}
.form-v3-group > :not(.form-v3-icon) {
    flex-grow: 1;
}
/*
 * icons
 */
/* rename this to something like addon. CH, AM, JL */
.form-v3-icon {
    align-items: center;
    display: flex;
    justify-content: center;
    width: var(--ax-form-icon-width);
    flex-grow: 0;
}
/*
 * Error messages
 */
.form-v3-error {
    color: var(--ax-red);
    font-size: 14px;
    margin-top: 5px;
}
.form-v3-error:empty {
    display: none;
}
.form-v3-hint {
    color: var(--ax-font-light);
    font-size: 14px;
    margin-top: 5px;
}
.form-v3-hint:empty {
    display: none;
}
/*
 * fancy dropdown on build-team
 */
.fauxdown {
    background: #fff;

    /* margin: 5px 0 15px 0; */
    position: relative; /* Enable absolute positioning for children and pseudo elements. JL */
    vertical-align: top; /* for firefox alignment. JL */
    width: 175px;
}
/* styling for click-to-close */
/* this span "fauxdown__closed-label" must be the clickable element */
.fauxdown__closed-label {
    background-size: 11px 6px;
    background-repeat: no-repeat;
    background-position: right 5px bottom 13px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDExIDYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGw9IiM5OTkiIGQ9Ik0wIDBsNS41IDZMMTEgMCIvPgo8L3N2Zz4=);
    outline: none;
    padding-right: 20px;
    width: 100%;
}
.fauxdown__fancy-ul {
    background: #fff;
    border: 1px solid #ccc;
    display: none;
    list-style: none;
    margin: -1px 0 0;
    position: absolute;
    top: 100%;
    width: 100%;
    z-index: 10;
}
.fauxdown--active .fauxdown__fancy-ul {
    display: block;
}
.fauxdown__option {
    width: 100%;
}
.fauxdown__option:hover {
    background-color: #eee;
}
.fauxdown__fancy-a {
    cursor: pointer;
    text-decoration: none;
}
.fauxdown__fancy-a:hover {
    background-color: #eee;
    text-decoration: none;
}
form:invalid button[type='submit'] {
    cursor: default;
    opacity: 0.25;
    pointer-events: none;
}
button {
    cursor: pointer;
}
button.disabled,
button:disabled {
    cursor: default;
    opacity: 0.25;
}
/* don't use this, use one with a size. */
.button-v3 {
    appearance: none;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transition: 100ms ease-out;
}
.button-v3:focus {
    outline: 0;
    box-shadow: var(--ax-focus-shadow);
}
.button-v3--xs {
    appearance: none;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transition: 100ms ease-out;
    font-size: 14px;
    padding: 2px 5px;
}
.button-v3--xs:focus {
    outline: 0;
    box-shadow: var(--ax-focus-shadow);
}
.button-v3--sm {
    appearance: none;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transition: 100ms ease-out;
    font-size: 18px;
    padding: 10px 15px;
}
.button-v3--sm:focus {
    outline: 0;
    box-shadow: var(--ax-focus-shadow);
}
.button-v3--md {
    appearance: none;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transition: 100ms ease-out;
    font-size: 25px;
    padding: 10px 25px;
}
.button-v3--md:focus {
    outline: 0;
    box-shadow: var(--ax-focus-shadow);
}
.button-v3--lg {
    appearance: none;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    display: inline-block;
    font-family: Roboto, sans-serif;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transition: 100ms ease-out;
    font-size: 30px;
    padding: 10px 35px;
}
.button-v3--lg:focus {
    outline: 0;
    box-shadow: var(--ax-focus-shadow);
}
/* blue */
.button-v3--solid-blue {
    background-color: var(--ax-blue);
    border-color: var(--ax-blue);
    color: #fff;
    fill: #fff;
}
.button-v3--solid-blue:hover:not(:disabled) {
    background-color: #6293c9;
    border-color: #6293c9;
}
.button-v3--outline-blue {
    background-color: #fff;
    border-color: var(--ax-blue);
    color: var(--ax-blue);
    fill: var(--ax-blue);
}
.button-v3--outline-blue:hover:not(:disabled) {
    background-color: #efefef;
}
.button-v3--text-blue {
    background-color: transparent;
    border-color: transparent;
    color: var(--ax-blue);
    fill: var(--ax-blue);
}
.button-v3--text-blue:hover:not(:disabled) {
    background-color: #efefef;
}
/* red */
.button-v3--solid-red {
    background-color: var(--ax-red);
    border-color: var(--ax-red);
    color: #fff;
    fill: #fff;
}
.button-v3--solid-red:hover:not(:disabled) {
    background-color: #e96563;
    border-color: #e96563;
}
.button-v3--outline-red {
    background-color: #fff;
    border-color: var(--ax-red);
    color: var(--ax-red);
    fill: var(--ax-red);
}
.button-v3--text-red {
    background-color: transparent;
    border-color: transparent;
    color: var(--ax-red);
    fill: var(--ax-red);
}
.button-v3--text-red:hover:not(:disabled) {
    background-color: #efefef;
}
/* green */
.button-v3--solid-green {
    background-color: var(--ax-green);
    border-color: var(--ax-green);
    color: #fff;
    fill: #fff;
}
.button-v3--solid-green:hover:not(:disabled) {
    background-color: #9cce5e;
    border-color: #9cce5e;
}
.button-v3--outline-green {
    background-color: #fff;
    border-color: var(--ax-green);
    color: var(--ax-green);
    fill: var(--ax-green);
}
.button-v3--text-green {
    background-color: transparent;
    border-color: transparent;
    color: var(--ax-green);
    fill: var(--ax-green);
}
.button-v3--text-green:hover:not(:disabled) {
    background-color: #efefef;
}
/* orange */
.button-v3--solid-orange {
    background-color: var(--ax-orange);
    border-color: var(--ax-orange);
    color: #fff;
    fill: #fff;
}
.button-v3--solid-orange:hover:not(:disabled) {
    background-color: #f79858;
    border-color: #f79858;
}
.button-v3--outline-orange {
    background-color: #fff;
    border-color: var(--ax-orange);
    color: var(--ax-orange);
    fill: var(--ax-orange);
}
.button-v3--text-orange {
    background-color: transparent;
    border-color: transparent;
    color: var(--ax-orange);
    fill: var(--ax-orange);
}
.button-v3--text-orange:hover:not(:disabled) {
    background-color: #efefef;
}
.br-none {
    border: none;
}
.br--xs {
    border-style: solid;
    border-width: 1px;
}
.br--sm {
    border-style: solid;
    border-width: 2px;
}
.br--md {
    border-style: solid;
    border-width: 3px;
}
.br--lg {
    border-style: solid;
    border-width: 5px;
}
.br--xl {
    border-style: solid;
    border-width: 10px;
}
.br--xxl {
    border-style: solid;
    border-width: 25px;
}
.br--dashed {
    border-style: dashed;
}
/* border-top */
.br-t--xs {
    border-top-style: solid;
    border-top-width: 1px;
}
.br-t--sm {
    border-top-style: solid;
    border-top-width: 2px;
}
.br-t--md {
    border-top-style: solid;
    border-top-width: 3px;
}
.br-t--lg {
    border-top-style: solid;
    border-top-width: 5px;
}
.br-t--xl {
    border-top-style: solid;
    border-top-width: 10px;
}
.br-t--xxl {
    border-top-style: solid;
    border-top-width: 25px;
}
.br-t--dashed {
    border-top-style: dashed;
}
/* border-right */
.br-r--xs {
    border-right-style: solid;
    border-right-width: 1px;
}
.br-r--sm {
    border-right-style: solid;
    border-right-width: 2px;
}
.br-r--md {
    border-right-style: solid;
    border-right-width: 3px;
}
.br-r--lg {
    border-right-style: solid;
    border-right-width: 5px;
}
.br-r--dashed {
    border-right-style: dashed;
}
/* border-bottom */
.br-b--xs {
    border-bottom-style: solid;
    border-bottom-width: 1px;
}
.br-b--sm {
    border-bottom-style: solid;
    border-bottom-width: 2px;
}
.br-b--md {
    border-bottom-style: solid;
    border-bottom-width: 3px;
}
.br-b--lg {
    border-bottom-style: solid;
    border-bottom-width: 5px;
}
.br-b--dashed {
    border-bottom-style: dashed;
}
/* border-bottom */
.br-l--xs {
    border-left-style: solid;
    border-left-width: 1px;
}
.br-l--sm {
    border-left-style: solid;
    border-left-width: 2px;
}
.br-l--md {
    border-left-style: solid;
    border-left-width: 3px;
}
.br-l--lg {
    border-left-style: solid;
    border-left-width: 5px;
}
.br-l--dashed {
    border-left-style: dashed;
}
/* border-x */
.br-x--xs {
    border-left-style: solid;
    border-left-width: 1px;
    border-right-style: solid;
    border-right-width: 1px;
}
.br-x--sm {
    border-left-style: solid;
    border-left-width: 2px;
    border-right-style: solid;
    border-right-width: 2px;
}
.br-x--md {
    border-left-style: solid;
    border-left-width: 3px;
    border-right-style: solid;
    border-right-width: 3px;
}
.br-x--lg {
    border-left-style: solid;
    border-left-width: 5px;
    border-right-style: solid;
    border-right-width: 5px;
}
/* border-y */
.br-y--xs {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-top-width: 1px;
}
.br-y--sm {
    border-bottom-style: solid;
    border-bottom-width: 2px;
    border-top-style: solid;
    border-top-width: 2px;
}
.br-y--md {
    border-bottom-style: solid;
    border-bottom-width: 3px;
    border-top-style: solid;
    border-top-width: 3px;
}
.br-y--lg {
    border-bottom-style: solid;
    border-bottom-width: 5px;
    border-top-style: solid;
    border-top-width: 5px;
}
/* border-colors */
.br--transparent {
    border-color: transparent;
}
.br--blue {
    border-color: var(--ax-blue);
}
.br--light-blue {
    border-color: var(--ax-lightest-blue);
}
.br--cyan {
    border-color: var(--ax-cyan);
}
.br--orange {
    border-color: var(--ax-orange);
}
.br--light-orange {
    border-color: var(--ax-orange-light);
}
.br--green {
    border-color: var(--ax-green);
}
.br--light-green {
    border-color: var(--ax-green-light);
}
.br--yellow {
    border-color: #fd0;
}
.br--light-yellow {
    border-color: #fff9e3;
}
.br--red {
    border-color: var(--ax-red);
}
.br--purple {
    border-color: var(--ax-purple);
}
.br--gray-blue-background {
    border-color: #e9eaed;
}
.br--black {
    border-color: #000;
}
.br--gray-4d {
    border-color: #4d4d4d;
}
.br--gray-77 {
    border-color: #777;
}
.br--gray-9d {
    border-color: #9d9d9d;
}
.br--gray-cc {
    border-color: #ccc;
}
.br--gray-dc {
    border-color: #dcdcdc;
}
.br--gray-e0 {
    border-color: #e0e0e0;
}
.br--gray-ef {
    border-color: #efefef;
}
.br--gray-f8 {
    border-color: #f8f8f8;
}
.br--white {
    border-color: #fff;
}
/* border colors by side */
.br-b--cyan {
    border-bottom-color: var(--ax-cyan);
}
.br-t--cyan {
    border-top-color: var(--ax-cyan);
}
.br-r--cyan {
    border-right-color: var(--ax-cyan);
}
.br-l--cyan {
    border-left-color: var(--ax-cyan);
}
/* border radius */
.br--circle {
    border-radius: 100%;
}
.pw-strength__container{}
/* reset page, custom bg color */
.bg--44668b {
    background-color: #44668b;
}
.pw-strength__meter {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-grow: 1;
    min-width: 0;

    /* this allows flex children to break words and truncate text  */
    margin-right: 25px;
}
.pw-strength__meter-step {
    border-top-style: solid;
    border-top-width: 1px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-style: solid;
    border-left-width: 1px;
    width: 33.3333333%;
    height: 10px;
}
.pw-strength__meter-step:last-child {
    border-right-style: solid;
    border-right-width: 1px;
}
/* for the reset page, custom border color */
.pw-strength__meter-step--0A4A6F {
    border-top-style: solid;
    border-top-width: 1px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-style: solid;
    border-left-width: 1px;
    width: 33.3333333%;
    height: 10px;
    border-color: #0a4a6f;
}
.pw-strength__meter-step--0A4A6F:last-child {
    border-right-style: solid;
    border-right-width: 1px;
}
.pw-strength__label {
    color: #ccc;
    font-size: 12px;
    padding-right: 10px;
}
.pw-strength__label--a8 {
    color: #a8a8a8;
    font-size: 12px;
    padding-right: 10px;
}
.pw-strength__label--strength {
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}
/* to update password strength portion work on angular pages without the vue show/hide password component */
.form-v3-text__input-pw-reset--angular {
    appearance: none;
    border: 1px solid transparent;
    box-shadow: none;
    color: #313131;
    display: block;
    font-size: 16px;
    min-height: 100%;
    padding: 24px 10px 5px;
    text-align: left;
    line-height: 20px;
    font-family: inherit;
    background-color: #fff;
    border-color: #fff;

    /* hack for the outline to work with the show/hide password */
    margin-right: -40px;
    width: calc(100% + 40px);
}
.form-v3-text__input-pw-reset--angular.focus,
.form-v3-text__input-pw-reset--angular:focus {
    outline: none;
    box-shadow: var(--ax-focus-shadow);
}
.form-v3-text__input-pw-reset--angular.required:not(.populated, :focus),
.form-v3-text__input-pw-reset--angular:required:not(.populated, :focus) {
    background-color: var(--ax-orange-light);
    border-color: var(--ax-orange);
}
.form-v3-text__input-pw-reset--angular.invalid.populated:not(:focus),
.form-v3-text__input-pw-reset--angular:invalid.populated:not(:focus) {
    border-color: var(--ax-red);
}
.form-v3-text__input-pw-reset--angular.focus,
.form-v3-text__input-pw-reset--angular:focus {
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(245, 134, 59, 0.8);
}
.form-v3-text__input-pw-reset--angular:required:not(.populated, .form-v3-text__input-pw-reset--angular :focus) {
    background-color: #fff;
    border-color: #fff;
}
.form-v3-text__input-pw-reset--angular:required:not(:valid, .form-v3-text__input-pw-reset--angular :focus) {
    background-color: var(--ax-orange-light);
    border-color: var(--ax-orange);
}
.ax-password-input__button--angular {
    background-color: transparent;
    border: 0;
    outline: 0;
    z-index: 1;
}
*,
*::before,
*::after {
    box-sizing: inherit;
}
html {
    box-sizing: border-box;
    min-height: 100%;
}
body {
    background: #1e4a6c url(/Images/Login/2019/signin-rooftop.jpg) no-repeat left center;
    background-size: cover;
    background-attachment: fixed;
    color: var(--ax-font-default);
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 300;
    margin: 0;
    min-height: 100%;
    padding: 0;
}
@media (min-width: 1024px) {
    body {
        background: #1e4a6c url(/Images/Login/2019/signin-rooftop.jpg) no-repeat 0 100px;
        background-size: cover;
        background-attachment: fixed;
    }
}
@media (min-width: 1600px) {
    body {
        background: #1e4a6c url(/Images/Login/2019/signin-rooftop.jpg) no-repeat 140px 100px;
        background-size: cover;
        background-attachment: fixed;
    }
}
body.terms {
    background: #fff;
}
p {
    margin: 0;
    padding: 0;
}
h2 {
    margin: 0;
    padding: 0;
}
@media (max-width: 767px) {
    .hidden-xs {
        display: none;
    }
}
.news-status {
    background: rgba(255, 255, 255, 0.3);
    margin-left: auto;
    margin-right: auto;
    width: 277px;
    margin-top: -20px;
    margin-bottom: 30px;
}
@media (min-width: 1024px) {
    .news-status {
        margin-top: -50px;
        margin-bottom: 50px;
        width: 460px;
    }
}
.news-status__item {
    margin-bottom: 20px;
}
.news-status__item:last-child {
    margin-bottom: 0;
}
.header {
    width: 277px;
}
@media (min-width: 1024px) {
    .header {
        width: 460px;
    }
}
.header__icon-logo {
    margin: 54px 0 48px;
    padding: 0;
    text-align: center;
}
@media (min-width: 1024px) {
    .header__icon-logo {
        margin: 96px 0 84px;
    }
}
.header__icon-acculynx-logo {
    fill: #fff;
    height: 46px;
    width: 247px;
}
@media (min-width: 1024px) {
    .header__icon-acculynx-logo {
        height: 46px;
        width: 330px;
    }
}
@media (min-width: 1280px) {
    .header__icon-acculynx-logo {
        height: 82px;
        width: 442px;
    }
}
.container {
    height: 100%;
    width: 100%;
    flex-direction: column;
}
@media (min-width: 1024px) {
    .container {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
}
.signin-pane {
    height: 100%;
}
.signin-pane .contains-promo & {
    /* min-height: 570px; mobile */
}
.signin-pane.signin--invalid {
    /* min-height: 600px; */
}
@media (min-width: 1024px) {
    .signin-pane {
        height: 100vh;
        width: 100%;
    }

    .contains-promo .signin-pane {
        height: 100vh;
        width: 60%;
    }
}
.signin-pane__container {
    max-width: 277px;
    min-height: 570px;
    justify-content: flex-start;
    align-items: center;
}
.signin-pane__container.signin--invalid {
    min-height: 600px;
}
@media (min-width: 1024px) {
    .signin-pane__container {
        min-height: 580px;
        max-width: 460px;
        justify-content: center;
        align-items: center;
    }
}
.signin__form {
    width: 100%;
}
.signin__form__heading {
    font-size: 36px;
}
@media (min-width: 1024px) {
    .signin__form__heading {
        font-size: 48px;
    }
}
.signin__form__heading--reset {
    font-size: 36px;
    margin-bottom: 20px;
}
@media (min-width: 1024px) {
    .signin__form__heading--reset {
        font-size: 48px;
    }
}
@media (min-width: 1024px) {
    .signin__form__heading--reset {
        margin-bottom: 30px;
    }
}
@media (min-width: 1024px) {
    .promo__container {
        width: 40%;
    }
}
@media (min-width: 1024px) {
    .promo__faux-col {
        background-color: #fff;
        position: fixed;
        top: 0;
        bottom: 0;
        width: 100%;
    }
}
.promo {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    height: calc(100vh - 570px);
    margin: auto;
    min-height: 410px;
    width: 100%;
}
@media (min-width: 1024px) {
    .promo {
        justify-content: center;
        align-items: flex-start;
        height: calc(100vh);
        padding-top: 220px;
        position: relative;
        width: 100%;
        z-index: 100;
    }
}
.promo__mobile {
    height: 310px;
    width: 260px;
}
@media (min-width: 1024px) {
    .promo__mobile {
        display: none;
    }
}
.promo__desktop {
    display: none;
}
@media (min-width: 1024px) {
    .promo__desktop {
        display: block;
        height: 490px;
        width: 400px;
    }
}
.hr-dashed {
    border: 0;
    border-bottom: 1px dashed #bfbfbf;
    margin-top: 0;
}
.remember .form-v3-checkbox__label {
    color: #fff;
    font-size: 13px;
}
@media (max-width: 767px) {
    .remember .form-v3-checkbox__label {
        background-size: 18px 18px;
        font-size: 14px;
        min-height: 18px;
        min-width: 18px;
        padding: 1px 0 0 26px;
    }
}
@media (min-width: 1024px) {
    .remember .form-v3-checkbox__label {
        font-size: 16px;
    }
}
.hr {
    border: 0;
    border-bottom: 1px solid #979797;
    margin-bottom: 30px;
    margin-top: 30px;
}
@media (min-width: 1024px) {
    .hr {
        margin-bottom: 50px;
        margin-top: 50px;
    }
}
.form-v3-text__input--signin {
    appearance: none;
    border: 1px solid transparent;
    box-shadow: none;
    color: #313131;
    display: block;
    font-size: 16px;
    min-height: 100%;
    text-align: left;
    width: 100%;
    line-height: 20px;
    font-family: inherit;
    background-color: #fff;
    border-color: #fff;
    padding: 6px 12px;
}
.form-v3-text__input--signin.focus,
.form-v3-text__input--signin:focus {
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(245, 134, 59, 0.8);
}
.form-v3-text__input--signin:required:not(.populated, :focus) {
    background-color: #fff;
    border-color: #fff;
}
.form-v3-text__input--signin:required:not(:valid, :focus) {
    background-color: var(--ax-orange-light);
    border-color: var(--ax-orange);
}
.form-v3-text__input-pw-reset--signin {
    appearance: none;
    border: 1px solid transparent;
    box-shadow: none;
    color: #313131;
    display: block;
    font-size: 16px;
    min-height: 100%;
    text-align: left;
    line-height: 20px;
    font-family: inherit;
    background-color: #fff;
    border-color: #fff;
    padding: 6px 12px;

    /* hack for the outline to work with the show/hide password */
    margin-right: -40px;
    width: calc(100% + 40px);
}
.form-v3-text__input-pw-reset--signin.focus,
.form-v3-text__input-pw-reset--signin:focus {
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(245, 134, 59, 0.8);
}
.form-v3-text__input-pw-reset--signin:required:not(.populated, :focus) {
    background-color: #fff;
    border-color: #fff;
}
.form-v3-text__input-pw-reset--signin:required:not(:valid, :focus) {
    background-color: var(--ax-orange-light);
    border-color: var(--ax-orange);
}
.ax-password-input__button {
    background-color: transparent;
    border: 0;
    outline: 0;
    z-index: 1;
}
.signin__form__pw {
    margin-bottom: 20px;
}
@media (min-width: 1024px) {
    .signin__form__pw {
        margin-bottom: 50px;
    }
}
.form-v3-text__label--signin {
    display: none;
}
.button-v3--solid-orange {
    background-color: #f5925c;
    border-color: #f5925c;
    border-radius: 25px;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
    padding: 8px 20px;
    text-transform: uppercase;
}
.button-v3--solid-orange:hover {
    background-color: tint(#f5925c, 15%);
    border-color: tint(#f5925c, 15%);
}
@media (min-width: 1024px) {
    .button-v3--solid-orange {
        font-size: 16px;
    }
}
/* Errors List */
.reset-form .parsley-error-list {
    margin: 15px 0;
    padding: 0;
}
.reset-form .parsley-error-list li {
    color: #ff8b4f;
    font-size: 14px;
    list-style-type: none;
    text-align: center;
    line-height: 24px;
}
.text-error ul {
    margin: 0;
    padding: 5px 0 10px;
}
.text-error li {
    color: #ff8b4f;
    font-size: 14px;
    line-height: 24px;
    list-style-type: none;
    widows: 2;
    orphans: 2;
    text-align: center;
}
.icon-x {
    fill: var(--ax-blue);
    height: 15px;
    transform: rotate(45deg);
    width: 15px;
}
.overlay__body h1,
.overlay__body h2,
.overlay__body h3,
.overlay__body h4,
.overlay__body h5,
.overlay__body h6 {
    margin: 10px 0;
    text-rendering: optimizelegibility;
}
/* TERMS AND CONDITIONS styles, combo bootstrap helpers and font styles */
.overlay__body {
    line-height: 20px;
}
.overlay__body .form-terms {
    max-width: 1200px;
}
.overlay__body .form-terms .row-fluid {
    margin-bottom: 15px;
    margin-top: 15px;
    font-size: 0.8em;
}
.overlay__body p {
    text-align: left;
}
.overlay__body p.terms {
    font-size: 0.82em;
    padding: 15px 0 0;
    text-align: center;
}
.overlay__body p.major {
    text-indent: 2em;
}
.overlay__body .row-fluid p {
    margin-bottom: 1.5em;
    text-indent: 4em;
}
.overlay__body p.build {
    text-indent: 6em;
}
.overlay__body .agreement {
    text-align: justify;
}
.overlay__body p.faded {
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
    text-indent: 0;
    margin-bottom: 0.9em;
}
.overlay__body h4 {
    font-size: 17.5px;
}
/* TERMS AND CONDITIONS continued */
/* These styles are necessary for the "basically" column to work properly */
.row-fluid {
    width: 100%;
    *zoom: 1;
}
.row-fluid::before,
.row-fluid::after {
    display: table;
    line-height: 0;
    content: '';
}
.row-fluid::after {
    clear: both;
}
.row-fluid [class*='span'] {
    display: block;
    float: left;
    width: 100%;
    min-height: 30px;
    margin-left: 2.127659574468085%;
    *margin-left: 2.074468085106383%;
    box-sizing: border-box;
}
.row-fluid [class*='span']:first-child {
    margin-left: 0;
}
.row-fluid .controls-row [class*='span'] + [class*='span'] {
    margin-left: 2.127659574468085%;
}
.span4 {
    width: 300px;
}
@media (min-width: 1200px) {
    .span4 {
        width: 370px;
    }

    .row-fluid .span4 {
        width: 31.623931623931625%;
        *width: 31.570740134569924%;
    }
}
@media (min-width: 768px) and (max-width: 1199px) {
    .span4 {
        width: 228px;
    }

    .row-fluid .span4 {
        width: 31.491712707182323%;
        *width: 31.43852121782062%;
    }
}
@media (max-width: 767px) {
    .span4 {
        max-width: 97%;
    }
}
.span7 {
    width: 540px;
}
@media (min-width: 1200px) {
    .span7 {
        width: 670px;
    }

    .row-fluid .span7 {
        width: 57.26495726495726%;
        *width: 57.21176577559556%;
    }
}
@media (min-width: 768px) and (max-width: 1199px) {
    .span7 {
        width: 414px;
    }

    .row-fluid .span7 {
        width: 57.18232044198895%;
        *width: 57.12912895262725%;
    }
}
/* DIALOG OVERRIDES */
.overlay .overlay__footer button.button {
    height: 50px;
}

.gsi-material-button {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -webkit-appearance: none;
    background-color: WHITE;
    background-image: none;
    border: none;
    /*-webkit-border-radius: 4px;
    border-radius: 4px;*/
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #1f1f1f;
    cursor: pointer;
    font-family: 'Roboto', arial, sans-serif;
    font-size: 14px;
    height: 41px;
    letter-spacing: 0.25px;
    outline: none;
    overflow: hidden;
    padding: 0 12px;
    position: relative;
    text-align: center;
    -webkit-transition: background-color .218s, border-color .218s, box-shadow .218s;
    transition: background-color .218s, border-color .218s, box-shadow .218s;
    vertical-align: middle;
    white-space: nowrap;
    width: 215px;
    max-width: 400px;
    min-width: min-content;
}

.gsi-material-button .gsi-material-button-icon {
    height: 20px;
    margin-right: 12px;
    min-width: 20px;
    width: 20px;
}

.gsi-material-button .gsi-material-button-content-wrapper {
    -webkit-align-items: center;
    align-items: center;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 100%;
    justify-content: space-between;
    position: relative;
    width: 100%;
}

.gsi-material-button .gsi-material-button-contents {
    -webkit-flex-grow: 1;
    flex-grow: 1;
    font-family: 'Segoe UI Regular', arial, sans-serif;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
    color: #6A6A6A;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.5px;
}

.gsi-material-button .gsi-material-button-state {
    -webkit-transition: opacity .218s;
    transition: opacity .218s;
    bottom: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.gsi-material-button:disabled {
    cursor: default;
    background-color: #ffffff61;
    border-color: #1f1f1f1f;
}

    .gsi-material-button:disabled .gsi-material-button-contents {
        opacity: 38%;
    }

    .gsi-material-button:disabled .gsi-material-button-icon {
        opacity: 38%;
    }

.gsi-material-button:not(:disabled):active .gsi-material-button-state,
.gsi-material-button:not(:disabled):focus .gsi-material-button-state {
    background-color: #303030;
    opacity: 12%;
}

.gsi-material-button:not(:disabled):hover {
    -webkit-box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15);
    box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15);
}

.gsi-material-button:not(:disabled):hover .gsi-material-button-state {
    background-color: #303030;
    opacity: 8%;
}