View source for MediaWiki:Centralnotice-template-B2324 121222 en6C m p1 lg txt cnt

<!-- Large mobile banner. Must be used with "Large banner limit and switch" mixin -->
<style>
/* css variables */
:root {
    --wmui-base100: #fff;
    --wmui-base90: #f8f9fa;
    --wmui-base80: #eaecf0;
    --wmui-base70: #c8ccd1;
    --wmui-base50: #a2a9b1;
    --wmui-base30: #72777d;
    --wmui-base20: #54595d;
    --wmui-base10: #202122;
    --wmui-base0: #000;
    --wmui-accent: #36c;
    --wmui-accent-light: #eaf3ff;
    --wmui-accent-dark: #2a4b8d;
    --wmui-red: #d33;
    --wmui-red-light: #fee7e6;
    --wmui-red-dark: #b32424;
    --wmui-green: #00af89;
    --wmui-green-light: #d5fdf4;
    --wmui-green-dark: #14866d;
    --wmui-yellow: #fc3;
    --wmui-yellow-light: #fef6e7;
    --wmui-yellow-dark: #ac6600;
    --frb-primary: #2e5cb8;
    --frb-primary-light: #dde4f3;
    --frb-primary-dark: #2a4b8d;
    --frb-body: var(--wmui-base0);
    --frb-link: var(--wmui-accent);
    --frb-link-hover: #447ff5;
    --frb-message-background: #308557;
    --frb-message: var(--wmui-base100);
    --frb-muted: var(--wmui-base20);
    --frb-muted-hover: var(--wmui-base0);
    --frb-radio: var(--wmui-accent);
    --frb-button: var(--wmui-base90);
    --frb-button-border: var(--wmui-base50);
    --frb-button-hover: var(--wmui-accent-light);
    --frb-button-border-hover: var(--wmui-base50);
    --frb-button-focus: var(--wmui-accent-light);
    --frb-button-border-focus: var(--wmui-base50);
    --frb-button-selected: var(--wmui-accent);
    --frb-button-border-selected: var(--wmui-accent-dark);
    --frb-submit: var(--wmui-accent);
    --frb-submit-border: var(--wmui-accent);
    --frb-submit-hover: #447ff5;
    --frb-submit-border-hover: #447ff5;
    --frb-error: var(--wmui-red-dark);
}

#mw-mf-page-center {
    padding-bottom: 106px;
}

.banner-container {
    max-width: none;
}

/* Resets */
.frb * {
    margin: 0;
    padding: 0;
}

/* Box-sizing */
.frb,
.frb *,
.frb *:before,
.frb *:after,
.frb-nag {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.frb input[type="radio"],
.frb input[type="text"],
.frb input[type="email"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.frb input[type="radio"]:focus,
.frb input[type="text"]:focus,
.frb-radio:focus + .frb-label,
.frb-submit:focus,
.frb-rml-email:focus,
.frb-submit-rml:focus,
.frb-label:focus {
    outline: 0;
}

.frb-ptf-checkbox,
.frb input[type="radio"],
.frb-visually-hidden {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    margin: -1px;
    height: 1px;
    width: 1px;
    border: 0;
    padding: 0;
}

.frb frb-amt,
.frb-replaced {
    white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
    .frb,
    .frb * {
        transition: none !important;
    }
}

/* Font sizes and line heights */
.frb-options,
.frb-footer {
    font-size: 12px;
}

.frb-footer {
    line-height: 1.5;
}

.frb,
.frb input,
.frb-form button {
    font-size: 17px;
    line-height: 1;
}

.frb-ptf {
    font-size: 16px;
}

.frb-message,
.frb-ptf,
.frb-error {
    line-height: 1.3529411765; /*23px @17px*/
}

/* Styles */
/* Hide banner when Wikipedia site search is enabled */
.overlay-enabled .frb {
    display: none !important;
}

.frb-main {
    background-color: var(--wmui-base100);
}

.frb-top {
    font-family: -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Lato', 'Helvetica', 'Arial', sans-serif;
}

.frb-footer {
    display: none;
    margin: 0 14px;
    padding-top: 20px;
    padding-bottom: 20px;
    color: var(--frb-muted);
}

.frb-footer a {
    color: var(--frb-muted);
    text-decoration: underline;
}

.frb-footer a:hover {
    color: var(--frb-muted-hover);
}

.frb-separator {
    display: block;
    border: none;
    margin-top: 16px;
    height: 1px;
    background-color: var(--wmui-base80); /*same border as #page-actions*/
}

.frb-conversation {
    padding-bottom: 16px;
    max-height: 90%;
    max-height: calc(100% - 42px);
    overflow-y: auto;
    overflow-x: hidden;
    transition: max-height .5s;
}

@media screen and (min-width: 720px) {
    .frb-header-inside,
    .frb-conversation,
    .frb-footer,
    .frb-separator {
        max-width: 993px;
    }
}

@media screen and (min-width: 1000px) {
    .frb-header-inside,
    .frb-conversation,
    .frb-footer,
    .frb-separator {
        margin-left: auto;
        margin-right: auto;
    }
}

.frb-message {
    position: relative;
    clear: both;
    margin-bottom: 12px;
    padding: 10px 18px;
    background-color: var(--frb-message-background);
    color: var(--frb-message);
    border-radius: 1.5em;
    font-size: 16px;
    line-height: 1.5; /* 24px @16px */
}

.frb-message p {
    margin-bottom: 16px;
}

.frb-message.frb-message--optin {
    background-color: transparent;
    color: var(--frb-body);
}

@media all and (min-width: 720px) {
    .frb-message {
        padding: 12px 20px;
        font-size: 17px;
        line-height: 1.5294117647; /*26px @17px*/
    }
}

.frb-message-icon {
    vertical-align: top;
}

.frb-message-icon circle {
    fill: var(--wmui-red-dark);
}

.frb-message-icon path {
    fill: var(--wmui-base100);
}

.frb-greeting {
    display: block;
    font-size: 1.5em;
    font-weight: bold;
    text-align: center;
    padding: 0 0 2px;
}
.frb-greeting b {
    display: block;
    font-size: 16px;
}

/* Typing indicator */

.frb-message--typing {
    max-width: 82px;
    padding: 6px 20px 8px;
}

.is-hidden {
    display: none;
}

@keyframes blink {
    50% {
        fill: var(--wmui-base50);
    }
}
.type-indicator__circle {
    fill: var(--wmui-base70);
}
.type-indicator__circle {
    animation: 1s blink infinite;
}
.type-indicator__circle:nth-child(2) {
    animation-delay: 250ms;
}
.type-indicator__circle:nth-child(3) {
    animation-delay: 500ms;
}

.form-monthly .no-monthly {
    opacity: 0.4 !important;
}

.form-monthly .no-monthly .frb-label {
    cursor: default;
}

/* 4px tweak to visually align buttons with chat bubbles*/
.frb-buttons-wrapper {
    display: flex;
    flex-wrap: wrap;
    padding: 18px;
    margin: 0 0 -10px -4px;
    width: calc(100% + 8px);
}

/* reduce padding for small screens */
@media (max-width: 374px) {
    .frb-buttons-wrapper {
        padding: 18px 10px;
    }
}

.frb-button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 4px;
    flex: 1 0 0;
    cursor: pointer;
}

#frb-frequency-monthly:disabled + label {
    opacity: 0.4 !important;
    cursor: default;
}

.frb-amounts .frb-button {
    flex: 0 0 33.33%;
    max-width: 33.33%;
}

.frb-amounts .frb-button.frb-button--other {
    flex: 0 0 66.67%;
    max-width: 66.67%;
}

.frb-payment-options .frb-button {
    min-width: 33%;
}

/* 4 payment methods - 2+2 layout */
.frb-payment-options .frb-button:first-child:nth-last-child(4),
.frb-payment-options .frb-button:first-child:nth-last-child(4) ~ .frb-button {
    min-width: 50%;
}

/* If there are 5 buttons, make the first one of the wider ones */
.frb-payment-options .frb-button:first-child:nth-last-child(5) {
    min-width: 50%;
}

/* Other amount field */
.frb-other-txt,
.frb-other-input {
    line-height: 1;
    text-align: left;
}

.frb-other-txt {
    font-size: 14px;
    display: block;
    text-align: center;
    margin-bottom: 2px;
}

@media all and (min-width: 375px) {
    .frb-other-txt {
        font-size: 16px;
    }
}

@media all and (min-width: 720px) {
    .frb-other-txt {
        font-size: inherit;
    }
}

.frb-other-input {
    width: 100% !important;
    border: none;
    text-align: center !important;
    font-weight: bold;
    color: var(--frb-radio);
    box-shadow: 0 2px 0 0 var(--frb-radio);
    text-align: right;
    border-radius: 0; /* Needed for iOS */
}

.frb-button--other .frb-label {
    padding: 2px 8px 4px;
    flex-direction: column;
}

.frb-radio:checked + .frb-label .frb-other-input {
    color: var(--wmui-base100);
    box-shadow: 0 2px 0 0 var(--wmui-base100);
}

.frb-label {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 54px;
    color: var(--frb-link);
    background-color: var(--frb-button);
    border-radius: 10px;
    border: 1px solid var(--frb-button-border);
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
    font-weight: bold;
    padding: 5px 6px;
    line-height: 1;
}

/* reduce padding on credit card label for small screens */
@media (max-width: 374px) {
    .frb-pm-cc .frb-label {
        padding: 5px 3px;
    }
}

.frb-label:hover,
.frb-rml-email:hover,
.frb-submit-rml:hover {
    background-color: var(--frb-button-hover);
}

.frb-radio:checked + .frb-label {
    background-color: var(--frb-button-selected);
    border-color: var(--frb-button-border-selected);
    color: var(--wmui-base100);
}

.frb-radio:checked + .frb-label .frb-logo-payments--paypal path,
.frb-radio:checked + .frb-label .frb-logo-payments--paypal-usd path,
.frb-radio:checked + .frb-label .frb-logo-payments--amazon path,
.frb-radio:checked + .frb-label .frb-logo-payments--applepay path,
.frb-radio:checked + .frb-label .frb-logo-payments--venmo path {
    fill: var(--wmui-base100);
}

.frb-ptf-checkbox:focus + .frb-ptf-label .frb-ptf-img {
    box-shadow: inset 0 0 0 2px var(--wmui-accent);
}

.frb-radio:focus:checked + .frb-label,
.frb-button--is-focused .frb-label,
.frb-ptf-checkbox:focus:checked + .frb-ptf-label .frb-ptf-img {
    border-color: var(--frb-button-border-selected);
    box-shadow: inset 0 0 0 1px var(--frb-button-border-selected), inset 0 0 0 3px var(--wmui-base100);
}

.frb-submit:focus {
    box-shadow: inset 0 0 0 1px var(--frb-submit-border), inset 0 0 0 3px var(--wmui-base100);
}

.frb-ptf-checkbox:focus + .frb-ptf-label .frb-ptf-img {
    border-radius: 5px;
}

.frb-radio:focus + .frb-label,
.frb-label:focus,
.frb-submit-rml:focus,
.frb-rml-email:focus,
.frb-submit {
    border-color: var(--frb-submit-border);
}

.frb-radio:focus + .frb-label,
.frb-label:focus,
.frb-rml-email:focus,
.frb-submit-rml:focus {
    box-shadow: inset 0 0 0 1px var(--frb-submit-border);
}

.frb-logo-payments {
    width: 100%;
    height: 100%;
    max-height: 34px;
}

.frb-logo-payments--venmo {
    max-height: 24px;
}

.frb-logo-payments--paypal-usd {
    margin-top: 3px; /* Visual tweak */
}

.frb-logo-payments--applepay {
    margin-top: 3px; /* Visual tweak */
}

.frb-form fieldset legend {
    float: left;
    width: 100%;
    color: var(--frb-body);
    margin-bottom: -10px;
    font-weight: 600;
    background-color: transparent;
}

.frb-form fieldset {
    position: relative;
    background-color: #DBF3EC;
    padding: 6px 0px 6px;
    border-radius: 1.5em;
    margin-bottom: 10px;
}

.frb-form fieldset.frb-haserror .error-highlight {
    color: var(--frb-error);
    font-weight: bold;
}

.frb-form fieldset legend .frb-explanation {
    font-weight: normal;
}

.frb-submit {
    height: 64px;
    display: inline-block;
    cursor: default;
    margin: 12px 0 8px;
    width: 100%;
    color: rgba(84,89,93,0.2);
    background-color: var(--wmui-base100);
    border: 1px solid var(--frb-button-border);
    border-radius: 10px;
    font-weight: bold;
    text-transform: uppercase;
    transition: background-color 0.5s ease;
    opacity: .5;
}

.frb-submit.active {
    color: var(--wmui-base100);
    background-color: var(--frb-submit);
    border-color: var(--frb-submit-border);
    cursor: pointer;
    opacity: 1;
}
.frb-submit.active:hover {
    background-color: var(--frb-submit-hover);
    border-color: var(--frb-submit-border-hover);
}

.frb-submit-txt-once { display: inline; }
.form-monthly .frb-submit-txt-once { display: none; }

.frb-submit-txt-monthly { display: none; }
.form-monthly .frb-submit-txt-monthly { display: inline; }     

.frb-submit-amount {
    display: none;
}

.frb-submit-label-monthly {
    display: none;
}

.frb-submit-label-now {
    display: inline;
}

.form-monthly .frb-submit-label-monthly {
    display: inline;
}

.form-monthly .frb-submit-label-now {
    display: none;
}

/* Remind me later (RML) */
.frb-options {
    margin: 0 4px;
    text-align: center;
    color: var(--frb-body);
    font-weight: bold;
    text-transform: uppercase;
}

.frb-rml-link {
    display: block;
    margin: 8px auto 0 auto;
    padding: 16px;
    color: var(--frb-link);
    transition: color 0.2s ease;
    font-size: 14px;
    line-height: 1.1428571429; /*16px @14px*/
    font-weight: bold;
    text-transform: uppercase;
    background-color: var(--frb-button);
    border-radius: 10px;
    border: 1px solid var(--frb-button-border);
    margin-bottom: 10px;
}

.frb-rml-link:hover {
    background-color: var(--frb-button-selected);
    border-color: var(--frb-button-border-selected);
    color: var(--wmui-base100);
}

.frb-rml-link.frb-close-banner {
    color: var(--wmui-base10);
    display: flex;
    align-items: center;
    background-color: transparent;
    border-radius: 0;
    border: 0;
}

