---
title: PayFabric for Sage Intacct Theme CSS
description: PayFabric Sage Intacct Theme CSS
---

[Skip to content](https://help.north49.com/payfabric-sageintacct-theme-css#main-content)

English

Show submenu for translations

![noth49\_logo.png\]](https://help.north49.com/hs-fs/hubfs/noth49_logo.png?height=40&name=noth49_logo.png)

- [Default HubSpot Blog](https://blog.north49.com/)

Open main navigation

Close main navigation

- [Default HubSpot Blog](https://blog.north49.com/)
- English
  
  Show submenu for translations
- [Go to North49](https://www.north49.com/)

[Go to North49](https://www.north49.com/)

 Hello. How can we help you?

- There are no suggestions because the search field is empty.

1. [Knowledge Base](https://help.north49.com/?hsLang=en)
2. [PayFabric for Sage Intacct](https://help.north49.com/payfabric-for-sage-intacct?hsLang=en)
3. [User Guides](https://help.north49.com/payfabric-for-sage-intacct?hsLang=en#user-guides)

# PayFabric for Sage Intacct Theme CSS

## PayFabric Sage Intacct Theme CSS

body {

    background-color: white;

    font-family: "HelveticaNeueW01-65Medi", "Arial", "Helvetica", "Ariel", "sans-serif";

}

input,

div {

    box-sizing: border-box;

}

.Wallet {

    width: 100%;

    display: inline-block;

}

.Wallet #payment {

    width: 50%;

    padding: 20px;

    clear: none;

    float: left;

}

@media screen and (max-width: 768px) {

    .Wallet #payment {

        width: 100%;

        padding-bottom: 0px;

    }

}

.Wallet #payment input {

    color: #515151 !important;

    border-top: 0px !important;

    border-left: 0px !important;

    border-right: 0px !important;

}

.Wallet #payment .CardContainer {

    width: 100%;

    background: white;

    padding: 0px;

}

.Wallet #payment .CardContainer .AccountType {

    width: 100%;

    display: inline-block;

}

.Wallet #payment .CardContainer .AccountNumber {

    width: 50%;

    display: inline-block;

    padding-right: 10px;

}

@media screen and (max-width: 400px) {

    .Wallet #payment .CardContainer .AccountNumber {

        width: 100%;

        padding-right: 0px;

    }

}

.Wallet #payment .CardContainer .ABANumber {

    width: 50%;

    display: inline-block;

    margin-left: 0px;

    padding-left: 10px;

}

@media screen and (max-width: 400px) {

    .Wallet #payment .CardContainer .ABANumber {

        width: 100%;

        padding-left: 0px;

    }

}

.Wallet #payment .CardContainer .CardNumber {

    width: 75%;

    clear: both;

    float: left;

}

.Wallet #payment .CardContainer .CardNumber input {

    border-bottom: 1px solid #d6d6d6;

    font-size: 20px !important;

    font-weight: 700 !important;

}

.Wallet #payment .CardContainer .CardDate {

    width: 100%;

    clear: both;

    float: left;

}

.Wallet #payment .CardContainer .CardDate input {

    width: 45px !important;

    height: 40px !important;

    font-size: 16px !important;

    font-weight: 700 !important;

}

.Wallet #payment .CardContainer .CardDate #exptime1 {

    margin-right: 10px;

}

.Wallet #payment .CardContainer .NameOnCard {

    width: 100%;

    clear: both;

    float: left;

}

.Wallet #payment .CardContainer .NameOnCard input {

    border-bottom: 1px solid #d6d6d6;

    font-size: 20px !important;

    font-weight: 700 !important;

}

.Wallet #payment .CardContainer .NameOnCard .FirstName {

    padding-right: 5px;

    width: 50%;

}

@media screen and (max-width: 400px) {

    .Wallet #payment .CardContainer .NameOnCard .FirstName {

        width: 100%;

        padding-right: 0px;

    }

}

.Wallet #payment .CardContainer .NameOnCard .MiddleInitial,

.Wallet #payment .CardContainer .NameOnCard #WalletCreditCard\_CardHolderMiddleName {

    display: none;

}

.Wallet #payment .CardContainer .NameOnCard .LastName {

    margin-left: 0;

    padding-left: 5px;

    width: 50%;

}

@media screen and (max-width: 400px) {

    .Wallet #payment .CardContainer .NameOnCard .LastName {

        width: 100%;

        padding-left: 0px;

    }

}

.Wallet #payment .CardContainer .Driverlic,

.Wallet #payment .CardContainer .SSN {

    display: none;

}

.Wallet #payment .CardContainer .RContainer {

    left: auto;

    right: 0px;

    display: block;

}

@media screen and (max-width: 400px) {

    .Wallet #payment .CardContainer .RContainer {

        display: none;

    }

}

.Wallet #payment .CardContainer .checkbox {

    width: 100%;

}

