.what-is-aid {
    display:block;
    margin-bottom: 20px;
    text-align: center;
}

.what-is-aid:last-child {
    margin-bottom: 0;
}
:root {
  --black: #1e282d;
  --blackTransparent: rgba(30, 40, 45, 0.8);
  --white: #ffffff;
  --whiteTransparent: rgba(255, 255, 255, 0.8);
  --lighterGray: #faf9f5;
  --lightGray: #f4f4f4;
  --gray: #e7e6e2;
  --menuBorder: #4b5357;
  --darkGray: #5e5c58;
  --blue: #39a5db;
  --lightBlue: #8ec1db;
  --linkColor: #3d64a3;
  --pink: #CD006E;
  --pinkText: #CD006E;
  --red: red;
  --lightRed: #ffe4e7;
  --yellow: #f5ce50;
  --lightYellow: #f5ecce;
  --fieldGray: #dfdfdf;
  --green: #08cb08;
  --lightGreen: #def8cc;
  --brownOnYellow: #40340d;
  --boxShadow: rgba(0, 0, 0, 0.3);

  /* variables prefixed --cetera are external and set  inside _publication-style.html.erb */
  --publication-color-fallback: var(--black);
  --publication-color-inverted-fallback: var(--white);

  --background-color: var(
    --cetera-background-color,
    var(--lightGray)
  );
  --header-background-color: var(
    --cetera-publication-header-background-color,
    var(--white)
  );
  --header-border-color: var(
    --cetera-publication-header-border-color,
    var(--black)
  );
  --publication-color: var(
    --cetera-publication-color,
    var(--publication-color-fallback)
  );
  --publication-color-inverted: var(
    --cetera-publication-color-inverted,
    var(--publication-color-inverted-fallback)
  );

}

aid-non-user-vstoken-loader .company-logo {
    display: block;
    width: 60%;
    max-height: 100px;
    margin: 0 auto;
    margin-bottom: 50px;
}

aid-non-user-vstoken-loader .info-box {
    padding: 20px;
    background: var(--lightGray);
    display: flex;
    margin: 30px 0;
}

aid-non-user-vstoken-loader .svg-wrapper {
    width: 30px;
    height: 30px;
    padding: 2px;
    border: 1px solid var(--black);
    border-radius: 100%;
    display:flex;
    justify-content: center;
    flex-shrink: 0;
    margin-right: 10px;
}

aid-non-user-vstoken-loader .info-box svg {
    width: 80%;
}

aid-non-user-vstoken-loader .info-box svg path {
    fill: none;
    stroke-width: 20%;
    stroke: var(--black);
}

aid-non-user-vstoken-loader .info-box.success {
    background: var(--lightGreen);
}

aid-non-user-vstoken-loader .info-box.success .svg-wrapper {
    border-color: var(--green);
}

aid-non-user-vstoken-loader .info-box.success svg path {
    stroke: var(--green);
}

aid-non-user-vstoken-loader .info-box.err {
    background: var(--lightRed);
}

aid-non-user-vstoken-loader .info-box.err .svg-wrapper {
    border-color: var(--red);
}

aid-non-user-vstoken-loader .info-box.err svg path {
    stroke: var(--red);
}

aid-non-user-vstoken-loader .margin {
    margin: 1.2em 0 2.5em 0;
}