.frb-rml-link.frb-close-banner:hover {
    color: var(--frb-primary);
    background-color: transparent;
    border: 0;
}

.frb-close-banner svg {
    width: 16px;
    margin-right: 5px;
}

.frb-rml-disabled .js-rml {
    display: none;
}

.frb-rml-email,
.frb-submit-rml {
    height: 54px;
    padding: 16px 18px;
}

.frb-rml-email {
    margin: 4px 0 0 0;
    width: 100%;
    color: var(--frb-body);
    background-color: var(--frb-button);
    border-radius: 10px;
    border: 1px solid var(--frb-button-border);
    box-shadow: none;
    transition: background-color 0.2s ease;
    cursor: pointer;
    font-weight: normal;
}

.frb-rml-email.frb-haserror {
    border-color: var(--frb-error);
    box-shadow: inset 0 0 0 1px var(--frb-error);
}

.frb-submit-rml {
    display: block;
    margin: 8px auto;
    min-width: 200px;
    cursor: pointer;
    color: var(--frb-link);
    background-color: var(--frb-button);
    border-radius: 10px;
    border: 1px solid var(--frb-button-border);
    transition: background-color 0.2s ease;
    cursor: pointer;
}

/* -- Credit card logos -- */

.frb-cc-logo-wrapper {
    display: none;
    margin: 0 auto;
    width: 66px;
    font-size: 0; /* Remove spacing between icons */
}

.frb-pm-cc svg {
    width: 27px;
    height: 18px;
    margin: 2px;
    display: none;
}

/* Countries with 3 card types */
.frb-cctypes-vma .frb-cc-logo-wrapper {
    width: 100%;
}

@media (min-width: 374px) {
    .frb-cctypes-vma svg  {
        width: 30%;
        max-height: 34px;
    }
}

.frb-cctypes-vmad .frb-cc-logo-wrapper,
.frb-cctypes-vmaj .frb-cc-logo-wrapper,
.frb-cctypes-vma  .frb-cc-logo-wrapper,
.frb-cctypes-vm   .frb-cc-logo-wrapper {
    display: block;
}

.frb-cctypes-vmad .frb-pm-cc-label,
.frb-cctypes-vmaj .frb-pm-cc-label,
.frb-cctypes-vma  .frb-pm-cc-label,
.frb-cctypes-vm   .frb-pm-cc-label {
    display: none;
}

.frb-cctypes-vmad .frb-cc-logo-visa,
.frb-cctypes-vmad .frb-cc-logo-mastercard,
.frb-cctypes-vmad .frb-cc-logo-amex,
.frb-cctypes-vmad .frb-cc-logo-discover,

.frb-cctypes-vmaj .frb-cc-logo-visa,
.frb-cctypes-vmaj .frb-cc-logo-mastercard,
.frb-cctypes-vmaj .frb-cc-logo-amex,
.frb-cctypes-vmaj .frb-cc-logo-jcb,

.frb-cctypes-vma  .frb-cc-logo-visa,
.frb-cctypes-vma  .frb-cc-logo-mastercard,
.frb-cctypes-vma  .frb-cc-logo-amex,

.frb-cctypes-vm   .frb-cc-logo-visa,
.frb-cctypes-vm   .frb-cc-logo-mastercard {
    display: inline-block;
}

/* -- Pay the fee -- */
.frb-ptf {
    margin: 0px 0px 0px -2px;
    padding: 10px 18px;
}

.frb-ptf-fee {
    white-space: nowrap;
}

.frb-ptf-checkbox + .frb-ptf-label .frb-ptf-img {
    display: inline-block;
    margin-bottom: -4px;
    width: 32px;
    height: 32px;
    background-image: url('https://upload.wikimedia.org/wikipedia/donate/b/b7/Frb-checkbox-ooui.png');
    background-size: 64px;
    background-repeat: no-repeat;
    background-position: 0 0;
}

.frb-ptf-checkbox:checked + .frb-ptf-label .frb-ptf-img {
    background-position: -32px 0;
}

.frb-ptf-label {
    display: flex;
    cursor: pointer;
    align-items: center;
}

.frb-ptf-cell {
    display: inline-block;
}

.frb-ptf-cell:first-child {
    padding-left: 2px;
}

body.rtl .frb-ptf-cell:first-child {
    padding-left: 8px;
}

.frb-ptf-cell:nth-child(2) {
    padding-left: 14px;
}

/* --- Header --- */
.frb-header-minimize {
    position: absolute;
    right: 8px;
    top: -48px;
    opacity: 1;
    border-radius: 12px 12px 0 0;
    width: 48px;
    height: 48px;
    justify-content: center;
    transition: all 0.4s;
    background: var(--wmui-base10)
}

span.frb-header-minimize-icon {
    width: 40px;
    height: 40px;
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
}

.frb-header-minimize-icon svg {
    width: 25px;
    height: auto;
}

.frb-header-minimize-icon svg path:last-child {
    fill: var(--wmui-base100);
}


.frb-header {
    top: 0;
    z-index: 999;
    width: 100%;
    max-height: 100%;
    overflow: hidden;
    background-color: var(--wmui-base100);
}

/* The sticky class is added to the toolbar with JS when it reaches its scroll position */
.frb-header--sticky {
    position: fixed;
    top: 0;
    left: 0;
    border-bottom: 1px solid var(--wmui-base70);
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
}

.frb-header-inside {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 0 1px; /*padding needed to make focus outlines visible at edges*/
    width: 100%;
    min-height: 42px;
    height: 1px; /*needed for FF*/
}

.frb-header-action {
    flex: 1 0 0;
    padding: 11px 6px;
    text-align: center;
    font-size: 12px;
    line-height: 1;
    font-weight: bold;
    color: var(--frb-link);
    position: relative;
}
.frb-header-action:hover {
    text-decoration: underline;
}

@media all and (min-width: 375px) {
    .frb-header-action {
        font-size: 13px;
    }
}

.frb-header-action:after {
    content: ' ';
    position: absolute;
    top: 50%;
    right: -0.5px;
    transform: translateY(-50%);
    height: 22px;
    width: 1px;
    background: var(--wmui-base50);
}

body.rtl .frb-header-action:after {
    right: auto;
    left: -0.5px;
}

.frb-header-action:last-child:after {
    display: none;
}

.frb-header-action--donate {
    font-weight: bold;
}

/* --- Disable I already donated --- */
.frb.frb-iad-disabled .frb-iad {
    display: none;
}

/* Error messages */
.frb-error {
    display: none;
    margin: 8px 0;
    color: var(--frb-error);
    font-size: 15px;
    font-weight: 500;
}

/* Opt-in */
.frb-optin.frb-haserror .frb-message {
    color: var(--frb-error);
}

.frb-optin .frb-button {
    width: 50%;
}

.frb-optin-no-prompt__yes {
    display: none;
}

.frb-optin-no-prompt__no {
    display: block;
}

.frb-optin-no-prompt.is-positive .frb-optin-no-prompt__yes {
    display: block;
}

.frb-optin-no-prompt.is-positive .frb-optin-no-prompt__no {
    display: none;
}

.frb-optin-legal {
    font-size: 14px;
    line-height: 1.3;
    font-weight: normal;
    padding: 0px 16px 10px;
    color: var(--frb-muted);
}
.frb-optin-legal a {
    color: var(--frb-muted);
    text-decoration: underline;
}
.frb-optin-legal a:hover {
    color: var(--frb-muted-hover);
    text-decoration: underline;
}

.frb-cta {
    margin-top: 8px;
    background-color: #f9dde9;
    color: #000;
}

/* UPSELL */

.frb-upsell,
.frb-monthly-diff-amt .frb-amt-monthly,
.frb-upsell-ty {
    width: calc(100% + 8px) !important;
    transition: background-color 0.5s ease;
    padding: 10px 4px;
    text-align: center;
}

.frb-upsell { padding-top: 40px; }

.frb-monthly-diff-amt .frb-amt-monthly {
    display: block;
    padding: 0 4px 10px 4px;
}

.frb-upsell-cta,
.frb-upsell-ty {
    font-size: 17px;
    line-height: 1.3;
    font-weight: bold;
    text-align: center;
}

.frb-upsell-color,
.frb-monthly-diff-amt .frb-amt-monthly label {
    display: block;
    font-size: 15px;
    line-height: 1.3;
    font-weight: normal;
    padding: 0 5%;
    margin: .5em 0;
}

.frb .frb-monthly-diff-amt-link {
    display: block;
    font-size: 15px;
    line-height: 1.3;
    color: var(--frb-link);
    margin: 8px auto;
    padding: 12px;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
}
.frb .frb-monthly-diff-amt-link:hover {
    text-decoration: underline;
}

.frb-back-step, .frb-back {
    display: none;
    position: absolute;
    margin-top: 10px;
    cursor: pointer;
}

.frb-monthly-diff-amt { display: none; }

#frb-amt-monthly-other-input {
    position: relative;
    width: 30%;
    height: 54px;
    padding: 16px 18px;
    text-align: center;
    font-size: 18px;
    color: var(--frb-body);
    background-color: var(--frb-button);
    border-radius: 10px;
    border: 1px solid var(--frb-button-border);
    box-shadow: none;
    transition: background-color 0.2s ease;
    cursor: pointer;
    font-weight: normal;
}
#frb-amt-monthly-other-input:hover {
    background-color: var(--frb-button-hover);
}

/* Overlay */
.frb-mask {
    display: none;
    position: absolute;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--wmui-base0);
    opacity: 0.8;
    touch-action: none;
    border-radius: 8px;
}

.frb-step-upsell {
    position: fixed;
    z-index: 1001;
    top: 0;
    left: 0;
    right: 0;
    width: 90%;
    max-width: 800px;
    margin: 5% auto;
    padding: 5%;
    color: var(--frb-body);
    background: var(--wmui-base100);
}


.frb-bubble-container {
    position: absolute;
    width: fit-content;
    height: fit-content;
    background: none;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0);
    transition: background 0.25s ease;
}

.frb-bubble-message {
    display: block;
    color: white;
    position: relative;
    margin-right: 13px;
    font-size: 17px;
}

@media (max-width: 500px) {
    .frb-bubble-message {
        font-size: 16px;
    }
}

@media (max-width: 350px) {
    .frb-bubble-message {
        font-size: 13px;
    }

    .frb-bubble-message strong {
        font-size: 14px;
    }
}

.frb-bubble-message .frb-message-icon {
    position: relative;
    top: -4px;
}

.frb-bubble-message .frb-message-icon circle {
    fill: #FEFD34;
}

.frb-bubble-message .frb-message-icon path {
    fill: var(--wmui-base0);
}

.frb-bubble-message-container {
    position: fixed;
    right: 0;
    left: 0;
    bottom: -106px;
    height: 106px;
    z-index: 9999;
    background: var(--frb-message-background);
    padding: 10px 10px 30px 20px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-top: 2px solid #266A46;
    box-shadow: 0px -2px 10px 0px rgba(0,0,0,0.25);
    transition: all 400ms cubic-bezier(0.18,0.89,0.32,1.27);
}

.frb-main {
    position: fixed;
    bottom: 18px;
    right: 0;
    z-index: 999;
    opacity: 0;
    border-radius: 10px;
    margin: 0 8px;
    padding: 0 8px 8px 8px;
    height: 80%;
    transition: all 150ms ease-in-out;
    transform: scale(0.5);
    transform-origin: 100% 50%;
    visibility: hidden;
}


@media screen and (min-width: 360px) {
    .frb-main {
        height: 85%;
    }
}

.frb-conversation-close {
    top: -36px;
    position: absolute;
    right: 0;
    background: rgba(0, 0, 0, 0.75);
    border-radius: 41px;
    padding: 6px 12px;
    color: white;
    font-weight: 700;
    text-align: center;
    font-size: 16px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.frb-conversation-close.frb-bubble-message-close {
    position: fixed;
    right: 10px;
    top: auto;
    bottom: -47px;
    opacity: 0;
    border-radius: 12px 12px 0 0;
    width: 48px;
    height: 48px;
    justify-content: center;
    transition: all 0.4s;
}

span.frb-conversation-close-icon {
  position: absolute;
  right: 15px;
  top: 12px;
  width: 25px;
  height: 25px;
}
span.frb-conversation-close-icon:before, span.frb-conversation-close-icon:after {
  position: absolute;
  left: 15px;
  content: ' ';
  height: 25px;
  width: 3px;
  background-color: #fff;
}
span.frb-conversation-close-icon:before {
  transform: rotate(45deg);
}
span.frb-conversation-close-icon:after {
  transform: rotate(-45deg);
}

.frb-conversation-open {
    top: -36px;
    position: absolute;
    right: 0;
    background: rgba(0, 0, 0, 0.75);
    color: white;
    font-weight: 700;
    text-align: center;
    font-size: 16px;
    display: flex;
    align-items: center;
    cursor: pointer;
}
.frb-conversation-open {
    position: fixed;
    right: 60px;
    top: auto;
    bottom: -47px;
    opacity: 0;
    border-radius: 12px 12px 0 0;
    width: 48px;
    height: 48px;
    justify-content: center;
    transition: all 0.4s;
}
.frb-conversation-open-icon {
    width: 40px;
    height: 40px;
    display: flex;
    border-radius: 2px;
    justify-content: center;
    align-items: center;
}

.frb-conversation-open-icon svg {
    transform: rotate(180deg);
    width: 25px;
    height: auto;
}

.frb-conversation-open-icon svg path:last-child {
    fill: var(--wmui-base100);
}

.frb-bubble-message-visible {
    bottom: -95px;
    right: 0;
    left: 0;
}

.frb-header {
    position: sticky
}


/* nag bounce */
.frb-bubble-bounce {
    animation-duration: 0.8s;
    animation-name: nagbounce;
    animation-timing-function: ease-in-out;
}

.frb-bubble-red {
    animation-duration: 0.8s;
    animation-name: nagbouncered;
    animation-timing-function: ease-in-out;
    background-color: #ffc9c9;
    border-top-color: #990000;
    transition: all 0.6s;
}

.frb-bubble-red .frb-bubble-message {
    color: var(--frb-body);
}

@keyframes nagbounce {
  from {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-3px);
  }
  60% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-8px);
  }
  to {
    transform: translateY(0);
  }
}


@keyframes nagbouncered {
  from {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-3px);
  }
  60% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-8px);
  }
  to {
    transform: translateY(0);
  }
}