.Wallet #payment .CardContainer .checkbox input {

    height: 13px;

    width: 13px !important;

}

.Wallet #payment .CardContainer .CustomerCSS-wallet\_Echeck {

    width: 100%;

}

.Wallet #payment .CardContainer .CustomerCSS-wallet\_Echeck input {

    height: 13px;

    width: 13px !important;

}

.Wallet #billaddress {

    width: 50%;

    padding: 20px;

    clear: none;

    float: left;

}

@media screen and (max-width: 768px) {

    .Wallet #billaddress {

        width: 100%;

        padding-top: 0px;

    }

}

.Wallet #billaddress .Country {

    width: 100%;

    display: inline-block;

}

.Wallet #billaddress .Street {

    width: 100%;

    display: inline-block;

}

.Wallet #billaddress .Street #Billto\_AddressLine1 {

    margin-bottom: 5px;

}

.Wallet #billaddress .City {

    padding-right: 2px !important;

    width: 32%;

}

.Wallet #billaddress .State {

    padding-right: 2px !important;

    width: 32%;

}

.Wallet #billaddress .Zip {

    width: 36%;

}

@media screen and (max-width: 400px) {

    .Wallet #billaddress .City,

    .Wallet #billaddress .State,

    .Wallet #billaddress .Zip {

        padding-right: 0px !important;

        width: 100%;

    }

}

.Wallet #billaddress #Billto\_AddressLine3,

.Wallet #billaddress .walletBilltoPhone,

.Wallet #billaddress #Billto\_Phone1,

.Wallet #billaddress .Email\_CreateWallet,

.Wallet #billaddress #Billto\_Email {

    display: none;

}

.Wallet #paybutton {

    display: flex;

    justify-content: center;

    width: 100%;

    flex-direction: row-reverse;

    height: 50px;

}

.Wallet #paybutton input {

    width: 18% !important;

    border-radius: 5px !important;

}

.Wallet #paybutton .n-button-cancel {

    color: #30a6e9;

    background: white;

}

.Wallet label {

    color: #999999;

    width: 100%;

}

.Wallet input,

.Wallet select {

    border-radius: 0px !important;

    height: 40px;

    margin-bottom: 15px;

    width: 100% !important;

}

.Wallet .NewWalletCard {

    display: none;

}

#paymentForm .walletListDiv {

    display: none;

}

#paymentForm #payButton {

    background-color: #1d8ddb;

    border: none;

}

#paymentForm #BillCountryCode\[is-valid="true"\] {

    border: 1px solid #28a745;

}

#paymentForm #BillStateCode\[is-valid="true"\] {

    border: 1px solid #28a745;

}

- [PayFabric for Sage 300](https://help.north49.com/payfabric-for-sage-300?hsLang=en#main-content)

    - [User Guides](https://help.north49.com/payfabric-for-sage-300?hsLang=en#user-guides)
    - [What's New? Check Out the Latest Feature Additions](https://help.north49.com/payfabric-for-sage-300?hsLang=en#whats-new-check-out-the-latest-feature-additions)
- [PayFabric for Sage Intacct](https://help.north49.com/payfabric-for-sage-intacct?hsLang=en#main-content)

    - [User Guides](https://help.north49.com/payfabric-for-sage-intacct?hsLang=en#user-guides)
    - [What's New? Check Out the Latest Feature Additions](https://help.north49.com/payfabric-for-sage-intacct?hsLang=en#whats-new-check-out-the-latest-feature-additions)
- [Customer Portal](https://help.north49.com/customer-portal?hsLang=en#main-content)

    - [Setup](https://help.north49.com/customer-portal?hsLang=en#setup)
    - [Training and How-To Videos](https://help.north49.com/customer-portal?hsLang=en#training-and-how-to-videos)
    - [Payment Processing](https://help.north49.com/customer-portal?hsLang=en#payment-processing)
    - [Frequently Asked Questions](https://help.north49.com/customer-portal?hsLang=en#frequently-asked-questions)
    - [What's New? Check Out the Latest Feature Additions](https://help.north49.com/customer-portal?hsLang=en#whats-new-check-out-the-latest-feature-additions)
- [Dataport](https://help.north49.com/dataport?hsLang=en#main-content)

    - [FAQ](https://help.north49.com/dataport?hsLang=en#faq)
- [Contact Us](https://help.north49.com/contact-us?hsLang=en)

- [Default HubSpot Blog](https://blog.north49.com/)

[![Chill listening crop-3](https://help.north49.com/hs-fs/hubfs/noth49_logo-1.png?width=93&height=24&name=noth49_logo-1.png "Chill listening crop-3")](https://www.north49.com/)

support@north49.com

<https://www.facebook.com/north49> <https://twitter.com/north49tweet> <https://www.youtube.com/north49> <https://www.linkedin.com/company/261659/>

Copyright © 2026, North49 Business Solutions