aid-non-user-vstoken-loader .ip-text {
    display: block;
    margin-bottom: 1em;
}
:root {
  --black: #1e282d;
  --blackTransparent: rgba(30, 40, 45, 0.8);
  --white: #ffffff;
  --whiteTransparent: rgba(255, 255, 255, 0.8);
  --lighterGray: #faf9f5;
  --lightGray: #f4f4f4;
  --gray: #e7e6e2;
  --menuBorder: #4b5357;
  --darkGray: #5e5c58;
  --blue: #39a5db;
  --lightBlue: #8ec1db;
  --linkColor: #3d64a3;
  --pink: #CD006E;
  --pinkText: #CD006E;
  --red: red;
  --lightRed: #ffe4e7;
  --yellow: #f5ce50;
  --lightYellow: #f5ecce;
  --fieldGray: #dfdfdf;
  --green: #08cb08;
  --lightGreen: #def8cc;
  --brownOnYellow: #40340d;
  --boxShadow: rgba(0, 0, 0, 0.3);

  /* variables prefixed --cetera are external and set  inside _publication-style.html.erb */
  --publication-color-fallback: var(--black);
  --publication-color-inverted-fallback: var(--white);

  --background-color: var(
    --cetera-background-color,
    var(--lightGray)
  );
  --header-background-color: var(
    --cetera-publication-header-background-color,
    var(--white)
  );
  --header-border-color: var(
    --cetera-publication-header-border-color,
    var(--black)
  );
  --publication-color: var(
    --cetera-publication-color,
    var(--publication-color-fallback)
  );
  --publication-color-inverted: var(
    --cetera-publication-color-inverted,
    var(--publication-color-inverted-fallback)
  );

}

    .container.svelte-1qjvf6x {
        margin-top: -17px;
    }

    .container.svelte-1qjvf6x .pointer:where(.svelte-1qjvf6x) {
        box-sizing: border-box;
        width: 30px;
        height: 15px;
        margin-left: 75px;
        border-left: 15px solid transparent;
        border-right: 15px solid transparent;
        border-bottom: 15px solid #FBBC0529;
    }

    .container.svelte-1qjvf6x .bubble:where(.svelte-1qjvf6x) {
        background-color: #FBBC0529;
        padding: 15px;
        font-size: 86%;
    }

    h1.svelte-1qjvf6x {
        color: var(--brownOnYellow);
        font-size: 120%;
        margin-bottom: 8px;
    }

    p.svelte-1qjvf6x {
        color: var(--brownOnYellow);
        margin-bottom: 8px;
    }

    a.svelte-1qjvf6x {
        color: var(--brownOnYellow);
        font-weight: bold;
        cursor: pointer;
    }


    div.svelte-1y80bsu {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .wrapper.svelte-u0eaqh {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .info.svelte-u0eaqh {
        display: flex;
        gap: 1.3rem;
        --svg-square-size: 67px
    }
    .info.svelte-u0eaqh p:where(.svelte-u0eaqh) {
        flex: 1;
    }
    p.svelte-u0eaqh:last-child {
        margin-bottom: 0;
    }

    .info.svelte-1x55car {
        display: flex;
        gap: 1.3rem;
        --svg-square-size: 67px
    }
    .info.svelte-1x55car p:where(.svelte-1x55car) {
        flex: 1;
        font-size: 1rem;
        font-weight: 700;
        padding-right: 20px;
    }
    .devices.svelte-1x55car {
        font-size: 12px;
        font-weight: 400;
        line-height: 1.1;
        margin-left: 5px;
        margin-right: 20px;
    }
    .how.svelte-1x55car ol:where(.svelte-1x55car) {
        margin: 20px 0;
        padding-top: 0;
        padding-left: 0;
    }
    .how.svelte-1x55car ol:where(.svelte-1x55car) li:where(.svelte-1x55car) {
        margin-left: 20px;
        margin-bottom: 0;
    }
    .biometrics.svelte-1x55car {
        display: flex;
        gap: 12px;
        align-items: flex-start;
        font-weight: 700;
        font-size: 12px;
    }
    .biometrics.svelte-1x55car p:where(.svelte-1x55car) {
        color: rgba(0, 0, 0, .74);
        padding-right: 25px;
    }
    .biometrics svg {
        width: 32px;
    }

    .username_container.svelte-1opx39a {
        display: grid;
        grid-template-columns: 0 1fr;
        transition: grid-template-columns 250ms ease-in-out;
    }

    .username_container.showFlag.svelte-1opx39a {
        grid-template-columns: auto 1fr;
    }

    .country_selector.svelte-1opx39a {
        overflow: clip;
        padding: 0;
        opacity: 0;
        transition: padding 250ms ease-in-out, opacity 250ms ease-in-out 150ms;
        border-right: 2px solid var(--fieldGray);
    }

    span.svelte-1opx39a {
        display: block;
    }

    .showFlag.svelte-1opx39a .country_selector:where(.svelte-1opx39a) {
        padding: 0 .5rem;
        opacity: 1;
    }

    .country_selector.svelte-1opx39a button:where(.svelte-1opx39a),
    .country_selector.svelte-1opx39a > dialog button {
        height: 100%;
        display: flex;
        gap: .5rem;
        border: 0;
        background: none;
        position: relative;
        align-items: center;
    }

    @supports not (display: flex) {
        /*
         * Give some gap to browser that lack flex support,
         * namely iOS 12..
         */
        .country_selector.svelte-1opx39a:first-child {
            margin-right: .5rem;
        }
    }

    .country_selector.svelte-1opx39a > dialog {
        position: absolute;
        display: block;
        margin-top: 0;
        margin-left: 0;
        margin-right: auto;
        padding: 0;
        top: 100%;
        left: -2px;
        z-index: 100;
        border: 2px solid var(--fieldGray);
        transform: scaleY(0);
        opacity: 0;
        transform-origin: top;
        transition: opacity 250ms ease-in-out, transform 250ms ease-in-out;
    }

    .country_selector.svelte-1opx39a > dialog.isOpen {
        transform: scaleY(1);
        opacity: 1;
    }

    .country_selector.svelte-1opx39a button:where(.svelte-1opx39a) {
        padding: 0;
    }

    .country_selector.svelte-1opx39a > dialog.isOpen button {
        padding: .5rem;
    }

    .toggler.svelte-16dwbbi {
        margin-top: -8px;
        display: flex;
        justify-content: right;
    }

    div.svelte-1vr1x9o {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .info.svelte-1577sck {
        display: flex;
        gap: 1.3rem;
        --svg-square-size: 67px
    }
    .info.svelte-1577sck p:where(.svelte-1577sck) {
        flex: 1;
    }
    p.svelte-1577sck:last-child {
        margin-bottom: 0;
    }

    a.svelte-c338qz {
        display: block;
        text-align: right;
        font-size: 15px;
        margin-bottom: 20px;
    }

    div.svelte-1hjnosm {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

  .providers.svelte-11gw9q3 {
      display: flex;
      gap: 1rem;
  }
  .providers.svelte-11gw9q3 > * {
      flex: 1;
  }
  .provider.svelte-11gw9q3 {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 3px;
  }
  .provider.svelte-11gw9q3 > :where(.svelte-11gw9q3):not(:first-child) {
      flex-grow: 1;
  }

  div.webauthn.svelte-15fytnl {
    display: grid;
    grid-gap: 20px;
    gap: 20px;
  }

  div.svelte-15fytnl {
    display: grid;
    grid-gap: 16px;
    gap: 16px;
  }

  .sms-otp.svelte-15fytnl {
    display: block;
    text-align: right;
    margin: .5rem 0;
  }

  .facebookWarning.svelte-15fytnl {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-top: 1rem;
  }

  .facebookWarning.svelte-15fytnl img:where(.svelte-15fytnl) {
    max-width: 70%;
  }

  .facebookWarning.svelte-15fytnl img.dots:where(.svelte-15fytnl) {
    vertical-align: middle;
    width: calc(55px / 3);
    height: calc(13px / 3);
  }
:root {
  --black: #1e282d;
  --blackTransparent: rgba(30, 40, 45, 0.8);
  --white: #ffffff;
  --whiteTransparent: rgba(255, 255, 255, 0.8);
  --lighterGray: #faf9f5;
  --lightGray: #f4f4f4;
  --gray: #e7e6e2;
  --menuBorder: #4b5357;
  --darkGray: #5e5c58;
  --blue: #39a5db;
  --lightBlue: #8ec1db;
  --linkColor: #3d64a3;
  --pink: #CD006E;
  --pinkText: #CD006E;
  --red: red;
  --lightRed: #ffe4e7;
  --yellow: #f5ce50;
  --lightYellow: #f5ecce;
  --fieldGray: #dfdfdf;
  --green: #08cb08;
  --lightGreen: #def8cc;
  --brownOnYellow: #40340d;
  --boxShadow: rgba(0, 0, 0, 0.3);

  /* variables prefixed --cetera are external and set  inside _publication-style.html.erb */
  --publication-color-fallback: var(--black);
  --publication-color-inverted-fallback: var(--white);

  --background-color: var(
    --cetera-background-color,
    var(--lightGray)
  );
  --header-background-color: var(
    --cetera-publication-header-background-color,
    var(--white)
  );
  --header-border-color: var(
    --cetera-publication-header-border-color,
    var(--black)
  );
  --publication-color: var(
    --cetera-publication-color,
    var(--publication-color-fallback)
  );
  --publication-color-inverted: var(
    --cetera-publication-color-inverted,
    var(--publication-color-inverted-fallback)
  );

}

    .avatarUploader.svelte-10dv6x {
        padding-left: 100px;
        display: block;
        margin: 24px 0;
    }

    .avatarUploader.svelte-10dv6x input:where(.svelte-10dv6x) {
        display: none;
    }

    .avatarUploader.svelte-10dv6x progress:where(.svelte-10dv6x) {
        appearance: none;
        color: var(--blue);
        background: var(--lightGray);
        width: 100%;
    }

    .avatarUploader.svelte-10dv6x progress[value="0"]:where(.svelte-10dv6x) {
        display: none;
    }

    .avatarUploader.svelte-10dv6x progress:where(.svelte-10dv6x)::progress-bar {
        background: var(--blue);
    }

    .avatarUploader.svelte-10dv6x progress:where(.svelte-10dv6x)::-moz-progress-bar {
        background: var(--blue);
    }

    .avatarUploader.svelte-10dv6x progress:where(.svelte-10dv6x)::-webkit-progress-bar {
        background: var(--lightGray);
    }

    .avatarUploader.svelte-10dv6x progress:where(.svelte-10dv6x)::-webkit-progress-value {
        background: var(--blue);
    }

    .avatarUploader.svelte-10dv6x .aid-avatar:where(.svelte-10dv6x) {
        margin-left: -100px;
        float: left;
        width: 80px;
        height: 80px;
    }

    .actions.svelte-10dv6x {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    p.svelte-1btyr32 {
        margin-bottom: 0;
    }

    a.svelte-1btyr32 {
        margin-top: 8px;
    }
:root {
  --black: #1e282d;
  --blackTransparent: rgba(30, 40, 45, 0.8);
  --white: #ffffff;
  --whiteTransparent: rgba(255, 255, 255, 0.8);
  --lighterGray: #faf9f5;
  --lightGray: #f4f4f4;
  --gray: #e7e6e2;
  --menuBorder: #4b5357;
  --darkGray: #5e5c58;
  --blue: #39a5db;
  --lightBlue: #8ec1db;
  --linkColor: #3d64a3;
  --pink: #CD006E;
  --pinkText: #CD006E;
  --red: red;
  --lightRed: #ffe4e7;
  --yellow: #f5ce50;
  --lightYellow: #f5ecce;
  --fieldGray: #dfdfdf;
  --green: #08cb08;
  --lightGreen: #def8cc;
  --brownOnYellow: #40340d;
  --boxShadow: rgba(0, 0, 0, 0.3);

  /* variables prefixed --cetera are external and set  inside _publication-style.html.erb */
  --publication-color-fallback: var(--black);
  --publication-color-inverted-fallback: var(--white);

  --background-color: var(
    --cetera-background-color,
    var(--lightGray)
  );
  --header-background-color: var(
    --cetera-publication-header-background-color,
    var(--white)
  );
  --header-border-color: var(
    --cetera-publication-header-border-color,
    var(--black)
  );
  --publication-color: var(
    --cetera-publication-color,
    var(--publication-color-fallback)
  );
  --publication-color-inverted: var(
    --cetera-publication-color-inverted,
    var(--publication-color-inverted-fallback)
  );

}

    div.form_content.svelte-uefe6f {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    div.svelte-1y80bsu {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    div.svelte-4df9m5 {
        margin-top: 18px;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .wrapper.svelte-56ecqb {
        margin-top: -8px;
    }

    div.svelte-56ecqb {
        display: flex;
        flex-direction: column;
    }

    .all-fields.svelte-56ecqb {
        margin-bottom: -4px;
    }

    .wrapper.svelte-56ecqb {
        gap: 20px;
    }

    .form.svelte-56ecqb {
        margin-top: 15px;
        gap: 23px;
    }

    .text-inputs.svelte-56ecqb {
        gap: 35px;
        margin-bottom: 5px;
    }

    .privacy-policy.svelte-56ecqb {
        margin-top: 5px;
        margin-bottom: -8px;
    }

    .login-link.svelte-56ecqb {
        display: block;
        margin-top: 19px;
        margin-bottom: 20px;
        text-align: center;
        font-size: 15px;
    }

    div.svelte-4df9m5 {
        margin-top: 18px;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    div.svelte-1ei5ezg, p.svelte-1ei5ezg {
        margin-top: 18px;
    }

    article.svelte-1o4g764 {
        display: grid;
        gap: 16px;
    }

    article.svelte-1o4g764 {
        display: grid;
        gap: 16px;
    }

    div.svelte-10g7n1t {
        display: grid;
        gap: 16px;
    }

    div.svelte-10g7n1t {
        display: grid;
        gap: 16px;
    }

    .my-aid-msg.svelte-1ylv1ni {
        padding: 15px;
        font-size: 18px;
        color: var(--black);
    }

    .button.svelte-1gvpjez {
        display: flex;
        gap: 1rem;
        justify-content: center;
    }

    .logo.svelte-1gvpjez {
        position: relative;
        width: 25px;
    }

    .logo.svelte-1gvpjez .background:where(.svelte-1gvpjez) {
        background-color: var(--white);
        border-radius: 100%;
        position: absolute;
        transform: translateY(-50%) scale(1.1);
        top: 50%;
        width: 100%;
        aspect-ratio: 1 / 1;
        display: flex;
        padding: 3px;
    }