/*
    Modal
*/
.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    background: rgba(255,255,255,0.95);
    min-width: 100vw;
    min-height: 100vh;
    top: 0;
    left: 0;
    overflow: hidden;
}
.modal-container {
    width: 100%;
    max-width: 90%;
    margin: 0 auto;
    padding: 60px 30px 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 10px rgba(0,0,0,0.15);
    background: #fff;
    box-sizing: border-box;
    color: #000;
}
.modal-close-x {
    border: none;
    background: none;
    margin: 0;
    padding: 0;
    cursor: pointer;
    position: absolute;
    top: 24px;
    left: 24px;
    width: 22px;
    height: 18px;
    opacity: 0.5;
}

.modal-title-icon {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    left: -10px;
    top: -10px;
}
.modal-title-text {
    font-size: 17px;
    margin: 0;
    color: #262626;
    font-weight: bold;
    display: inline-block;
}
.modal-text {
    font-family: Arial;
    line-height: 1.44;
    font-size: 15px;
    max-width: 100%;
    margin: 16px auto 0;
}
.frb-modal-buttons {
    display: block;
    justify-content: center;
    margin: 16px auto 0;
}
.modal-close-button {
    margin: 0 0 10px;
    display: block;
    border-radius: 2px;
    border: solid 1px #a2a9b1;
    background-color: #f8f9fa;
    width: 100%;
    height: 45px;
    font-family: Arial;
    font-size: 13px;
    font-weight: bold;
    color: #007de2;
    cursor: pointer;
}
.modal-close-button:hover{
    background-color: #eaf3ff;
}

/* wmf identity */

.frb-wmf-identity {
    position: relative;
    clear: both;
    margin: 20px 0 0px;
    color: var(--wmui-base0);
    border-radius: 1.5em;
    line-height: 1.3;
    display: flex;
    justify-content: center;
    padding: 0 10px;
}

