@media only screen and (max-width: 1600px) { html { --scale: 0.83333333333333; } }@media only screen and (max-width: 1536px) { html { --scale: 0.8; } }@media only screen and (max-width: 1440px) { html { --scale: 0.75; } }@media only screen and (max-width: 1366px) { html { --scale: 0.71145833333333; } }@media only screen and (max-width: 1280px) { html { --scale: 0.66666666666667; } }@media only screen and (max-width: 1024px) { html { --scale: 0.53333333333333; } }@media only screen and (max-width: 768px) { html { --scale: 0.4; } }.auth-page {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

    overflow: auto;

    background-color: var(--off-white-2);

    font-size: 1rem;
}

.auth-page__inner {
    --margin: 55px;

    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;

    width: calc(100% - 2 * var(--margin));
    max-width: 866px;
    margin: var(--margin);
}

.auth-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;

    padding: 8px;
    min-height: 600px;
    width: 100%;
    max-width: 866px;

    background-color: var(--off-white-1);
    border-radius: 9px;
}


/* ——— Content ——— */

.auth-form__content {
    --margin: 45px;
    
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

    width: calc(100% - 2 * var(--margin));
    max-width: 513px;
    margin: var(--margin);
    margin-top: 55px;

    color: var(--navy-blue);
}

.auth-form__content__heading {
    margin-bottom: 57px;

    font-size: 1.6em;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
}

.auth-form__content__prompt {
    margin-top: -32px;
    margin-bottom: 32px;

    font-size: 0.88em;
    font-weight: bold;
    text-align: center;
    color: var(--dark-cyan);
}

.auth-form__content__large-buttons,
.auth-form__content__dropdowns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}

.auth-form__content__large-buttons {
    --button-margin: 6px;

    margin: calc(-1 * var(--button-margin));
}

.auth-form__content__large-buttons > .button {
    --box-shadow--default: 0 0 15px rgba(136, 181, 193, 0.2);

    padding: 14px;
    min-height: 120px;
    min-width: 217px;
    margin: var(--button-margin);

    border-radius: 14px;

    font-size: 1em;
}

.auth-form__content__dropdowns {
    --box-shadow: 0 0 15px rgba(136, 181, 193, 0.2);

    border-radius: 14px;
    overflow: hidden;

    -webkit-box-shadow: var(--box-shadow);
        -moz-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);
}

.auth-form__content__dropdowns > .custom-select {
    height: 72px;

    background-color: var(--dark-cyan);

    font-size: 1em;
    font-weight: bold;

    /* URL reference: https://yoksel.github.io/url-encoder/ */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22.18 13.09'%3E%3Cpath data-name='Path 77' d='M2.83 2.83l8.26 8.26 8.26-8.26' fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'/%3E%3C/svg%3E");
}
.auth-form__content__dropdowns > .custom-select:not(:first-child) {
    border-left: 2px solid var(--off-white-3);
}

.auth-form__content__text-field {
    --box-shadow: 0 0 20px rgba(101, 99, 99, 0.2);

    --placeholder-font-size: 0.8em;
    --placeholder-font-weight: bold;
    --placeholder-text-transform: uppercase;

    all: unset;

    -ms-flex-item-align: stretch;
        -ms-grid-row-align: stretch;
        align-self: stretch;

    height: 79px;

    background-color: white;
    border-radius: 9px;
    overflow: hidden;

    -webkit-box-shadow: var(--box-shadow);
        -moz-box-shadow: var(--box-shadow);
            box-shadow: var(--box-shadow);

    font-size: 0.8em;
    font-weight: bold;

    color: var(--navy-blue);
    -webkit-text-fill-color: var(--navy-blue);
}
.auth-form__content__text-field:not(input) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.auth-form__content__text-field:not(:last-child) {
    margin-bottom: 20px;
}
.auth-form__content__text-field:focus,
.auth-form__content__text-field:focus-within {
    --box-shadow: 0 0 20px var(--cyan);
}

.auth-form__content__text-field > input {
    all: unset;

    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
input.auth-form__content__text-field,
.auth-form__content__text-field > input {
    padding: 0 33px;
}

/* Separator */
.auth-form__content__text-field > svg {
    -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
}

.auth-form__content__text-field__password-visibility {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

    padding: 0 20px;

    /* Allow flex to properly align-center the SVG elements. */
    line-height: 0;

    cursor: pointer;
}

input:checked ~ .svg-icon-eye:nth-of-type(1),
input:not(:checked) ~ .svg-icon-eye:nth-of-type(2) {
    display: none;
}

.auth-form__content__warning {
    -ms-flex-item-align: start;
        align-self: flex-start;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

    margin-top: -7px;
}
.auth-form__content__dropdowns + .auth-form__content__warning {
    margin-top: 20px;
}
.auth-form__content__warning:not(:last-child) {
    margin-bottom: 13px;
}

.auth-form__content__warning > .warning-icon {
    padding: 0;
}

/* Warning message */
.auth-form__content__warning > span {
    margin-left: 8px;

    font-size: 0.6em;
    font-weight: bold;
    text-transform: uppercase;
    color: var(--red);
}

/* Warning message link */
.auth-form__content__warning > span > a {
    color: inherit;
}

.auth-form__content__forgot-password {
    -ms-flex-item-align: end;
        align-self: flex-end;

    font-size: 0.6em;
}

.auth-form__content__forgot-password > a {
    font-weight: bold;
    color: inherit;
}

.auth-form__content__newsletter {
    -ms-flex-item-align: start;
        align-self: flex-start;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;

    cursor: pointer;
}

.auth-form__content__newsletter > span {
    margin-left: 14px;

    font-size: 0.88em;
}


/* ——— Foot ——— */

.auth-form__foot {
    --child-horizontal-margin: 10px;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;

    margin: 0
        calc(20px - var(--child-horizontal-margin))
        17px;
}

.auth-form__foot__message,
.auth-page__inner__foot-message {
    font-size: 0.68em;
    color: var(--turquoise);
}
.auth-form__foot__message {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;

    margin: 0 var(--child-horizontal-margin);
}
.auth-form__foot__message--subtle {
    /* Shift the subtle message down/left slightly. */
    margin:
        0 var(--child-horizontal-margin)
        -5px calc(var(--child-horizontal-margin) - 5px);

    font-size: 0.6em;
    color: var(--grey);
}

.auth-form__foot__message > a,
.auth-page__inner__foot-message > a {
    color: inherit;
    font-weight: bold;
}
.auth-form__foot__message--subtle > a {
    font-weight: normal;
}

.auth-form__foot > .button {
    min-width: 105px;
    padding: 14px 34px;
    margin: 0 var(--child-horizontal-margin);
}

.auth-form__progress {
    --segment-margin: 3.5px;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    margin: calc(-1 * var(--segment-margin));
    margin-top: calc(5px - var(--segment-margin));
}

.auth-form__progress__segment {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;

    height: 13px;
    margin: var(--segment-margin);

    background-color: var(--off-white-3);
    border-radius: 9px;
}
.auth-form__progress__segment--complete {
    background-color: var(--dark-cyan);
}

.auth-page__inner__foot-message {
    -ms-flex-item-align: start;
        align-self: flex-start;

    margin-top: 15px;
    margin-left: 16px;
}