Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                
  <ul class="collapsible">
    <li class="active">
      <div class="collapsible-header"><i class="material-icons">attach_money</i>Platform Fees</div>
      <div class="collapsible-body #eceff1 blue-grey lighten-4">
        <table class="striped z-depth-2">
          <thead>
            <tr>
              <th colspan="3">
                <h5>Credit Card Transaction Fees: Charged on every transaction as set forth below</h5>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Transaction markup<br>(variable)</td>
              <td>X.XX%</td>
              <td>{{platform}} mark up fee charged for every captured transaction as % of transaction amount.</td>
            </tr>
            <tr>
              <td>Transaction markup<br>(fixed)</td>
              <td>$X.XX</td>
              <td>{{platform}} mark up fee charged for every captured transaction as fixed fee per transaction count.</td>
            </tr>
            <tr>
              <td>Authorization Fee</td>
              <td>$X.XX</td>
              <td>{{platform}} mark up fee charged for every Authorization as fixed fee per auth count. This includes all states of auth i.e. reverse, failed, success.</td>
            </tr>
            <tr>
              <td>Refund markup<sup>1</sup><br>(fixed)</td>
              <td>$X.XX</td>
              <td>{{platform}} mark up fee charged for every refund transaction as fixed fee per refund count.</td>
            </tr>
            <thead>
              <tr>
                <th colspan="3">
                  <h5>Per Incidence Fees: Charged every time your account incurs one of the below items</h5>
                </th>
              </tr>
            </thead>
          <tbody>
            <tr>
              <td>Chargeback Fee</td>
              <td>$X.XX</td>
              <td>Charged when a cardholder of card-issuing bank formally protests a charge.</td>
            </tr>
            <tr>
              <td>Debit Failure Fee<sup>2</sup></td>
              <td>$X.XX</td>
              <td>Charged when we are unable to debit our fees from your account. We typically debit all fees for a month 6 days after the end of the month.</td>
            </tr>
          </tbody>
          <thead>
            <tr>
              <th colspan="3">
                <h5>Monthly Fee</h5>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>Monthly Service Fee<sup>3</sup></td>
              <td>$X.XX</td>
              <td>{{platform}} fee charged every month.</td>
            </tr>
          </tbody>
          <thead>
            <tr>
              <th colspan="3">
                <h5>eCheck Transaction Fees<sup>4</sup></h5>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>eCheck<br>(variable fee)</td>
              <td>X.XX%</td>
              <td>{{platform}} fee charged for every eCheck transaction as % of transaction amount.</td>
            </tr>
            <tr>
              <td>eCheck<br>(fixed fee)</td>
              <td>$X.XX</td>
              <td>{{platform}} fee charged for every eCheck transaction as fixed fee per transaction count.</td>
            </tr>
            <tr>
              <td>eCheck Fee<br>(minimum)</td>
              <td>$X.XX</td>
              <td>Minimum fee for eCheck (variable fee + fixed fee) irrespective of transaction amount per eCheck transaction.</td>
            </tr>
            <tr>
              <td>eCheck Fee<br>(maximum)</td>
              <td>$X.XX</td>
              <td>Maximum fee for eCheck (variable fee + fixed fee) irrespective of transaction amount per eCheck transaction.</td>
            </tr>
            <tr>
              <td>Refund eCheck Fee<sup>1</sup><br>(fixed)</td>
              <td>$X.XX</td>
              <td>{{platform}} fee charged for every eCheck refund transaction as fixed fee per refund count.</td>
            </tr>
          </tbody>
        </table>
      </div>
    </li>
  </ul>
  <div class="row">
    <span class="col s10 offset-s1">1. Refund markup fees are charged for every credit transaction related to cards and refund eCheck fees are charged for every eCheck credit transaction. We do not return our fees on the original transaction, and some Payment Brands do not return interchange and fees on the original transaction. Therefore, when you refund a payment, it might cost you more than what you received for the original transaction.</span>
  </div>
  <div class="row">
    <span class="col s10 offset-s1">2. Debit Failure fee is charged when WePay cannot debit your merchant linked bank account via ACH debit including but not limited to insufficient funds or incorrect account information, others.</span>
  </div>
  <div class="row">
    <span class="col s10 offset-s1">3. Monthly Recurring Fee will be debited for the first time in the month your account has been set up. This fee will be debited regardless of whether you are processing transactions through your account until you close it.</span>
  </div>
  <div class="row">
    <span class="col s10 offset-s1">4. eCheck Fees are charged if you’re enabled for ACH method of payment for processing.</span>
  </div>
  <ul class="collapsible">
    <li class="active">
      <div class="collapsible-header"><i class="material-icons">attach_money</i>Interchange Pass-Through</div>
      <div class="collapsible-body #eceff1 blue-grey lighten-4">
        <table class="striped z-depth-2">
          <thead>
            <tr>
              <th colspan="3">
                <h5>TRANSACTION PROCESSING FEES</h5>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td colspan="3">
                <h6><b>Payment Brand Interchange and Wholesale Discount:</b></h6><br>MasterCard, Visa and Discover assess Interchange and an Assessment Fee & Network Fee for each Transaction. American Express assesses a Wholesale Discount Rate and Network Fee for each transaction. These rates and fees will be passed through at cost.
              </td>
            </tr>
            <tr>
              <td>Interchange and Wholesale Discount Rates</td>
              <td></td>
              <td>As set by each Payment Brand</td>
            </tr>
            <tr>
              <td>
                <div class="row">
                  <div>
                    <div class="card-panel #eceff1 blue-grey lighten-4">
                      <span>
                        <table>
                          <thead>
                            <tr>
                              <th colspan="3">Payment Brand Assessments</th>
                            </tr>
                          </thead>
                          <tbody>
                            <tr>
                              <td rowspan="2">MasterCard</td>
                              <td>Credit transactions less than $1000 and all Debit transactions.</td>
                              <td>0.130%</td>
                            </tr>
                            <tr>
                              <td>Credit transactions greater than $1000</td>
                              <td>0.014%</td>
                            </tr>
                            <tr>
                              <td rowspan="2">Visa</td>
                              <td>Debit Transactions</td>
                              <td>0.130%</td>
                            </tr>
                            <tr>
                              <td>Credit Transactions</td>
                              <td>0.140%</td>
                            </tr>
                            <tr>
                              <td colspan="2">American Express OptBlue Network Fee</td>
                              <td>0.150%</td>
                            </tr>
                            <tr>
                              <td colspan="2">Discover / JCB</td>
                              <td>0.130%</td>
                            </tr>
                          </tbody>
                        </table>
                      </span>
                    </div>
                  </div>
                </div>
              </td>
              <td></td>
              <td>
                <div class="row">
                  <div>
                    <div class="card-panel #eceff1 blue-grey lighten-4">
                      <span>
                        <table>
                          <thead>
                            <tr>
                              <th>Payment Brand Network Fees</th>
                              <th>Credit</th>
                              <th>Debit</th>
                            </tr>
                          </thead>
                          <tbody>
                            <tr>
                              <td>MasterCard Network Access & Fees Brand Usage Fee (NABU) (Charged per Authorization & per Refund)</td>
                              <td>$0.0195</td>
                              <td>$0.0195</td>
                            </tr>
                            <tr>
                              <td>Visa Domestic Sales Auth (APF) (Charged per Authorization per Refund)</td>
                              <td>$0.0195</td>
                              <td>$0.0155</td>
                            </tr>
                            <tr>
                              <td>Visa Intl Sales Auth (APF) (Charged per Authorization & per Refund)</td>
                              <td>$0.0395</td>
                              <td>$0.0355</td>
                            </tr>
                            <tr>
                              <td>Discover / JCB Data Usage</td>
                              <td>$0.0195</td>
                              <td>$0.0195</td>
                            </tr>
                          </tbody>
                        </table>
                      </span>
                    </div>
                  </div>
                </div>
              </td>
            </tr>
            <tr>
              <td colspan="3">
                <div class="row">
                  <div>
                    <div class="card-panel #eceff1 blue-grey lighten-5">
                      <span>
                        <table>
                          <thead>
                            <tr>
                              <th colspan="4">Payment Brand Fees</th>
                            </tr>
                          </thead>
                          <tbody>
                            <tr>
                              <td>MC File Transmission Fee Per Transaction*</td>
                              <td>$0.0014</td>
                              <td>VI Financial Transaction Fee</td>
                              <td>$0.0018</td>
                            </tr>
                            <tr>
                              <td>MC Reporting & Infrastructure</td>
                              <td>$0.0003</td>
                              <td>VI Reporting & Data Transfer</td>
                              <td>$0.0002</td>
                            </tr>
                          </tbody>
                        </table>
                      </span>
                    </div>
                  </div>
                </div>
              </td>
            </tr>
            <tr>
              <td colspan="3">*MasterCard assesses a file transmission fee based on the number of bytes of data contained in a transmitted file. Because the file size may vary from transaction to transaction, the parties acknowledge that it is not possible to accurately translate the byte-based fee into a consistently accurate transaction-based fee. In light of the foregoing, the parties have agreed that the Merchant shall pay a fee in the amount stated above for each transaction submitted under this Agreement. Such fee shall be deemed to be the file transmission fee imposed by MasterCard on each transaction for all purposes of this Agreement, and we may change the amount of such fee in accordance with the terms of this Agreement in the event MasterCard changes the amount or calculation of its file transmission fee.</td>
            </tr>
          </tbody>
          <thead>
            <tr>
              <th colspan="3"><h5>ONE TIME AND PERIODIC FEES</h5></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>
                <div class="row">
                  <div>
                    <div class="card-panel #eceff1 blue-grey lighten-4">
                      <span>
                        <table>
                          <thead>
                            <tr>
                              <th colspan="2">Monthly Fees</th>
                            </tr>
                          </thead>
                          <tbody>
                            <tr>
                              <td>Visa Fixed Acquirer Network Fee<sup>1</sup></td>
                              <td>Varies</td>
                            </tr>
                          </tbody>
                        </table>
                      </span>
                    </div>
                  </div>
                </div>
              </td>
              <td></td>
              <td>
                <div class="row">
                  <div>
                    <div class="card-panel #eceff1 blue-grey lighten-4">
                      <span>
                        <table>
                          <thead>
                            <tr>
                              <th colspan="2">Annual Fees</th>
                            </tr>
                          </thead>
                          <tbody>
                            <td>MC Merchant Location Fee<sup>2</sup></td>
                            <td>$1.25</td>
                          </tbody>
                        </table>
                      </span>
                    </div>
                  </div>
                </div>
              </td>
            </tr>
            <tr>
              <td colspan="3">
                1. Visa Fixed Acquirer Network Fee is a monthly fee assessed by Visa based on Merchant Category Code (MCC), dollar volume, number of merchant locations, number of Tax IDs, and whether the physical Visa card is present or not present at the time of the transaction. This fee can vary monthly.<br><br>
                2. MasterCard Merchant Location Fee of $1.25 will be applicable for each month with $200.00 or more in MasterCard volume. This fee will be assessed quarterly based on the previous 3 months activity.
              </td>
            </tr>
          </tbody>
        </table>
        <table class="z-depth-2">
          <thead>
            <tr>
              <th colspan="3"><h5>PAYMENT BRAND FEES — PER INCIDENCE</h5></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td colspan="3">
                <h6>These fees are billed by MasterCard, Visa, American Express, and Discover and passed through your account</h6>
              </td>
            </tr>
            <tr>
              <td>MC Acquiring License Fee</td>
              <td>0.004%</td>
              <td>Charged on MasterCard Gross Sales volume.</td>
            </tr>
            <tr>
              <td>MC Digital Enablement / Card Not Present Fee</td>
              <td>0.010%</td>
              <td>Charged on MasterCard Card Not Present Gross Sales volume.</td>
            </tr>
            <tr>
              <td>AX OptBlue Card Not Present Fee</td>
              <td>0.30%</td>
              <td>Charged on American Express Card Not Present Gross Sales volume.</td>
            </tr>
            <tr>
              <td>Discover / JCB Network Authorization Fee</td>
              <td>$0.0025</td>
              <td>Charged by Discover on all authorizations for card transactions that are settled through the Discover Network.</td>
            </tr>
            <tr>
              <td>MC Auth Access Fee AVS Card Present</td>
              <td>$0.01</td>
              <td rowspan="2">Charged by MasterCard when a merchant uses the Address Verification Service to validate a cardholder address.</td>
            </tr>
            <tr>
              <td>MC Auth Access Fee AVS Card Not Present</td>
              <td>$0.01</td>
            </tr>
            <tr>
              <td>MC Processing Integrity Fee: Pre Authorization</td>
              <td>$0.045</td>
              <td rowspan="3">Charged when a card is authorized but not deposited and the authorization is not reversed in a timely manner.<br>*the minimum fee amount for a Final authorization is $0.04.</td>
            </tr>
            <tr>
              <td>MC Processing Integrity Fee: Final Authorization*</td>
              <td>0.25%</td>
            </tr>
            <tr>
              <td>Visa Misuse of Authorization Fee</td>
              <td>$0.093</td>
            </tr>
            <tr>
              <td>Visa Zero Floor Limit Fee</td>
              <td>$0.20</td>
              <td>Charged when a transaction is deposited but never authorized.</td>
            </tr>
            <tr>
              <td>Visa Transaction Integrity Fee</td>
              <td>$0.10</td>
              <td>Charged on Visa transactions that do not meet the qualification standards for US Custom Payment Service (CPS) categories.</td>
            </tr>
            <tr>
              <td>MC Ineligible Chargeback Blocking Fee</td>
              <td>$3.00</td>
              <td>Charged when a fraud related Chargeback is blocked by MasterCard.</td>
            </tr>
            <tr>
              <td>MC Cross Border Assessment Fee</td>
              <td>0.60%</td>
              <td rowspan="4">Applies to non-U.S. bank issued cards in which the transaction is settled in USD.</td>
            </tr>
            <tr>
              <td>Visa International Service Assessment Fee</td>
              <td>1.00%</td>
            </tr>
            <tr>
              <td>American Express OptBlue International Fee</td>
              <td>0.40%</td>
            </tr>
            <tr>
              <td>Discover / JCB International Service Fee</td>
              <td>0.80%</td>
            </tr>
            <tr>
              <td>MC International Support Fee</td>
              <td>0.85%</td>
              <td rowspan="3">Additional fee charged by MasterCard, Visa and Discover on non-U.S. bank issued cards.</td>
            </tr>
            <tr>
              <td>Visa Interregional Acquiring Fee</td>
              <td>0.45%</td>
            </tr>
            <tr>
              <td>Discover / JCB International Processing Fee</td>
              <td>0.50%</td>
            </tr>
          </tbody>
          <thead>
            <tr>
              <th colspan="3"><h5>Payment Brand Charges and Termination Fees</h5></th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td colspan="3">Part of the fees that we charge you for processing your transactions consist of fees we pay to the Payments Brands.<br><br>
                These charges, called “Payment Brand Charges,” include but are not limited to, interchange rates, assessments, file transmission fees, access fees, and international and cross border fees. Therefore, in addition to the rates set forth below, you will also be charged Payment Brand Charges. Payment Brand interchange rates can be accessed online by visiting <a href="https://merchantservices.chase.com/support/managing-your-account/interchange-and-assessment-understanding">https://merchantservices.chase.com/support/managing-your-account/interchange-and-assessment-understanding</a> and clicking on “View all of the Latest Payment Network Updates,” then “Current Brand Pricing - US”.<br><br>
                Please note that we may, from time to time, elect not to charge you for certain existing, new or increased Payment Brand Charges. If we elect not to charge you, we still reserve the right to begin charging you for existing, new or increased Payment Brand Charges at any time in the future, upon notice to you. No such Payment Brand Charges will be imposed retroactively.<br><br>
                <h5>Amount Due Upon Termination</h5><br><br>
                We do not charge a fee for closing your merchant account.<br><br>
                NOTICE REQUIRED BY AMERICAN EXPRESS:<br>
                American Express requires that we inform you that (i) American Express charges Chase a wholesale discount rate and not interchange and (ii) American Express operates a non-interchange based network.
            </tr>
          </tbody>
        </table>
      </div>
    </li>
  </ul>
  <form>
    <div class="row">
      <label class="col s7">
        <input type="checkbox" class="filled-in" checked="checked" />
        <span>I have reviewed the above fees associated with processing transactions, and by continuing agree to this pricing.</span>
      </label>
    </div>
    <div class="row">
      <form>
        <div class="input-field col s3">
          <input id="password" type="password">
          <label for="password">Set Password</label>
        </div>
      </form>
      <button class="btn-large waves-effect waves-light" type="submit" name="action">Submit
    <i class="material-icons right">send</i>
  </button>
    </div>
  </form>
              
            
!

CSS

              
                
              
            
!

JS

              
                document.addEventListener("DOMContentLoaded", function () {
  var elems = document.querySelectorAll(".collapsible");
  var instances = M.Collapsible.init(elems);
});

              
            
!
999px

Console