.frb-wmf-identity-logo {
    flex: 0 0 120px;
    max-width: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.frb-wmf-identity-logo img {
    width: 100%;
    max-width: 110px;
}

.frb-wmf-identity-message {
    flex: 0 1 auto;
    font-size: 14px;
    display: flex;
    align-items: center;
    padding-left: 20px;
    color: var(--wmui-base0);
}

.frb-wmf-identity-message p {
    margin: 0;
    font-size: 13px;
}

@media (max-width: 374px) {
    .frb-wmf-identity {
        display: block;
        text-align: center;
    }

    .frb-wmf-identity-logo {
        margin: 0 auto 5px;
        display: block;
    }

    .frb-wmf-identity-message {
        padding: 0;
        text-align: center;
        display: block;
    }
}

/* screen reader visibility class */
.sr-only {
    border: 0 !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important;
}

/* nag */
#frb-nag { cursor: pointer; }

/* body, html no scroll when overlay is open */
.frb-overlay-open {
    overflow: hidden;
    position: relative;
    height: 100%;
}

.frb-submit-txt-donate { display: none; }
.frb-submit-txt-once {display: inline; }
.frb-submit-txt-monthly { display: none; }
.form-monthly .frb-submit-txt-once { display: none; }  
.form-monthly .frb-submit-txt-monthly { display: inline; }

</style>

<div class="modal" role="dialog" aria-label="I already donated">

    <div class="modal-container">
        <button class="modal-close modal-close-x">
            <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 16'><g fill='none' fill-rule='evenodd' transform='translate(1 1)'><path stroke='#000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.778' d='M7.181 13.285L.753 7 7.181.715'></path><rect fill='#000' width='18.182' height='1.778' x='.818' y='6.111' rx='.889'></rect></g></svg>
        </button>

        <div class="modal-title">
            <span class="modal-title-text">Thank you, dear donor!</span>
        </div>

        <div class="modal-text">
            Your generosity helps keep Wikipedia and its sister sites thriving. Select "hide appeals" to suppress fundraising messages in this browser for a week, or go back to the appeal if you're still interested in donating.
        </div>

        <div class="frb-modal-buttons">
            <button class="modal-close modal-close-button" name="frb-hide-appeals-button">{{{FR2015_translations,iad-hide}}}</button>
            <button class="modal-close modal-close-button" name="frb-modal-back-button">{{{FR2015_translations,iad-back}}}</button>
        </div>
    </div>
</div><!-- Modal end -->

<div class="frb frb-top" id="{{{banner}}}" style="display: none;" role="region" aria-label="fundraising banner"><!-- hidden by default until have checked the cookies -->
<h1 class="frb-visually-hidden">Fundraising banner</h1>
<div class="frb-bubble-container"> <!-- frb-bubble-container start -->
    <div class="frb-conversation-triangle"></div>
    <div class="frb-main">
        <button class="frb-header-minimize js-close" aria-label="minimize">
            <span class="frb-header-minimize-icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" aria-hidden="true"><g><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"></path></g></svg>
            </span>
        </button>
        <aside class="frb-header">
            <h2 class="frb-visually-hidden">Fundraising banner navigation</h2>
            <div class="frb-header-inside">
                <button class="frb-header-action js-rml">
                    Maybe later
                </button>
                <button class="frb-header-action frb-iad modal-open">
                    I already donated
                </button>
            </div>
        </aside>
        <div class="frb-conversation">
            <h2 class="frb-visually-hidden">Fundraising banner message</h2>
            <div class="frb-message frb-message--standard">
            <p>
                <span class="frb-greeting">
                    Wikipedia still can't be&nbsp;sold.
                    <b>%date%: An important update for readers in %country%</b>
                </span>
            </p>
            <p>
                Please don't scroll past this 1-minute read. We're sorry to interrupt, but it's %weekday%, %date%, and it will soon be too late to help us in our end-of-year fundraiser. We ask you to reflect on the number of times you visited Wikipedia in the past year and whether you're able to give %amount% to the Wikimedia Foundation. If you can, please join the 2% of readers who give. If everyone reading this right now gave just %amount%, we'd hit our goal in a couple of hours.
            </p>
            <p>
                In the age of AI, Wikipedia matters more than ever. Verifiable, contextualized information is a vital resource for emerging technologies. Your contributions support how you and other readers use Wikipedia now, and how revolutionary new systems will utilize it tomorrow.
            </p>
            <p>
                If Wikipedia has given you %amount% of knowledge in 2023, please give back. Every contribution matters: every edit, every donation counts. 
            </p>
            </div><!-- end of frb-message frb-message--standard -->

            <form id="frb-form" class="frb-form">
                <h2 class="frb-visually-hidden">Fundraising payment form</h2>
                <fieldset class="frb-amounts">
                    <legend class="frb-message frb-message-amount">
                        <span class="error-highlight">{{{FR2015_translations,please-select-amount}}} (<span class="frb-replace-currencycode">USD</span>)</span>.
                        <span class="frb-explanation">The average donation in %country% is around %average%. Many first-time donors give %amount%. All that matters is that you're choosing to stand up for free, open information; and for that, you have our gratitude.</span>
                    </legend>
                    <div class="frb-buttons-wrapper">
                        <div class="frb-button">
                            <input class="frb-radio frb-radio-amount" id="frb-amt-ps1" type="radio" name="amount" value="2.75" />
                            <label for="frb-amt-ps1" class="frb-label">$2.75</label>
                        </div>
                        <div class="frb-button">
                            <input class="frb-radio frb-radio-amount" id="frb-amt-ps2" type="radio" name="amount" value="5" />
                            <label for="frb-amt-ps2" class="frb-label">$5</label>
                        </div>
                        <div class="frb-button">
                            <input class="frb-radio frb-radio-amount" id="frb-amt-ps3" type="radio" name="amount" value="10" />
                            <label for="frb-amt-ps3" class="frb-label">$10</label>
                        </div>
                        <div class="frb-button">
                            <input class="frb-radio frb-radio-amount" id="frb-amt-ps4" type="radio" name="amount" value="20" />
                            <label for="frb-amt-ps4" class="frb-label">$20</label>
                        </div>
                        <div class="frb-button">
                            <input class="frb-radio frb-radio-amount" id="frb-amt-ps5" type="radio" name="amount" value="30" />
                            <label for="frb-amt-ps5" class="frb-label">$30</label>
                        </div>
                        <div class="frb-button">
                            <input class="frb-radio frb-radio-amount" id="frb-amt-ps6" type="radio" name="amount" value="50" />
                            <label for="frb-amt-ps6" class="frb-label">$100</label>
                        </div>
                        <div class="frb-button">
                            <input class="frb-radio frb-radio-amount" id="frb-amt-ps7" type="radio" name="amount" value="50" />
                            <label for="frb-amt-ps7" class="frb-label">$100</label>
                        </div>
                        <div class="frb-button frb-button--other">
                            <label class="sr-only" for="frb-input-other">Other Amount</label>
                            <input id="frb-input-other" class="frb-radio" type="radio" name="amount" value="Other" />
                            <label class="frb-label">
                                <span class="frb-other-txt">{{{FR2015_translations,other}}} (<span class="frb-replace-currencysymbol">$</span>)</span>
                                <input name="otherAmount" id="frb-amt-other-input" class="frb-other-input" type="text" inputmode="decimal" value="" tabindex="-1" dir="ltr" />
                            </label>
                        </div>
                    </div>
                    <div class="frb-ptf" style="display:none;">
                        <input class="frb-ptf-checkbox" type="checkbox" name="ptf" id="frb-ptf-checkbox" value="true">
                        <label class="frb-ptf-label" for="frb-ptf-checkbox">
                            <span class="frb-ptf-cell"><span class="frb-ptf-img"></span></span>
                            <span class="frb-ptf-cell">I'll generously add <span class="frb-ptf-fee">a little</span> to cover the transaction fees so you can keep 100% of my donation.</span>
                        </label>
                    </div>
                </fieldset>
                <p class="frb-message frb-message--standard frb-cta">
                    <svg class="frb-message-icon" role="img" aria-hidden="true" width="20" height="20" viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero" fill="none"><circle cx="10.492" cy="14.492" r="10.492"></circle><path d="M12.681 11.754l-2.267 7.864c-.125.45-.188.745-.188.885 0 .08.033.156.1.226.066.07.136.105.21.105.125 0 .25-.055.376-.165.332-.273.73-.767 1.194-1.482l.376.22c-1.113 1.94-2.296 2.91-3.55 2.91-.48 0-.86-.135-1.144-.404a1.349 1.349 0 0 1-.426-1.023c0-.273.062-.62.188-1.04l1.537-5.286c.147-.51.221-.892.221-1.15a.566.566 0 0 0-.21-.432c-.14-.125-.332-.188-.575-.188-.11 0-.243.004-.398.011l.144-.442 3.749-.609h.663zm-.685-5.087c.457 0 .842.159 1.156.475.313.318.47.701.47 1.15 0 .45-.16.834-.476 1.15-.317.318-.7.476-1.15.476-.443 0-.822-.158-1.14-.475a1.566 1.566 0 0 1-.475-1.15c0-.45.157-.833.47-1.15a1.549 1.549 0 0 1 1.145-.476z"></path></g></svg>
                    We ask you, sincerely: don't scroll away, join the 2% of readers who give.
                </p>

                <div class="frb-step-2" style="display: none;">

                    <fieldset class="frb-frequency">
                        <legend class="frb-message error-highlight">
                            {{{FR2015_translations,how-often}}}
                        </legend>
                        <div class="frb-buttons-wrapper">
                            <div class="frb-button frb-button--frequency">
                                <input class="frb-radio" id="frb-frequency-onetime" type="radio" name="frequency" value="onetime" checked onclick="frb.toggleMonthly(false);" />
                                <label for="frb-frequency-onetime" class="frb-label">{{{FR2015_translations,one-time}}}</label>
                            </div>
                            <div class="frb-button frb-button--frequency">
                                <input class="frb-radio" id="frb-frequency-monthly" type="radio" name="frequency" value="monthly" onclick="frb.toggleMonthly(true);" />
                                <label for="frb-frequency-monthly" class="frb-label">{{{FR2015_translations,give-monthly}}}</label>
                            </div>
                        </div>
                    </fieldset>

                    <fieldset class="frb-methods">
                        <legend class="frb-message error-highlight">
                            {{{FR2015_translations,select-payment-method-please}}}
                        </legend>
                        <div class="frb-buttons-wrapper frb-payment-options">

                            <div data-name="iDEAL" class="frb-button frb-pm-ideal" style="display: none;">
                                <input id="frb-pm-ideal" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'rtbt', submethod:'rtbt_ideal' });"/>
                                <label for="frb-pm-ideal" class="frb-label">iDEAL</label>
                            </div>

                            <div data-name="Credit Card" class="frb-button frb-pm-cc">
                                <input id="frb-pm-cc" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'cc' });"/>
                                <label for="frb-pm-cc" class="frb-label">
                                    <span class="frb-pm-cc-label">{{{FR2015_translations,pm-creditcard}}}</span>
                                    <span class="frb-cc-logo-wrapper">
                                        <svg class="frb-cc-logo-visa" xmlns="http://www.w3.org/2000/svg" aria-labelledby="frb-cc-logo-visa-title" viewBox="0 0 200 120"><title id="frb-cc-logo-visa-title">Visa</title><path fill="#FFFFFF" d="M7.7 0h184.6c4.2 0 7.7 3.3 7.7 7.5v105c0 4.1-3.4 7.5-7.7 7.5H7.7c-4.2 0-7.7-3.3-7.7-7.5V7.5C0 3.3 3.4 0 7.7 0z"/><path fill="#F7B600" d="M0 98v14.3c0 4.2 3.4 7.7 7.7 7.7h184.6c4.2 0 7.7-3.4 7.7-7.7V98H0z"/><path fill="#1A1F71" d="M200 22V7.7c0-4.2-3.4-7.7-7.7-7.7H7.7C3.4 0 0 3.4 0 7.7V22h200zM81.9 36.9L62.3 83.4H49.4l-9.6-37.2c-.6-2.3-1.1-3.1-2.8-4.1-3.8-1.8-7.8-3.1-12-3.9l.2-1.4h20.6c2.8 0 5.1 2 5.6 4.8l5.1 26.9 12.6-31.7h12.8zm50.3 31.3c0-12.3-17-13-16.9-18.4 0-1.7 1.6-3.4 5.2-3.9 4.1-.4 8.2.3 12 2.1l2.1-9.8c-3.6-1.4-7.5-2.1-11.4-2.1-12 0-20.4 6.4-20.5 15.3-.1 6.8 6 10.4 10.6 12.6s6.3 3.8 6.3 5.8c0 3.1-3.8 4.5-7.3 4.5-4.3.1-8.6-.9-12.5-2.9l-2.2 10.2c4.3 1.7 8.9 2.5 13.5 2.5 12.7 0 20.9-6.2 21.1-15.9m31.6 15.2H175l-9.8-46.5h-10.4c-2.3 0-4.3 1.3-5.2 3.4l-18.3 43.1H144l2.5-7h15.6l1.7 7zm-13.6-16.5l6.4-17.4 3.7 17.4h-10.1zm-51-30l-10 46.5H77.1l10-46.5h12.1z"/></svg>

                                        <svg class="frb-cc-logo-mastercard" xmlns="http://www.w3.org/2000/svg" aria-labelledby="frb-cc-logo-mastercard-title" viewBox="0 0 200 120"><title id="frb-cc-logo-mastercard-title">MasterCard</title><path d="M192.3 120H7.7c-4.2 0-7.7-3.4-7.7-7.5V7.5C0 3.4 3.5 0 7.7 0h184.6c4.2 0 7.7 3.4 7.7 7.5v105c0 4.1-3.5 7.5-7.7 7.5z"/><g id="Layer_1-2"><path id="_Compound_Path_" fill="#FFFFFF" d="M61.9 106.5v-6.2c.2-2-1.3-3.7-3.3-3.9h-.5c-1.4-.1-2.7.6-3.5 1.8-.7-1.1-1.9-1.8-3.3-1.8-1.2-.1-2.3.5-3 1.5v-1.2h-2v9.9h2v-5.7c-.1-1.3.8-2.5 2.1-2.6h.4c1.4 0 2.2.9 2.2 2.6v5.7h2v-5.7c-.1-1.3.8-2.5 2.1-2.6h.4c1.5 0 2.2.9 2.2 2.6v5.7l2.2-.1zm32.1-10h-3.6v-3h-2v3h-2.1v1.8h2.1v4.7c0 2.3.8 3.7 3.3 3.7.9 0 1.9-.3 2.7-.8l-.6-1.8c-.6.3-1.2.5-1.9.6-1 0-1.5-.7-1.5-1.7v-4.8H94v-1.7zm18.3-.2c-1.1 0-2.1.5-2.7 1.5v-1.2h-2v9.9h2v-5.6c0-1.6.8-2.7 2.2-2.7.5 0 .9.1 1.3.2l.7-1.9c-.5-.1-1-.2-1.5-.2zm-27.7 1c-1.2-.7-2.6-1.1-4-1-2.5 0-4 1.2-4 3.1 0 1.6 1.1 2.6 3.3 2.9l1 .1c1.2.2 1.8.6 1.8 1.1 0 .8-.9 1.3-2.3 1.3-1.2 0-2.3-.3-3.3-1l-1 1.6c1.3.9 2.7 1.3 4.3 1.3 2.8 0 4.4-1.3 4.4-3.2 0-1.9-1.2-2.6-3.3-2.9l-1-.1c-.9-.1-1.8-.4-1.8-1s.8-1.2 2-1.2c1.1 0 2.1.3 3.1.9l.8-1.9zm29.9 4.2c-.1 2.7 2 5.1 4.7 5.2h.5c1.3.1 2.6-.4 3.5-1.2l-1-1.6c-.7.6-1.6.9-2.6.9-1.8-.2-3.2-1.8-3-3.7.2-1.6 1.4-2.9 3-3 .9 0 1.8.3 2.6.9l1-1.6c-1-.8-2.3-1.2-3.5-1.2-2.7-.1-5 2-5.2 4.7v.6zm-13.9-5.2c-2.9 0-4.9 2.1-4.9 5.2-.2 2.7 1.9 5 4.5 5.2h.5c1.5.1 2.9-.4 4-1.4l-1-1.5c-.8.7-1.8 1-2.9 1-1.5.1-2.8-1-3-2.5h7.4v-.8c.1-3.1-1.8-5.2-4.6-5.2zm0 1.8c1.4 0 2.5 1 2.6 2.4v.1h-5.3c.1-1.4 1.3-2.5 2.7-2.5zm-26.7 3.4v-4.9h-2v1.2c-.8-1-2-1.5-3.2-1.5-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2 1.2.1 2.4-.5 3.2-1.5v1.2h2v-4.9zm-7.9 0c-.1-1.7 1.1-3.2 2.8-3.4h.3c1.8.2 3.2 1.8 3 3.7-.2 1.6-1.4 2.9-3 3-1.7 0-3.1-1.4-3.1-3.1-.1 0-.1-.1 0-.2zm76.1-5.2c-1.1 0-2.1.5-2.7 1.5v-1.2h-2v9.9h2v-5.6c0-1.6.8-2.7 2.2-2.7.5 0 .9.1 1.3.2l.7-1.9c-.5-.1-1-.2-1.5-.2zm15.8 8.7c.1 0 .3 0 .4.1.1 0 .2.1.3.2.1.1.2.2.2.3.1.2.1.5 0 .8-.1.1-.1.2-.2.3-.1.1-.2.2-.3.2-.1.1-.3.1-.4.1-.4 0-.8-.2-.9-.6-.1-.2-.1-.5 0-.8.1-.1.1-.2.2-.3.1-.1.2-.2.3-.2.2 0 .3-.1.4-.1zm0 1.8c.1 0 .2 0 .3-.1.1 0 .2-.1.2-.2.3-.3.3-.7 0-1l-.2-.2c-.1 0-.2-.1-.3-.1-.1 0-.2 0-.3.1-.1 0-.2.1-.2.2-.3.3-.3.7 0 1 .1.1.2.1.2.2.1.1.2.1.3.1zm.1-1.2c.1 0 .2 0 .3.1.1.1.1.1.1.2s0 .1-.1.2-.1.1-.2.1l.3.3h-.2l-.3-.3h-.1v.3h-.2v-.9h.4zm-.2.1v.2h.3v-.2h-.3zm-23.3-4.2v-5h-2v1.2c-.8-1-2-1.5-3.2-1.5-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2 1.2.1 2.4-.5 3.2-1.5v1.2h2v-4.8zm-8 0c-.1-1.7 1.1-3.2 2.8-3.4h.3c1.8.2 3.2 1.8 3 3.7-.2 1.6-1.4 2.9-3 3-1.7 0-3.1-1.4-3.1-3.1v-.2zm27.9 0v-9h-2v5.2c-.8-1-2-1.5-3.2-1.5-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2 1.2.1 2.4-.5 3.2-1.5v1.2h2v-4.8zm-8 0c-.1-1.7 1.1-3.2 2.8-3.4h.3c1.8.3 3.1 2 2.8 3.9-.2 1.5-1.4 2.6-2.8 2.8-1.7 0-3.1-1.4-3.1-3.1-.1 0-.1-.1 0-.2z"/><g id="_Group_"><path fill="#FF5F00" d="M83.9 21h32.4v58.7H83.9z"/><path id="_Path_2" fill="#EB001B" d="M86 50.3C86 38.8 91.2 28 100.2 21c-16.1-12.7-39.4-9.9-52.1 6.3S38.2 67 54.3 79.7c13.4 10.6 32.4 10.6 45.8 0C91.2 72.6 86 61.8 86 50.3z"/><path fill="#F79E1B" d="M156.6 73.5v-1.2h.5V72h-1.2v.2h.5v1.2h.2zm2.4 0V72h-.4l-.4 1-.4-1h-.4v1.5h.3v-1.1l.4.9h.3l.4-.9v1.1h.2zm1.2-23.2c0 20.6-16.6 37.3-37.1 37.3-8.3 0-16.4-2.8-22.9-8 16.1-12.7 18.9-36.2 6.2-52.4-1.8-2.3-3.9-4.4-6.2-6.3 16.1-12.7 39.4-9.9 52.1 6.3 5.1 6.6 7.9 14.8 7.9 23.1z"/></g></g></svg>

                                        <svg class="frb-cc-logo-amex" xmlns="http://www.w3.org/2000/svg" aria-labelledby="frb-cc-logo-amex-title" viewBox="0 0 200 120"><title id="frb-cc-logo-amex-title">Amex</title><linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="187.342" y1="3564.816" x2="13.247" y2="3503.596" gradientTransform="translate(0 -3474.102)"><stop offset="0" stop-color="#51BCEA"/><stop offset="1" stop-color="#3078BC"/></linearGradient><path fill="url(#SVGID_1_)" d="M192.3 120H7.7c-4.2 0-7.7-3.5-7.7-7.7V7.7C0 3.5 3.5 0 7.7 0h184.6c4.2 0 7.7 3.5 7.7 7.7v104.7c0 4.1-3.5 7.6-7.7 7.6z"/><path fill="#FFFFFF" d="M162.8 60.1L179 42.5h-11L157.4 54l-10.2-11.5h-33.4v35h32.9l10.6-11.6 10.2 11.6h10.8l-15.5-17.4zm-20.3 10.1H122v-7h18.2V56H122v-6.4h20.8l9.1 10.2-9.4 10.4zm-95-7.7l-5.6-13.9-5.6 13.9m74.4 15h-8.5V50.1L90.1 77.5h-7.3L70.7 50.1v27.4h-17l-3.2-7.8H33.2L30 77.5h-9l14.9-35h12.3l14.1 33.1V42.5H76l10.9 23.7 10-23.7h13.8v35z"/></svg>

                                        <svg class="frb-cc-logo-jcb" xmlns="http://www.w3.org/2000/svg" aria-labelledby="frb-cc-logo-jcb-title" viewBox="0 0 200 120"><title id="frb-cc-logo-jcb-title">JCB</title><path fill="#FFFFFF" d="M193.1 0H7.7C3.4 0 0 3.3 0 7.5v105c0 3.9 3.1 7.1 6.9 7.5h185.4c4.3 0 7.7-3.4 7.7-7.5V7.5c0-3.9-3.1-7.1-6.9-7.5z"/><linearGradient id="path6338_1_" gradientUnits="userSpaceOnUse" x1="-227.894" y1="959.936" x2="-209.808" y2="959.936" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#007940"/><stop offset=".229" stop-color="#00873F"/><stop offset=".743" stop-color="#40A737"/><stop offset="1" stop-color="#5CB531"/></linearGradient><path id="path6338" fill="url(#path6338_1_)" d="M130.4 69.6h8.7c.2 0 .8-.1 1.1-.1 1.6-.3 3.1-1.8 3.1-3.9 0-2-1.4-3.5-3.1-3.9-.2-.1-.7-.1-1.1-.1h-8.7v8z"/><linearGradient id="path6349_1_" gradientUnits="userSpaceOnUse" x1="-227.894" y1="962.732" x2="-209.823" y2="962.732" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#007940"/><stop offset=".229" stop-color="#00873F"/><stop offset=".743" stop-color="#40A737"/><stop offset="1" stop-color="#5CB531"/></linearGradient><path id="path6349" fill="url(#path6349_1_)" d="M138.1 15c-8.2 0-15 6.7-15 15v15.6h21.2c.5 0 1.1 0 1.5.1 4.8.2 8.3 2.7 8.3 7 0 3.4-2.4 6.3-6.8 6.8v.2c4.9.3 8.6 3 8.6 7.3 0 4.5-4.1 7.5-9.6 7.5H123V105h22c8.2 0 15-6.7 15-15V15h-21.9z"/><linearGradient id="path6360_1_" gradientUnits="userSpaceOnUse" x1="-227.894" y1="965.808" x2="-209.807" y2="965.808" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#007940"/><stop offset=".229" stop-color="#00873F"/><stop offset=".743" stop-color="#40A737"/><stop offset="1" stop-color="#5CB531"/></linearGradient><path id="path6360" fill="url(#path6360_1_)" d="M142.1 53.7c0-2-1.4-3.3-3.1-3.5-.2 0-.6-.1-.8-.1h-7.8v7.3h7.8c.2 0 .7 0 .8-.1 1.7-.3 3.1-1.7 3.1-3.6z"/><linearGradient id="path6371_1_" gradientUnits="userSpaceOnUse" x1="-268.384" y1="962.752" x2="-250.018" y2="962.752" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#1F286F"/><stop offset=".475" stop-color="#004E94"/><stop offset=".826" stop-color="#0066B1"/><stop offset="1" stop-color="#006FBC"/></linearGradient><path id="path6371" fill="url(#path6371_1_)" d="M55.1 15c-8.2 0-15 6.7-15 15v37c4.2 2.1 8.6 3.4 12.9 3.4 5.2 0 8-3.1 8-7.4V45.5h12.9v17.4c0 6.8-4.2 12.3-18.5 12.3-8.7 0-15.4-1.9-15.4-1.9v31.6h22c8.2 0 15-6.7 15-15V15H55.1z"/><linearGradient id="path6384_1_" gradientUnits="userSpaceOnUse" x1="-248.235" y1="962.712" x2="-230.398" y2="962.712" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#6C2C2F"/><stop offset=".173" stop-color="#882730"/><stop offset=".573" stop-color="#BE1833"/><stop offset=".859" stop-color="#DC0436"/><stop offset="1" stop-color="#E60039"/></linearGradient><path id="path6384" fill="url(#path6384_1_)" d="M96.6 15c-8.2 0-15 6.7-15 15v19.6c3.8-3.2 10.4-5.3 21-4.8 5.7.2 11.8 1.8 11.8 1.8V53c-3.1-1.6-6.7-3-11.4-3.3-8.1-.6-12.9 3.4-12.9 10.3 0 7 4.9 11 12.9 10.3 4.7-.3 8.3-1.8 11.4-3.3v6.3s-6 1.6-11.8 1.8c-10.6.5-17.2-1.6-21-4.8V105h22c8.2 0 15-6.7 15-15V15h-22z"/></svg>

                                        <svg class="frb-cc-logo-discover" xmlns="http://www.w3.org/2000/svg" aria-labelledby="frb-cc-logo-discover-title" viewBox="0 0 200 120"><title id="frb-cc-logo-discover-title">Discover</title><path fill="#FFFFFF" d="M192.3 120H7.7c-4.2 0-7.7-3.5-7.7-7.7V7.7C0 3.5 3.5 0 7.7 0h184.6c4.2 0 7.7 3.5 7.7 7.7v104.7c0 4.1-3.5 7.6-7.7 7.6z"/><path fill="#E77730" d="M47.5 120h144.8c4.2 0 7.7-3.5 7.7-7.7V64.6s-21.5 15.4-61.9 31C104 108.9 57 118.2 47.5 120z"/><path fill="#211E1E" d="M26.6 54.2c-1.8 1.6-4 2.3-7.6 2.3h-1.5V37.8H19c3.6 0 5.8.6 7.6 2.3 1.9 1.7 3.1 4.4 3.1 7 0 2.7-1.2 5.4-3.1 7.1m-6.5-21.3h-8.2v28.2H20c4.3 0 7.4-1 10.2-3.3 3.3-2.7 5.2-6.7 5.2-10.8 0-8.2-6.3-14.1-15.3-14.1M38 61.3h5.6V32.9H38v28.4zm19.1-17.5c-3.3-1.2-4.3-2-4.3-3.6 0-1.8 1.8-3.2 4.1-3.2 1.7 0 3 .7 4.5 2.3l2.9-3.8c-2.4-2.1-5.3-3.2-8.4-3.2-5.1 0-8.9 3.5-8.9 8.1 0 3.9 1.8 5.9 7 7.7 2.2.8 3.3 1.3 3.8 1.6 1.1.7 1.7 1.8 1.7 2.9 0 2.3-1.9 4-4.3 4-2.7 0-4.8-1.3-6.1-3.8l-3.6 3.5c2.6 3.8 5.6 5.3 9.9 5.3 5.8 0 9.8-3.8 9.8-9.2.2-4.3-1.7-6.3-8.1-8.6m10 3.3c0 8.3 6.6 14.8 15.1 14.8 2.4 0 4.5-.5 7-1.7v-6.5c-2.2 2.2-4.2 3.1-6.7 3.1-5.6 0-9.6-4.1-9.6-9.7 0-5.4 4.1-9.7 9.3-9.7 2.7 0 4.7 1 7 3.2V34c-2.4-1.2-4.5-1.8-6.9-1.8-8.4.1-15.2 6.7-15.2 14.9m66.2 4.9l-7.6-19h-6.1l12.1 29h3l12.4-29h-6l-7.8 19m16.3 9.3h15.8v-4.8h-10.2v-7.7h9.8V44h-9.8v-6.2h10.2v-4.9h-15.8M176.3 46h-1.6v-8.5h1.7c3.5 0 5.4 1.4 5.4 4.2-.1 2.7-2 4.3-5.5 4.3m11.1-4.6c0-5.2-3.7-8.3-10.1-8.3H169v28.2h5.6V49.9h.7l7.7 11.4h6.9l-9-11.9c4.2-.9 6.5-3.8 6.5-8"/><path fill="#E77731" d="M121.2 47.1c0 8.2-6.8 15-15.1 15S91 55.3 91 47.1s6.8-15 15.1-15c8.4 0 15.1 6.8 15.1 15"/><path fill="none" d="M106.3 32c-.6 0-1.2 0-1.8.1.2 0 .4 0 .6-.1.5.1.9.1 1.2 0h.8-.8M91.4 43.6c-.1.5-.2 1.1-.3 1.6 0 .2 0 .4-.1.5.1-.5.1-1 .2-1.5.1-.1.1-.3.2-.6"/></svg>
                                    </span>
                                </label>
                            </div>

                            <div data-name="Bank Transfer" class="frb-button frb-pm-bt no-monthly" style="display: none;">
                                <input id="frb-pm-bt" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'bt' }, 'no-monthly');"/>
                                <label for="frb-pm-bt" class="frb-label">{{{FR2015_translations,pm-banktransfer}}}</label>
                            </div>

                            <div data-name="Cash" class="frb-button frb-pm-cash no-monthly" style="display: none;">
                                <input id="frb-pm-cash" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'cash' }, 'no-monthly');"/>
                                <label for="frb-pm-cash" class="frb-label">{{{FR2015_translations,pm-cash}}}</label>
                            </div>

                            <div data-name="PayPal" class="frb-button frb-pm-pp">
                                <input id="frb-pm-pp" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'paypal' });"/>
                                <label for="frb-pm-pp" class="frb-label">
                                    <svg class="frb-logo-payments frb-logo-payments--paypal" role="img" aria-labelledby="frb-logo-paypal-title" width="80" height="24" viewBox="0 0 80 24" xmlns="http://www.w3.org/2000/svg"><title id="frb-logo-paypal-title">{{{FR2015_translations,pm-paypal}}}</title><g fill-rule="nonzero" fill="none"><path d="M12.444 5.085H6.97a.763.763 0 0 0-.752.648L4.006 19.891c-.044.279.17.53.451.53H7.07a.762.762 0 0 0 .751-.647l.597-3.819a.762.762 0 0 1 .75-.648h1.733c3.606 0 5.686-1.76 6.23-5.248.245-1.526.01-2.724-.698-3.564-.778-.922-2.158-1.41-3.99-1.41zm.631 5.171c-.3 1.981-1.8 1.981-3.25 1.981h-.826l.579-3.7a.457.457 0 0 1 .45-.388h.379c.988 0 1.92 0 2.402.569.288.339.376.842.266 1.538zM28.803 10.193h-2.62a.458.458 0 0 0-.451.388l-.116.74-.184-.269c-.567-.83-1.832-1.108-3.095-1.108-2.896 0-5.37 2.213-5.851 5.317-.25 1.548.105 3.029.976 4.061.799.95 1.941 1.345 3.301 1.345 2.334 0 3.628-1.513 3.628-1.513l-.117.734c-.044.281.17.533.45.533h2.36a.763.763 0 0 0 .752-.648l1.416-9.05a.457.457 0 0 0-.449-.53zm-3.653 5.145c-.253 1.51-1.441 2.525-2.957 2.525-.76 0-1.37-.246-1.76-.713-.387-.464-.534-1.123-.411-1.858.236-1.497 1.444-2.544 2.937-2.544.744 0 1.35.25 1.748.72.399.475.557 1.139.443 1.87zM42.761 10.193h-2.634a.761.761 0 0 0-.63.336l-3.632 5.398-1.54-5.187a.764.764 0 0 0-.73-.547h-2.587a.46.46 0 0 0-.433.608l2.9 8.588-2.726 3.884a.46.46 0 0 0 .372.727h2.63c.25 0 .483-.123.625-.33l8.76-12.755a.46.46 0 0 0-.375-.722" fill="#283B82"/><path d="M51.48 5.085h-5.473a.762.762 0 0 0-.75.648l-2.214 14.158c-.044.279.17.53.45.53H46.3c.261 0 .485-.191.525-.453l.628-4.013a.762.762 0 0 1 .751-.648h1.732c3.606 0 5.686-1.76 6.23-5.248.246-1.526.01-2.724-.699-3.564-.777-.922-2.156-1.41-3.987-1.41zm.632 5.171c-.299 1.981-1.799 1.981-3.25 1.981h-.826l.58-3.7a.456.456 0 0 1 .45-.388h.379c.987 0 1.92 0 2.402.569.287.339.375.842.265 1.538zM67.84 10.193h-2.62a.455.455 0 0 0-.45.388l-.116.74-.184-.269c-.567-.83-1.832-1.108-3.094-1.108-2.897 0-5.37 2.213-5.851 5.317-.25 1.548.105 3.029.976 4.061.8.95 1.94 1.345 3.3 1.345 2.334 0 3.628-1.513 3.628-1.513l-.117.734c-.044.281.17.533.452.533h2.36a.762.762 0 0 0 .75-.648l1.417-9.05a.46.46 0 0 0-.452-.53zm-3.654 5.145c-.251 1.51-1.441 2.525-2.957 2.525-.76 0-1.37-.246-1.76-.713-.387-.464-.533-1.123-.41-1.858.237-1.497 1.444-2.544 2.936-2.544.744 0 1.35.25 1.748.72.4.475.56 1.139.443 1.87zM70.929 5.474L68.683 19.89c-.044.279.17.53.45.53h2.258a.761.761 0 0 0 .751-.647l2.215-14.157a.459.459 0 0 0-.45-.532H71.38a.458.458 0 0 0-.45.389" fill="#469BDB"/></g></svg>
                                </label>
                            </div>

                            <div data-name="Venmo" class="frb-button frb-pm-venmo" style="display: none;">
                                <input id="frb-pm-venmo" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'venmo' });"/>
                                <label for="frb-pm-venmo" class="frb-label">
                                    <svg class="frb-logo-payments frb-logo-payments--venmo" role="img" aria-labelledby="frb-logo-venmo-title" height="16" viewBox="0 0 194.469 35.719" xmlns="http://www.w3.org/2000/svg">
                                        <title id="frb-logo-venmo-title">Venmo</title>
                                        <path fill="#008cff" d="M34.577.822c1.42 2.345 2.06 4.761 2.06 7.813 0 9.732-8.31 22.376-15.054 31.254H6.178L0 2.953l13.489-1.28 3.266 26.282c3.052-4.972 6.819-12.784 6.819-18.11 0-2.916-.5-4.902-1.28-6.537zM52.06 17.089c2.482 0 8.73-1.136 8.73-4.687 0-1.705-1.205-2.555-2.626-2.555-2.486 0-5.749 2.98-6.105 7.242zm-.285 7.032c0 4.336 2.412 6.037 5.608 6.037 3.482 0 6.815-.85 11.147-3.052l-1.632 11.08c-3.052 1.49-7.81 2.485-12.427 2.485-11.713 0-15.905-7.102-15.905-15.98 0-11.508 6.82-23.726 20.878-23.726 7.74 0 12.068 4.335 12.068 10.372 0 9.733-12.493 12.714-19.737 12.784zM110.439 9.348c0 1.42-.215 3.48-.43 4.827l-4.047 25.572H92.827l3.693-23.441c.07-.636.285-1.916.285-2.626 0-1.705-1.066-2.13-2.347-2.13-1.701 0-3.407.78-4.543 1.35l-4.187 26.848H72.519l6.035-38.286h11.432l.144 3.056C92.827 2.742 96.38.822 101.417.822c6.676 0 9.022 3.41 9.022 8.526zM149.432 5.156c3.762-2.697 7.314-4.191 12.211-4.191 6.744 0 9.09 3.41 9.09 8.527 0 1.42-.215 3.48-.429 4.827l-4.043 25.572h-13.138l3.763-23.937c.069-.64.215-1.42.215-1.916 0-1.92-1.066-2.345-2.347-2.345-1.631 0-3.262.71-4.473 1.35l-4.187 26.848H132.96l3.762-23.937c.069-.64.211-1.42.211-1.915 0-1.92-1.067-2.346-2.343-2.346-1.705 0-3.407.78-4.543 1.35l-4.191 26.848h-13.204l6.034-38.285h11.292l.355 3.196c2.627-1.916 6.175-3.836 10.932-3.836 4.119-.001 6.815 1.774 8.167 4.19zM196.869 16.308c0-3.126-.782-5.257-3.123-5.257-5.183 0-6.248 9.162-6.248 13.85 0 3.555.995 5.756 3.336 5.756 4.899 0 6.035-9.663 6.035-14.35zm-22.719 8.027c0-12.074 6.389-23.372 21.088-23.372 11.076 0 15.125 6.537 15.125 15.559 0 11.934-6.32 24.292-21.374 24.292-11.147 0-14.839-7.317-14.839-16.48z" transform="matrix(.92444 0 0 .89315 0 -.734)"/>
                                    </svg>
                                </label>
                            </div>

                            <div data-name="Apple Pay" class="frb-button frb-pm-applepay">
                                <input id="frb-pm-applepay" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'apple' });"/>
                                <label for="frb-pm-applepay" class="frb-label">
                                    <svg class="frb-logo-payments frb-logo-payments--applepay" role="img" aria-labelledby="frb-logo-applepay-title" width="58" height="24" viewBox="0 0 512 210.2" xmlns="http://www.w3.org/2000/svg"><title id="frb-logo-applepay-title">Apple Pay</title><path d="M93.6 27.1C87.6 34.2 78 39.8 68.4 39c-1.2-9.6 3.5-19.8 9-26.1 6-7.3 16.5-12.5 25-12.9 1 10-2.9 19.8-8.8 27.1m8.7 13.8c-13.9-.8-25.8 7.9-32.4 7.9-6.7 0-16.8-7.5-27.8-7.3-14.3.2-27.6 8.3-34.9 21.2-15 25.8-3.9 64 10.6 85 7.1 10.4 15.6 21.8 26.8 21.4 10.6-.4 14.8-6.9 27.6-6.9 12.9 0 16.6 6.9 27.8 6.7 11.6-.2 18.9-10.4 26-20.8 8.1-11.8 11.4-23.3 11.6-23.9-.2-.2-22.4-8.7-22.6-34.3-.2-21.4 17.5-31.6 18.3-32.2-10-14.8-25.6-16.4-31-16.8m80.3-29v155.9h24.2v-53.3h33.5c30.6 0 52.1-21 52.1-51.4s-21.1-51.2-51.3-51.2h-58.5zm24.2 20.4h27.9c21 0 33 11.2 33 30.9s-12 31-33.1 31h-27.8V32.3zM336.6 169c15.2 0 29.3-7.7 35.7-19.9h.5v18.7h22.4V90.2c0-22.5-18-37-45.7-37-25.7 0-44.7 14.7-45.4 34.9h21.8c1.8-9.6 10.7-15.9 22.9-15.9 14.8 0 23.1 6.9 23.1 19.6v8.6l-30.2 1.8c-28.1 1.7-43.3 13.2-43.3 33.2 0 20.2 15.7 33.6 38.2 33.6zm6.5-18.5c-12.9 0-21.1-6.2-21.1-15.7 0-9.8 7.9-15.5 23-16.4l26.9-1.7v8.8c0 14.6-12.4 25-28.8 25zm82 59.7c23.6 0 34.7-9 44.4-36.3L512 54.7h-24.6l-28.5 92.1h-.5l-28.5-92.1h-25.3l41 113.5-2.2 6.9c-3.7 11.7-9.7 16.2-20.4 16.2-1.9 0-5.6-.2-7.1-.4v18.7c1.4.4 7.4.6 9.2.6z"/></svg>
                                </label>
                            </div>

                            <div data-name="Google Pay" class="frb-button frb-pm-google">
                                <input id="frb-pm-google" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'google' });"/>
                                <label for="frb-pm-google" class="frb-label">
                                    <svg class="frb-logo-payments frb-logo-payments--google" role="img" aria-labelledby="frb-logo-google-title" xmlns="http://www.w3.org/2000/svg" viewBox="170.7 170 752 400" height="24">
                                        <title id="frb-logo-google-title">Google Pay</title>
                                        <path fill="#FFF" d="M722.7 170h-352c-110 0-200 90-200 200s90 200 200 200h352c110 0 200-90 200-200s-90-200-200-200z"/><path fill="#3C4043" d="M722.7 186.2c24.7 0 48.7 4.9 71.3 14.5 21.9 9.3 41.5 22.6 58.5 39.5 16.9 16.9 30.2 36.6 39.5 58.5 9.6 22.6 14.5 46.6 14.5 71.3s-4.9 48.7-14.5 71.3c-9.3 21.9-22.6 41.5-39.5 58.5-16.9 16.9-36.6 30.2-58.5 39.5-22.6 9.6-46.6 14.5-71.3 14.5h-352c-24.7 0-48.7-4.9-71.3-14.5-21.9-9.3-41.5-22.6-58.5-39.5-16.9-16.9-30.2-36.6-39.5-58.5-9.6-22.6-14.5-46.6-14.5-71.3s4.9-48.7 14.5-71.3c9.3-21.9 22.6-41.5 39.5-58.5 16.9-16.9 36.6-30.2 58.5-39.5 22.6-9.6 46.6-14.5 71.3-14.5h352m0-16.2h-352c-110 0-200 90-200 200s90 200 200 200h352c110 0 200-90 200-200s-90-200-200-200z"/><g fill="#3C4043"><path d="M529.3 384.2v60.5h-19.2V295.3H561c12.9 0 23.9 4.3 32.9 12.9 9.2 8.6 13.8 19.1 13.8 31.5 0 12.7-4.6 23.2-13.8 31.7-8.9 8.5-19.9 12.7-32.9 12.7h-31.7v.1zm0-70.5v52.1h32.1c7.6 0 14-2.6 19-7.7 5.1-5.1 7.7-11.3 7.7-18.3 0-6.9-2.6-13-7.7-18.1-5-5.3-11.3-7.9-19-7.9h-32.1v-.1zM657.9 339.1c14.2 0 25.4 3.8 33.6 11.4 8.2 7.6 12.3 18 12.3 31.2v63h-18.3v-14.2h-.8c-7.9 11.7-18.5 17.5-31.7 17.5-11.3 0-20.7-3.3-28.3-10s-11.4-15-11.4-25c0-10.6 4-19 12-25.2 8-6.3 18.7-9.4 32-9.4 11.4 0 20.8 2.1 28.1 6.3v-4.4c0-6.7-2.6-12.3-7.9-17-5.3-4.7-11.5-7-18.6-7-10.7 0-19.2 4.5-25.4 13.6l-16.9-10.6c9.3-13.5 23.1-20.2 41.3-20.2zm-24.8 74.2c0 5 2.1 9.2 6.4 12.5 4.2 3.3 9.2 5 14.9 5 8.1 0 15.3-3 21.6-9s9.5-13 9.5-21.1c-6-4.7-14.3-7.1-25-7.1-7.8 0-14.3 1.9-19.5 5.6-5.3 3.9-7.9 8.6-7.9 14.1zM808.2 342.4l-64 147.2h-19.8l23.8-51.5-42.2-95.7h20.9l30.4 73.4h.4l29.6-73.4h20.9z"/></g><path fill="#4285F4" d="M452.93 372c0-6.26-.56-12.25-1.6-18.01h-80.48v33l46.35.01c-1.88 10.98-7.93 20.34-17.2 26.58v21.41h27.59c16.11-14.91 25.34-36.95 25.34-62.99z"/><path fill="#34A853" d="M400.01 413.58c-7.68 5.18-17.57 8.21-29.14 8.21-22.35 0-41.31-15.06-48.1-35.36h-28.46v22.08c14.1 27.98 43.08 47.18 76.56 47.18 23.14 0 42.58-7.61 56.73-20.71l-27.59-21.4z"/><path fill="#FABB05" d="M320.09 370.05c0-5.7.95-11.21 2.68-16.39v-22.08h-28.46c-5.83 11.57-9.11 24.63-9.11 38.47s3.29 26.9 9.11 38.47l28.46-22.08a51.657 51.657 0 0 1-2.68-16.39z"/><path fill="#E94235" d="M370.87 318.3c12.63 0 23.94 4.35 32.87 12.85l24.45-24.43c-14.85-13.83-34.21-22.32-57.32-22.32-33.47 0-62.46 19.2-76.56 47.18l28.46 22.08c6.79-20.3 25.75-35.36 48.1-35.36z"/>
                                    </svg>
                                </label>
                            </div>

                            <div data-name="PayPal" class="frb-button frb-pm-pp-usd" style="display: none;">
                                <input id="frb-pm-pp-usd" type="radio" name="frb-methods" class="frb-radio" onchange="frb.setMethod({ method:'paypal', skipValidation: true });"/>
                                <label for="frb-pm-pp-usd" class="frb-label">
                                    <svg class="frb-logo-payments frb-logo-payments--paypal-usd" role="img" aria-labelledby="frb-logo-paypal-usd-title" width="105" height="24" viewBox="0 0 105 24" xmlns="http://www.w3.org/2000/svg"><title id="frb-logo-paypal-usd-title">{{{FR2015_translations,pm-paypal}}} (USD)</title><g fill="none" fill-rule="evenodd"><path d="M75.452 10.3c.44-.68 1.024-1.411 1.752-2.195h1.192l-.471.621a11.815 11.815 0 0 0-1.542 2.684 12.17 12.17 0 0 0-.604 2.007c-.24 1.13-.297 2.17-.172 3.12.074.563.26 1.283.56 2.163h-1.17l-.277-.538c-.185-.325-.353-.81-.504-1.452a7.683 7.683 0 0 1-.05-3.393c.214-1.013.643-2.018 1.286-3.016zm4.042-2.062h1.735l-1.07 5.023c-.118.562-.139.972-.061 1.231.11.458.514.688 1.208.688.692 0 1.189-.23 1.492-.688.188-.259.342-.669.46-1.23l1.07-5.024h1.735l-1.07 5.023c-.185.869-.464 1.545-.837 2.03-.691.886-1.744 1.33-3.16 1.33-1.416 0-2.282-.444-2.6-1.33-.166-.485-.157-1.161.028-2.03l1.07-5.023zm8.232 5.65c-.025.373.017.652.128.837.207.336.647.504 1.32.504.402 0 .739-.044 1.008-.133.514-.17.82-.486.915-.948.06-.27-.015-.478-.222-.626-.203-.144-.547-.272-1.03-.383l-.827-.194c-.81-.192-1.353-.4-1.63-.626-.47-.377-.619-.967-.449-1.769.155-.732.55-1.34 1.187-1.824.635-.484 1.469-.726 2.5-.726.861 0 1.547.228 2.057.685.51.456.687 1.119.532 1.987h-1.641c.078-.491-.06-.84-.416-1.048-.236-.136-.552-.205-.948-.205-.44 0-.81.089-1.111.266-.302.178-.485.425-.552.743-.063.292.02.51.25.654.144.097.474.21.992.339l1.336.338c.584.148 1.007.345 1.27.593.406.384.532.94.377 1.669-.16.746-.577 1.366-1.253 1.86-.677.493-1.536.74-2.578.74-1.065 0-1.85-.243-2.357-.73-.506-.485-.669-1.153-.487-2.003h1.63zm8.893-4.23l-1.13 5.333h1.574c.805 0 1.452-.397 1.94-1.192.266-.436.462-.955.588-1.558.177-.831.183-1.47.016-1.915-.166-.446-.637-.668-1.413-.668h-1.575zm3.393-1.242a2 2 0 0 1 1.17 1.037c.2.406.3.846.302 1.319.002.473-.042.924-.13 1.353-.233 1.086-.647 2.007-1.242 2.76-.806 1.017-1.826 1.525-3.06 1.525h-3.52l1.734-8.172h3.52c.504.008.912.067 1.226.178zm4.768 1.885c.218.998.22 2.003.005 3.016-.236 1.112-.733 2.243-1.49 3.393-.426.643-.801 1.127-1.126 1.452l-.505.538H100.5c.669-.88 1.16-1.6 1.475-2.162.528-.95.913-1.99 1.153-3.121a10.54 10.54 0 0 0 .25-2.007 7.927 7.927 0 0 0-.4-2.684l-.205-.62h1.192c.395.783.667 1.515.815 2.195z" fill="#000"/><g fill-rule="nonzero"><path d="M8.444 2.085H2.97a.763.763 0 0 0-.752.648L.006 16.891c-.044.279.17.53.451.53H3.07a.762.762 0 0 0 .751-.647l.597-3.819a.762.762 0 0 1 .75-.648h1.733c3.606 0 5.686-1.76 6.23-5.248.245-1.526.01-2.724-.698-3.564-.778-.922-2.158-1.41-3.99-1.41zm.631 5.171c-.3 1.981-1.8 1.981-3.25 1.981h-.826l.579-3.7a.457.457 0 0 1 .45-.388h.379c.988 0 1.92 0 2.402.569.288.339.376.842.266 1.538zM24.803 7.193h-2.62a.458.458 0 0 0-.451.388l-.116.74-.184-.269c-.567-.83-1.832-1.108-3.095-1.108-2.896 0-5.37 2.213-5.851 5.317-.25 1.548.105 3.029.976 4.061.799.95 1.941 1.345 3.301 1.345 2.334 0 3.628-1.513 3.628-1.513l-.117.734c-.044.281.17.533.45.533h2.36a.763.763 0 0 0 .752-.648l1.416-9.05a.457.457 0 0 0-.449-.53zm-3.653 5.145c-.253 1.51-1.441 2.525-2.957 2.525-.76 0-1.37-.246-1.76-.713-.387-.464-.534-1.123-.411-1.858.236-1.497 1.444-2.544 2.937-2.544.744 0 1.35.25 1.748.72.399.475.557 1.139.443 1.87zM38.761 7.193h-2.634a.761.761 0 0 0-.63.336l-3.632 5.398-1.54-5.187a.764.764 0 0 0-.73-.547h-2.587a.46.46 0 0 0-.433.608l2.9 8.588-2.726 3.884a.46.46 0 0 0 .372.727h2.63c.25 0 .483-.123.625-.33l8.76-12.755a.46.46 0 0 0-.375-.722" fill="#283B82"/><path d="M47.48 2.085h-5.473a.762.762 0 0 0-.75.648l-2.214 14.158c-.044.279.17.53.45.53H42.3c.261 0 .485-.191.525-.453l.628-4.013a.762.762 0 0 1 .751-.648h1.732c3.606 0 5.686-1.76 6.23-5.248.246-1.526.01-2.724-.699-3.564-.777-.922-2.156-1.41-3.987-1.41zm.632 5.171c-.299 1.981-1.799 1.981-3.25 1.981h-.826l.58-3.7a.456.456 0 0 1 .45-.388h.379c.987 0 1.92 0 2.402.569.287.339.375.842.265 1.538zM63.84 7.193h-2.62a.455.455 0 0 0-.45.388l-.116.74-.184-.269c-.567-.83-1.832-1.108-3.094-1.108-2.897 0-5.37 2.213-5.851 5.317-.25 1.548.105 3.029.976 4.061.8.95 1.94 1.345 3.3 1.345 2.334 0 3.628-1.513 3.628-1.513l-.117.734c-.044.281.17.533.452.533h2.36a.762.762 0 0 0 .75-.648l1.417-9.05a.46.46 0 0 0-.452-.53zm-3.654 5.145c-.251 1.51-1.441 2.525-2.957 2.525-.76 0-1.37-.246-1.76-.713-.387-.464-.533-1.123-.41-1.858.237-1.497 1.444-2.544 2.936-2.544.744 0 1.35.25 1.748.72.4.475.56 1.139.443 1.87zM66.929 2.474L64.683 16.89c-.044.279.17.53.45.53h2.258a.761.761 0 0 0 .751-.647l2.215-14.157a.459.459 0 0 0-.45-.532H67.38a.458.458 0 0 0-.45.389" fill="#469BDB"/></g></g></svg>
                                </label>
                            </div>

                        </div>
                    </fieldset>

                    <fieldset class="frb-fieldset frb-optin" style="display: none;">
                        <legend class="frb-message">
                            {{{FR2015_translations,optin-can-we-follow}}}
                        </legend>
                        <div class="frb-buttons-wrapper">
                            <div class="frb-button">
                                <input class="frb-radio" type="radio" name="opt_in" id="frb-optin-yes" value="1">
                                <label class="frb-label" for="frb-optin-yes">{{{FR2015_translations,optin-yes}}}</label>
                            </div>
                            <div class="frb-button">
                                <input class="frb-radio" type="radio" name="opt_in" id="frb-optin-no" value="0">
                                <label class="frb-label" for="frb-optin-no">{{{FR2015_translations,optin-no}}}</label>
                            </div>
                        </div>
                        <p class="frb-message frb-message--typing frb-message--optin is-hidden">
                            <svg class="type-indicator" aria-hidden="true" width="42" height="10" viewBox="0 0 42 10" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><circle class="type-indicator__circle" fill="#B3D1FF" style="/*mix-blend-mode:multiply*/" cx="5" cy="5" r="5"/><circle class="type-indicator__circle" fill="#B3D1FF" style="/*mix-blend-mode:multiply*/" cx="21" cy="5" r="5"/><circle class="type-indicator__circle" fill="#80B3FF" style="/*mix-blend-mode:multiply*/" cx="37" cy="5" r="5"/></g></svg>
                        </p>
                        <p class="frb-message is-hidden frb-optin-no-prompt frb-message--optin">
                            <span class="frb-optin-no-prompt__no"> {{{FR2015_translations,optin-we-sorry}}}</span>
                            <span class="frb-optin-no-prompt__yes"> {{{FR2015_translations,optin-thanks-changing}}}</span>
                        </p>
                        <p class="frb-optin-legal">{{{FR2015_translations,optin-info-handled}}}</p>
                    </fieldset>

                    <button id="frb-donate" class="frb-submit" onclick="return false;">
                        <span class="frb-submit-txt">
                            <span class="frb-submit-txt-continue">{{{FR2015_translations,continue}}}</span>
                            <span class="frb-submit-txt-donate">
                                <span class="frb-submit-txt-once">{{{FR2015_translations,continue-amt-onetime}}}</span>
                                <span class="frb-submit-txt-monthly">{{{FR2015_translations,continue-amt-monthly}}}</span>
                            </span>
                        </span>
                    </button>

                    <div class="frb-error frb-error-smallamount">{{{FR2015_translations,smallamount-error}}}</div>
                    <div class="frb-error frb-error-bigamount">{{{FR2015_translations,bigamount-error}}}</div>
                    <div class="frb-error frb-error-method">{{{FR2015_translations,select-payment-method-please}}}</div>
                    <div class="frb-error frb-error-optin">{{{FR2015_translations,optin-please-select-email-option}}}</div>

                </div><!--frb-step-2-->

                <div class="frb-mask"></div>
                <div class="frb-step-upsell" style="display: none;">
                    <button class="frb-back-step">
                        <svg class="frb-icon frb-icon-back" aria-labelledby="frb-icon-back-title-upsell" xmlns="http://www.w3.org/2000/svg" width="20" height="16" viewBox="0 0 20 16"><title id="frb-icon-back-title-upsell">{{{FR2015_translations,back}}}</title><g fill="none" fill-rule="evenodd" transform="translate(1 1)"><path stroke="#72777D" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.778" d="M7.181 13.285L.753 7 7.181.715"/><rect width="18.182" height="1.778" x=".818" y="6.111" fill="#72777D" rx=".889"/></g></svg>
                    </button>
                    <button class="frb-back">
                        <svg class="frb-icon frb-icon-back" aria-labelledby="frb-icon-back-title" xmlns="http://www.w3.org/2000/svg" width="20" height="16" viewBox="0 0 20 16"><title id="frb-icon-back-title">{{{FR2015_translations,back}}}</title><g fill="none" fill-rule="evenodd" transform="translate(1 1)"><path stroke="#72777D" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.778" d="M7.181 13.285L.753 7 7.181.715"/><rect width="18.182" height="1.778" x=".818" y="6.111" fill="#72777D" rx=".889"/></g></svg>
                    </button>

                    <div class="frb-upsell">
                        <p class="frb-upsell-cta">Why not make it <span class="frb-upsell-ask"></span> monthly?</p>
                        <p class="frb-upsell-color">Monthly support is the best way to ensure that Wikipedia keeps thriving.</p>
                    </div>

                    <div class="frb-monthly-buttons">

                        <button id="frb-monthly-donate-no" class="frb-submit active" onclick="return false;">
                            <span class="frb-submit-txt">No thanks! I'll make a one-time donation of <span class="frb-ptf-total"></span></span>
                        </button>

                        <button id="frb-monthly-donate-yes" class="frb-submit active" onclick="return false;">
                            <span class="frb-submit-txt">Yes, I'll donate <span class="frb-upsell-ask"></span> each month</span>
                        </button>

                        <button class="frb-monthly-diff-amt-link">Yes, I'll donate monthly, but for a different amount</button>

                    </div>

                    <div class="frb-monthly-diff-amt">
                        <p class="frb-upsell-ty">Thank you for your support!</p>
                        <div class="frb-amt-monthly">
                            <label for="frb-amt-monthly-other-input">{{{FR2015_translations,enter-monthly-amt}}}</label>
                            <input name="otherMonthlyAmount" type="text" inputmode="decimal" id="frb-amt-monthly-other-input" size="3" autocomplete="off" value="" />
                        </div>
                        <div class="frb-error frb-error-smallamount">{{{FR2015_translations,smallamount-error}}}</div>
                        <div class="frb-error frb-error-bigamount">{{{FR2015_translations,bigamount-error}}}</div>
                        <button id="frb-donate-monthly-other" class="frb-submit" onclick="return false;">
                            <span class="frb-submit-txt">{{{FR2015_translations,donate-amt-monthly}}}</span>
                        </button>
                    </div>

                </div><!--frb-step-upsell-->

            </form><!--frb-form-->

            <div class="frb-rml-wrapper">
                <h2 class="frb-visually-hidden">Fundraising remind me later form</h2>
                <button class="frb-rml-link js-rml">
                    {{{FR2015_translations,maybe-later}}}
                </button>

                <p class="frb-message frb-message--typing is-hidden">
                    <svg class="type-indicator" aria-hidden="true" width="42" height="10" viewBox="0 0 42 10" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><circle class="type-indicator__circle" fill="#B3D1FF" style="/*mix-blend-mode:multiply*/" cx="5" cy="5" r="5"/><circle class="type-indicator__circle" fill="#B3D1FF" style="/*mix-blend-mode:multiply*/" cx="21" cy="5" r="5"/><circle class="type-indicator__circle" fill="#80B3FF" style="/*mix-blend-mode:multiply*/" cx="37" cy="5" r="5"/></g></svg>
                </p>

                <form class="frb-rml-form is-hidden" id="frb-rml-form" method="post" action="https://www.pages04.net/wikimedia/remind/Form?sp_source={{{banner}}}">
                    <p class="frb-message frb-message--standard">
                        {{{FR2015_translations,remind-me-please-enter}}}
                    </p>
                    <input type="hidden" name="formSourceName" value="StandardForm" />
                    <!-- DO NOT REMOVE HIDDEN FIELD sp_exp -->
                    <input type="hidden" name="sp_exp" value="yes" />
                    <input type="hidden" name="rml_source" value="{{{banner}}}" />
                    <input type="hidden" name="rml_country" value="" />
                    <input type="hidden" name="rml_language" value="" />
                    <input type="hidden" name="rml_submitDate" value="" />
                    <input type="hidden" name="rml_segment" value="" />
                    <input type="email" name="Email" class="frb-rml-email" id="frb-rml-email" placeholder="{{{FR2015_translations,remind-me-donor-email}}}" dir="ltr" autocomplete="email" />
                    <div class="frb-error frb-error-invalidemail">
                        {{{FR2015_translations,remind-me-error-msg-invalid}}}
                    </div>
                    <button class="frb-submit-rml" id="frb-rml-submit" type="submit">{{{FR2015_translations,remind-me-submit}}}</button>
                </form>

                <p class="frb-message frb-message--standard frb-rml-ty is-hidden">
                    {{{FR2015_translations,remind-me-thankyou}}}
                </p>
            </div><!--end frb-rml-wrapper-->

            <div class="frb-wmf-identity">
               <div class="frb-wmf-identity-logo">
                   <img src="https://upload.wikimedia.org/wikipedia/donate/1/14/Wikimedia_Foundation_logo_-_wordmark.svg" alt="Wikimedia Foundation Logo" />
               </div>
               <div class="frb-wmf-identity-message">
                   <p>Proud host of Wikipedia and its sister sites</p>
               </div>
            </div>

            <div class="frb-footer">
                <h2 class="frb-visually-hidden">Fundraising legal footer</h2>
                {{MediaWiki:FundraisingBanners/SmallPrint-2017}}
            </div><!--end frb-footer-->

            <button class="frb-rml-link frb-close-banner js-close">
                Collapse
            </button>

        </div><!--frb-conversation-->
    </div><!--frb-main-->

    <div id="frb-nag" class="frb">
        <div class="frb-conversation-open frb-bubble-message-close" aria-label="open">
            <span class="frb-conversation-open-icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" aria-hidden="true"><g><path d="m17.5 4.75-7.5 7.5-7.5-7.5L1 6.25l9 9 9-9z"></path></g></svg>
            </span>
        </div>
        <div class="frb-conversation-close frb-bubble-message-close frbRemoveBanner" aria-label="close">
            <span class="frb-conversation-close-icon"></span>
        </div>
        <div class="frb-bubble-message-container" id="frb-bubble-message-container">
            <span class="frb-bubble-message">
                <svg class="frb-message-icon" role="img" aria-hidden="true" width="20" height="20" viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero" fill="none"><circle cx="10.492" cy="14.492" r="10.492"></circle><path d="M12.681 11.754l-2.267 7.864c-.125.45-.188.745-.188.885 0 .08.033.156.1.226.066.07.136.105.21.105.125 0 .25-.055.376-.165.332-.273.73-.767 1.194-1.482l.376.22c-1.113 1.94-2.296 2.91-3.55 2.91-.48 0-.86-.135-1.144-.404a1.349 1.349 0 0 1-.426-1.023c0-.273.062-.62.188-1.04l1.537-5.286c.147-.51.221-.892.221-1.15a.566.566 0 0 0-.21-.432c-.14-.125-.332-.188-.575-.188-.11 0-.243.004-.398.011l.144-.442 3.749-.609h.663zm-.685-5.087c.457 0 .842.159 1.156.475.313.318.47.701.47 1.15 0 .45-.16.834-.476 1.15-.317.318-.7.476-1.15.476-.443 0-.822-.158-1.14-.475a1.566 1.566 0 0 1-.475-1.15c0-.45.157-.833.47-1.15a1.549 1.549 0 0 1 1.145-.476z"></path></g></svg>
                Sorry to interrupt, but time will soon run out for you to give in 2023. Please, donate %amount%.
            </span>
        </div><!--end frb-bubble-message-container -->
    </div><!--frb-nag-->
</div><!--end frb-bubble-container -->
</div><!--end frb-->

<script>
var frb = frb || {};

frb.HIDE_DURATION_SKIP = 3600; // 1 hour
frb.HIDE_DURATION_RML = 604800; // 1 week
frb.HIDE_DURATION_CLOSENAG = 3600; // 1 hour

frb.show = function() {
    $('.banner-container').insertBefore('#bodyContent');
    $('.frb').css('display', 'block');
    $('.frb').addClass('frb-country-' + mw.centralNotice.data.country);
};

frb.toggleMonthly = function( monthly ) {
    if ( monthly.type === 'checkbox' ) {
        monthly = monthly.checked;
    }
    if ( monthly ) {
        $('#frb-frequency-monthly').prop('checked', true);
        $('#frb-monthly-checkbox').prop('checked', true);
        $('.no-monthly input').attr('disabled', true);
        $('#frb-form').addClass('form-monthly');
        if ( $('.form-monthly .no-monthly input[type=radio]').is(':checked') ) {
            $('.form-monthly .no-monthly input[type=radio]').removeAttr('checked');
            frb.setMethod({});
        }
    } else {
        $('#frb-frequency-onetime').prop('checked', true);
        $('#frb-monthly-checkbox').prop('checked', false);
        $('.no-monthly input').attr('disabled', false);
        $('#frb-form').removeClass('form-monthly');
    }
};

{{MediaWiki:FundraisingBanners/LocalizeData-2017.js}}

// Insert any localize data overrides here

{{MediaWiki:FundraisingBanners/CoreJS-2018.js}}
{{MediaWiki:FundraisingBanners/LocalizeJS-2022.js}}
{{MediaWiki:FundraisingBanners/VenmoBrowserCheck.js}}

frb.rml = {

    post: function() {
        /* Create the iframe for the form and use it as the form's target */
        var frameName = 'remindFrame';
        var $form = $('#frb-rml-form');
        if ( $("iframe[name=" + frameName + "]").length === 0 ) {
            var $iframe = $('<iframe style="display: none;" name="' + frameName + '"></iframe>');
            $form.attr("target", $iframe.attr("name"));
            $form.after($iframe);
        }
        $form[0].submit();
    },

    getCurrentDate: function() {
        /* Get current date in correct format for Silverpop */
        var today = new Date();
        var dd = today.getDate();
        var mm = today.getMonth()+1; // January is 0!
        var yyyy = today.getFullYear();

        if( dd < 10 ) {
            dd = '0' + dd;
        }
        if( mm < 10 ) {
            mm = '0' + mm;
        }

        return mm+'/'+dd+'/'+yyyy;
    },

    init: function() {
        /* Prep the reminder form */

        var form = document.getElementById('frb-rml-form');
        if ( !form ) return;

        form.rml_country.value    = mw.centralNotice.data.country;
        form.rml_language.value   = mw.centralNotice.data.uselang;
        form.rml_submitDate.value = frb.rml.getCurrentDate();
        form.rml_segment.value    = Math.floor((Math.random() * 100) + 1);

        $('#frb-rml-submit').click(function() {
            if ( mw.util.validateEmail( form.Email.value ) ) {
                frb.rml.post();
                $('.frb-rml-form, .frb-rml-link').hide();
                $('.frb-rml-ty').show();
                $('.frb').delay(3000).fadeOut( frb.fadeDuration, function() {
                    $('.frb').hide();
                });
                $('body, html').removeClass('frb-overlay-open');
                frb.altSetHideCookie( 'close', frb.HIDE_DURATION_RML );
                return false;
            } else {
                $('#frb-rml-email').addClass('frb-haserror').focus();
                $('.frb-error-invalidemail').show();
                return false;
            }
        });
    }

};

frb.initNag = function() {
    /* --- Code for sticky "nag" banner --- */
    $('.frb-nag-close').click(function(e) {
        $('#centralNotice').hide(); // Hide nag (but not inline banner)
        frb.altSetHideCookie( 'close', frb.HIDE_DURATION_CLOSENAG );
        e.stopPropagation();
    });

    $(document).on("click", "#frb-nag .frb-nag-action", function(e) {
        e.preventDefault();
        $( ".frb-bubble-container" ).css({"width": "100%", "height": "100%", "background": "rgba(0, 0, 0, 0.46)"});
        $("#frb-amt-ps1").click();
        $('html, body').animate( { scrollTop: $('#frb-inline').offset().top }, frb.animationDuration );
        $('.frb-step-1').show();
        $('.frb-step-2').fadeIn( frb.fadeDuration );
        $('.frb-cta-first').hide();
        $('#frb-nag').slideToggle( frb.animationDuration );
        frb.extraData.clickedNag = 1;
    });
};

$(function() {

    if ( mw.centralNotice.adminUi || !frb.supportedBrowser ) { // T262693
        return;
    }

    var language = mw.centralNotice.data.uselang;
    var country = mw.centralNotice.data.country;
    var currency = frb.getCurrency(country);
    var validAmount, validMethod, validStayInTouch;
    if ( !frb.optinRequired ) {
        validStayInTouch = 1;
    }
    var minAmount = frb.amounts.minimums[ currency ];
    var form = document.getElementById('frb-form');
    var donateFormLocation;

    mw.loader.using(['mediawiki.util']).then(function() {
        frb.rml.init();
    });

    frb.initAmountOptions();
    frb.localizeAmountOptions(frb.amounts.options7, currency, country, language, true);
    frb.localizeErrors();

    frb.storedOptions = {};
    frb.extraData = {};

    // TODO - make these all the same?
    frb.scrollDuration = frb.reduceMotion ? 0 : 600;
    frb.fadeDuration   = frb.reduceMotion ? 0 : 400;
    frb.messageDelay   = frb.reduceMotion ? 0 : 500; // Chat animation speed, for RML interaction

    frb.activateCTA = function () {
        if (validAmount && validMethod && validStayInTouch) {
            // console.log('valid - activate CTA');
            $('.frb-submit-txt-continue').hide();
            $('.frb-submit-txt-donate').show();
            $('.frb-submit').addClass('active');
        } else {
            $('.frb-submit:not(#frb-btn-first-submit)').removeClass('active');
            // console.log('invalid - deactivate CTA');
        }
    };

    frb.setMethod = function(options, frequency) {
        if( frequency === 'no-monthly' ) {
            $('#frb-frequency-monthly').attr('disabled', true);
        } else {
            $('#frb-frequency-monthly').attr('disabled', false);
        }
        frb.storedOptions = options; // Default to credit card
    };

    $('.frb-amounts').on('input change', function() {
        frb.validateAmount();
        validAmount = 1;
        frb.updateFeeDisplay();
        frb.activateCTA();
        if ( frb.optinRequired ) {
            $('.frb-optin').show();
        }
        $('.frb-cta').fadeOut( frb.fadeDuration, function() {
            $('.frb-step-2, .frb-footer').fadeIn( frb.fadeDuration );
        });
    });

    $('.frb-methods').on('change', function() {
        $('.frb-methods').removeClass('frb-haserror');
        $('.frb-error-method').hide();
        validMethod = 1;
        frb.activateCTA();
    });

    // Opt-in interaction
    $('.frb-optin .frb-radio').on('click', function() {
        validStayInTouch = 1;
        frb.activateCTA();
        $('.frb-optin').removeClass('frb-haserror');
        $('.frb-error-optin').hide();
        if ( $('#frb-optin-no').is(':checked') ) {
            $('.frb-optin-no-prompt').removeClass('is-positive');
            if ( !$('.frb-optin-no-prompt').is(':visible') ) {
                $('.frb-optin .frb-message--typing')
                    .show()
                    .delay( frb.messageDelay )
                    .fadeOut( frb.fadeDuration, function() {
                        $('.frb-optin-no-prompt').fadeIn( frb.fadeDuration );
                    });
            }
        } else {
            $('.frb-optin-no-prompt').addClass('is-positive');
        }
    });

    /* Close banner */
    $('.js-close').on('click', function(){
        hideConversation();
        $(".frb-bubble-message-container").css({"bottom": "-20px"});
        $(".frb-bubble-message-close").css({"bottom": "85px"});
        $(".frb-bubble-message-close").css({"opacity": "1"});
    });

    /* Scroll to donate option */
    $('.js-donate').on('click', function(e) {
        donateFormLocation = $('.frb-amounts').position().top - $('.frb-header').outerHeight();
        $('.frb-conversation').animate( { scrollTop: donateFormLocation + $('.frb-conversation').scrollTop() }, frb.scrollDuration );
        return false;
    });

    var $rmlButtonParent = $('.frb-options');

    /* Remind me later (RML) form */
    /* Reveal the RML form after clicking 'Donate Later' */
    $('.js-rml').on('click', function(e) {
        var rmlLocation = $('.frb-rml-wrapper').position().top;

        e.stopPropagation();
        $('.frb-footer').show();

        //if ( $(this).parent().parent().hasClass('frb-header') ) {
            $('.frb-conversation').animate( { scrollTop: rmlLocation + $('.frb-conversation').scrollTop()}, frb.scrollDuration );
        //}

        if ( $('.frb-rml-form').css('display') === 'none' ) {
            $('.frb-rml-wrapper .frb-message--typing')
                .show()
                .delay( frb.messageDelay )
                .fadeOut( frb.fadeDuration, function () {
                    $('.frb-rml-form').fadeIn(function () {
                        $('#frb-rml-email').focus();
                    });
                });
        }

        return false;
    });

    /* Other amount field */
    $('.frb-button--other').on('click keypress', function(e) {
        if ( e.which === 13 || e.type === 'click' ) {
            document.getElementById('frb-input-other').checked = true;
            frb.updateFeeDisplay();
            $('.frb-other-input').focus();
        }
    });

    /* Other amount field focus styles */
    $('.frb-other-input')
        .focus(function() {
            $('.frb-button--other').addClass('frb-button--is-focused');
        })
        .blur(function() {
            $('.frb-button--other').removeClass('frb-button--is-focused');
        });

    frb.updateUpsellAsk = function(isOtherAmountStep) {
        var amount, feeAmount, upsellAmount,
            list = frb.amounts.monthlySuggest[currency];

        if ( list === undefined ) {
            console.log('No monthlySuggest amounts found for ' + currency);
            return;
        }

        // If user is on third step (write a different amount) then get monthly amount if not, the the first form amount
        if (isOtherAmountStep !== undefined) {
            amount = frb.getMonthlyAmount();
        } else {
            amount = frb.getAmount(form);
        }

        // If PTF is checked when we need to calculate the fee for that amount
        if ( $('#frb-ptf-checkbox').prop('checked') ) {
            amount = amount + frb.calculateFee(amount);
        }

        for (var i = list.length - 1; i >= 0; i--) {
            if ( amount <= list[i][0] ) {
                upsellAmount = list[i][1];
            }
        }

        // If user is in the upsell (second step) then the form.otherMonthlyAmount.value will be updated with the upsellAmount calculated
        if (isOtherAmountStep === undefined) {
            form.otherMonthlyAmount.value = upsellAmount;
        }

        // A formatted value will be returned
        var upsellAmountFormatted = frb.formatCurrency(currency, upsellAmount, language);

        // The value of the amount will be updated only if the user is in the upsell (second step)
        if (isOtherAmountStep === undefined) {
            $('.frb-upsell-ask').text(upsellAmountFormatted);
        }
    };

    /**
     * Should we show pre-payment monthly convert?
     *
     * Only if: initial selection is one-time, suggested amount is not 0 (meaning skip),
     * payment method supports monthly, and payment method does not have post-payments monthly convert
     *
     * @returns boolean
     */
    frb.shouldShowMonthlyConvert = function() {
        let postPaymentMethods = [ 'cc', 'apple', 'google' ];
        if (
            frb.getRecurring( document.getElementById( 'frb-form' ) ) ||
            !frb.shouldShowRecurring( frb.storedOptions, mw.centralNotice.data.country ) ||
            form.otherMonthlyAmount.value == 0 ||
            postPaymentMethods.includes( frb.storedOptions.method )
        ) {
            return false;
        } else {
            return true;
        }
    }

    // Pre-upsell submit button
    $('#frb-donate').on('click', function(e) {
        frb.updateUpsellAsk();
        if ( !frb.shouldShowMonthlyConvert() ) {
            frb.submitForm(frb.storedOptions);
        } else if ( frb.validateForm(frb.storedOptions) ) {
            $('.frb-step-upsell, .frb-back-step, .frb-mask').fadeIn( frb.fadeDuration );
        } else {
            frb.extraData.validateError = 1;
        }
        return false;
    });

    // Go back to main step
    $('.frb-back-step').on('click', function(e) {
        $('.frb-mask, .frb-step-upsell').fadeOut( frb.fadeDuration );
        return false;
    });

    // Donate monthly other amount
    $('.frb-monthly-diff-amt-link').on('click', function(e) {
        form.otherMonthlyAmount.value = '';
        validAmount = 0;
        frb.activateCTA();
        frb.toggleMonthly(true);
        $('.frb-upsell, .frb-monthly-buttons').hide();
        $('.frb-monthly-diff-amt, .frb-back').show();
        return false;
    });

    // Go back from diff amount
    $('.frb-back').on('click', function(e) {
        form.otherMonthlyAmount.value = '';
        frb.updateUpsellAsk();
        validAmount = 1;
        frb.activateCTA();
        frb.toggleMonthly(false);
        $('.frb-monthly-diff-amt, .frb-back').hide();
        $('.frb-upsell, .frb-monthly-buttons').show();
        return false;
    });

    // Validate monthly other amount
    $('#frb-amt-monthly-other-input').on('input change', function(e) {
        if ( frb.validateMonthlyAmount() ) {
            validAmount = 1;
            frb.activateCTA();
            frb.updateUpsellAsk(true);
        } else {
            validAmount = 0;
        }
    });

    frb.getMonthlyAmount = function() {
        var amount = null;

        // Check the "monthly other" amount box
        if (form.otherMonthlyAmount.value !== '') {
            var otherMonthlyAmount = form.otherMonthlyAmount.value;
            otherMonthlyAmount = otherMonthlyAmount.replace(/[,.](\d)$/, ':$10');
            otherMonthlyAmount = otherMonthlyAmount.replace(/[,.](\d)(\d)$/, ':$1$2');
            otherMonthlyAmount = otherMonthlyAmount.replace(/[$£€¥,.]/g, '');
            otherMonthlyAmount = otherMonthlyAmount.replace(/:/, '.');
            amount = otherMonthlyAmount;
        }

        amount = parseFloat(amount);

        if ( isNaN(amount) ) {
            return 0;
        } else {
            var totalMonthlyAmountFormatted = frb.formatCurrency(currency, amount, language);
            $('.frb-monthly-total').text(totalMonthlyAmountFormatted);

            return amount;
        }
    };

    frb.validateMonthlyAmount = function() {
        var amount = frb.getMonthlyAmount();
        var currency  = frb.getCurrency( mw.centralNotice.data.country );
        var minAmount = frb.amounts.minimums[ currency ];

        if ( amount === null || isNaN(amount) || amount <= 0 || amount < minAmount ) {
            $('.frb-error-bigamount').hide();
            $('.frb-error-smallamount').show();
            return false;
        } else if ( amount > frb.maxUSD * minAmount ) {
            $('.frb-error-bigamount').show();
            return false;
        } else {
            $('.frb-error-smallamount, .frb-error-bigamount').hide();
            return true;
        }
    };

    frb.submitMonthly = function() {
        frb.extraData.monthlyUpsell = 1;
        frb.extraData.originalAmt = frb.getAmount().toString();

        frb.toggleMonthly(true);
        document.getElementById('frb-input-other').checked = true;
        document.getElementById('frb-ptf-checkbox').checked = false;
        form.otherAmount.value = form.otherMonthlyAmount.value;
        frb.submitForm(frb.storedOptions);
    }

    // Submit form
    $('#frb-monthly-donate-yes').on('click', function(e) {
        frb.submitMonthly();
        return false;
    });

    $('#frb-monthly-donate-no').on('click', function(e) {
        frb.submitForm(frb.storedOptions);
        return false;
    });

    $('#frb-donate-monthly-other').on('click', function (e) {
        if (frb.validateMonthlyAmount()) {
            frb.submitMonthly();
        }
        return false;
    });



    // Open already donated modal
    $('.modal-open').on('click', function(e) {
        $('.modal').show()
    })

    // Close already donated modal
    $('.modal-close').on('click', function(e) {
        closeModal(e)
    })


    $('.modal').click(function(e) {
        const modalContainer = $('.modal-container');

        if (!modalContainer.is(e.target) && modalContainer.has(e.target).length === 0) {
            closeModal(e)
        }
    })


    function closeModal(e) {
        $('.modal').hide()
        if (e.target.name == 'frb-hide-appeals-button') {
            $('.frb').hide();

            $('body, html').removeClass('frb-overlay-open');
            frb.altSetHideCookie( 'donate close', 604800 );
        }

        return false;
    }

    if ( country == "US" || country == "CA" || country == "GB" || country == "IE" || country == "AU" || country == "NZ" ) {
        $('.frb').addClass('frb-6c');
    }

    if ( frb.shouldShowBanner() ) {
        frb.show();
        showConversation();
    }

});


function hideConversation() {
    $('body, html').removeClass('frb-overlay-open');
    $( ".frb-bubble-message-container" ).removeClass( "frb-bubble-message-visible" );
    $( ".frb-bubble-container" ).css({"width": "fit-content", "height": "fit-content", "background": "rgba(0, 0, 0, 0)"});
    $(".frb-main").css({"opacity": "0", "transform": "scale(0.5)", "visibility": "hidden"});
}

function showConversation() {
    $('body, html').addClass('frb-overlay-open');
    $( ".frb-bubble-message-container" ).addClass( "frb-bubble-message-visible" );
    $( ".frb-bubble-message-container").attr('style','');
    $( ".frb-bubble-message-close").attr('style','');
    $( ".frb-bubble-container" ).css({"width": "100%", "height": "100%", "background": "rgba(0, 0, 0, 0.46)"});
    $(".frb-main").delay( frb.fadeDuration ).css({"visibility": "visible", "opacity": "1", "transform": "scale(1)"});
}

// hide message popping from bubble
$(document).ready(function(){

    $( ".frb-main" ).click(function( event ) {
        event.stopPropagation();
    });

    $('.frb-bubble-container').on('click', function () {
        hideConversation();
        $(".frb-bubble-message-container").css({"bottom": "-20px"});
        $(".frb-bubble-message-close").css({"bottom": "85px"});
        $(".frb-bubble-message-close").css({"opacity": "1"});
    });

    // open conversation with banner details
    $('#frb-bubble-message-container, .frb-conversation-open').on('click', function (event) {
        event.stopPropagation();

        if ($('.frb-main').css('opacity') == '0' ){
            $('body, html').addClass('frb-overlay-open');
            $(".frb-main").css({"visibility": "visible", "opacity": "1", "transform": "scale(1)"});
            $( ".frb-bubble-message-container" ).addClass( "frb-bubble-message-visible" );
            $( ".frb-bubble-message-container").attr('style','');
            $( ".frb-bubble-message-close").attr('style','');
            $( ".frb-bubble-container" ).css({"width": "100%", "height": "100%", "background": "rgba(0, 0, 0, 0.46)"});
            frb.extraData.clickedNag = 1;
        }
        // hide conversation
        else {
            hideConversation();
            $(".frb-bubble-message-container").css({"bottom": "-20px"});
            $(".frb-bubble-message-close").css({"bottom": "85px"});
            $(".frb-bubble-message-close").css({"opacity": "1"});
        }
    });

    $('.frbRemoveBanner').click(function(e) {
        $('body, html').removeClass('frb-overlay-open');
        $('#centralNotice').hide(); // Hide banner
        frb.altSetHideCookie( 'close', frb.HIDE_DURATION_CLOSENAG );
        e.stopPropagation();
    });

    $(window).scroll(function () {
        // TODO: clarify this
        // Check if element exists on scroll: important after email has been submitted in RML nag
        if ($('#frb-bubble-message-container').length) {
            var nagRevealPosition = $(window).height() * 3;
            if ($(window).scrollTop() > nagRevealPosition || $(window).scrollTop() + $(window).height() > $(document).height() - 100) {
                $(".frb-bubble-message-container").addClass("frb-bubble-bounce");
            }
        }
    });
});

</script>