File: /home/i/e/s/iestorre/musica222/layouts/libraries/cms/kjhnbg/94f4cd/en/css/wallet.ltr.css
/* Styles for the Wallet */
/* 8ballUI/public/css/_views/wallet/index.less */
/**
* @fileOverview Variables contains variables
* @name Variables
* @author hdoan, mdaveshah, ziliu
* @tested browsers FF 12, Chrome 18, Safari 5 on Mac
*/
/* Font sizes */
/* Inputs */
/** old styles **/
/****************/
/* Colors */
/* button colors */
/* New color variables from Adam Dustan's Patterns sheet: https://ebay.box.com/s/apis0xukrp25jzdvjyky */
/* engagement module colors, named via http://chir.ag/projects/name-that-color */
/* info / warning icon colors */
/* generic colors for colors except text like box-border, shadow, background */
/* card colors */
/* textColor for all the colors of text */
/* font weights */
/* Z-index list */
/* user for a bird's eye view of components based on z-axis */
/* for example, if you want to put a button in header, just assign z-index of that button to @zindexHeader */
/* these will overwrite the bootstrap pre defined variables */
/* TODO: check the clean the non-needed modal styles in bootstrap */
/* the same as bootstrap one, just overwrite */
/* Setting for Sidepanel */
/* This is not used by all side panels, only for the default one */
/* what about larger phones like gs3? what about phablets like the note?
/* responsive breakpoints */
/* borders */
/* Image Paths */
/* Image URIs */
/* Navigation */
/* Activity */
/* send money */
/* data uri for notification */
/* wallet */
/* shop static landing page */
/* feedback icon */
.clearfix {
*zoom: 1;
}
.clearfix:before,
.clearfix:after {
display: table;
content: "";
line-height: 0;
}
.clearfix:after {
clear: both;
}
/**
* @fileOverview Mixins contains mixins
* @name Mixins
* @author hdoan, mdaveshah
* @tested browsers FF 12, Chrome 18, Safari 5 on Mac
* Please do not modify Mixins to add IE related styles.
*/
.ltrInput {
text-align: left;
/*! @noflip */
direction: ltr;
}
.ltrInputGroup {
/*! @noflip */
text-align: left;
/*! @noflip */
direction: ltr;
}
.enforceLtr {
/*! @noflip */
direction: ltr;
unicode-bidi: embed;
}
.overflow-auto {
overflow: auto;
}
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/**
* Multi-line truncation utilizing overflow:hidden and specified height of content
* http://www.mobify.com/blog/multiline-ellipsis-in-pure-css/
*
* @height - height of content to cut off
* @lineheight - spacing between lines
* @ellipsiswidth - width of ellipsis area
*/
/**
* Vertical separator with radial box shadow right
* @width - width of vertical separator
* @height1 - height of first darker box shadow
* @height2 - height of second lighter box shadow (taller than first height)
* @top1 - top position of first box shadow
* @top2 - top position of second box shadow
* @right - right position of separator
* @z - z-index of separator
* @borderRadius - how radial the box shadow is
*/
/**
* Horizontal separator with radial box shadow down
* @height - height of horizontal separator
* @width1 - width of first darker box shadow
* @width2 - width of second lighter box shadow (longer than first width)
* @left1 - left position of first box shadow
* @left2 - left position of second box shadow
* @bottom - bottom position of separator
* @z - z-index of separator
* @borderRadius - how radial the box shadow is
*/
/* This mixin is to add a pointer to a dropdown */
/* mixin for creating a triangle */
/* Mixin for bubbles */
/* mixin for creating carets bubbles with a border */
/* mixins for creating caret for customSelectBtn */
/* START SPINNER */
/* DEFAULT USAGE: add .hasSpinner classes (in app.less) to the elements that we want to have an overlay and spinner graphic on top of */
/* Applies to Modals and other DIV elements: Apply this mixin selectively to other CSS properties to avoid duplication of CSS code */
/* Just use .spinner() to apply spinner, or along with .overlay() to add overlay behind spinner and block the user interaction on the DIV */
@-webkit-keyframes rotation {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-moz-keyframes rotation {
from {
-moz-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-moz-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-o-keyframes rotation {
from {
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-o-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
}
@-webkit-keyframes revrotation {
from {
-webkit-transform: rotate(0deg) scaleX(-1);
transform: rotate(0deg) scaleX(-1);
}
to {
-webkit-transform: rotate(359deg) scaleX(-1);
transform: rotate(359deg) scaleX(-1);
}
}
@-moz-keyframes revrotation {
from {
-moz-transform: rotate(0deg) scaleX(-1);
transform: rotate(0deg) scaleX(-1);
}
to {
-moz-transform: rotate(359deg) scaleX(-1);
transform: rotate(359deg) scaleX(-1);
}
}
@-o-keyframes revrotation {
from {
-o-transform: rotate(0deg) scaleX(-1);
transform: rotate(0deg) scaleX(-1);
}
to {
-o-transform: rotate(359deg) scaleX(-1);
transform: rotate(359deg) scaleX(-1);
}
}
@keyframes revrotation {
from {
transform: rotate(0deg) scaleX(-1);
}
to {
transform: rotate(359deg) scaleX(-1);
}
}
/* END SPINNER */
/* mixin to create flat white button (iOS7 style) */
.flatBtn {
border-left: 0;
border-right: 0;
border-bottom: 0;
background: #ffffff;
-moz-box-shadow: 0 1px 3px #cccccc;
-webkit-box-shadow: 0 1px 3px #cccccc;
box-shadow: 0 1px 3px #cccccc;
background-color: #faf9f9;
background-image: -moz-linear-gradient(top, #fffefe, #f3f2f2);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fffefe), to(#f3f2f2));
background-image: -webkit-linear-gradient(top, #fffefe, #f3f2f2);
background-image: -o-linear-gradient(top, #fffefe, #f3f2f2);
background-image: linear-gradient(to bottom, #fffefe, #f3f2f2);
background-image: -webkit-linear-gradient(top, #fffefe 0%, #f3f2f2 100%);
background-image: -o-linear-gradient(top, #fffefe 0%, #f3f2f2 100%);
background-image: linear-gradient(to bottom, #fffefe 0%, #f3f2f2 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffffefe', endColorstr='#fff3f2f2', GradientType=0);
}
/**
* The following are just the overrides for TWBS
*/
/**
* DO NOT EDIT THIS FILE AS IT'S GENERATED CODE.
* UED: cgrigson, adustin, nvandewater
* UIE: jlowery
* Note: If modifications are needed, don't modify this file! Either override or make a PR to:
* https://github.paypal.com/jlowery/paypal-vxpattern-lib
*/
/* Icons */
/* Z-index list */
/* user for a bird's eye view of components based on z-axis */
/* for example, if you want to put a button in header, just assign z-index of that button to @zindexHeader */
/* these will overwrite the bootstrap pre defined variables */
/* TODO: check the clean the non-needed modal styles in bootstrap */
/* the same as bootstrap one, just overwrite */
/* Setting for Sidepanel */
/* This is not used by all side panels, only for the default one */
/* what about larger phones like gs3? what about phablets like the note?
/* responsive breakpoints */
/* Navigation */
/* Spinner */
/*
* @name buttons
* @description All defined button styles and states belong here, including any helper class button style options, like `vx_btn-secondary` or `vx_btn-medium` etc.
*
* @group elements
*/
@font-face {
font-family: 'consumer-icons';
src: url('fonts/ConsumerIcons-Regular.eot');
src: url('fonts/ConsumerIcons-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('fonts/ConsumerIcons-Regular.woff') format('woff'), /* Modern Browsers */ url('fonts/ConsumerIcons-Regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('fonts/ConsumerIcons-Regular.svg#69ac2c9fc1e0803e59e06e93859bed03') format('svg');
font-style: normal;
font-weight: 400;
/* IE9 Compat Modes */
/* Legacy iOS */
}
.vx_btn,
.vx_btn-small,
.vx_btn-medium {
display: inline-block;
min-width: 6rem;
padding: 0.75rem 1.5rem;
margin-bottom: 1.5rem;
border: 1px solid #0070ba;
border-radius: 1.5rem;
font-size: 0.9375rem;
line-height: 1.6;
font-family: 'PayPal-Sans', sans-serif;
font-weight: 500;
text-align: center;
text-decoration: none;
cursor: pointer;
color: #ffffff;
background-color: #0070ba;
transition: all 250ms ease;
-webkit-font-smoothing: antialiased;
}
.vx_btn:visited,
.vx_btn-small:visited,
.vx_btn-medium:visited,
.vx_btn:active,
.vx_btn-small:active,
.vx_btn-medium:active,
.vx_btn:hover,
.vx_btn-small:hover,
.vx_btn-medium:hover,
.vx_btn:focus,
.vx_btn-small:focus,
.vx_btn-medium:focus {
color: #ffffff;
}
.vx_btn:visited,
.vx_btn-small:visited,
.vx_btn-medium:visited {
text-decoration: none;
}
.vx_btn:hover,
.vx_btn-small:hover,
.vx_btn-medium:hover,
.vx_btn:focus,
.vx_btn-small:focus,
.vx_btn-medium:focus {
background-color: #003087;
border: 1px solid #003087;
box-shadow: none;
text-decoration: none;
}
.vx_btn:focus,
.vx_btn-small:focus,
.vx_btn-medium:focus {
outline: none;
text-decoration: underline;
}
.vx_btn[disabled],
.vx_btn-small[disabled],
.vx_btn-medium[disabled],
.vx_btn[disabled]:hover,
.vx_btn-small[disabled]:hover,
.vx_btn-medium[disabled]:hover,
.vx_btn[disabled]:active,
.vx_btn-small[disabled]:active,
.vx_btn-medium[disabled]:active,
.vx_btn.vx_is-disabled,
.vx_btn-small.vx_is-disabled,
.vx_btn-medium.vx_is-disabled,
.vx_btn.vx_is-disabled:hover,
.vx_btn-small.vx_is-disabled:hover,
.vx_btn-medium.vx_is-disabled:hover,
.vx_btn.vx_is-disabled:active,
.vx_btn-small.vx_is-disabled:active,
.vx_btn-medium.vx_is-disabled:active {
color: #cbd2d6;
background: #f5f6f8;
box-shadow: none;
border: 1px solid #cbd2d6;
text-decoration: none;
cursor: not-allowed;
outline: none;
-ms-transform: none;
-webkit-transform: none;
transform: none;
}
.vx_btn + .vx_btn,
.vx_btn + .vx_btn-small,
.vx_btn + .vx_btn-medium,
.vx_btn-small + .vx_btn,
.vx_btn-small + .vx_btn-small,
.vx_btn-small + .vx_btn-medium,
.vx_btn-medium + .vx_btn,
.vx_btn-medium + .vx_btn-small,
.vx_btn-medium + .vx_btn-medium {
margin-left: 0.75rem;
}
.vx_btn.vx_btn-block,
.vx_btn-small.vx_btn-block,
.vx_btn-medium.vx_btn-block {
margin-right: 0;
margin-left: 0;
width: 100%;
}
.vx_btn-secondary {
background-color: transparent;
border-color: #0070ba;
color: #0070ba;
}
.vx_btn-secondary:hover,
.vx_btn-secondary:focus {
color: #003087;
background-color: rgba(255, 255, 255, 0.2);
border-color: #003087;
box-shadow: 0 0 0 1px #003087 inset;
}
.vx_btn-secondary:visited {
text-decoration: none;
color: #0070ba;
}
.vx_btn_reversed {
border-color: #ffffff;
background-color: #ffffff;
color: #0070ba;
}
.vx_btn_reversed:hover,
.vx_btn_reversed:focus {
background-color: #f0f0f0;
border-color: #f0f0f0;
color: #003087;
}
.vx_btn_reversed:visited {
color: #0070ba;
}
.vx_btn_reversed:visited:hover {
color: #003087;
}
.vx_btn-secondary_reversed {
background-color: transparent;
color: #ffffff;
border-color: #ffffff;
}
.vx_btn-secondary_reversed:hover,
.vx_btn-secondary_reversed:focus {
background-color: rgba(0, 0, 0, 0.1);
color: #ffffff;
border-color: #ffffff;
box-shadow: 0 0 0 1px #ffffff inset;
}
.vx_btn-medium {
font-size: 0.8125rem;
line-height: 1.38461538;
min-width: 4.5rem;
padding: 0.5625rem 1.125rem;
}
.vx_btn-small {
font-size: 0.8125rem;
line-height: 1.36363636;
min-width: 3.75rem;
padding: 0.46875rem 0.9375rem;
}
.vx_btn-icon {
display: inline-block;
width: 1.5rem;
position: relative;
margin-right: 0.625rem;
}
.vx_btn-icon svg {
width: 1.5rem;
height: 1.5rem;
position: absolute;
top: -1.125rem;
left: 0;
}
.vx_btn-icon .svg-stroke {
stroke: #ffffff;
}
.vx_btn-icon .svg-fill {
fill: #ffffff;
}
.vx_btn-secondary .vx_btn-icon .svg-stroke {
stroke: #0070ba;
}
.vx_btn-secondary .vx_btn-icon .svg-fill {
fill: #0070ba;
}
.vx_btn-secondary:hover .vx_btn-icon .svg-stroke,
.vx_btn-secondary:focus .vx_btn-icon .svg-stroke {
stroke: #003087;
}
.vx_btn-secondary:hover .vx_btn-icon .svg-fill,
.vx_btn-secondary:focus .vx_btn-icon .svg-fill {
fill: #003087;
}
[disabled] .vx_btn-icon .svg-stroke,
[disabled]:hover .vx_btn-icon .svg-stroke,
[disabled]:active .vx_btn-icon .svg-stroke,
.vx_is-disabled .vx_btn-icon .svg-stroke,
.vx_is-disabled:hover .vx_btn-icon .svg-stroke,
.vx_is-disabled:active .vx_btn-icon .svg-stroke {
stroke: #cbd2d6;
}
[disabled] .vx_btn-icon .svg-fill,
[disabled]:hover .vx_btn-icon .svg-fill,
[disabled]:active .vx_btn-icon .svg-fill,
.vx_is-disabled .vx_btn-icon .svg-fill,
.vx_is-disabled:hover .vx_btn-icon .svg-fill,
.vx_is-disabled:active .vx_btn-icon .svg-fill {
fill: #cbd2d6;
}
.vx_btn-medium .vx_btn-icon {
width: 1.125rem;
margin-right: 0.5rem;
}
.vx_btn-medium .vx_btn-icon svg {
width: 1.125rem;
height: 1.125rem;
top: -0.8125rem;
}
.vx_btn-small .vx_btn-icon {
width: 1.10795454rem;
margin-right: 0.375rem;
}
.vx_btn-small .vx_btn-icon svg {
width: 1.10795454rem;
height: 1.10795454rem;
top: -0.75rem;
}
.vx_btn-group,
.vx_btn-group_stacked {
text-align: center;
}
.vx_btn-group_stacked .vx_btn,
.vx_btn-group_stacked .vx_btn-small,
.vx_btn-group_stacked .vx_btn-medium {
display: table;
margin-left: auto;
margin-right: auto;
}
.vx_addBtn-primary,
.vx_addBtn-secondary {
font-weight: 500;
font-size: 0.9375rem;
line-height: 1.5rem;
background: none;
border: none;
color: #0070ba;
padding-left: 0.125rem;
}
.vx_addBtn-primary:before,
.vx_addBtn-secondary:before {
content: "\e004";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: 'consumer-icons';
line-height: 0;
font-size: 1.25rem;
}
.vx_addBtn-primary:hover,
.vx_addBtn-secondary:hover {
color: #005ea6;
text-decoration: none;
}
.vx_addBtn-primary:before {
color: #ffffff;
background: #0070ba;
border-radius: 100%;
padding: 0 5px 3px;
box-shadow: 0 1px 2px #2c2e2f;
margin-right: 12px;
}
.vx_addBtn-secondary:before {
margin-right: 5px;
}
.vx_backBtn {
background: none;
border: none;
color: #0070ba;
font-weight: normal;
padding: 0;
}
.vx_backBtn:focus,
.vx_backBtn:active,
.vx_backBtn:hover {
color: #005ea6;
text-decoration: none;
}
.vx_backBtn:focus span,
.vx_backBtn:active span,
.vx_backBtn:hover span {
text-decoration: underline;
}
.vx_backBtn:before {
font-family: 'consumer-icons';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 0;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
content: '\2190';
display: inline;
font-size: 1.5em;
vertical-align: -0.1em;
padding-right: 0.1em;
}
.vx_btn-twoUp .vx_btn {
display: inline-block;
width: 48%;
margin-left: 0;
margin-right: 0;
}
.vx_btn-twoUp .vx_btn:first-of-type {
margin-right: 1.5%;
}
.vx_btn-twoUp .vx_btn:last-of-type {
margin-left: 1.5%;
}
@media (max-width: 768px) {
.vx_blocks-for-mobile .vx_btn {
display: block;
width: 100%;
}
.vx_blocks-for-mobile .vx_btn + .vx_btn {
margin: 5px 0 0;
}
}
.vx_btn-link {
background: none;
border: none;
color: #0070ba;
font-weight: 500;
padding: 0;
}
.vx_btn-link:hover {
color: #005ea6;
text-decoration: underline;
}
/* Styles for checkbox widget */
.ppCheckbox {
width: 100%;
position: relative;
}
.ppCheckbox.hide {
display: none;
}
.ppCheckbox input {
opacity: 0;
}
.ppCheckbox input:focus + label {
outline: 1px dotted #999999;
}
.ppCheckbox label {
margin-top: -35px;
margin-left: -10px;
margin-bottom: 0;
padding: 10px 0;
cursor: pointer;
line-height: 200%;
}
.ppCheckbox label:hover .icon.icon-checkmark-small:before {
border: none;
}
.ppCheckbox label:hover .icon:before {
border: 1px solid #009cde;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.ppCheckbox label .icon:before {
padding: 1px 11px 3px 12px;
margin-right: 10px;
border: 1px solid #cccccc;
content: '';
font-size: 16px;
font-weight: bold;
border-radius: 5px;
color: #ffffff;
}
.ppCheckbox label .icon-checkmark-small:before {
content: "\e014";
padding: 0 5px 6px 6px;
border: none;
top: -2px;
position: relative;
background-color: #009cde;
}
.ppCheckbox label.hideLabel .icon {
display: none;
}
.ppCheckbox.radio .icon:before {
padding: 0;
border: none;
position: absolute;
top: 15px;
right: 0;
font-weight: normal;
}
/*** wallet imports at the bottom ***/
/* override - core component addressEntry */
.js .wallet .last {
float: right;
}
.native-select {
width: 100%;
height: 35px;
}
.dropdown {
display: inline-block;
vertical-align: middle;
}
.wallet .help {
margin: 0;
}
.dropdown-menu {
padding: 14px;
border-width: 5px;
margin-left: -250%;
left: -100%;
top: 40px;
text-align: center;
}
.dropdown-menu:after {
content: "";
display: inline-block;
position: absolute;
left: 50%;
top: -16px;
width: 0;
height: 0;
vertical-align: top;
border-bottom: 14px solid #cccccc;
border-right: 14px solid transparent;
border-left: 14px solid transparent;
}
.helpText {
margin-bottom: 10px;
background-color: #ffffff;
text-align: left;
}
.helpText:last-child {
margin: 0;
}
/* overrides */
.contents {
max-width: 100%;
}
#contents > section.wallet {
max-width: 1024px;
height: auto;
padding-bottom: 62px;
background: transparent;
}
.wallet {
background-color: #f8f8f8;
}
.wallet .disabled {
pointer-events: none;
}
.wallet .disclaimer {
text-indent: -9px;
margin-top: 10px;
}
.fiCollections_noSidebar {
margin-left: 1em;
}
.btn-block {
margin-bottom: 1em;
}
.ppFundsDetails .center-block {
display: block;
}
.mainModalFlowContainer {
min-height: 20em;
z-index: 1060;
}
/**
* @fileOverview Styles for the wallet section and wallet module of summary page
* @name walletModule
* Corresponding Dust files are public/templates/widgets/creditProductModule.dust, public/templates/widgets/balanceModule.dust and public/templates/widgets/fundingInstrumentModule.dust
*
* The only actual element called "walletModule" is on Summary page - it's the unified container for Balance, Credit Product and Funding Instruments.
* Wallet page doesn't have a unified container for the modules.
*
* @author tsullivan
* @tested Chrome, Firefox, Safari, IE9
*/
.additional-info {
font-weight: 400;
color: #2c2e2f;
}
.balanceNumeral,
.creditNumeral {
color: #2c2e2f;
}
.balanceNumeral .numeralLabel,
.creditNumeral .numeralLabel {
white-space: pre-line;
color: #6c7378;
}
.balanceModule-zeroBalanceText {
padding-top: 0.5em;
color: #2c2e2f;
display: block;
}
.balanceModule-currencyCode {
display: inline-block;
}
.balanceActions,
.pendingActions,
.creditActions {
margin: 0;
padding-top: 1em;
}
.pendingActions li,
.creditActions li {
display: inline-block;
}
.balanceActions li {
list-style: none;
}
.creditActions {
position: relative;
margin-bottom: 0.6em;
}
/* due states and payment due icons */
.dueState span,
span.negativeBalanceAlert {
display: inline-block;
min-height: 20px;
}
.creditStateDueSoon {
padding-left: 30px;
color: #444444;
background: url("data:image/png;base64,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") no-repeat;
background-position: 0 8px;
}
.creditStateOverDue,
.negativeBalanceAlert {
padding-left: 30px;
color: #444444;
background: url("data:image/png;base64,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") no-repeat;
background-position: left center;
}
.icon-autoPay {
color: #6c7378;
}
.makePaymentLink {
margin-bottom: 15px;
}
.viewLimits {
margin-right: 1em;
padding-right: 1em;
border-right: 1px solid #c5c5c5;
}
.fiModule-icon_attentionMobile,
.fiModule-icon_criticalMobile {
margin-left: -4px;
text-align: left;
}
.fiModule-mobileAlertDismiss:hover,
.fiModule-mobileAlertDismiss:focus {
text-decoration: none;
color: #2c2e2f;
}
.fiModule-mobileAlertDismiss {
position: absolute;
top: 3px;
right: 0;
width: 25px;
height: 25px;
margin-right: -4px;
color: #2c2e2f;
}
.fiModule-mobileAlertDismiss .speakableText {
text-indent: 100%;
padding-left: 1.5em;
margin-right: -100%;
opacity: 0;
}
.currenciesHeader {
margin: 13px 0 0 10px;
}
.currenciesList {
margin: 0 0 0 10px;
}
.currenciesEntry {
list-style-type: none;
}
.preferredMethod,
.msgPadEnroll {
color: #6c7378;
}
.autoPaySetup {
margin-top: 5px;
color: #299976;
}
.autoPaySetup_noDue {
margin-top: -15px;
color: #299976;
}
.autoPaySetup-dollarIcon {
margin-left: -5px;
}
/* for balance and credit product module */
/*
Mixins
*/
.fiModule-container {
border: 1px solid #e0e0e0;
margin-top: 2em;
padding: 12px 20px 20px;
border-radius: 6px;
background-color: #ffffff;
box-shadow: none;
}
.fiModule-container_shadow {
transition: box-shadow 0.3s ease-in-out;
-moz-box-shadow: 0 2px 2px #ccc;
-webkit-box-shadow: 0 2px 2px #ccc;
box-shadow: 0 2px 2px #ccc;
}
.fiModule-icon-arrow {
display: inline-block;
position: relative;
left: 2px;
}
.fiModule-icon-arrow:before {
font-size: 1.3rem;
line-height: 0;
color: #0070ba;
text-decoration: none;
}
.fiModule-icon-arrow-animate {
left: 8px;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.fiModule-title-header {
padding-left: 0;
color: #2c2e2f;
}
.fiModule-title-header:hover {
text-decoration: none;
}
.fiModule-title-link {
text-align: right;
}
.fiModule-title-link:hover {
text-decoration: underline;
}
.fiModule-title {
padding-left: 0;
margin: 0;
}
.fiModule-currency-container {
margin-top: 8px;
}
.fiModule-currency_text {
margin-bottom: 10px;
}
.fiModule-secondary-text {
margin-bottom: 12px;
}
.fiModule-balance-text {
padding-left: 4px;
}
.fiModule-cta-text-container {
width: 45%;
display: inline-block;
vertical-align: middle;
}
.fiModule-cta-text {
line-height: 1.3;
}
.fiModule-cta-textMargin {
padding-left: 8px;
}
.fiModule-list-item {
border-bottom: 1px dotted #b7bcbf;
}
.fiModule-fiList-links {
padding: 10px 0;
display: block;
}
.fiModule-text-noFi {
margin-bottom: 16px;
display: inline-block;
}
.fiModule-ctaModule-divider {
width: 100%;
border-top: 1px dotted #b7bcbf;
margin-top: 10px;
padding-top: 10px;
}
.fiModule-footer {
border-top: 1px dotted #b7bcbf;
margin-top: 8px;
padding-top: 15px;
}
.fiModule-footer_setMargin {
margin-bottom: 0;
}
.fiModule-negative-text {
color: #d20000;
text-transform: uppercase;
}
.fiModule-text-block {
display: block;
}
.fiModule-list {
width: 100%;
margin: 0;
list-style-type: none;
}
.fiModule-table {
display: table;
}
.fiModule-row {
display: table-row;
}
.fiModule-cell {
display: table-cell;
vertical-align: middle;
}
.fiModule-icon-cell {
display: table-cell;
vertical-align: top;
}
.fiModule-fiType {
padding-left: 10px;
}
.fiModule-cell_iconMobile {
width: 2.5em;
}
.fiModule-alertText {
display: block;
}
.fiModule-alertTextMobile {
padding-right: 2.3em;
}
.fiModule-acctNumber {
white-space: nowrap;
}
.fiModule-ctaText {
margin: 0.9em 0 0;
color: #2c2e2f;
}
.fiModule-ctaTextMobile {
margin: 1em 0 0;
color: #2c2e2f;
}
.fiModule-icon_card {
width: 48px;
height: 30px;
background-image: url('shared/vsou.png');
background-size: cover;
display: inline-block;
}
.fiModule-icon_bank {
width: 48px;
height: 30px;
background-image: url('Confirm/ui-web/wallet-icons/banks-sprite-small@2x.png');
background-size: cover;
background-position-y: 0px;
display: inline-block;
}
.fiModule-icon_bank.icon-generic_bank {
background-position-y: 0px;
}
.fiModule-icon_bank.icon-bank_of_america,
.fiModule-icon_bank.icon-bank_of_america_na {
background-position-y: -32px;
}
.fiModule-icon_bank.icon-barclays_bank {
background-position-y: -65px;
}
.fiModule-icon_bank.icon-capital_one_fsb {
background-position-y: -99px;
}
.fiModule-icon_bank.icon-citibank_fsb {
background-position-y: -165px;
}
.fiModule-icon_bank.icon-clydesdale_bank {
background-position-y: -198px;
}
.fiModule-icon_bank.icon-cooperative_bank {
background-position-y: 630px;
}
.fiModule-icon_bank.icon-fifth_third_bank {
background-position-y: 596px;
}
.fiModule-icon_bank.icon-hsbc_bank {
background-position-y: 562px;
}
.fiModule-icon_bank.icon-huntington_bank {
background-position-y: 530px;
}
.fiModule-icon_bank.icon-jpmorgan_chase_bank_na {
background-position-y: -132px;
}
.fiModule-icon_bank.icon-lloyds_bank {
background-position-y: 497px;
}
.fiModule-icon_bank.icon-nationwide_bank {
background-position-y: 463px;
}
.fiModule-icon_bank.icon-natwest_bank {
background-position-y: 431px;
}
.fiModule-icon_bank.icon-pnc_bank {
background-position-y: 398px;
}
.fiModule-icon_bank.icon-rbs_bank {
background-position-y: 365px;
}
.fiModule-icon_bank.icon-regions_bank {
background-position-y: 331px;
}
.fiModule-icon_bank.icon-santander_bank {
background-position-y: 298px;
}
.fiModule-icon_bank.icon-standard_chartered_bank {
background-position-y: 265px;
}
.fiModule-icon_bank.icon-suntrust_bank {
background-position-y: 232px;
}
.fiModule-icon_bank.icon-td_bank {
background-position-y: 198px;
}
.fiModule-icon_bank.icon-us_bank_na {
background-position-y: 166px;
}
.fiModule-icon_bank.icon-usaa_bank {
background-position-y: 134px;
}
.fiModule-icon_bank.icon-virgin_bank {
background-position-y: 100px;
}
.fiModule-icon_bank.icon-wells_fargo_bank_na {
background-position-y: 66px;
}
.fiModule-icon_bank.icon-yorkshire_bank {
background-position-y: 34px;
}
.fiModule-visa-logo {
background-position-y: 99px;
}
.fiModule-mastercard-logo {
background-position-y: 330px;
}
.fiModule-amex-logo {
background-position-y: -65px;
}
.fiModule-discover-logo {
background-position-y: 595px;
}
.fiModule-maestro-logo {
background-position-y: 363px;
}
.fiModule-jcb-logo {
background-position-y: 396px;
}
.fiModule-elo-logo {
background-position-y: 529px;
}
.fiModule-hiper-logo {
background-position-y: 496px;
}
.fiModule-unionpay-logo {
background-position-y: 132px;
}
.fiModule-hipercard-logo {
background-position-y: 463px;
}
.icon-card-half-solid {
background-position-y: 0px;
}
.fiModule-icon_critical,
.fiModule-icon_criticalMobile {
color: #d20000;
}
.fiModule-icon_attention,
.fiModule-icon_attentionMobile {
color: #ff9600;
}
.fiModule-icon_attention,
.fiModule-icon_critical,
.fiModule-icon_criticalMobile,
.fiModule-icon_attentionMobile {
display: inline-block;
}
.fiModule-icon_attention:hover,
.fiModule-icon_critical:hover,
.fiModule-icon_criticalMobile:hover,
.fiModule-icon_attentionMobile:hover {
text-decoration: none;
}
.fiModule-alert-text {
padding-left: 5px;
}
.icon-addBank {
width: 18px;
height: 18px;
margin: 5px 7px 0 5px;
border: 1px solid #0070ba;
border-radius: 50%;
background-color: #0070ba;
display: inline-block;
text-align: center;
box-shadow: 0 1px 2px #2c2e2f;
}
.icon-addBank:hover {
text-decoration: none;
}
.icon-add_Bank {
color: #ffffff;
font-size: 1rem;
}
.icon-add_Bank:before {
position: relative;
bottom: 3px;
}
.fiModule_trimBank {
width: 102px;
margin-right: 5px;
padding-bottom: 2px;
text-overflow: ellipsis;
display: inline-block;
white-space: nowrap;
vertical-align: middle;
overflow: hidden;
}
.fiModule-link-add {
padding-left: 5px;
}
.fiModule-credit-text {
padding-top: 5px;
}
.fiModule-btn_secondary {
margin: 10px 10px 12px 0;
}
.button-paymentPastDue {
margin: 11px 0px 2px;
}
.creditState-collections {
padding-left: 0.85rem;
background: none;
color: #d20000;
font-size: 0.815rem;
vertical-align: baseline;
}
.text-pastDue {
font-family: 'PayPal-Sans', sans-serif;
}
.creditState-collections::before {
color: #c72b2d;
}
.icon-handShake {
margin: 11px 11px 11px 0px;
}
.text-options {
font-size: 0.815rem;
color: #2c2e2f;
}
.moduleListItems {
margin: 15px 0 0;
}
@media (max-width: 768px) {
.fiModule-container {
border-radius: 0;
border-left: none;
border-right: none;
}
}
/* variable for enduring items in modules are consistently spaced */
/* headers for in balance, credit and activity modules */
.moduleHeader {
margin-bottom: 16px;
margin-top: 0;
padding-bottom: 8px;
border-bottom: 1px solid #6c7378;
color: #2c2e2f;
}
.moduleHeaderLink {
color: inherit;
position: relative;
display: block;
}
.moduleHeaderLink:visited {
color: #2c2e2f;
}
.moduleHeaderLink:hover,
.moduleHeaderLink:focus {
text-decoration: underline;
color: #0070ba;
}
.moduleHeaderLink:after {
width: 10px;
height: 10px;
content: '';
position: absolute;
top: 5px;
right: 3px;
border-top: 2px solid #2c2e2f;
border-right: 2px solid #2c2e2f;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.error .moduleHeader:hover,
.error .moduleHeader:focus {
color: inherit;
}
.error .moduleHeader:after {
content: none;
}
.moduleFooter {
width: 100%;
padding-top: 10px;
position: relative;
display: table;
}
.moduleListItems li {
list-style: none;
}
.debitCardImage {
width: 40px;
height: 40px;
display: table-cell;
background: url('shared/sptri.png') no-repeat left -528px;
background-size: 35px;
}
.debitCardSummary {
height: 40px;
display: table-cell;
vertical-align: middle;
}
.ppCard-container {
display: table;
}
.ppAnywhereCard-image {
background: url("Confirm/digitalassets/c/consumer/bundle/icons/icMastercard2x.png") no-repeat;
background-size: contain;
background-repeat: no-repeat;
background-position-y: 6px;
width: 48px;
height: 30px;
}
.ppAnywhereCard-status {
color: #6c7378;
}
.ppAnywhereCard-status .ppAnywhereCard-active {
background: url("Confirm/digitalassets/c/consumer/bundle/icons/icChainLink_1x.png") no-repeat left;
padding-left: 15px;
}
.ppAnywhereCard-status .ppAnywhereCard-activateLink {
border-left: 1px solid #6c7378;
padding-left: 10px;
margin-left: 10px;
}
.ppAnywhereCard-summary {
height: 35px;
}
/* Action / label cells divided by a border.
* Used in wallet module that appears on summary page and wallet page.
*
* Explanation of margin and padding calculations: Bootstrap's grid would make
* the 2 cells' width 50% of the container, but "divided cells" don't have
* fixed width, just a nice border between two small things. They just have a
* similar margin / padding that Bootstrap's grid has.
*
* Bootstrap's spanXs have `margin-left: 2.564102564102564%`. That percentage is 100.0 / 39.0
*/
.dividedCellLeft {
padding-right: 2.56410256%;
padding-right: 10px;
}
.dividedCellRight {
padding-left: 2.56410256%;
padding-left: 10px;
margin-right: -2.56410256%;
}
.addMoney.ituLink {
display: block;
}
.addMoney.ituLink ~ .dividedCellRight {
padding-left: 0;
border-left: none;
}
.disputesMessages .action-highlight {
color: #ff9600;
}
@media (max-width: 1024px) {
.summaryModuleContainer .dividedCellLeft,
.paypalSourcesContainer .dividedCellLeft,
.summaryModuleContainer .dividedCellRight,
.paypalSourcesContainer .dividedCellRight {
width: 100%;
padding: 0;
margin: 0;
border: 0;
}
.summaryModuleContainer .dividedCellLeft,
.paypalSourcesContainer .dividedCellLeft {
margin: 0 0 8px 0;
}
}
@media (max-width: 768px) {
.summaryModuleContainer .dividedCellLeft,
.paypalSourcesContainer .dividedCellLeft,
.summaryModuleContainer .dividedCellRight,
.paypalSourcesContainer .dividedCellRight {
width: auto;
}
.summaryModuleContainer .dividedCellLeft,
.paypalSourcesContainer .dividedCellLeft {
padding-right: 2.56410256%;
padding-right: 10px;
}
.summaryModuleContainer .dividedCellRight,
.paypalSourcesContainer .dividedCellRight {
padding-left: 2.56410256%;
padding-left: 10px;
margin-right: -2.56410256%;
border-left: 1px solid #6c7378;
}
.creditProductModule .x-small {
display: inline;
}
}
@media (max-width: 479px) {
.summaryModuleContainer .dividedCellLeft,
.paypalSourcesContainer .dividedCellLeft,
.summaryModuleContainer .dividedCellRight,
.paypalSourcesContainer .dividedCellRight {
width: 100%;
padding: 0;
margin: 0;
border: 0;
}
.summaryModuleContainer .dividedCellLeft,
.paypalSourcesContainer .dividedCellLeft {
margin: 0 0 8px 0;
}
}
/* balance module and credit product module widget enhancements */
.walletModule {
margin-bottom: 1em;
}
.padMessage {
border: 1px solid #878787;
border-radius: 5px;
margin: 0 0 1.5em 0;
padding: 1.25em 1.5em;
width: 100%;
}
.padMessage p {
margin: 0 0 0 2.5em;
}
.padMessage .icon-positive-small {
color: #299976;
margin: 5px 0 0 -4px;
float: left;
}
.padMessage .icon-info-small {
color: #9da3a6;
margin: 5px 0 0 -4px;
float: left;
}
.padMessage a.padLink {
margin-left: 5px;
}
.pad-success {
border: 1px solid #299976;
border-radius: 5px;
background-color: #f7fff7;
}
/*** toggle switch ***/
/* http://proto.io/freebies/onoff/ */
.onOff {
width: 100%;
padding: 0.8em 1em;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
background: #f5f5f5;
border-radius: 6px;
}
.onOff > label {
margin: 0;
display: inline-block;
line-height: 35px;
}
.onoffswitch {
width: 80px;
margin: auto;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/* enables checkbox keyboard usage */
.onoffswitch input[type="checkbox"] {
width: 100%;
height: 100%;
margin: 0;
position: absolute;
z-index: 1;
opacity: 0;
}
.onoffswitch input[type="checkbox"]:focus + .onoffswitch-label {
box-shadow: 0 0 3px 2px #0666b3;
}
.onoffswitch-label {
height: 34px;
margin: 0;
border: 2px solid;
border-color: #c5c5c5;
border-color: rgba(69, 69, 69, 0.14);
display: block;
overflow: hidden;
cursor: pointer;
border-radius: 6px;
-webkit-box-shadow: inset 0 3px 3px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 3px 3px rgba(0, 0, 0, 0.3);
}
.onoffswitch-inner {
width: 200%;
margin-left: -100%;
display: inline-block;
-moz-transition: margin 0.3s ease-in 0s;
-ms-transition: margin 0.3s ease-in 0s;
-webkit-transition: margin 0.3s ease-in 0s;
-o-transition: margin 0.3s ease-in 0s;
transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner .on,
.onoffswitch-inner .off {
width: 44%;
height: 32px;
display: inline-block;
line-height: 32px;
font-weight: 600;
text-shadow: none;
}
.onoffswitch-inner .on {
padding-left: 0.5em;
background: #468427;
background: rgba(70, 132, 39, 0.8);
color: #ffffff;
}
.onoffswitch-inner .off {
text-align: right;
background-color: #cfcfcf;
background-image: -moz-linear-gradient(top, #c3c3c3, #e1e1e1);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#c3c3c3), to(#e1e1e1));
background-image: -webkit-linear-gradient(top, #c3c3c3, #e1e1e1);
background-image: -o-linear-gradient(top, #c3c3c3, #e1e1e1);
background-image: linear-gradient(to bottom, #c3c3c3, #e1e1e1);
background-image: -webkit-linear-gradient(top, #c3c3c3 0%, #e1e1e1 100%);
background-image: -o-linear-gradient(top, #c3c3c3 0%, #e1e1e1 100%);
background-image: linear-gradient(to bottom, #c3c3c3 0%, #e1e1e1 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc3c3c3', endColorstr='#ffe1e1e1', GradientType=0);
color: #333333;
text-shadow: 0 1px 1px #ffffff;
}
.onoffswitch-switch {
width: 33px;
height: 31px;
margin: 1px 0 0;
border: 1px solid;
border-color: #c5c5c5;
border-color: rgba(69, 69, 69, 0.14);
position: absolute;
top: 0;
bottom: 0;
right: 46px;
background-color: #f4f4f4;
border-radius: 6px;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
-moz-transition: all 0.3s ease-in 0s;
-ms-transition: all 0.3s ease-in 0s;
-webkit-transition: all 0.3s ease-in 0s;
-o-transition: all 0.3s ease-in 0s;
transition: all 0.3s ease-in 0s;
}
.onoffswitch input[type="checkbox"]:checked + .onoffswitch-label .onoffswitch-inner {
margin-left: 0;
}
.onoffswitch input[type="checkbox"]:checked + .onoffswitch-label .onoffswitch-switch {
right: 0;
}
/**
* @fileOverview tooltip contains default styles for tooltip
* @name tooltip
* @author zizuo
* @tested browsers Chrome 25+, FF 19+
*/
.contextualHelp {
position: relative;
display: inline;
font-size: 0.8em;
font-size: 0.875rem;
line-height: 1.5em;
}
.contextualHelp .dropdown-toggle {
position: absolute;
left: 0;
}
.contextualHelp .dropdown-menu {
width: 300px;
margin: 0;
padding: 8px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
left: -270px;
border: 0 none;
background: #043c69;
}
.contextualHelp .dropdown-menu .dropdown-header {
height: 44px;
}
.contextualHelp .dropdown-menu .dropdown-header a {
padding: 5px 10px;
}
.contextualHelp .dropdown-menu .dropdown-body {
padding: 0.75em;
color: #333333;
line-height: 1.25em;
font-weight: normal;
border-radius: 6px;
background: #fff;
-moz-box-shadow: inset 0 0 5px #043c69;
-webkit-box-shadow: inset 0 0 5px #043c69;
box-shadow: inset 0 0 5px #043c69;
}
.contextualHelp .dropdown-menu .dropdown-body p {
margin: 0;
}
.contextualHelp .dropdown-menu .dropdown-body a {
display: inline;
padding: 0;
color: #0079c1;
}
.contextualHelp .dropdown-menu .detailsHeader {
margin: 0;
padding: 5px;
max-width: 200px;
float: left;
color: #fff;
font-weight: bold;
font-size: 1.2em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.contextualHelp .dropdown-menu .btn {
margin-top: 0;
display: inline-block;
color: #ffffff;
}
.contextualHelp.center .dropdown-menu {
margin-left: -150px;
left: 50%;
}
.contextualHelp.center .dropdown-menu:after {
left: 50%;
}
.help {
padding: 1px 8px;
margin: 0 15px;
-webkit-border-radius: 18px;
-moz-border-radius: 18px;
border-radius: 18px;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 2px solid #bbb;
background: #ffffff;
color: #666666;
font-size: 17px;
}
.help:hover,
.help:focus,
.help:active {
color: #666666;
background: #ffffff;
text-decoration: none;
}
.box-up .dropdown-menu {
top: auto;
bottom: 100%;
}
.box-up .dropdown-menu:after {
content: "";
display: inline-block;
position: absolute;
left: 285px;
top: auto;
bottom: -25px;
width: 0;
height: 0;
vertical-align: top;
border-top: 1em solid #043c69;
border-right: 1em solid transparent;
border-bottom: 1em solid transparent;
border-left: 1em solid transparent;
}
.box-down .dropdown-menu:after {
content: "";
display: inline-block;
position: absolute;
left: 270px;
top: -12px;
width: 0;
height: 0;
vertical-align: top;
border-bottom: 1em solid #043c69;
border-right: 1em solid transparent;
border-left: 1em solid transparent;
}
/**
* @fileOverview responsive styles for tooltip
* @name tooltip
* @author klkomenda
* @tested
*/
/* phone portrait */
@media (max-width: 640px) {
/**
* Tooltip positioning adjustments
*/
.contextualHelp .dropdown-menu {
max-width: 233px;
left: -195px;
}
.contextualHelp .dropdown-menu:after {
content: "";
display: inline-block;
position: absolute;
left: 193px;
top: -12px;
width: 0;
height: 0;
vertical-align: top;
border-bottom: 1em solid #043c69;
border-right: 1em solid transparent;
border-left: 1em solid transparent;
}
.availableCredit-tt .dropdown-menu {
left: -100px;
}
.availableCredit-tt .dropdown-menu:after {
content: "";
display: inline-block;
position: absolute;
left: 98px;
top: -12px;
width: 0;
height: 0;
vertical-align: top;
border-bottom: 1em solid #043c69;
border-right: 1em solid transparent;
border-left: 1em solid transparent;
}
}
/* card ribbon badge - need wrapper for :after with z-index: -1 */
.ribbon {
width: 100%;
position: absolute;
top: 50%;
left: -7px;
z-index: 1;
}
.ribbonBadge {
width: auto;
height: 26px;
line-height: 25px;
padding: 0 10px;
border: 0;
position: absolute;
left: 0;
color: #ffffff;
text-align: left;
text-shadow: none;
font-weight: 300;
}
.ribbonBadge:after {
content: "";
width: 0;
height: 0;
border-top: 7px solid;
border-left: 7px solid transparent;
position: absolute;
top: 26px;
left: 0;
z-index: -1;
}
.ribbonBadge.confirmed {
background: #3ea134;
}
.ribbonBadge.confirmed:after {
border-top-color: #1f6219;
}
.ribbonBadge.needAttention {
background: #d7ae0a;
}
.ribbonBadge.needAttention:after {
border-top-color: #836406;
}
.ribbonBadge.expired {
background: #bb1827;
}
.ribbonBadge.expired:after {
border-top-color: #741109;
}
/* Smartphones ----------- */
@media (max-width: 640px) {
.ribbon {
top: 46%;
}
.ribbonBadge {
height: 25px;
line-height: 25px;
font-size: 1em;
}
.ribbonBadge:after {
top: 25px;
}
}
/* portrait phone */
@media (max-width: 479px) {
.ribbonBadge {
height: 18px;
line-height: 18px;
font-size: 0.85em;
}
.ribbonBadge:after {
top: 18px;
}
}
/* Toggle buttons */
.toggleBtnGroup {
text-align: center;
margin: 0 auto;
}
.toggleBtnGroup > .toggleBtn {
display: inline-block;
padding: 0 0.5em;
margin: 0;
background: #ffffff;
color: #9da3a6;
border: 1px solid #9da3a6;
text-align: center;
font-size: 0.8571428571428572em;
font-size: 0.9375rem;
line-height: 2.8em;
font-weight: 600;
border-radius: 0;
}
.toggleBtnGroup > .toggleBtn:first-of-type {
border-bottom-left-radius: 8px;
border-top-left-radius: 8px;
border-right: 0;
}
.toggleBtnGroup > .toggleBtn:last-of-type {
border-bottom-right-radius: 8px;
border-top-right-radius: 8px;
border-left: 0;
}
.toggleBtnGroup .btnCol4 {
min-width: 33.3%;
}
.toggleBtnGroup .btnCol6 {
min-width: 50%;
}
.toggleBtnGroup input[type="radio"]:checked + .toggleBtn {
color: #ffffff;
background: #9da3a6;
}
.toggleBtnGroup input[type="radio"]:focus + .btn {
-webkit-box-shadow: 0 0 3px 2px #0666b3;
box-shadow: 0 0 3px 2px #0666b3;
}
.zeroBalAlertIcon {
margin-bottom: 4em;
color: #c5c5c5;
}
.zeroBalAlertBtn {
margin-top: 2em;
max-width: 24em;
width: 100%;
}
.zeroBalAlert-header,
.zeroBalAlert-body {
text-align: center;
}
/* Custom radio button */
.radio {
padding-left: 22px;
}
.radio.inline {
margin-right: 28px;
display: inline;
}
.radio input + label {
position: relative;
}
.radio input + label:after {
content: '';
width: 18px;
height: 18px;
position: absolute;
left: -25px;
border: 1px solid #9da3a6;
border-radius: 100%;
}
.radio input:checked + label:before {
content: '';
width: 12px;
height: 12px;
position: absolute;
top: 1px;
left: -22px;
background-color: #009cde;
border-radius: 100%;
}
.radio input:hover + label:after {
border-color: #009cde;
}
@media (max-width: 479px) {
.radio.inline {
display: block;
}
}
/* Input Type Ahead */
.input-typeahead {
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
margin: 0;
max-width: 100%;
max-height: 172px;
position: relative;
z-index: 1;
top: -1em;
left: 0;
background: #ffffff;
border: 0 solid #009cde;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
list-style: none;
padding: 0;
height: 0;
overflow: auto;
}
.input-typeahead.showItems {
padding: 0.5em 0;
height: 100%;
border-width: 1px;
}
.input-typeahead .typeahead-item {
padding: 0.2em 0;
margin: 0;
position: relative;
}
.input-typeahead .typeahead-item:hover {
background: #eeeeee;
cursor: pointer;
}
.input-typeahead .typeahead-item .image-col {
overflow: hidden;
text-align: center;
min-height: 2em;
}
.input-typeahead .typeahead-item span {
min-height: 1em;
padding: 0;
}
.input-typeahead .typeahead-item strong {
color: #0079ad;
}
.input-typeahead .typeahead-item .itemValue,
.input-typeahead .typeahead-item .itemSubValue {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.input-typeahead .typeahead-item .item-thumbnail {
border-radius: 1em;
max-height: 1.5em;
}
.input-typeahead .typeahead-item .item-thumbnail-pplogo {
height: 1.5em;
}
.input-typeahead .typeahead-item .itemValue_noLeadingSpace {
padding-left: 0.75em;
}
/* CIP flow */
.cip .name,
.cip .confirmedTaxId {
padding-bottom: 12px;
margin-bottom: 12px;
border-bottom: 1px solid #d4d4d4;
}
.cip .name label,
.cip .confirmedTaxId label {
font-weight: 600;
}
.cip .fullName {
text-align: right;
}
.cip .nativeDropdown.lap {
margin-top: 0;
}
.cip .addressLabel {
font-weight: 600;
}
.cip .radio {
height: 36px;
display: table;
}
.cip .radio label {
display: table-cell;
vertical-align: middle;
}
.cip .docField {
margin-bottom: 1em;
}
.cip .docField > label {
font-weight: 600;
}
.cip .docNum {
width: 150px;
z-index: 1;
}
.cip .docNum.lap {
margin: 0 0 0 28px;
}
.cip .back {
position: absolute;
top: 15px;
left: 0;
line-height: 20px;
vertical-align: top;
text-decoration: none;
}
.cip .back:before {
margin-right: 3px;
font-size: 0.9714285714285714em;
font-size: 1.0625rem;
line-height: 1.2352941176470589em;
}
.cip .info {
padding: 10px 0;
border-bottom: 1px solid #d4d4d4;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.875em;
}
.cip .info label {
font-weight: 500;
color: #333333;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.875em;
}
.cip .address {
margin: 5px 0 6px;
line-height: 20px;
text-align: right;
}
.cip .cipReview,
.cip .cipSubmit {
margin-top: 20px;
}
.cipFailure {
text-align: center;
}
.cipFailure .icon-info-large,
.cipFailure .icon-attention-large,
.cipFailure .icon-critical-large {
margin: 40px 0 60px;
display: block;
}
.cipFailure .icon-info-large {
color: #999999;
}
.cipFailure .icon-attention-large {
color: #f79723;
}
.cipFailure .icon-critical-large {
color: #c72e2e;
}
.cipFailure .resolutionCenter {
display: block;
}
.cipFailure .btn {
margin-top: 10px;
}
@media (max-width: 640px) {
.cip .back {
left: 15px;
}
}
.paypalSources {
position: relative;
}
.paypalSourcesContainer {
height: 100%;
width: 350px;
padding: 20px 0 135px;
margin: auto;
position: fixed;
overflow: auto;
}
.row-fluid .paypalSources {
margin: 0;
}
.fundingSource {
display: inline-block;
margin-left: 20px;
vertical-align: top;
}
.sidepanel-body .fundingSource {
margin-left: 0;
}
.fundingSources .moduleHeader {
padding-bottom: 8px;
margin-bottom: 16px;
margin-top: 0;
margin-left: 45px;
border-bottom: 1px solid #eeeeee;
font-weight: 600;
}
.fundingSources .thumbnail:hover,
.fundingSources .thumbnail:focus,
.fundingSources .thumbnail:active {
border-color: transparent;
-webkit-box-shadow: none;
box-shadow: none;
}
.fundingSource .addFI.card {
display: block;
text-align: center;
border-radius: 10px;
color: #999999;
background: #eeeeee;
font-size: 1.142857142857143em;
font-size: 1.25rem;
line-height: 1.05em;
}
.fundingSource .addFI.card span {
margin-top: 10%;
display: block;
color: #999999;
}
.last4 {
/*! @noflip */
direction: ltr;
unicode-bidi: embed;
}
.ppPrepaid {
position: absolute;
top: 8px;
left: 7px;
z-index: 4;
color: #ffffff;
margin-left: 5%;
}
.ppPrepaid-section {
font-size: .8em;
margin: 0;
text-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
}
.ppPrepaid-logo {
width: 4em;
margin: 0 3px 0 0;
-webkit-filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.2));
filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.2));
}
.ppPrepaid-link {
display: block;
font-weight: 600;
color: #ffffff;
margin-top: .5em;
}
.ppPrepaid-link:hover {
color: #6c7378;
}
.ppPrepaid-link-portrait {
margin-top: 0;
font-weight: 200;
font-size: .8em;
}
#overpanel .ppPrepaid {
margin: 3% 0 0 3%;
}
#overpanel .ppPrepaid-section {
font-size: 1em;
}
#overpanel .ppPrepaid-logo {
width: 5em;
}
#overpanel .ppPrepaid-link {
display: none;
}
/**
* NetSpend balance display
*/
.netSpendBalance {
position: relative;
color: #2c2e2f;
margin: 10px 0;
}
.refreshIcon {
moz-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
border: none;
background: transparent;
}
.icon-refresh:before {
font-size: 1rem;
vertical-align: top;
line-height: 16px;
color: #2c2e2f;
}
.syncing > .refreshIcon .icon-refresh:hover {
text-decoration: none;
}
.syncing > .refreshIcon .icon-refresh:before {
color: #9da3a6;
}
.syncing > .refreshIcon:focus {
outline: none;
}
.balance-container {
margin-bottom: 0;
}
.balance-container > .refreshIcon {
display: inline-block;
}
.cards {
height: 100%;
padding: 38px 10px;
position: relative;
overflow-x: hidden;
}
.cards a:hover,
.cards a:focus {
text-decoration: none;
}
.cards .moduleHeader:after {
display: none;
}
.cards h3 {
margin: 0;
display: inline-block;
color: #444444;
font-weight: 600;
}
.cards .last4 {
font-weight: 600;
}
.cards .fundingSources {
list-style: none;
}
.cards .fundingSources .fundingSource {
width: auto;
border-radius: 10px;
}
.cards .fundingSources .fundingSource .btns {
text-align: center;
}
.cards .fundingSources .fundingSource ul.disc {
list-style-type: disc;
}
.creditAndDebit_debitCard {
margin-right: 20px;
display: inline-block;
}
.padMessage_module {
width: 50%;
margin-top: 20px;
vertical-align: top;
display: inline-block;
}
.padMessage_module .padMessage_header {
margin-top: 0px;
margin-bottom: 10px;
}
.card {
width: 225px;
height: 140px;
padding: 7px;
border: 0 none;
position: relative;
color: #444444;
font-weight: 300;
text-decoration: none;
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
/* card color diagonal gradients */
}
.card:hover,
.card:focus,
.card:active {
-webkit-box-shadow: none;
box-shadow: none;
color: #444444;
}
.card.creditOrDebit {
color: #ffffff;
border-radius: 10px;
}
.card.gray {
background-color: #7f7f7f;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #555555, #898989 50%, #555555);
background-image: -webkit-linear-gradient(135deg, #555555, #898989 50%, #555555);
background-image: -o-linear-gradient(135deg, #555555, #898989 50%, #555555);
background-image: linear-gradient(135deg, #555555, #898989 50%, #555555);
}
.card.black {
background-color: #474a4c;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
background-image: -webkit-linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
background-image: -o-linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
background-image: linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
}
.card.blue {
background-color: #306793;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
background-image: -webkit-linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
background-image: -o-linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
background-image: linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
}
.card.red {
background-color: #c95151;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
background-image: -webkit-linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
background-image: -o-linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
background-image: linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
}
.card.gold {
background-color: #d0a157;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
background-image: -webkit-linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
background-image: -o-linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
background-image: linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
}
.card.green {
background-color: #4f9c50;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
background-image: -webkit-linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
background-image: -o-linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
background-image: linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
}
.card.paypalBalanceCard {
border-radius: 10px;
border: 3px solid #c5c5c5;
text-align: center;
}
.card.paypalBalanceCard .logo {
margin-top: 56px;
}
.card:visited {
color: #444444;
}
.creditOrDebit:visited {
color: #ffffff;
}
.banking {
background: #ffffff;
}
.banking.image {
border: 1px solid;
border-color: #c5c5c5;
border-color: rgba(102, 102, 102, 0.3);
}
.banking .bank {
height: 100%;
padding: 8px 8px 0 12px;
display: block;
border: 1px solid;
border-color: #c5c5c5;
border-color: rgba(102, 102, 102, 0.15);
background: url("Confirm/webstatic/icon/generic-bank_2x.png") no-repeat;
background-size: 16%;
background-position: 96% 93%;
position: relative;
}
.banking .bank > span {
display: block;
font-size: 1.0285714285714287em;
font-size: 1.125rem;
line-height: 1.1666666666666667em;
-moz-transition: font-size 0.3s ease-in-out;
-ms-transition: font-size 0.3s ease-in-out;
-webkit-transition: font-size 0.3s ease-in-out;
-o-transition: font-size 0.3s ease-in-out;
transition: font-size 0.3s ease-in-out;
}
.banking .bank > span.cardName {
color: #444444;
}
.banking .payAfterDelivery-item {
background: url("Confirm/webstatic/icon/pad_icon.png") no-repeat;
background-size: 16%;
background-position: 96% 93%;
}
.banking .cardName {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.banking span.type {
font-size: 0.6857142857142857em;
font-size: 0.75rem;
line-height: 1.75em;
color: #999999;
text-transform: uppercase;
}
.banking .pad.payAfterDelivery {
font-size: 0.6857142857142857em;
font-size: 0.75rem;
line-height: 1.75em;
color: #999999;
}
.banking .checking {
color: #333333;
}
.banking .savings {
color: #333333;
}
.banking .lastDigits {
position: absolute;
bottom: 5%;
}
.banking.card .noBankType {
margin-top: 37%;
}
/* match overpanel menu item styling for <input type="submit"/> button */
.removeBankBtn {
width: 100%;
margin-bottom: 0.588em;
}
.payAfterDelivery ~ .lastDigits {
margin-top: 15%;
}
/**
* Credit/Debit Card representations in
* the wallet index view
*/
.creditOrDebit {
border-radius: 10px;
/**
* Card Logos
*/
}
.creditOrDebit:after {
content: "";
width: 25%;
height: 25%;
position: absolute;
right: 5%;
bottom: 5%;
}
.creditOrDebit.visa:after {
background: url("Confirm/webstatic/logo/cards/visa_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.visa .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.elo:after {
background: url("Confirm/webstatic/logo/cards/elo.png") no-repeat;
background-size: 100%;
height: 32%;
}
.creditOrDebit.elo .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.hiper:after {
background: url("Confirm/webstatic/logo/cards/hiper.png") no-repeat;
background-size: 100%;
height: 28%;
}
.creditOrDebit.hiper .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.hipercard:after {
background: url("Confirm/webstatic/logo/cards/hipercard.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.hipercard .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.master_card:after {
background: url("Confirm/webstatic/logo/cards/mastercard_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.master_card .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.amex:after {
width: 20%;
height: 35%;
background: url("Confirm/webstatic/logo/cards/amex_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.amex .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.discover:after {
background: url("Confirm/webstatic/logo/cards/discover_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.discover .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.maestro:after,
.creditOrDebit.switch:after {
background: url("Confirm/webstatic/logo/cards/maestro_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.maestro .cardType,
.creditOrDebit.switch .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.jcb:after {
background: url("Confirm/webstatic/logo/cards/jcbcard_2x.png") no-repeat;
background-size: 82%;
}
.creditOrDebit.jcb .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.china_union_pay:after {
background: url("Confirm/webstatic/logo/cards/CUP_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.china_union_pay .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit .ribbon {
top: 72%;
}
.creditOrDebit .cardName {
padding-top: 14px;
}
.creditOrDebit .lastDigits {
width: 100%;
padding: 26% 0 24%;
display: inline-block;
text-align: center;
text-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
}
.creditOrDebit .cardType {
position: absolute;
bottom: 14px;
right: 7px;
}
/**
* Card Type image overrides per country
*/
.creditOrDebit .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.cb_nationale:after {
background: url("Confirm/webstatic/logo/cards/cartebancaire_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.cofinoga:after {
background: url("Confirm/webstatic/logo/cards/cofinoga_2x.png") no-repeat;
background-size: 90%;
}
.creditOrDebit.cofidis:after {
background: url("Confirm/webstatic/logo/cards/4etoiles_2x.png") no-repeat;
background-size: 63%;
background-position: 50%;
}
.FR .creditOrDebit.cetelem:after {
background: url("Confirm/webstatic/logo/cards/aurore2_2x.gif") no-repeat;
background-size: 100%;
}
.IT .creditOrDebit.cetelem:after {
background: url("Confirm/webstatic/logo/cards/aura_2x.png") no-repeat;
background-size: 100%;
}
.ES .creditOrDebit.cetelem:after {
background: url("Confirm/webstatic/logo/cards/aurora_2x.png") no-repeat;
background-size: 100%;
}
.rtl .banking .bank {
background-position: 4% 93%;
}
.modal.padLearnMoreTooltip_modal,
.modal.padPolicyTooltip_modal {
background-color: rgba(0, 0, 0, 0.87);
}
.pad_termsConditions {
font-size: 13px;
color: #9da3a6;
}
.pad_headerParagraph {
font-size: 15px;
}
.pad_removeMargin {
margin-top: 0;
margin-bottom: 0;
}
.pad_removeMarginBottom {
margin-bottom: 0;
}
.padPromotion-container {
margin-top: 40px;
margin-bottom: 40px;
}
.padPromotion-icon,
.padPromotion-iconMessage {
text-align: center;
margin-top: 10px;
}
.padPromotion-icon {
color: #50c7f9;
}
.padPromotion-iconMessages {
margin-top: 10px;
}
.padPromotion-iconMessage {
display: list-item;
float: left;
}
.padPromotion-promoMessage {
margin-top: 110px;
margin-bottom: 40px;
}
.padPromotion-ol {
list-style: decimal inside;
}
@media (max-width: 479px) {
.padPromotion-promoMessage {
margin-top: 150px;
}
}
@media (max-width: 990px) {
.padPromotion-iconMessage {
width: 33%;
}
.padPromotion-icon {
display: inline-block;
width: 33%;
}
}
.walletPrefs-preferredIcon:before {
padding-right: 4px;
color: #FFA500;
}
.walletPrefs-unpreferredIcon:before {
padding-right: 4px;
color: #C0C0C0;
}
.walletPrefs-contentText {
font-size: 14px;
}
.walletPrefs-walletContent {
margin: -20px 10px 25px 10px;
}
.walletPrefs-credit_preferenceContent {
display: inline-block;
margin-top: 18px;
}
.walletPrefs-editPreferenceLink {
margin-left: 20px;
}
.walletPrefs-preferredText {
margin-top: 0px;
margin-bottom: 0px;
}
.walletPrefs-contentWrapper {
display: table;
}
.walletPrefs-content {
display: table-cell;
}
.iframe3ds {
width: 430px;
height: 430px;
background: #ffffff;
}
.iframe3dsContainer {
width: 430px;
margin: 0 auto;
outline: 1px solid #cbd2d6;
position: relative;
}
@media only screen and (max-width: 480px) {
.iframe3ds {
width: 100%;
}
.iframe3dsContainer {
width: 100%;
}
}
.threeDSMessages-container {
width: 100%;
position: absolute;
top: 30%;
z-index: 1050;
}
.threeDSMessage {
text-align: center;
}
.threeDSIconContainer {
margin-bottom: 2em;
}
.threeDSIcon-warning {
color: #ff9600;
}
.buyerProtectionInfo-buyerProtection {
width: 100%;
margin-top: 80px;
padding: 10px;
display: table;
background-color: #fafafa;
}
.buyerProtectionInfo-descriptionContainer {
display: table-cell;
color: #9da3a6;
}
.buyerProtectionInfo-descriptionTitle {
margin: 0;
font-size: 14px;
}
.buyerProtectionInfo-descriptionText {
margin: 0;
font-size: 12px;
}
.buyerProtectionInfo-icon_shield {
width: 20px;
vertical-align: middle;
color: #9da3a6;
}
.addCard-verificationMessage {
margin-bottom: 25px;
padding: 10px;
}
.addCard-btn_confirm {
margin-bottom: 20px;
}
.addCardCodeExpired,
.addCardconfirmLater,
.cardAttemptFailed {
text-align: center;
}
.card-btn_container {
margin-bottom: 25px;
}
.card-attention_icon {
padding-bottom: 30px;
color: #ff9600;
}
.creditCardInput_vCode {
margin-bottom: 0;
}
.addCard-btn_initiateConfirm {
margin-top: 20px;
}
.timeTicker-icon {
color: #ff9600;
}
.timer_alert {
color: #d20000;
}
.timer-container {
margin-bottom: 12px;
}
.timeTicker_wrapper {
font-weight: bold;
}
.creditCardInput_csc {
z-index: 3;
}
.creditCardInput_mobileNumber {
z-index: 2;
}
.confirmCard-link_remove {
margin-top: 20px;
}
.creditCardInput_csc:after {
content: '';
width: 70px;
height: 44px;
position: absolute;
right: 6px;
top: 4px;
background: url('shared/sptri.png') no-repeat;
background-position: 23px -696px;
}
.giftCard {
background-color: #dddddd;
background-image: -moz-linear-gradient(135deg, #ffffff, #dddddd);
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(135deg, #ffffff, #dddddd);
background-image: -o-linear-gradient(135deg, #ffffff, #dddddd);
background-image: linear-gradient(135deg, #ffffff, #dddddd);
border-radius: 10px;
}
.giftCard:after {
content: '';
width: 117px;
height: 48px;
position: absolute;
bottom: 5%;
right: 5%;
background: url('https://securepics.ebaystatic.com/aw/pics/globalheader/spr11.png') no-repeat right bottom;
background-size: 100%;
}
.giftCard .value {
width: 100%;
margin: 10px 0 0;
display: block;
font-size: 2.4000000000000004em;
font-size: 2.625rem;
line-height: 0.5em;
text-align: right;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.redemptionCode {
word-wrap: break-word;
}
.savedOffers .savedOffer {
min-height: 150px;
z-index: 1;
background-color: #ffffff;
}
.savedOffer {
border-radius: 0;
}
.savedOffer.card {
width: 300px;
min-height: 170px;
}
.savedOffer .ribbon {
top: 33%;
}
.savedOffer.ready_to_use .value {
color: #329e47;
}
.savedOffer.ready_to_use .bottom {
border-color: #3ea134;
}
.savedOffer.redeemed .value {
color: #dca500;
}
.savedOffer.redeemed .bottom {
border-color: #d7ae0a;
}
.savedOffer.expired .value {
color: #b32317;
}
.savedOffer.expired .bottom {
border-color: #bb1827;
}
.savedOffer .merchant,
.savedOffer .bottom,
.savedOffer .offer,
.savedOffer .expirationDate {
display: inline-block;
}
.savedOffer .value,
.savedOffer .offerSummary {
display: block;
}
.savedOffer .multiline-ellipsis {
height: 40px;
overflow: hidden;
line-height: 20px;
}
.savedOffer .multiline-ellipsis:before {
content: "";
width: 5px;
height: 40px;
float: left;
}
.savedOffer .multiline-ellipsis > .text {
width: 100%;
margin-left: -5px;
float: right;
word-wrap: break-word;
}
.savedOffer .multiline-ellipsis:after {
content: "\02026";
width: 18px;
margin-left: -18px;
padding-right: 5px;
float: right;
position: relative;
top: -20px;
left: 100%;
text-align: right;
background: #ffffff;
}
.savedOffer .merchant {
width: 75%;
margin: 2px 0 0 7px;
float: left;
}
.savedOffer .bottom {
width: 100%;
margin-top: 20px;
border-top: 1px dashed;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.savedOffer .value {
margin-top: 30px;
position: relative;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
text-align: center;
}
.savedOffer .hasCents {
margin-top: 36px;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1em;
}
.savedOffer .percent_discount {
padding-right: 14px;
}
.savedOffer .percent_discount span:first-child {
font-size: 0.5em;
position: absolute;
right: 0;
top: -6px;
}
.savedOffer .percent_discount span:last-child {
font-size: 0.4em;
position: absolute;
right: 0;
bottom: -10px;
}
.savedOffer .offerSummary {
padding: 21px 0 0 14px;
position: relative;
}
.savedOffer .offerSummary:before {
content: '';
width: 1px;
height: 50px;
margin-top: -15px;
border-left: 1px solid;
position: absolute;
left: 0;
top: 50%;
color: #c5c5c5;
}
.savedOffer .gcSummary:before {
content: none;
}
.savedOffer .offer {
width: 100%;
margin-bottom: -2px;
}
.savedOffer .expirationDate {
font-size: 0.6857142857142857em;
font-size: 0.75rem;
line-height: 1.5em;
}
.merchantLogo {
width: 54px;
height: 54px;
padding: 3px;
margin: -14px 0 0 3px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
background: #ffffff;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.merchantLogo:before {
content: '';
width: 40px;
height: 25px;
position: absolute;
bottom: 133px;
left: 6px;
top: 14px;
z-index: -1;
background: #bcbcbc;
background: rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);
-moz-transform: rotate(85deg);
-webkit-transform: rotate(85deg);
-ms-transform: rotate(85deg);
-o-transform: rotate(85deg);
transform: rotate(85deg);
}
.merchantLogo img {
width: 48px;
}
/* Smartphones ----------- */
@media (max-width: 640px) {
.cards .fundingSources.savedOffers .fundingSource {
width: auto;
}
.savedOffer .expirationDate {
font-size: 0.6285714285714286em;
font-size: 0.6875rem;
line-height: 1.4545454545454546em;
}
}
@media (max-width: 479px) {
.savedOffers .merchantLogo img {
width: 28px;
height: 28px;
}
}
.btns .btn,
.btns .btn-secondary {
margin-right: 1em;
}
form.sepaMandate p {
text-align: left;
}
form.sepaMandate .btns {
margin: 1em auto;
}
.mandateText {
height: 18em;
/* max height for iframe before scrollbars appear */
padding: 0 0.357em 0 0.357em;
color: black;
border: 1px solid black;
overflow-y: auto;
}
.mandateText ol {
margin: 0 25px 10px 25px;
font-size: 13px;
}
.mandateText ol li {
margin-bottom: 10px;
}
.mandateText .whitespace-pre {
white-space: pre-line;
}
.mandateText .whatAuthorizationAllows {
border-top: 1px solid #999999;
}
form .mandateText h3,
form .mandateText .span4,
form .mandateText .span8 {
color: black;
text-align: left;
}
.mandateText dl {
margin: 0;
}
.spaceRow {
padding-top: 1.2em;
}
.modalContent .dialogSubheader {
text-align: center;
margin-top: 15px;
}
.modalContent .dialogSubheader img {
height: 40px;
}
.sepaMandate .alert,
.ddiMandate .alert {
width: 400px;
}
.sepaMandate form,
.ddiMandate form {
text-align: left;
}
.sepaMandate .details,
.ddiMandate .details {
background: url("Confirm/webstatic/logo/banks/dd.png") top left no-repeat;
background-size: 20%;
padding-top: 4em;
}
.sepaMandate .subheader,
.ddiMandate .subheader {
font-weight: bold;
}
.sepaMandate .subheader .value,
.ddiMandate .subheader .value {
font-weight: normal;
display: block;
}
.sepaMandate .btns,
.ddiMandate .btns {
margin-top: 1.5em;
}
.sepaMandate .skipDDILink,
.ddiMandate .skipDDILink {
padding-top: 10px;
}
.sepaMandate .ppCheckbox,
.ddiMandate .ppCheckbox {
padding-left: 10px;
}
.sepaMandate .acceptAuthorizationSubmit,
.ddiMandate .acceptAuthorizationSubmit {
position: relative;
}
.viewDDI .subheader {
font-weight: bold;
}
.viewDDI dt {
font-weight: normal;
width: 50%;
float: left;
margin-bottom: 5px;
}
.viewDDI dd {
margin: 0 0 5px 0;
width: 50%;
height: 20px;
float: left;
text-align: right;
}
.viewDDI p {
margin: 1em 0;
}
.viewDDI .dialogsubheader {
background: url("Confirm/webstatic/logo/banks/dd.png") no-repeat;
background-position: right center;
background-size: 20%;
}
.viewDDI .dialogsubheader p {
width: 79%;
}
.viewDDI .btns {
text-align: center;
}
.acceptAuthorizationContentDetails .btns {
text-align: center;
}
.modal.ddi_padLearnMoreTooltip_modal {
background-color: rgba(0, 0, 0, 0.87);
}
.alert .pad_align-left {
text-align: left;
}
.alert .pad_topMargin {
margin-top: 10px;
}
@media (max-width: 640px) {
.mainModalFlowContainer .modal-body {
padding-bottom: 100px;
height: 100%;
position: fixed;
}
}
/**
* Styles for the Direct Debit Instruction (DDI) and
* DDI print page
*/
.staticPage .navbar-header .brand {
padding-left: 0;
}
.staticPage .centered {
margin: 0 auto;
max-width: 1024px;
}
/**
* Direct Debit Instructions
*/
.ddi {
margin-top: 30px;
}
.ddi h1 {
font-weight: 300;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.ddi .ddiAccountInfo,
.ddi .ddDetails {
display: inline-block;
width: 50%;
vertical-align: top;
}
.ddi .ddiAccountInfo h2 {
width: 85%;
}
.ddi .ddGuarantee {
border: 2px solid #7e7e7e;
padding: 10px 50px 30px 50px;
background: url("Confirm/webstatic/logo/banks/dd.png") no-repeat 98% 4%;
background-size: 100px;
margin-top: 2em;
}
.ddi .ddGuarantee li {
margin-bottom: 1em;
}
.ddi dt {
font-weight: normal;
}
.ddi dd {
font-weight: bold;
margin-left: 0;
margin-bottom: 1em;
}
/**
* Direct Debit Instructions Print Page
*/
.ddiPrint .ddiPrintHeaderContainer {
border-bottom: 1px solid #cccccc;
margin-bottom: 1em;
padding-bottom: .2em;
}
.ddiPrint .ddiPrintHeaderContainer p {
display: inline-block;
}
.ddiPrint .ddiPrintHeaderContainer .print-btn {
float: right;
}
.ddiPrint .bankInstructions {
border: 1px solid #000000;
padding: 10px 8px;
}
.ddiPrint .printFormInput {
border: 1px solid #000000;
border-bottom: none;
height: 2em;
padding-left: 5px;
}
.ddiPrint .printFormInput.lastInput {
border-bottom: 1px solid #000000;
}
.ddiPrint .signatureBox {
height: 7em;
padding-top: 10px;
padding-left: 10px;
border: 1px solid #000000;
}
.ddiPrint .accountOwner {
border-bottom: none;
padding-top: 2px;
}
.ddiPrint .date {
font-weight: bold;
text-align: right;
}
.ddiPrint dt {
font-weight: bold;
margin-bottom: .6em;
}
.ddiPrint dd {
font-weight: normal;
}
.ddiPrint dd span {
display: inline-block;
border: 1px solid #000000;
border-right: none;
padding: 4px 7px;
}
.ddiPrint dd span:last-child {
border-right: 1px solid #000000;
}
.ddiPrint .ddiOriginatorInfo {
display: table;
width: 100%;
}
.ddiPrint .ddiOriginatorInfo dl,
.ddiPrint .ddiOriginatorInfo .ddiLogo {
display: table-cell;
width: 50%;
}
.ddiPrint .ddiOriginatorInfo .ddiLogo {
vertical-align: middle;
font-weight: bold;
text-align: right;
}
.ddiPrint .ddiPrintSection {
display: inline-block;
width: 50%;
vertical-align: top;
}
.ddiPrint .accountHolderInfo {
padding-right: 20px;
}
.ddiPrint .btns {
margin-top: 1em;
}
.ddiPrint .ddGuarantee {
background: none;
position: relative;
}
.ddiPrint .ddGuarantee img {
position: absolute;
top: 10px;
right: 10px;
width: 100px;
}
/**
* Print Styles
*/
@media print {
.ddiPrint .navbar-header,
.ddiPrint .print-btn,
.ddiPrint #footer {
display: none;
}
.ddiPrint .contents > section:first-child,
.ddiPrint .contents > div:first-child {
padding-top: 0;
}
.ddiPrint .ddiPrintSection {
display: block;
float: right;
}
.ddiPrint .accountHolderInfo {
float: left;
}
.ddiPrint .ddGuarantee {
page-break-before: always;
clear: both;
}
}
@page {
margin: 2cm 1cm;
}
@page :first {
margin: 0.5cm 1cm;
}
.ppFundsDetails .menu .logo {
margin-bottom: 1em;
}
.ppFundsDetails .balanceSummary .menu .image {
border: 1px solid #cccccc;
text-align: center;
}
.ppFundsDetails .balanceSummary .menu .logo {
width: 225px;
margin-top: 4em;
}
.ppFundsDetails .paypalCredit dl {
padding-right: 1.8em;
}
.ppFundsDetails .paypalCredit dl span {
margin-right: 10px;
color: #999999;
font-weight: 600;
}
.ppFundsDetails .paypalCredit .due span {
color: #d07305;
}
.ppFundsDetails .paypalCredit .contextualHelp {
margin: 0 0 0 10px;
display: inline-block;
vertical-align: top;
}
.ppFundsDetails .helpCredit {
margin-top: -0.3em;
position: absolute;
right: 22px;
}
.ppFundsDetails .availableCredit .helpCredit {
margin-top: 0.15em;
}
/**
* PayPal Credit Options, e.g. Bill Me Later
*
* Used in modal/overpanel triggered from the creditProductModule
*/
.paypalCredit dl {
padding-right: 2.1em;
}
.paypalCredit .statementBalanceLabel span,
.paypalCredit .minPaymentDueLabel span {
font-size: 0.7428571428571429em;
font-size: 0.8125rem;
color: #999999;
font-weight: 600;
}
.paypalCredit .minPaymentDueLabel span {
color: #d07305;
}
.paypalCredit .currentBalanceLabel,
.paypalCredit .availableCreditLabel {
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 2.125em;
color: #333333;
}
.paypalCredit .currentBalanceAmount,
.paypalCredit .availableCreditAmount {
font-size: 1.9428571428571428em;
font-size: 2.125rem;
line-height: 1.1470588235294117em;
color: #666666;
font-weight: 600;
}
.paypalBalance .helpBalance {
width: 30px;
height: 30px;
margin-left: 0.5em;
display: inline-block;
vertical-align: middle;
}
.paypalBalance .balance,
.paypalBalance .balanceFromDetails {
width: 90%;
margin: auto;
}
.paypalBalance .contextualHelp {
display: inline-block;
font-size: 0.8em;
font-size: 0.875rem;
line-height: 1.4285714285714286em;
position: relative;
}
.paypalBalance .contextualHelp .dropdown-toggle {
position: static;
margin-left: 10px;
}
/**
* Reducing the width of the contextual
* help bubbles on smartphones and
* repositioning the pointer arrow
*
* @see https://jira.paypal.com/jira/browse/PPWLLTEXP-1916
*/
@media (max-width: 640px) {
.paypalBalance .contextualHelp .dropdown-menu {
width: 200px;
left: -152px;
}
.paypalBalance .contextualHelp.box-down .dropdown-menu:after {
left: 160px;
}
}
.balanceSummary .span8 {
padding-bottom: 11%;
}
.modal .balanceSummary .menu .balanceActions {
display: block;
width: 100%;
}
.modal .balanceSummary .menu .addFunds,
.modal .balanceSummary .menu .withdrawFunds {
width: auto;
}
.modal .balanceSummary .menu .addFunds {
padding-right: 0.75em;
}
.modal .balanceSummary .menu .withdrawFunds {
padding-left: 0.75em;
border-left: 1px solid #eeeeee;
}
.creditSummary .center-block {
margin-bottom: 0.588em;
}
@media (max-width: 640px) {
.row-fluid .balanceSummary > div {
width: 100%;
padding: 0 0 1em;
}
}
.fiDetails,
.addFI {
overflow-x: hidden;
overflow-y: visible;
}
.fiDetails .modal-header .btn {
position: absolute;
left: 0;
}
.fiDetails h3 {
margin-left: 0;
margin-top: 0;
font-size: 1.0285714285714287em;
font-size: 1.125rem;
line-height: 1.1666666666666667em;
}
.fiDetails form {
position: relative;
}
.fiDetails form.uneditable .textInput input {
color: #999999;
}
.fiDetails form.uneditable .textInput input:hover {
border-color: #bec0c2 #bec0c2 #dbdfe2;
}
.fiDetails form.uneditable .selectDropdown {
color: #999999;
background: #fafafa;
}
.fiDetails form.uneditable .selectDropdown:hover {
border-color: #ccd0d4;
-webkit-box-shadow: none;
box-shadow: none;
}
.fiDetails dd {
font-weight: 600;
}
.fiDetails dd.status {
color: #329e47;
}
.fiDetails .authStatusLabel {
white-space: nowrap;
}
.fiDetails .hasError .selectDropdown,
.fiDetails .hasError .selectDropdown:hover,
.fiDetails .hasError .selectDropdown:focus,
.fiDetails .hasError .selectDropdown.hovered {
background-position: 85% -2191px, right -1687px, center;
}
.confirmDeposits {
padding-bottom: 8em;
}
.confirmDeposits .contextualHelp .dropdown-menu {
left: 0;
}
.confirmDeposits .box-down .dropdown-menu:after {
left: 5px;
}
.confirmDeposits > p {
color: #333333;
text-align: left;
}
.confirmDeposits .newDepositsRequest {
margin: 1.5em 0;
}
.confirmDeposits .sampleStatement {
width: 25em;
height: 10em;
margin-top: 10px;
display: inline-block;
font-size: 1.142857143em;
color: #5d5c5f;
background: url("Confirm/webstatic/scr/scr_statement_400x80.png") no-repeat center 2em;
background-size: 100%;
}
.confirmDeposits .sampleStatement table {
width: 91%;
margin: 1.2em auto 0;
text-align: left;
}
.confirmDeposits .sampleStatement tr {
font-weight: 600;
}
.confirmDeposits .sampleStatement tr:first-child {
font-size: 0.6875em;
color: #747470;
}
.confirmDeposits .sampleStatement tr:last-child {
line-height: 2em;
font-size: .8em;
color: #333;
}
.confirmDeposits .sampleStatement tr td:last-child {
text-align: right;
}
.confirmDeposits .sampleStatement tr td span {
padding: 3px 4px;
border: 1px solid #f26522;
background-color: #fdc689;
border-radius: 6px;
}
.confirmDeposits .sampleStatement p {
margin-top: 3em;
position: relative;
font-size: 0.8em;
font-weight: 600;
color: #717074;
}
.confirmDeposits .sampleStatement p span {
color: #333;
}
.confirmDeposits .sampleStatement p:before {
content: "";
width: 40px;
height: 1px;
margin-left: -4.2em;
position: absolute;
top: -1.7em;
left: 50%;
background: #f26522;
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
.confirmDeposits .textInput {
display: inline-block;
vertical-align: middle;
}
.confirmDeposits .textInput.numericCode {
display: block;
}
.confirmDeposits .textInput input {
padding-right: 12px;
}
.confirmDeposits .textInput .BRL {
padding-left: 35px;
}
.confirmDeposits .contextualHelp {
display: inline-block;
top: -22px;
left: 10px;
}
.confirmDeposits .confirmCodeRequest {
margin-top: 1em;
}
.confirmDeposits a.cancel {
margin-left: 20px;
}
.confirmDeposits .btn-block .confirm {
margin: 1em 0;
}
.cards .menu .banking .bank > span {
font-size: 1.2571428571428571em;
font-size: 1.375rem;
line-height: 0.9545454545454546em;
}
.cards .menu .banking .bank > span.type {
margin-top: 5px;
font-size: 0.9714285714285714em;
font-size: 1.0625rem;
line-height: 1.2352941176470589em;
}
.cards .menu .banking .bank > span.lastDigits {
font-size: 1.4285714285714288em;
font-size: 1.5625rem;
line-height: 0.84em;
}
.cards .menu .banking .cardName {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.cards .menu .banking .lastDigits {
margin-top: 33%;
}
.cards .menu .banking .noBankType {
margin-top: 3.5em;
}
.disabled.customSelectBtn:after {
display: none;
}
.entryFlow {
height: 100%;
overflow: auto;
}
/* PayPal Payment Card */
.row-fluid .requestCard {
margin: 0;
}
.row-fluid .ppcardExp {
margin: 10px 0;
}
/* PayPal Pay Later on/off switch */
.row-fluid .onOff {
margin-bottom: 1em;
text-align: left;
}
.row-fluid .onOff .status {
width: 88%;
margin: 0 auto;
font-weight: 500;
text-align: center;
}
/* bank details */
.fiDetails .hasHelp {
padding-right: 1.5em;
}
.fiDetails .hasHelp .contextualHelp {
margin-top: -25px;
position: absolute;
right: 3em;
}
.fiDetails .hasHelp span.authStatusText {
padding-right: 25px;
}
.banking.image .bank > span {
font-size: 1.2571428571428571em;
font-size: 1.375rem;
line-height: 0.9545454545454546em;
line-height: 1.375em;
}
.banking.image .bank > span.type {
margin-top: 5px;
font-size: 0.9714285714285714em;
font-size: 1.0625rem;
line-height: 1.2352941176470589em;
}
.banking.image .bank > span.pad {
color: #999999;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.3125em;
}
.banking.image .bank > span.lastDigits {
font-size: 1.4285714285714288em;
font-size: 1.5625rem;
line-height: 0.84em;
}
.banking.image .cardName {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.banking.image .lastDigits {
margin-top: 32%;
}
.banking.image .last4 {
font-weight: 600;
}
.banking.image .noBankType {
margin-top: 3.5em;
}
.bankSummary .banking .bank {
padding: 11px 11px 0 15px;
}
.bankSummary form[name="deleteBank"] {
margin: 10px 0;
}
@media (max-width: 640px) {
.banking.image .lastDigits {
margin-top: 28%;
}
}
.changeAutoWithdrawal {
padding-left: 10px;
}
.removeBank-disclaimer {
color: #9da3a6;
pointer-events: none;
}
.SE .status,
.NO .status,
.DK .status,
.SE .statusLabel,
.NO .statusLabel,
.DK .statusLabel {
display: none;
}
/* Styles for add fi template */
.addModal .modal-body {
padding: 0 0 100px 0;
}
.addModal .back {
position: absolute;
top: 1em;
left: 4em;
}
.addModal form {
width: 100%;
margin: 0;
position: relative;
text-align: center;
}
.addModal fieldset {
margin-bottom: 1em;
position: relative;
}
.addModal legend {
text-align: left;
}
.addModal .save {
width: 40%;
margin: 0 auto;
}
.addModal .btns {
margin: 1em auto;
clear: both;
text-align: center;
}
.addModal .btns .btn {
min-width: 40%;
vertical-align: middle;
}
.addFI.btn.hidden-phone {
position: fixed;
top: 59px;
right: 120px;
z-index: 800;
}
.selectAddType .thumbnails li,
.selectCreditOrDebit .thumbnails li {
margin-bottom: 2.127659574468085%;
text-align: center;
height: 128px;
}
.selectAddType .thumbnails li:nth-child(4n+4),
.selectCreditOrDebit .thumbnails li:nth-child(4n+4) {
margin-left: 0;
}
.selectAddType .thumbnails .BML,
.selectCreditOrDebit .thumbnails .BML {
display: none;
}
.selectAddType .btn.disabled,
.selectCreditOrDebit .btn.disabled {
opacity: 0.65;
}
.selectAddType a,
.selectCreditOrDebit a {
min-width: 100px;
height: 33%;
padding-top: 4.8em;
display: block;
position: relative;
font-size: 1.214285714em;
}
.selectAddType a:before,
.selectCreditOrDebit a:before {
content: "";
width: 92px;
height: 60px;
margin-left: -45px;
position: absolute;
top: 1em;
left: 50%;
background: url("Confirm/webstatic/sprite/sprite_wallet_icons_2x.png") no-repeat;
background-position: center 0;
-webkit-background-size: 95% auto;
-moz-background-size: 95% auto;
-o-background-size: 95% auto;
background-size: 95% auto;
}
.selectAddType .addBankCardLink:before,
.selectCreditOrDebit .addBankCardLink:before {
height: 65px;
top: 0.8em;
background-position: center -62px;
}
.selectAddType .addBmlLink:before,
.selectCreditOrDebit .addBmlLink:before {
height: 70px;
top: 0.2em;
background-position: center -354px;
}
.selectAddType .addGiftCard:before,
.selectCreditOrDebit .addGiftCard:before {
background-position: center -125px;
}
.selectAddType .addOffers:before,
.selectCreditOrDebit .addOffers:before {
background-position: center -237px;
}
.selectAddType .addIdCard:before,
.selectCreditOrDebit .addIdCard:before {
background-position: center -292px;
}
.selectAddType .addLoyaltyCard:before,
.selectCreditOrDebit .addLoyaltyCard:before {
background-position: center -181px;
}
.addressDropdown {
clear: both;
}
.expirationYear select {
padding-right: 30px;
}
/**
* Styles for 8ball "Add Bank" flow
*/
.confirmSkipDDI {
width: 420px;
}
.addBankCard.GB .viewDDI dl dt {
text-align: left;
margin-bottom: 5px;
}
.addBankCard.GB .submitDDI .skipDDILink {
padding-top: 10px;
}
.addBankCard.GB .bankName {
font-weight: bold;
}
.addBankCard p {
margin: 1em 0;
text-align: left;
}
.btns .confirmCodeNow {
margin-bottom: 1em;
}
.accountTypeToggle {
margin-bottom: 1em;
}
.ownerName-label,
.ownerName-disclaimer,
.confirmCode-label {
display: block;
}
.alert.confirmSkipDDI {
width: 420px;
}
.alert.deleteAuthorizationConfirm {
width: 470px;
}
.accountNumbers,
.ibanField {
margin: 1em 0;
}
.accountNumbers .sideBySideInput .textInput,
.ibanField .sideBySideInput .textInput,
.accountNumbers.sideBySideInput .textInput,
.ibanField.sideBySideInput .textInput {
width: 49%;
}
.sideBySideInput_nameFields .textInput {
width: 49%;
}
.accountNumbers_noTopMargin {
margin-top: 0;
}
.routingNumberLabel,
.accountNumberLabel {
display: block;
margin-bottom: 10px;
}
form[name="deleteBank"] {
margin: 0;
}
.addBank.table {
width: 100%;
padding: 1em;
margin-bottom: 0.5em;
display: table;
color: #2c2e2f;
background-color: #ffffff;
border-radius: 3px;
}
.addBank.table table {
width: 100%;
margin: auto;
border: 1px solid #333;
border-collapse: collapse;
}
.addBank.table table.visible-phone {
margin-top: 1em;
}
.addBank.table th {
font-weight: normal;
}
.addBank.table th.recipient {
max-width: 20em;
}
.addBank.table th.recipient > span {
word-break: break-all;
}
.addBank.table tr {
border-bottom: 1px solid #9da3a6;
}
.addBank.table thead th {
padding: 0.5em;
border-bottom: 1px solid #9da3a6;
font-weight: bold;
text-align: left;
}
.addBank.table tbody td {
padding: 0.5em;
text-align: left;
}
.addBank.table tbody tr:nth-child(odd) {
background: #eeeeee;
}
form[name="bankInfo"] {
text-align: left;
margin-right: 20px;
}
form[name="bankInfo"] .ppCheckbox {
margin-top: 1em;
}
form[name="bankInfo"] .dob + .contextualHelp .help {
padding: 1px 6px;
font-size: inherit;
}
form[name="bankInfo"] .textInput {
margin: 0;
z-index: 1;
}
form[name="bankInfo"] .textInput.focus {
z-index: 2;
}
form[name="bankInfo"] .textInput.routingNumsThree {
width: 10%;
margin-right: 10px;
min-width: 55px;
}
form[name="bankInfo"] > div[data-toggle-element] {
clear: both;
}
form[name="bankInfo"] .accountNumbers + .btns {
margin-top: 6em;
}
form[name="bankInfo"] p {
margin-top: 0;
}
form[name="bankInfo"] .creditContent {
margin-top: 10px;
}
form[name="bankInfo"] .name,
form[name="bankInfo"] .input-row {
margin-bottom: 1em;
white-space: pre-line;
}
form[name="bankInfo"] .fieldsContainer {
padding: 1em 0 0;
}
form[name="bankInfo"] .legalName {
margin: 1.25em 0;
}
form[name="bankInfo"] .legalName-label {
margin: 0;
font-weight: bold;
}
form[name="bankInfo"] .dob {
width: 44%;
}
form[name="bankInfo"] .contextualHelp {
display: inline-block;
width: 30px;
margin-top: 2em;
z-index: 3;
}
form[name="bankInfo"] .contextualHelp.GB {
margin-top: 0;
}
form[name="bankInfo"] .contextualHelp.GB .dropdown-menu {
text-align: left;
}
form[name="bankInfo"] .contextualHelp .dropdown-menu {
left: auto;
right: -20px;
width: 200px;
}
form[name="bankInfo"] .contextualHelp .dropdown-menu:after {
left: auto;
right: 0.5em;
}
form[name="bankInfo"] .contextualHelp .dropdown-menu .dropdown-header .btn {
min-width: 44px;
float: right;
clear: none;
}
form[name="bankInfo"] .bankCountry,
form[name="bankInfo"] .accountType {
margin: 0 0 20px;
}
form[name="bankInfo"] .bankCountry .nativeDropdown,
form[name="bankInfo"] .accountType .nativeDropdown {
margin-top: 0;
}
form[name="bankInfo"] .accountType {
margin: 0 0 20px;
}
form[name="bankInfo"] .bankCountry-label,
form[name="bankInfo"] .accountType-label,
form[name="bankInfo"] .cpf-label {
margin-bottom: 8px;
display: block;
}
form[name="bankInfo"] .bankCountry-label.cpf-display,
form[name="bankInfo"] .accountType-label.cpf-display,
form[name="bankInfo"] .cpf-label.cpf-display {
display: inline-block;
width: 19%;
}
form[name="bankInfo"] .cpf-info {
margin-bottom: 0;
}
form[name="bankInfo"] .cpf-helper {
color: #7e7e7e;
}
form[name="bankInfo"] .bankCountry-link {
color: #0070ba;
}
form[name="bankInfo"] .bankCountry-link:hover,
form[name="bankInfo"] .bankCountry-link:focus {
text-decoration: underline;
}
form[name="bankInfo"] .accountNumbers {
position: relative;
}
form[name="bankInfo"] .bankNameLabel {
clear: both;
}
form[name="bankInfo"] .continue {
width: 60%;
margin: 1.25em auto 0;
display: block;
}
/**
* Styles for check images for US & CA
*/
.checkWrapper {
overflow: hidden;
}
.check {
width: 500px;
height: 10.5em;
margin: 0.6em auto;
display: block;
position: relative;
background: url("Confirm/webstatic/scr/scr_check_453x138.png") no-repeat center bottom;
-webkit-background-size: 101% 100%;
-moz-background-size: 101% 100%;
-o-background-size: 101% 100%;
background-size: 101% 100%;
-moz-transition: width 0.3s ease-in-out;
-ms-transition: width 0.3s ease-in-out;
-webkit-transition: width 0.3s ease-in-out;
-o-transition: width 0.3s ease-in-out;
transition: width 0.3s ease-in-out;
}
.check.CA {
background-image: url("Confirm/webstatic/scr/scr_check_453x138_CA.png");
}
.check.CA.savings {
background-image: url("Confirm/webstatic/scr/scr_check_453x138_CA.png");
}
.check.CA.onroutingNum:before {
content: "";
width: 17%;
height: 20%;
border: 4px solid #0079c1;
position: absolute;
bottom: 10%;
/* @noflip */
left: 14%;
}
.check.CA.onroutingNum2:before {
content: "";
width: 13%;
height: 20%;
border: 4px solid #0079c1;
position: absolute;
bottom: 10%;
/* @noflip */
left: 32%;
}
.check.CA.onaccountNum:before {
left: 44.5%;
}
.check.savings {
background: url("Confirm/webstatic/scr/scr_deposit_slip_453x138.png") no-repeat center bottom;
-webkit-background-size: 101% 100%;
-moz-background-size: 101% 100%;
-o-background-size: 101% 100%;
background-size: 101% 100%;
}
.check.onaccountNum:before,
.check.onroutingNum:before {
content: "";
width: 26.5%;
height: 18%;
border: 4px solid #0079c1;
position: absolute;
bottom: 10%;
}
.check.onroutingNum:before {
/* @noflip */
left: 2%;
}
.check.onaccountNum:before {
/* @noflip */
left: 29.5%;
}
.accountFields {
margin: 0;
}
.routingRow {
width: 100%;
margin: 0;
display: table;
}
@media (min-width: 480px) and (max-width: 640px) {
.check {
height: 8em;
width: 400px;
}
}
@media (max-width: 479px) {
.check {
height: 8em;
width: 290px;
}
form[name="bankInfo"] {
margin-left: 0;
}
}
.noBankMsg {
margin-bottom: 1em;
padding: 0.5em 0.5em 0.4em 3.5em;
border: 2px solid #0666b3;
position: relative;
font-size: 0.8em;
font-size: 0.875rem;
line-height: 1.4285714285714286em;
}
.noBankMsg:before {
content: "";
width: 24px;
height: 24px;
position: absolute;
left: 14px;
top: 5px;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAACpF6WWAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxODMzNDY0Mjc2MkUxMUUzOUFFNkZGRTgyRTc2RTdDMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoxODMzNDY0Mzc2MkUxMUUzOUFFNkZGRTgyRTc2RTdDMSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjE4MzM0NjQwNzYyRTExRTM5QUU2RkZFODJFNzZFN0MxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE4MzM0NjQxNzYyRTExRTM5QUU2RkZFODJFNzZFN0MxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+GIEQ6wAAAa9JREFUeNqUlT1LA0EQhi8hRoIi+IGVELBQsbERsTCFaONHY6eFgvgfLDSCmLT6B0TSWAT87ARbLUUURFEJKChamEaUkCNwvqPvhWW53TsHHtjdmX0z2dmbjTmbF47FWsAI6AGNwAX34Bx8mjYlDOv9YA3MUEy3KjgCOXCrO+PaPAZWwRWYNQg6XBf/NchyX6CoOLZBHjQ40SzBbHdUYVV0BSyFiByAZfChrS9yP7P7K1Q3uANJi+AD6AMes8tqfpe1KPmZrocIirWBVtAMxgL8Ser8nkmKVQ4zqfgps0kZYkQnJZlm+OsmewNToAsMgmNLbJPoiWjaEvTOs5vXMrZZWkTbLQGPYAuccC5XbTJEtENEy5aADKu9x/kE6AwRLYvoc0jQLqhwvBChoE8iega+LEEF5UpNg31L7LfoxZmFqaKv4JLjYbDBCptMmkxFvfxuQNCLMr4BozzXIHP9y++Llvjp6TYEiuCQfXTckmWOOvVv3+9SO2wO/7UCm5GndymPDmnOtYhiNcbXBYOatMd+OsC/XbX0gSLj8qqg7TmRJ2JOeaN62e2rUd6oHwEGAOFXWezVEIKkAAAAAElFTkSuQmCC") no-repeat;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
@media (max-width: 640px) {
form[name="bankInfo"] {
margin: 0;
}
form[name="bankInfo"] .dob {
width: 88%;
}
form[name="bankInfo"] .textInput.textInput {
width: 100%;
}
form[name="bankInfo"] .contextualHelp {
display: none;
}
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.noBankMsg:before {
content: "";
width: 24px;
height: 24px;
position: absolute;
left: 14px;
top: 5px;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAqCAYAAADFw8lbAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxODMzNDYzRTc2MkUxMUUzOUFFNkZGRTgyRTc2RTdDMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoxODMzNDYzRjc2MkUxMUUzOUFFNkZGRTgyRTc2RTdDMSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjE4MzM0NjNDNzYyRTExRTM5QUU2RkZFODJFNzZFN0MxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE4MzM0NjNENzYyRTExRTM5QUU2RkZFODJFNzZFN0MxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+8NOCOwAAA4RJREFUeNrUmU1IVUEUx6/yNLIk6rXI0looWkIRpQVBUEJBIEYIfUpJLbLsixbVIiqoTZS0ybIoibC0RR8EGgUl2CJMo01UWm8hPZO+CSviSR//U2dkus713bkzXujADx7z7j3zv3PnzJw5N8Wp6XT+B4sY3JsKisFiUATywRQwhv//CnpBN6DRaAUd4GdYQrNBNVgHcoa5bhSYAGaCcm57BS6BWhDXHRW/FuUOYmBfEpFelsP3xthX1LbQleA52ArSLUy5dPZFPlfZEEpT4zS4AiaOQIyQzybuIxJUaAa4DqpCCOoq7itDVyg9XSMoDXEFKuU+IzpCT4IyC53TEvUYfPZ5fRn37UsoTe7NFkReAJPAHJDFo+XHqO817sYU184U5Ug0DZynYBb4IbWNB299rt0fwXTwzmtEj1iK7jsukWSfwHef99NGcdjr1U8FmywFxmRF2zwwVsPHRtY0ROgWkGZJaLlrxaB5elnTRxpr+meOkuAe3sdt2jNOQmZobtfCKB+YRj7ExC62KLKHs6Q3IA8s/TMgwSybtbULoSUWBFKk7wEt4JfUvhvUGPilNLJdvI65hiJPgdmg2SXS4bTOxIrkYCowcHQcHAJ3wQnF/6MNhRbIQrMCOqnntZdELgQPFNcsMBSaJQvNDOBgAOwF1ziLp13nhkcua2KZpmcmWudegnHS3p5Q5JvLbCwlYkT7A94vRFIAnVf8v9rCiaBfFtpn6KyVT5tu22BhMPtkoV2Gzs4p2grF0mJoXbLQRwaOPoCrivb1lna6Tlloq4GjRkUQkd8K/k3p3gvDaTUo9KFuQUCyi4q2JVw1oSCrBMcC+o5z3jAolDKchgCOXotX47IKFrkL3AYHAwptECUgOfWqVbzCZNam2NvFUaKS9/kWHl1dS7CmIYlz3CN6h7OYR/tOnk5tBpFfL09HdzJ7gKNYpx6lqglU89wqNFhJ9rudui/YpnG0pXPNE3CfRc/nc1ee4ZK0wz1gqr2eakGLfJ7t070KBgZ2VnW+Sh3miW464Rv1uV2npJPgasWtEEU2c58JHaFk38BycCYEkdTHCu7T0RUqkuMqftL3IyCQfK7lPgb85KPJrInP5nUBNgWvqVXHPn2tMKmaT0+Vi1xw1Pn7xUPXevneXPbl+y2lGHxnEp9vSvi4nc8FA1Ff+sI7SzenkfeckD/fOFIi086MuP0WYADxLLWXOIid0gAAAABJRU5ErkJggg==") no-repeat;
-webkit-background-size: 100%;
-moz-background-size: 100%;
-o-background-size: 100%;
background-size: 100%;
}
}
.bleedingNotification {
display: inline-block;
background-color: #d3e7f9;
padding: 10px;
border-bottom: 10px solid #00a1ff;
width: 100%;
text-align: center;
}
.autoCountryName {
color: #6c7378;
}
.ppCheckbox .addBank_autowithdraw {
width: 20px;
height: 20px;
margin-left: 0;
position: relative;
top: 0;
left: 14px;
z-index: 10;
}
.edit {
margin-left: 10px;
}
.userName-toggleOrderBtn {
display: block;
}
.secondaryText {
color: #6c7378;
font-size: 13px;
padding-bottom: 10px;
}
.separator {
position: absolute;
top: 21%;
left: -20px;
}
.digitNumber {
position: relative;
}
.deleteAuthorization {
margin-left: 20px;
}
@media (min-width: 1200px) {
.col-lg-offset-1_ltr {
/* @noflip */
margin-left: 8.33333%;
}
}
.js .addressEntry .nativeDropdown.lap {
margin-bottom: 20px;
text-align: left;
}
form[name="addCreditOrDebit"] .creditCardInput_mobileNumber {
}
form[name="addCreditOrDebit"] .creditCardInput_vCode {
}
form[name="addCreditOrDebit"] .ccNumber {
margin-bottom: 0;
}
form[name="addCreditOrDebit"] .ccNumber.lap {
margin-bottom: 0;
}
form[name="addCreditOrDebit"] .ccNumber:not(.hasError) ~ .cardLogo {
width: 47px;
height: 30px;
position: absolute;
top: 7px;
right: 9px;
background: url('shared/sptri.png') no-repeat 0 45px;
}
form[name="addCreditOrDebit"] .ccNumber:not(.hasError) ~ .cardLogo[data-ctype="visa"] {
background-position: left -92px;
}
form[name="addCreditOrDebit"] .ccNumber:not(.hasError) ~ .cardLogo[data-ctype="master_card"] {
background-position: left -198px;
}
form[name="addCreditOrDebit"] .ccNumber:not(.hasError) ~ .cardLogo[data-ctype="amex"] {
background-position: left -297px;
}
form[name="addCreditOrDebit"] .ccNumber:not(.hasError) ~ .cardLogo[data-ctype="discover"] {
background-position: left -594px;
}
form[name="addCreditOrDebit"] .ccNumber:not(.hasError) ~ .cardLogo[data-ctype="china_union_pay"] {
background-position: left -1328px;
}
form[name="addCreditOrDebit"] .ccNumber:not(.hasError) + .clearInput:not(.hide) + .cardLogo {
right: 40px;
}
form[name="addCreditOrDebit"] .csc {
width: 49%;
margin: 15px 0 0;
position: relative;
text-align: left;
}
form[name="addCreditOrDebit"] .csc:after {
content: '';
width: 70px;
height: 44px;
position: absolute;
right: 6px;
top: 4px;
background: url('shared/sptri.png') no-repeat;
background-position: 23px -696px;
}
form[name="addCreditOrDebit"] .csc[data-ctype="amex"]:after {
background-position: 23px -796px;
}
form[name="addCreditOrDebit"] .csc.textInput label {
padding-right: 56px;
}
form[name="addCreditOrDebit"] .creditCardInput .textInput.expirationDate {
width: 49%;
}
form[name="addCreditOrDebit"] .creditCardInput .textInput.expirationDate,
form[name="addCreditOrDebit"] .creditCardInput .textInput.dob {
margin: 15px 0 0;
}
form[name="addCreditOrDebit"] .creditCardInput .cardIssueInformation {
width: 100%;
margin: -0.9em 0 0.3em 0;
}
form[name="addCreditOrDebit"] .creditCardInput .cardIssueInformation .textInput.lap {
width: 49%;
}
form[name="addCreditOrDebit"] .creditCardInput .ppCheckbox {
margin-top: 5px;
clear: both;
}
form[name="addCreditOrDebit"] .creditCardInput .ppCheckbox-label {
margin-left: 0;
}
form[name="addCreditOrDebit"] .creditCardInput .ppCheckbox-input {
position: absolute;
}
form[name="addCreditOrDebit"] .save {
margin-top: 1em;
}
.initiateConfirm.addCreditCard {
padding: 0 20px 0 20px;
}
.initiateConfirm.addCreditCard .btns .btn {
width: 40%;
}
.confirmCard > p:last-child {
text-align: center;
}
.confirmCard > p:last-child span {
display: block;
text-align: left;
}
.addNewAddress .btns {
margin: 1em auto;
clear: both;
text-align: center;
}
.addNewAddress .btns .btn {
min-width: 40%;
vertical-align: middle;
margin: 0 1em;
}
/**
* laying out the card input fields
*/
.cardInputs .textInput {
width: 49%;
}
.cardInputs .textInput:nth-child(odd) {
float: left;
}
.cardInputs .textInput:nth-child(even) {
float: right;
}
.cardInputs > .textInput:only-child {
width: 100%;
}
/**
* if we need to display 4 input fields
* make sure the last one stretches the full width
*/
.creditCardInput-layout4 .textInput:last-child {
width: 100%;
}
/**
* Stretching month/year input to occupy more space
* on smartphones to avoid truncation
*
* @see https://jira.paypal.com/jira/browse/PPWLLTEXP-1953
*/
@media (max-width: 640px) {
form[name="addCreditOrDebit"] .expirationDate {
width: 100%;
}
form[name="addCreditOrDebit"] .textInput.csc {
clear: both;
float: none;
display: block;
}
form[name="addCreditOrDebit"] .creditCardInput .textInput.expirationDate,
form[name="addCreditOrDebit"] .creditCardInput .textInput.dob,
form[name="addCreditOrDebit"] .creditCardInput .csc {
width: 100%;
}
form[name="addCreditOrDebit"] .csc.hasError .clearInput {
right: 166px;
}
form[name="addCreditOrDebit"] .csc .clearInput {
right: 130px;
}
.addCreditCard .creditCardInput .expirationDate.textInput {
width: 100%;
}
.initiateConfirm.addCreditCard {
height: auto;
}
}
@media (max-width: 568px) {
form[name="addCreditOrDebit"] .csc.hasError .clearInput {
right: 151px;
}
form[name="addCreditOrDebit"] .csc .clearInput {
right: 115px;
}
form[name="addCreditOrDebit"] .creditCardInput .csc input {
width: 100%;
}
}
@media (max-width: 480px) {
form[name="addCreditOrDebit"] .csc.hasError .clearInput {
right: 98px;
}
form[name="addCreditOrDebit"] .csc .clearInput {
right: 62px;
}
}
/* Styles for addFunds modal */
.addFundsModal .modal-body {
padding: 0;
}
.addFundsModal .btn {
width: 100%;
}
.addFundsModal .amount-input::-ms-clear {
margin-right: 2.2em;
}
.topUpInstructions-registrationOption {
position: relative;
padding: 20px;
margin-bottom: 20px;
background-color: #f7f9fa;
}
.topUpInstructions-registrationOption .banamex {
background-position: 0 0;
}
.topUpInstructions-registrationOption .bancomer {
background-position: 0 -126px;
}
.topUpInstructions-registrationOption .santandar {
background-position: 0 -252px;
}
.topUpInstructions-registrationOption .hsbc {
background-position: 0 -378px;
}
.topUpInstructions-registrationOption .banorte {
background-position: 0 -504px;
}
.topUpInstructions-registrationOption .copy {
font-size: 13px;
}
.topUpInstructions-subHeader,
.topUpDetails-subHeader {
font-weight: 600;
}
.topUpDetails-subHeader.topUpDetails-subHeader {
line-height: 21px;
}
.topUpOption-detailsList {
list-style: none;
}
.topUpOption-detailsList,
.topUpOption-imgContainer {
vertical-align: middle;
}
.topUpOption-imgContainer {
margin: 15px 0 0;
}
.topUpOption-img_register {
background: url(Confirm/webstatic/logo/banks/MX-Register-Instruction-Sprite.png) 0 0;
}
.topUpOption-img_transfer {
background: url(Confirm/webstatic/logo/banks/MX-Transfer-Instruction-Sprite.png) 0 0;
}
.topUpOption-img {
width: 200px;
height: 125px;
margin: 0 auto;
background-size: 100%;
background-repeat: no-repeat;
}
.topUpBanks .nativeDropdown.enhanced .selectDropdown select,
.purposeCodeDropDown .nativeDropdown.enhanced .selectDropdown select {
opacity: 1;
padding-left: 10px;
}
.logoBalanceContainer .logoContainer {
border: 1px solid #eeeeee;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 0;
-webkit-border-top-left-radius: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-topleft: 5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 5px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 10px;
}
.logoBalanceContainer .giftCardLogo {
height: 100px;
text-align: center;
line-height: 80px;
}
.logoBalanceContainer img {
display: inline-block;
vertical-align: middle;
margin: auto;
max-height: 75%;
max-width: 70%;
}
.logoBalanceContainer .accountNoPinInfo {
margin-bottom: 20px;
}
.logoBalanceContainer .accountNoInfo {
border: 1px solid #eeeeee;
-webkit-border-top-right-radius: 3px;
-webkit-border-bottom-right-radius: 0;
-webkit-border-bottom-left-radius: 0;
-webkit-border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
-moz-border-radius-bottomright: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-topleft: 3px;
border-top-right-radius: 3px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 3px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
text-align: center;
}
.logoBalanceContainer .pinNoInfo {
border: 1px solid #eeeeee;
border-top: 0;
-webkit-border-top-right-radius: 0;
-webkit-border-bottom-right-radius: 3px;
-webkit-border-bottom-left-radius: 3px;
-webkit-border-top-left-radius: 0;
-moz-border-radius-topright: 0;
-moz-border-radius-bottomright: 3px;
-moz-border-radius-bottomleft: 3px;
-moz-border-radius-topleft: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
border-top-left-radius: 0;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
text-align: center;
}
.logoBalanceContainer .accountInfo {
padding: 15px 0 5px 0;
font-weight: bold;
font-size: 20px;
letter-spacing: 3px;
}
.logoBalanceContainer .pinInfo {
font-weight: bold;
font-size: 20px;
letter-spacing: 4px;
}
.logoBalanceContainer .balanceDetails {
border-left: 1px solid #eeeeee;
border-right: 1px solid #eeeeee;
border-bottom: 1px solid #eeeeee;
-webkit-border-top-right-radius: 0;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-top-left-radius: 0;
-moz-border-radius-topright: 0;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-topleft: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top-left-radius: 0;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 12px 12px 0;
}
.logoBalanceContainer .balanceText,
.logoBalanceContainer .lastUpdatedText {
float: left;
}
.logoBalanceContainer .lastUpdatedText {
position: relative;
bottom: 15px;
}
.logoBalanceContainer .balanceInfo,
.logoBalanceContainer .refreshInfo,
.logoBalanceContainer .editInfo {
text-align: right;
}
.logoBalanceContainer .refreshInfo,
.logoBalanceContainer .editInfo {
display: block;
}
.logoBalanceContainer .balanceDetails.editPage {
border: none;
}
.selectGiftCardInfo .giftCardInfoList {
margin: 0;
}
.selectGiftCardInfo .giftCardInfoRow {
display: block;
border-bottom: 1px solid #eeeeee;
padding-bottom: 10px;
padding-top: 12px;
}
.selectGiftCardInfo .girdCardInfoRow:first-child {
padding-top: 0;
}
.selectGiftCardInfo .icon {
display: block;
position: relative;
top: 19px;
text-align: right;
}
.selectGiftCardInfo .cardDetails {
display: block;
padding: 10px 0 10px 0;
}
.selectGiftCardInfo .showDetails {
overflow: hidden;
}
.selectGiftCardInfo .tandcLink {
padding-top: 15px;
}
.selectGiftCardInfo .deleteCard {
padding-top: 10px;
}
.balanceHelp-label {
display: block;
padding-bottom: 15px;
}
@media (max-width: 480px) {
.giftCardInfoList {
padding-top: 30px;
}
}
.merchantGC a {
border-radius: 10px;
border: 1px solid #c5c5c5;
background-color: #ffffff;
line-height: 115px;
text-align: center;
}
.merchantGC .merchantGC-img {
max-height: 75%;
max-width: 70%;
display: inline-block;
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.merchantGC .thumbnail:hover {
border: 1px solid #c5c5c5;
}
.gcHelp {
margin-bottom: 20px;
}
.physicalCardHelp {
padding: 0 0 10px 0;
margin: 0 0 20px 0;
border-bottom: 1px solid #ffffff;
}
.sponsorLogo {
max-width: 150px;
max-height: 150px;
}
.tandcLink {
padding-top: 15px;
}
.input-typeahead.merchantGCAdd .item-thumbnail {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
.addressWidget-zipcode {
z-index: 3;
}
.overpanel-body {
margin-bottom: 25%;
}
.overpanel-body .image,
.overpanel-body .logo {
max-width: 24em;
min-height: 13.5em;
height: auto;
padding: 0.5em;
margin: 0 auto 1em;
position: relative;
}
.overpanel-body .image.pp,
.overpanel-body .logo.pp {
border: 1px solid #d4d4d4;
background: url("Confirm/webstatic/logo/logo_paypal_212x56.png") no-repeat center;
}
.overpanel-body .image.ppCredit,
.overpanel-body .logo.ppCredit {
border: 1px solid #d4d4d4;
background: url("Confirm/webstatic/logo/credit_products/PP_Credit_logo.png") no-repeat center;
}
ul.linkAccount {
margin-left: 0;
}
.alreadyLinkedSection {
background-color: aliceblue;
border-radius: 5px;
border: 1px solid #ccc;
text-align: center;
margin-bottom: 20px;
}
.alreadyLinkedSection span.icon-info-small {
display: block;
position: relative;
top: 20px;
color: #9da3a6;
right: 110px;
}
.linkAccount li {
list-style: none;
padding-bottom: 10px;
}
.linkAccount .linkBank {
margin-top: 15px;
}
.ppCheckbox input {
height: 20px;
}
.oneAccount {
display: inline-block;
font-weight: bold;
margin-top: 10px;
}
form .floatingWidth {
width: 65%;
}
form .lap.searchBankName {
margin-bottom: 0;
}
.autowithdraw_removeBanks {
margin-left: 0;
margin-bottom: 40px;
position: relative;
}
.autowithdraw_removeBanks li {
list-style: none;
border-top: 1px solid #cbd2d6;
padding: 20px 20px 20px 50px;
position: relative;
}
.autowithdraw_removeBanks li .bankLogo {
background: url("Confirm/webstatic/icon/generic-bank.png") no-repeat;
background-position: 0 0;
display: block;
width: 12%;
height: 100%;
position: absolute;
left: 0px;
top: 10px;
}
.autowithdraw_removeBanks li.selected {
background-color: #f7f9fa;
padding: 30px 30px 30px 50px;
border-top: 1px solid #0092d1;
border-bottom: 1px solid #0092d1;
}
.autowithdraw_removeBanks li.icon-positive-small-after:after {
content: "\e020";
position: relative;
left: 75%;
}
@media (max-width: 479px) {
.autowithdraw_removeBanks li {
line-height: 16px;
}
.autowithdraw_removeBanks li.icon-positive-small-after:after {
left: 35%;
}
.autowithdraw_removeBanks li.selected {
padding: 20px 20px 20px 50px;
}
}
@media (max-width: 640px) {
.autowithdraw_removeBanks li {
padding: 30px 30px 30px 70px;
}
.autowithdraw_removeBanks li.icon-positive-small-after:after {
left: 50%;
}
.autowithdraw_removeBanks li.selected {
padding: 40px 30px 40px 70px;
}
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.autowithdraw_removeBanks li .bankLogo {
background: url("Confirm/webstatic/icon/generic-bank_2x.png") no-repeat;
background-size: 50%;
}
}
.menu .manageCurrencies {
padding-top: 10px;
}
.helpBalance {
margin-top: 5px;
position: relative;
display: inline-block;
vertical-align: top;
}
.helpBalance .dropdown-menu {
top: 40px;
left: -135px;
}
.helpBalance .dropdown-menu:after {
left: 150px;
}
#helpAccepted {
display: inline-block;
position: relative;
top: -20px;
}
#helpAccepted .dropdown-menu {
width: 300px;
}
.overpanel-body dd.isNegative span {
margin: 0;
color: #b32317;
}
@media (max-width: 640px) {
.helpBalance {
margin-top: -2px;
}
}
.linkBankWarning {
text-align: center;
}
.linkBankWarning .icon {
margin: 40px 0 60px;
display: block;
color: #999999;
}
.linkBankWarning p {
margin: 0 auto 25px;
}
.linkBankWarning ul {
margin: 0 20px 30px 40px;
text-align: left;
}
.linkBankWarning .betweenLines,
.linkBankWarning .moneyPak {
margin: 13px auto;
}
.paypalCash {
margin: 10px 0;
}
.paypalCashLogo {
background: url("Confirm/webstatic/logo/ppCash.png") left no-repeat;
background-size: 120px;
padding: 18px 65px;
}
.balanceActionsInfo {
min-height: 385px;
}
.balanceActionForm {
margin: 0;
position: relative;
}
.balanceActionForm .textInput {
margin: 0;
z-index: 2;
}
.balanceActionForm p {
margin: 1em 0;
}
.balanceActionForm > p:first-child {
margin-bottom: -5px;
}
.balanceActionForm .textInput.lap {
margin-bottom: 0;
}
.balanceActionForm .amount {
position: relative;
}
.balanceActionForm .addBankCurrency {
position: absolute;
top: 13px;
right: 44px;
}
.balanceActionForm .hasError + .addBankCurrency {
right: 80px;
}
.balanceActionForm .withdrawTime,
.balanceActionForm .withdrawToCheck {
margin: 20px 0;
}
.balanceActionForm .withdrawalFee {
margin-top: 0;
}
.balanceActionForm .addToBankText {
margin-top: -5px;
}
.dynamicFeeSchedule-message.dynamicFeeSchedule-message {
margin-top: 5px;
}
.reviewInfo.reviewInfo {
margin-bottom: 2em;
}
.reviewInfo.reviewInfo .change {
margin-right: 0.5em;
}
.reviewInfo.reviewInfo .accountType {
text-transform: capitalize;
}
.reviewInfo.reviewInfo dt,
.reviewInfo.reviewInfo dd {
width: 50%;
display: inline-block;
}
.reviewInfo.reviewInfo dd {
text-align: right;
}
.reviewInfo.reviewInfo .conversationText {
color: #6c7378;
text-align: right;
line-height: 0;
margin-bottom: 20px;
}
.processingTime {
margin-bottom: 2em;
}
.processingTime-legalText.processingTime-legalText {
display: block;
margin: 0.5em 0 0;
}
.balanceActionSuccess {
width: 80%;
margin: 0 auto 3em;
text-align: center;
}
.balanceActionSuccess:before {
margin: 0 auto;
position: relative;
}
.balanceActionSuccess .successConvert {
padding-top: 0;
}
.balanceActionSuccess-message {
padding-top: 1em;
display: block;
}
.balanceActionSuccess-checkmark {
padding: 1em;
text-align: center;
color: #299976;
}
.balanceActionSuccess-header,
.balanceActionSuccess-btnContainer {
text-align: center;
}
/*BalalnceWithdrawOffer feature*/
.withdrawVariant .btn {
min-width: 45%;
}
.balanceWithdraw .icon-info-small {
margin-top: 5px;
float: left;
color: #9da3a6;
}
.balanceWithdraw p {
margin: 0 0 0 2.0em;
}
#withdrawalOffer {
background-color: rgba(0, 0, 0, 0.87);
}
#withdrawalOffer h2,
#withdrawalOffer .btn-block {
text-align: center;
}
#withdrawalOffer .mainContent {
width: 50%;
margin: 0 auto 3em;
}
#withdrawalOffer .mainContent .subHeading {
margin: 40px 0 6px;
color: #ffffff;
font-size: 0.8571428571428572em;
font-size: 0.9375rem;
line-height: 1.4em;
}
#withdrawalOffer .mainContent ul {
margin-left: 0;
padding-left: 15px;
}
#withdrawalOffer .btn-block {
margin-top: 60px;
}
#withdrawalOffer .btn-block .btn-secondary {
margin-top: 10px;
margin-left: 0;
}
#withdrawalOffer .information {
text-align: center;
}
#withdrawalOffer .information .icon {
min-height: 100px;
margin-top: 38px;
display: inline-block;
}
#withdrawOfferVariant3 {
background-color: rgba(0, 0, 0, 0.87);
text-align: center;
}
#withdrawOfferVariant3 .tooltipContent {
text-align: center;
}
#withdrawOfferVariant3 .continue-withdrawal {
margin-left: 15px;
}
#withdrawOfferVariant3 .button-group {
margin-top: 40px;
}
#withdrawOfferVariant3 .btn-block {
margin-top: 40px;
}
#withdrawOfferVariant3 .btn-block .btn-secondary {
margin-top: 15px;
margin-left: 0;
}
#withdrawOfferVariant3 .btn-block .notification {
width: 48%;
margin: 15px auto 0;
font-size: 0.8em;
font-size: 0.875rem;
line-height: 1.5em;
}
#withdrawOfferVariant3 ul li {
width: 100px;
margin-right: 10px;
padding-top: 20px;
list-style-type: none;
display: inline-block;
}
#withdrawOfferVariant3 ul li a {
color: #ffffff;
text-decoration: none;
font-size: 0.8em;
font-size: 0.875rem;
line-height: 1.5em;
}
#withdrawOfferVariant3 ul li a:hover .icon-small {
opacity: 1;
}
#withdrawOfferVariant3 ul li a .linkContent:hover,
#withdrawOfferVariant3 ul li a .linkContent:active {
text-decoration: underline;
}
#withdrawOfferVariant3 ul li .icon-small {
margin-bottom: 20px;
display: block;
color: #0079ad;
opacity: 0.5;
}
#withdrawOfferVariant3 ul li .icon-small:before {
font-size: 2em;
font-size: 2.1875rem;
line-height: 0.6em;
}
#withdrawOfferVariant3 ul li:first-child {
width: 130px;
}
#withdrawOfferVariant3 .information .icon {
min-height: 100px;
margin-top: 38px;
display: inline-block;
}
/*End BalanceWithdrawOffer feature */
/* Smartphones ----------- */
@media (max-width: 479px) {
.reviewInfo dt,
.reviewInfo dd {
width: 100%;
display: block;
}
.reviewInfo dd,
.reviewInfo .conversationText {
text-align: left;
}
.balanceActionSuccess {
width: 100%;
}
.paypalCash {
margin: 10px 0;
text-align: center;
}
.paypalCashLogo {
background: url("Confirm/webstatic/logo/ppCash.png") center no-repeat;
background-size: 120px;
padding: 18px 150px;
display: block;
}
}
.moneyPak {
display: table;
}
.moneyPak a {
display: table-cell;
}
.moneyPakLogo {
padding: .06em 0 0 5em;
background: url('shared/sptri.png') no-repeat 0 -982px;
}
@media (max-width: 640px) {
.linkBankWarning {
padding: 0 15px;
margin-bottom: 2em;
}
.linkBankWarning p,
.linkBankWarning ul {
width: 70%;
}
#withdrawalOffer .mainContent {
width: 85%;
}
#withdrawalOffer .btn-block .btn {
min-width: 100%;
}
#withdrawOfferVariant3 .continue-withdrawal {
margin-left: 0;
}
}
@media (max-width: 479px) {
.linkBankWarning p,
.linkBankWarning ul {
width: 85%;
}
/*BalanceWithdrawOffer feature*/
.balanceActionForm .btn {
min-width: 100%;
}
.balanceActionForm .btn-secondary {
margin-top: 20px;
margin-left: 0;
}
#withdrawalOffer .mainContent {
width: 90%;
}
#withdrawalOffer .btn-block .btn {
min-width: 100%;
}
#withdrawOfferVariant3 .btn-block .notification {
width: 85%;
}
/*End BalancewithdrawOffer feature*/
}
/* Retina display */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.moneyPakLogo {
background: url('Confirm/webstatic/sprite/sprite_logos_wallet_2x_v2.png') no-repeat 0 -685px;
background-size: 25%;
padding-left: 83px;
float: left;
}
}
@media (-webkit-min-device-pixel-ratio: 2) and (max-width: 479px), (min-resolution: 192dpi) and (max-width: 479px) {
.moneyPakLogo {
background: url('Confirm/webstatic/sprite/sprite_logos_wallet_2x_v2.png') no-repeat 0 -610px;
background-size: 25%;
}
}
.feeSchedule-amount {
text-align: right;
}
.withdraw-link_addMargin {
margin-top: 10px;
}
.review-description.review-description {
color: #2c2e2f;
}
.pendingTransaction-container {
text-align: center;
}
.pendingTransaction-icon_attention {
display: block;
padding-bottom: 2.5em;
color: #9da3a6;
}
.cardBrandUpdateFail-icon_attention {
display: block;
padding-bottom: 2.5em;
color: #ff9600;
}
@media (min-width: 768px) {
.cardAttemptFailed-btn_addSpace {
margin-left: 0.5em;
}
}
.proActiveMsg-container_blue {
position: relative;
border: 1px solid #f1f8fc;
background-color: #f1f8fc;
margin-top: 5px;
padding: 15px 15px 12px 18px;
color: #2c2e2f;
font-size: 0.8125rem;
line-height: 1.84615385;
}
.proActiveMsg-container_blue:after {
bottom: 100%;
left: 8%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(241, 248, 252, 0);
border-bottom-color: #f1f8fc;
border-width: 10px;
margin-left: -10px;
}
.topUpErrorIcon {
color: #ff9600;
}
.infoBox {
padding: 15px;
background-color: #f5f7fa;
border-radius: 5px;
}
.infoBoxItem:not(:last-child) {
margin-bottom: 10px;
}
.addBankConfirmBank .btns,
.addBankCodeConfirmBank .btns,
.addBankDepositConfirmBank .btns {
clear: both;
}
.addBankConfirmBank .confirmCode .textInput,
.addBankCodeConfirmBank .confirmCode .textInput,
.addBankDepositConfirmBank .confirmCode .textInput {
width: 260px;
margin-top: 0;
}
.addBankConfirmBank .btn-block {
margin-top: 1em;
}
.addBankConfirmBank .btn-block input[type="submit"] {
margin-bottom: 1em;
}
.addBankChooseConfirmMethod p {
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.875em;
}
.addBankChooseConfirmMethod li {
width: 100%;
height: 150px;
margin-top: 2em;
position: relative;
cursor: pointer;
border: 1px solid #cccccc;
border-radius: 10px;
}
.addBankChooseConfirmMethod li .option1,
.addBankChooseConfirmMethod li .option2 {
position: absolute;
left: 1em;
color: #0666b3;
font-size: 1.142857142857143em;
font-size: 1.25rem;
line-height: 1.5em;
}
.addBankChooseConfirmMethod li .option1 {
top: 2em;
}
.addBankChooseConfirmMethod li .option2 {
top: 3em;
}
.addBankChooseConfirmMethod li:after {
width: 10px;
height: 10px;
content: '';
position: absolute;
top: 70px;
right: 1em;
float: right;
display: inline-block;
border-top: 2px solid #c5c5c5;
border-right: 2px solid #c5c5c5;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.addBankChooseConfirmMethod li .icon {
position: absolute;
right: 1em;
top: 58px;
font-size: 1.3714285714285714em;
font-size: 1.5rem;
line-height: 1.4166666666666667em;
}
.confirmInstantly .btns {
text-align: center;
}
.confirmInstantly .btns .btn,
.confirmInstantly .btns .btn-block {
margin-top: 1em;
}
.confirmInstantly .bankLogo {
position: relative;
}
.confirmInstantly .bankLogo .icon {
position: absolute;
right: 0;
top: 0;
font-size: 1.3714285714285714em;
font-size: 1.5rem;
line-height: 1.25em;
}
.betweenLines {
margin-bottom: 10px;
position: relative;
text-align: center;
margin-top: 20px;
}
.betweenLines span:before,
.betweenLines span:after {
width: 42%;
position: absolute;
left: 0;
top: 10px;
border-top: 1px solid #d4d4d4;
content: '';
}
.betweenLines span:after {
right: 0;
left: auto;
}
.confirmationHelp {
color: #999999;
}
.mfatimeout {
margin-top: -10px;
}
.linkingAndLoading .steps {
padding: 25px 20px 0;
background-color: #141f2b;
}
.linkingAndLoading .steps li {
padding: 0 0 25px 40px;
position: relative;
color: #999999;
}
.linkingAndLoading .steps li.progress {
color: #cccccc;
}
.linkingAndLoading .steps li.progress:before {
content: "";
height: 18px;
width: 18px;
margin: -15px auto auto -15px;
position: absolute;
top: 14px;
left: 16px;
z-index: 6;
border-width: 2px;
border-style: solid;
border-color: #2180c0 rgba(255, 255, 255, 0.5) rgba(255, 255, 255, 0.5);
-webkit-animation: rotation 0.7s infinite linear;
-moz-animation: rotation 0.7s infinite linear;
-ms-animation: rotation 0.7s infinite linear;
animation: rotation 0.7s infinite linear;
border-radius: 100%;
}
.linkingAndLoading .steps li.done {
color: #ffffff;
}
.linkingAndLoading .steps li.done:before {
/*Add another block-level blank space*/
content: "\00a0";
display: block;
/*Make it a small rectangle so the border will create an L-shape*/
width: 10px;
height: 20px;
/*Add a border on the bottom and left, creating that 'L' */
border: solid #68ff68;
border-width: 0 3px 3px 0;
position: absolute;
left: 7px;
right: auto;
top: -7px;
/*Rotate the L 45 degrees to turn it into a checkmark*/
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.linkingAndLoading .steps li.done:before {
border-width: 0 2px 2px 0;
}
.linkingAndLoading p {
font-weight: 600;
}
.cardNumber {
position: relative;
}
.zipcodeLabel {
margin-bottom: 10px;
display: block;
}
.prefix2 {
margin-right: 2%;
}
.bankNameLogo {
width: 200px;
height: 40px;
background: url("Confirm/webstatic/i/sprite/sprite_bank-logos.png");
background-repeat: no-repeat;
background-position: 0 100px;
}
.bankOfAmerica {
background-position: 0 0;
}
.chase {
background-position: 0 -50px;
}
.wellsFargo {
background-position: 0 -100px;
}
.etrade {
background-position: 0 -150px;
}
.usBank {
background-position: 0 -200px;
}
.tdBank {
background-position: 0 -250px;
}
.fifthThirdBank {
background-position: 0 -300px;
}
.huntington {
background-position: 0 -350px;
}
.keyBank {
background-position: 0 -400px;
}
.pnc {
background-position: 0 -450px;
}
.regions {
background-position: 0 -500px;
}
.usaa {
background-position: 0 -550px;
}
.ing {
background-position: 0 -600px;
}
.rbcBank {
background-position: 0 -650px;
}
.capitalOne {
background-position: 0 -700px;
}
.bmo {
background-position: 0 -800px;
}
.cibc {
background-position: 0 -850px;
}
.nationalBank {
background-position: 0 -900px;
}
.scotiabank {
background-position: 0 -950px;
}
.rbcBank {
background-position: 0 -1000px;
}
.citi {
background-position: 0 -1050px;
}
.sunTrust {
background-position: 0 -1100px;
}
.navyFederal {
background-position: 0 -1150px;
}
.compass {
background-position: 0 -1200px;
}
.mountainAmerica {
background-position: 0 -1250px;
}
.mtBank {
background-position: 0 -1300px;
}
.ally {
background-position: 0 -1350px;
}
.bbt {
background-position: 0 -1400px;
}
.citizensBank {
background-position: 0 -1450px;
}
.listBanks .logo-bigger {
width: 143px;
height: 60px;
padding: 8px;
margin: auto;
display: table;
background: url('Confirm/webstatic/sprite/sprite_bank_logos.png') no-repeat 0 54px;
background-size: cover;
text-align: center;
line-height: 20px;
}
.listBanks .ca {
background: url('Confirm/webstatic/sprite/CA-FAB-Logo-Sprite-2x.png') no-repeat 0 54px;
background-size: cover;
}
.listBanks .bankOfAmerica {
background-position: 0 0;
}
.listBanks .capitalOne {
background-position: 0 -60px;
}
.listBanks .capital360 {
background-position: 0 -120px;
}
.listBanks .chase {
background-position: 0 -180px;
}
.listBanks .citiBank {
background-position: 0 -244px;
}
.listBanks .fifthThirdBank {
background-position: 0 -304px;
}
.listBanks .huntington {
background-position: 0 -364px;
}
.listBanks .pnc {
background-position: 0 -424px;
}
.listBanks .regions {
background-position: 0 -484px;
}
.listBanks .sunTrust {
background-position: 0 -544px;
}
.listBanks .tdBank {
background-position: 0 -604px;
}
.listBanks .usBank {
background-position: 0 -664px;
}
.listBanks .usaa {
background-position: 0 -724px;
}
.listBanks .wellsFargo {
background-position: 0 -784px;
}
.listBanks .scotiabank {
background-position: 0 -784px;
}
.listBanks .rbcRoyal {
background-position: 0 -964px;
}
.listBanks .bmoFinancial {
background-position: 0 -1268px;
}
.listBanks .nationalBank {
background-position: 0 -1568px;
}
.listBanks .desjardins {
background-position: 0 -1690px;
}
.listBanks .cibc {
background-position: 0 -1811px;
}
.bankNameText {
display: table-cell;
vertical-align: middle;
}
/* Confirm bank – double deposit */
.deposit {
width: 47%;
z-index: 0;
position: relative;
}
.deposit > .textInput {
font-weight: 600;
color: #333333;
}
.deposit > .textInput input {
/*@noflip*/
text-align: left;
font-size: 0.9714285714285714em;
font-size: 1.0625rem;
line-height: 1.2352941176470589em;
}
.deposit .disabled input {
color: #cbd2d6;
cursor: not-allowed;
pointer-events: auto;
}
.typeahead-wrapper {
position: relative;
}
.typeahead-wrapper .input-typeahead {
width: 100%;
position: absolute;
top: 43px;
z-index: 2;
}
.typeahead-wrapper .input-typeahead.showItems {
height: auto;
}
.autoWithdrawCardLogo:before {
font-size: 3.5rem;
}
.autoWithdrawBankLogo:before {
font-size: 4rem;
}
.autoWithdraw-text {
text-align: left;
}
.creditOrDebit.image .lastDigits {
padding-top: 28%;
text-align: center;
}
.creditOrDebit.image .last4 {
font-weight: 600;
}
.addressEntry {
margin: 1em 0;
}
.cardSummary .help-information.open,
.cardSummary .hasError .help-error.open {
top: 60px;
}
.cardSummary .textInput.csc label,
.cardSummary .textInput.issueNum label,
.cardSummary .textInput.dob label,
.cardSummary .textInput.expirationDate label,
.cardSummary .startDate legend,
.cardSummary .billingLabel {
padding: 0;
font-size: 0.8571428571428572em;
font-size: 0.9375rem;
line-height: 2em;
width: 100%;
margin: 0;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.875em;
font-weight: 600;
color: #333333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
border-bottom: none;
}
.cardSummary .expirationDate,
.cardSummary .csc,
.cardSummary .issueNum,
.cardSummary .dob {
margin: 0;
}
.cardSummary .expirationDate {
z-index: 3;
}
.cardSummary .csc {
z-index: 2;
}
.cardSummary .addressModel {
z-index: 1;
}
.cardSummary .nativeDropdown.billing {
margin-top: 0;
}
.cardSummary .updateDone {
margin-top: 25px;
}
.cardSummary-completeConfLink {
text-align: left;
margin-bottom: 0;
}
.pendingConfirmCard {
margin-top: 1em;
}
@media (max-width: 479px) {
.expiration.span6 {
width: 100%;
}
.cardSecurityCode.span6 {
width: 100%;
margin: 0;
}
}
.addcards.active {
margin: 10px 0 10px;
}
.addcards.active .debitCard,
.addcards.active .creditCard,
.addcards.active .prePaidGiftCard {
display: none;
}
.editCard .row-fluid > div,
.editCard .row-fluid > fieldset {
float: left;
height: 6em;
}
.editCard form .nativeDropdown.lap {
margin-top: 0;
}
.editCard .row-fluid > div:nth-child(2n+1),
.editCard .row-fluid > fieldset:nth-child(2n+1) {
margin-left: 0;
}
.bankLogos-container {
padding: 1em;
background-color: #f5f7fa;
}
.bankLogos-content {
margin: 0;
color: #2c2e2f;
font-size: 13px;
}
.bankLogos-imageContainer {
display: inline-block;
width: 25%;
padding: 0 2% 0 0;
margin-top: 1em;
}
.bankLogos-image {
width: 100%;
}
.addCardSuccess .text-center {
text-align: center;
}
.addCardSuccess .subHeading {
font-weight: bold;
}
.addCardSuccess ul.addList {
margin: 0 0 10px 190px;
padding-top: 10px;
}
.addCardSuccess ul.addList li {
padding-bottom: 12px;
}
.addCardSuccess a {
width: 280px;
margin: 0 auto 1em;
display: block;
}
.addCardSuccess-checkmark {
padding-bottom: 2em;
text-align: center;
color: #299976;
}
.success-icon_positive {
margin-bottom: 45px;
text-align: center;
color: #299976;
}
/* phone portrait */
@media (max-width: 479px) {
.addCardSuccess a {
width: auto;
}
}
.savedOfferDetails .value {
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1em;
}
.savedOfferDetails .hasCents {
margin-top: 44px;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1em;
}
a.merchantSite {
width: auto;
margin: 10px 0 20px;
display: inline-block;
}
.savedOfferSummary {
height: 100%;
}
.savedOfferSummary .terms {
padding-bottom: 100px;
}
.savedOfferSummary h3 {
font-weight: 600;
}
.savedOfferSummary .onoffswitch {
margin-top: 10px;
}
.savedOfferSummary > label {
padding: 0;
font-size: 0.8571428571428572em;
font-size: 0.9375rem;
line-height: 2em;
width: 100%;
margin: 0;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.875em;
font-weight: 600;
color: #333333;
}
.savedOfferSummary pre {
border: 0;
background: none;
margin: 0;
padding: 0;
word-break: normal;
white-space: pre-wrap;
/* css-3 */
white-space: -moz-pre-wrap;
/* Mozilla, since 1999 */
white-space: -pre-wrap;
/* Opera 4-6 */
white-space: -o-pre-wrap;
/* Opera 7 */
word-wrap: break-word;
}
.activeLabel span {
margin-top: -16px;
display: block;
}
.offerDetails {
height: 100%;
position: relative;
}
.offerDescription,
.offerTerms {
position: absolute;
top: 0;
left: 0;
}
@media (max-width: 640px) {
.savedOfferDetails .hasCents {
margin-top: 38px;
}
}
.listFABBank .overpanel-content {
width: 796px;
}
.listFABBank ul.listBanks {
margin-left: 0;
}
.listFABBank .listBanks.loginPage .logo-bigger {
background-size: 75%;
width: 200px;
}
.listFABBank .icon-arrow-right-small:before {
content: "";
}
.listFABBank li {
margin: 0 20px 20px 0;
border: 1px solid #e4e4e4;
list-style: none;
}
.listFABBank li:hover {
background-color: #fafafa;
}
.brChallenge .checkMarkSymbol:before {
/*Add another block-level blank space*/
content: "\00a0";
display: block;
/*Make it a small rectangle so the border will create an L-shape*/
width: 6px;
height: 10px;
/*Add a border on the bottom and left, creating that 'L' */
border: solid #008800;
border-width: 0 3px 3px 0;
position: absolute;
left: auto;
right: 8px;
top: 0;
/*Rotate the L 45 degrees to turn it into a checkmark*/
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.brChallenge .checkMarkSymbol:before {
height: 15px;
border-width: 0 2px 2px 0;
margin: 0 auto;
position: relative;
right: 3px;
}
.brChallenge .crossMarkSymbol {
width: 40px;
height: 40px;
border-radius: 5;
font-size: 1.4285714285714288em;
font-size: 1.5625rem;
line-height: 0.84em;
text-align: center;
color: #b32317;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.brChallenge .table-borderless {
margin-bottom: 30px;
padding: 20px 0;
border-top: 1px solid #eeeeee;
border-bottom: 1px solid #eeeeee;
}
.brChallenge .table-borderless .tableHead {
padding-top: 20px;
}
.brChallenge .table-borderless .tableHead:first-child {
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.3125em;
}
.brChallenge .table-borderless .tableHead:last-child {
width: 20%;
}
.brChallenge .table-borderless td.cellSpacing {
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.3125em;
}
.brChallenge .table-borderless .lastRow td {
padding: 9px 0 10px 0;
}
.brChallenge .btn {
min-width: 280px;
}
.brChallenge .btn-secondary {
margin-left: 15px;
}
@media (max-width: 479px) {
.brChallenge .table-borderless td.cellSpacing {
padding: 0 0 10px 10px;
}
.brChallenge .btn-secondary {
margin-top: 20px;
margin-left: 0;
}
}
@media (max-width: 640px) {
.brChallenge .table-borderless td.cellSpacing {
padding: 0 0 10px 10px;
}
.brChallenge .btn-secondary {
margin-top: 20px;
margin-left: 0;
}
}
.linkBankSuccess {
text-align: center;
}
.linkBankSuccess span.icon-positive-large {
color: #080;
}
.linkBankSuccess h2 {
margin-top: 30px;
}
.linkBankSuccess .linkedSuccessfully {
margin-top: 30px;
}
.linkBankSuccess p.warning {
padding-top: 20px;
}
.linkBankSuccess ul.accountsNotLinked {
margin: auto auto 30px auto;
padding-left: 80px;
}
.linkBankSuccess ul.accountsNotLinked li {
text-align: left;
margin-left: 0;
}
.linkBankSuccess .fiUnavailable {
margin-top: 40px;
}
.linkBankSuccess .icon.icon-attention-large {
display: inline-block;
font-size: 80px;
color: #e7ad02;
}
.linkBankSuccess a.gotoStart,
.linkBankSuccess a.gotoCredit {
width: 200px;
margin: 0 auto 1em;
padding-top: 10px;
display: block;
}
.linkBankSuccess .policiesText {
font-size: 13px;
}
.linkBankSuccess .padBenefits {
line-height: 24px;
margin-bottom: 30px;
}
form .textInput.searchSponsor {
margin-bottom: 0;
}
.sponsorSearchResult ul {
list-style: none;
margin-left: 0;
}
.sponsorSearchResult li {
font-size: 1.2em;
padding-top: 10px;
padding-bottom: 10px;
cursor: pointer;
border-bottom: solid 1px #eeeeee;
}
.sponsorSearchResult li p {
margin-top: 15px;
}
.sponsorSearchResult li img {
margin-right: 10px;
float: left;
width: 50px;
height: 50px;
}
.sponsorSearchResult .category {
font-weight: bold;
border-bottom: solid 2px #eeeeee;
}
.ui-helper-hidden-accessible {
display: none;
}
.confirmBankAccount {
margin-left: 0;
}
.unconfirmedBankItem {
list-style: none;
padding-bottom: 10px;
padding-left: 5px;
}
.unconfirmedBankItem input,
.unconfirmedBankItem label {
margin-left: 10px;
vertical-align: middle;
}
.payAfterDelivery-content_info {
margin-bottom: 20px;
}
.payAfterDelivery-term {
margin-left: 15px;
}
.padTerms {
margin-left: 5px;
}
.bank-content_info {
margin-bottom: 30px;
}
.updatePad {
margin-bottom: 10px;
}
.arrow-checkmark:before {
color: #0078c0;
font-size: 35px;
}
.enrollPad,
.enrollPadOverPanel {
cursor: pointer;
}
.modal.successpage_padLearnMoreTooltip_modal {
background-color: rgba(0, 0, 0, 0.87);
}
/* Overpanel */
.theoverpanel {
width: 100%;
min-height: 100%;
top: 0;
position: fixed;
z-index: 1050;
background: #ffffff;
}
.theoverpanel .overpanel-header,
.theoverpanel h2 {
font-size: 1.25rem;
line-height: 1.5;
font-weight: 400;
text-transform: none;
font-family: 'PayPal-Sans-Big', sans-serif;
-webkit-font-smoothing: antialiased;
}
.overpanel-wrapper {
margin: 0;
min-height: 100%;
background: #ffffff;
}
.overpanelOpen .theoverpanel {
position: static;
-webkit-animation-fill-mode: none;
animation-fill-mode: none;
}
.overpanelOpen .globalNav-main,
.overpanelOpen .globalNav_main,
.overpanelOpen .foreground-container,
.overpanelOpen .sidepanel {
display: none;
}
.overpanelPrepForClose .globalNav-main,
.overpanelPrepForClose .globalNav_main,
.overpanelPrepForClose .foreground-container,
.overpanelPrepForClose .sidepanel {
display: none;
}
/* Mobile First, aka Desktop Later */
@media (min-width: 768px) {
.theoverpanel .overpanel-header,
.theoverpanel h2 {
font-size: 1.875rem;
line-height: 1.4;
font-weight: 300;
text-transform: none;
}
}
/**
* Overqualifying this for now since it clashes with
* styles declared in overpanel.less
*
* Once we move to a single overpanel solution, we can
* remove .theoverpanel from this rule
*/
.theoverpanel .dismiss {
margin-left: 512px;
top: 0;
padding: 15px;
left: 50%;
z-index: 2;
}
.theoverpanel .dismiss .icon-close-small {
color: #666666;
}
@media (max-width: 1024px) {
.theoverpanel .dismiss {
margin-left: 0;
left: auto;
right: 0;
}
}
.overpanel-content {
/* Top space in overpanel should be 114px for desktop by Adam Dustan */
padding-top: 114px;
font-size: 15px;
background: #ffffff;
position: relative;
overflow: auto;
min-width: 400px;
}
.maxOverpanelWidth {
max-width: 696px;
margin: 0 auto;
}
.menu {
padding-right: 2em;
z-index: 1;
background: #ffffff;
}
.menu .image,
.menu .btn,
.menu a,
.menu .toggle {
width: 100%;
margin-bottom: 0.588em;
}
.menu .image {
max-width: 24em;
height: 13.5em;
padding: 0.5em;
margin: 0 auto 1em;
position: relative;
background-size: contain;
background-position: center;
}
.overpanel-body {
height: 100%;
margin-bottom: 68px;
z-index: 0;
background: #ffffff;
}
.overpanel-body dl {
margin: 0 0 1em;
position: relative;
}
.overpanel-body dt {
padding: 0;
font-size: 0.8571428571428572em;
font-size: 0.9375rem;
line-height: 2em;
width: 100%;
margin: 0;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.875em;
font-weight: 600;
color: #333333;
}
.overpanel-body dd,
.overpanel-body .overpanel-description {
margin: 0 0 8px;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.3125em;
font-weight: 300;
word-wrap: break-word;
}
.overpanel-body dd span,
.overpanel-body .overpanel-description span {
color: #666666;
margin-right: 10px;
}
.overpanel-logo {
width: 100%;
height: 40px;
position: absolute;
left: 0;
bottom: 0;
z-index: -1;
/**
* not using the v2 sprite image here because the moneypak logo pushes the width of the
* image and is not the same size as the others. This makes centering the image difficult
*/
background: url("shared/sptri.png") no-repeat center 5px;
background-size: 35px;
}
.overpanel-subheader {
padding: 0;
font-size: 0.8571428571428572em;
font-size: 0.9375rem;
line-height: 2em;
width: 100%;
margin: 0;
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.875em;
font-weight: 600;
color: #333333;
margin-bottom: -12px;
font-family: 'PayPal-Sans', sans-serif;
}
@media (max-width: 768px) {
.overpanel-content {
padding-top: 3em;
min-width: 0;
}
.overpanel-header {
padding: 3em 0 0;
}
}
@media (max-width: 640px) {
.overpanel-content {
/* Top space should be 64px on mobile by Adam Dustan */
padding-top: 64px;
}
.theoverpanel h2 {
font-size: 1.4285714285714288em;
font-size: 1.5625rem;
line-height: 0.84em;
line-height: 1.2em;
margin-top: 0;
}
.overpanel-header {
padding: 0 15px;
}
.overpanel-body {
padding: 0 15px;
margin-bottom: 2em;
}
.overpanel-logo {
display: none;
}
.overpanel-body.row-fluid > div:not(.btn-block) {
width: 100%;
padding: 0;
margin: 0;
}
.menu .image {
width: 20em;
height: 12em;
}
}
/**
* Temporary fixes for modals that should be styled as overpanels
* This should be removed once these get converted and make use
* of the actual overpanel module
*/
.paypalBalance .detailsHeader,
.addFundsModal .detailsHeader,
.withdrawFundsModal .detailsHeader,
.paypalCredit .detailsHeader {
font-size: 1.8285714285714285em;
font-size: 2rem;
line-height: 1.09375em;
margin-bottom: 0.7em;
font-weight: 300;
}
.paypalBalance .modalContent,
.addFundsModal .modalContent,
.withdrawFundsModal .modalContent,
.paypalCredit .modalContent {
margin: 0 auto;
width: 100%;
max-width: 696px;
padding: 5em 0;
}
.paypalBalance .modalContent .modal-header,
.addFundsModal .modalContent .modal-header,
.withdrawFundsModal .modalContent .modal-header,
.paypalCredit .modalContent .modal-header {
margin: 0;
padding: 0;
}
.paypalBalance.modal .modal-body.body-default,
.addFundsModal.modal .modal-body.body-default,
.withdrawFundsModal.modal .modal-body.body-default,
.paypalCredit.modal .modal-body.body-default {
width: 100%;
}
@media (max-width: 640px) {
#paypalBalance .detailsHeader,
#addFunds .detailsHeader,
#withdrawFunds .detailsHeader {
margin-bottom: 0.7em;
font-size: 1.8285714285714285em;
font-size: 2rem;
line-height: 1.09375em;
}
#paypalBalance .modalContent,
#addFunds .modalContent,
#withdrawFunds .modalContent {
margin-top: 0;
}
#paypalBalance .modalContent .modal-header,
#addFunds .modalContent .modal-header,
#withdrawFunds .modalContent .modal-header {
margin: 0;
padding: 8px 8px 0;
background-color: transparent;
text-align: left;
border-bottom: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
#paypalBalance .modalContent .row-fluid .menu,
#addFunds .modalContent .row-fluid .menu,
#withdrawFunds .modalContent .row-fluid .menu {
width: 100%;
padding: 0;
margin: 0;
}
}
.card {
width: 225px;
height: 140px;
padding: 0.5em;
border: 0 none;
position: relative;
color: #444444;
font-weight: 300;
text-decoration: none;
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
/* card color diagonal gradients */
}
.card:hover,
.card:focus,
.card:active {
-webkit-box-shadow: none;
box-shadow: none;
color: #444444;
}
.card.creditOrDebit {
color: #ffffff;
border-radius: 10px;
}
.card.gray {
background-color: #7f7f7f;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #555555, #898989 50%, #555555);
background-image: -webkit-linear-gradient(135deg, #555555, #898989 50%, #555555);
background-image: -o-linear-gradient(135deg, #555555, #898989 50%, #555555);
background-image: linear-gradient(135deg, #555555, #898989 50%, #555555);
}
.card.black {
background-color: #474a4c;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
background-image: -webkit-linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
background-image: -o-linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
background-image: linear-gradient(135deg, #2c2e2f, #4e5153 50%, #2c2e2f);
}
.card.blue {
background-color: #306793;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
background-image: -webkit-linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
background-image: -o-linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
background-image: linear-gradient(135deg, #07467a, #3a6f99 50%, #07467a);
}
.card.red {
background-color: #c95151;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
background-image: -webkit-linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
background-image: -o-linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
background-image: linear-gradient(135deg, #ba1717, #cd6060 50%, #ba1717);
}
.card.gold {
background-color: #d0a157;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
background-image: -webkit-linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
background-image: -o-linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
background-image: linear-gradient(135deg, #c88723, #d2a764 50%, #c88723);
}
.card.green {
background-color: #4f9c50;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
background-image: -webkit-linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
background-image: -o-linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
background-image: linear-gradient(135deg, #317b31, #57a458 50%, #317b31);
}
.creditOrDebit {
border-radius: 10px;
}
.creditOrDebit:after {
content: "";
width: 25%;
height: 25%;
position: absolute;
right: 5%;
bottom: 5%;
}
.creditOrDebit:before {
content: "";
width: 25%;
height: 25%;
position: absolute;
right: 5%;
top: 5%;
}
.creditOrDebit.visa:after {
background: url("Confirm/webstatic/logo/cards/visa_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.visa .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.mastercard:after {
background: url("Confirm/webstatic/logo/cards/mastercard_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.mastercard .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.amex:after {
width: 20%;
height: 35%;
background: url("Confirm/webstatic/logo/cards/amex_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.amex .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.discover:after {
background: url("Confirm/webstatic/logo/cards/discover_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.discover .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.maestro:after {
background: url("Confirm/webstatic/logo/cards/maestro_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.maestro .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.jcb:after {
background: url("Confirm/webstatic/logo/cards/jcbcard_2x.png") no-repeat;
background-size: 82%;
}
.creditOrDebit.jcb .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.china_union_pay:after {
background: url("Confirm/webstatic/logo/cards/CUP_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.china_union_pay .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit.china_union_pay_dual:before {
background: url("Confirm/webstatic/logo/cards/CUP_2x.png") no-repeat;
background-size: 100%;
}
.creditOrDebit.china_union_pay_dual .cardType {
position: absolute !important;
clip: rect(1px 1px 1px 1px);
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
padding: 0 !important;
border: 0 !important;
height: 1px !important;
width: 1px !important;
overflow: hidden;
}
.creditOrDebit .ribbon {
top: 72%;
}
.creditOrDebit .cardName {
padding-top: 1em;
}
.creditOrDebit .lastDigits {
width: 100%;
padding: 26% 0 24%;
display: inline-block;
text-align: center;
text-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
}
.creditOrDebit .cardType {
position: absolute;
bottom: 1em;
right: 0.5em;
}
.walletPref-cardBankDetails {
width: 70%;
margin: 0;
display: block;
font-size: 15px;
line-height: 110%;
}
.walletPref-cardDetails {
padding: 8px 0;
}
.walletPref-bankDetails {
padding: 0;
}
.walletPref-header_choiceCFSPreferredTitle {
margin: 0 0 2px;
font-size: 18px;
font-weight: bold;
}
.walletPref-balanceModule {
margin: 18px 0 32px 15px;
}
.walletPref-checkmark_balance:before {
margin: 5px;
padding: 0.5px 3px 2.7px 4px;
border-radius: 10px;
color: #ffffff;
background-color: #3ea134;
line-height: 1.5;
}
.walletPref-label_balance {
padding: 0px 0px 8px 0px;
}
.walletPref-addFILink {
width: 265px;
margin: 30px auto 0;
padding: 10px 0 70px;
border-radius: 10px;
display: block;
text-align: center;
color: #999999;
background: #eeeeee;
font-size: 1.142857142857143em;
font-size: 1.25rem;
line-height: 1.05em;
}
.walletPref-addFILink > span {
margin-top: 10%;
display: block;
color: #999999;
}
.walletPref-radio {
width: 100%;
list-style: none;
border-top: 1px solid #eeeeee;
background: url('shared/sptri.png');
background-repeat: no-repeat;
background-position: 10px -492px;
position: relative;
}
.walletPref-image_bank {
background: url("Confirm/webstatic/icon/generic-bank_2x.png") no-repeat;
background-size: 30px;
background-position: 17px 12px;
}
.walletPref-image_VISA {
background-position: 10px -84px;
}
.walletPref-image_PPCREDIT {
background-position: 21px 10px;
background-size: 47px;
}
.walletPref-image_MCARD {
background-position: 10px -191px;
}
.walletPref-image_AMEX {
background-position: 13px -290px;
}
.walletPref-image_DISC {
background-position: 10px -587px;
}
.walletPref-image_BCVL {
background: url("Confirm/webstatic/logo/credit_products/PayPal_SmartConnect_292x183.png") no-repeat;
background-size: 30px;
background-position: 17px 50%;
}
/* eBay MasterCard */
.walletPref-image_DLEBAY {
background: url("Confirm/webstatic/logo/credit_products/eBay_mastercard_292x183.png") no-repeat;
background-size: 39px;
background-position: 11px 50%;
}
/* PayPal Extras */
.walletPref-image_DLPLUS {
background: url("Confirm/webstatic/logo/credit_products/PayPal_extras_292x183.png") no-repeat;
background-size: 39px;
background-position: 11px 50%;
}
.walletPref-radio:last-child {
border-bottom: 1px solid #eeeeee;
}
.walletPref_checked:last-child {
border-bottom: 1px solid #a8d7e9;
}
.walletPref-radio > input {
position: absolute;
opacity: 0;
}
.walletPref-label_finInstrument {
padding: 10px 0 10px 60px;
margin: 0;
display: block;
cursor: pointer;
}
.walletPref-label_finInstrument:hover > .settings-icon:before {
border: 1px solid #0078c0;
box-shadow: none;
}
.walletPref-label_finInstrument:hover > :not(.walletPref-checkmark):before {
content: '';
}
.settings-icon:before {
position: absolute;
top: 20px;
right: 20px;
border-radius: 5px;
}
.walletPref-label_finInstrument:hover > .walletPref-checkmark:before {
border: none;
}
.walletPref-instrumentList {
padding: 18px 0 0;
margin-left: 0;
text-align: left;
}
.walletPref-instrumentDisabled {
opacity: 0.5;
cursor: not-allowed;
}
.walletPref-link_unconfirmed {
margin-left: 16px;
font-size: 13px;
display: block;
}
.walletPref_checked {
border-top: 1px solid #a8d7e9;
border-bottom: 1px solid #a8d7e9;
background-color: #fafdfe;
}
.walletPref-checkmark:before {
position: absolute;
right: 2%;
color: #0078c0;
font-size: 35px;
}
.walletPref-footer_disclaimer {
margin: 32px 4px 30px 8px;
padding-left: 0;
font-size: 14px;
color: #999;
line-height: 100%;
}
.walletPref-subheader_disclaimer {
font-weight: bold;
}
.walletPref_btn-save {
width: 60%;
}
.padFlow {
text-align: center;
}
.padFlow-header {
margin-bottom: 0;
}
.padFlow-content_info {
margin-top: 15px;
margin-bottom: 10px;
}
.padFlow-button {
margin: 30px auto;
width: 300px;
background-color: #0070BA;
}
.padFlow-iconRow {
width: 100%;
}
.padFlow-icon {
text-align: center;
}
.padFlow-iconElem {
display: inline-block;
width: 25%;
}
.padFlow-terms {
margin-left: 4px;
}
.padFlow-iconItem {
margin: 25px 0 15px 0;
}
.padFlow-icon:before {
font-size: 3.6em;
}
.padFlow-iconCaption {
font-size: 15px;
}
.padFlow-icon.isFinished {
color: #299976;
}
.padFlow-icon.isUnfinished {
color: #9da3a6;
}
@media (max-width: 1024px) {
.paypalSourcesContainer {
width: 275px;
}
}
/* tablets - portrait */
@media (max-width: 768px) {
.paypalSources {
width: 100%;
}
.paypalSourcesContainer {
width: 100%;
padding: 0;
position: relative;
}
.cards {
width: 100%;
padding: 10px 35px;
margin-left: 0;
}
.row-fluid .thumbnails {
margin-left: 14px;
}
.confirmCard-btn_confirm {
margin-bottom: 20px;
}
}
/* Smartphones ----------- */
@media (max-width: 640px) {
.listFABBank .overpanel-content {
width: 100%;
}
.listFABBank .listBanks .icon-arrow-right-small:before {
content: "";
}
.listFABBank .listBanks .icon-arrow-right-small:after {
content: "\e008";
position: absolute;
top: 20px;
right: 0;
}
.listFABBank .listBanks li {
width: 100%;
border-left: none;
border-right: none;
border-bottom: none;
margin-bottom: 0;
position: relative;
}
.listFABBank .listBanks .logo-bigger {
width: 100%;
background-size: 143px;
text-align: left;
}
.cards {
padding: 10px 23px;
overflow-x: visible;
}
.row-fluid .thumbnails {
margin-left: 0;
}
.cards .fundingSources .fundingSource {
margin: 0 0 0 17px;
}
.cards .card {
width: 210px;
min-height: 125px;
}
.cards .thumbnail.banking .cardName {
padding: 0;
}
.cards .thumbnail.banking .noBankType {
margin-top: 37%;
}
form[name="confirmDeposits"] .numericCode {
width: 100%;
}
.cards .savedOffer {
width: 300px;
height: 140px;
}
.savedOffer .merchant {
font-size: 0.9142857142857143em;
font-size: 1rem;
line-height: 1.3125em;
}
.savedOffer .ribbon {
top: 38%;
}
.savedOffer .bottom {
margin-top: 15.5px;
}
.savedOffer.thumbnail .value {
margin-top: 28px;
font-size: 1.3714285714285714em;
font-size: 1.5rem;
line-height: 1.4166666666666667em;
font-size: 3.5vw;
}
.savedOffer.thumbnail .hasCents {
margin-top: 36px;
font-size: 1.2000000000000002em;
font-size: 1.3125rem;
line-height: 0.9523809523809523em;
}
.savedOffer .percent_discount span:first-child {
top: -4px;
}
.savedOffer .percent_discount span:last-child {
bottom: -7px;
}
.savedOffer .offerSummary {
padding: 15px 0 0 8px;
}
.savedOffer .offer {
margin-bottom: -5px;
}
.savedOffer .expirationDate {
margin: 0;
}
.savedOfferDetails .menu .image {
width: 100%;
min-height: 100%;
}
.savedOfferDetails .offerSummary {
padding-left: 15px;
}
.savedOfferDetails .terms {
margin-bottom: 0;
}
.findOffers.btn {
width: 100%;
}
.bankInfo .check {
width: auto;
margin: 0.5em auto 1em;
}
.bankInfo form .textInput {
width: 100%;
padding: 0;
}
.bankInfo form .textInput.lastName {
margin-top: 0.5em;
}
.check.CA.onroutingNum:before {
/* @noflip */
left: 14%;
bottom: 10%;
}
.check.CA.onroutingNum2:before {
bottom: 10%;
/* @noflip */
left: 32%;
}
.check.CA.onaccountNum:before {
bottom: 8%;
/* @noflip */
left: 44.5%;
}
.bankInfo .routingNum input:not([type=submit]):not([type=radio]):not([type=checkbox]),
.bankInfo .accountNum input:not([type=submit]):not([type=radio]):not([type=checkbox]) {
border-width: 1px;
border-style: solid;
border-color: #bec0c2 #bec0c2 #dbdfe2;
border-radius: 5px;
}
.fiDetails .hasHelp .onOff .contextualHelp {
margin-top: 5px;
right: 27px;
}
.wallet .help {
padding: 0 6px;
margin: 0 15px;
-webkit-border-radius: 18px;
-moz-border-radius: 18px;
border-radius: 18px;
-moz-background-clip: padding-box;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 2px solid #bbb;
background: #ffffff;
color: #666666;
font-size: 14px;
margin: 0;
}
.wallet .help:hover,
.wallet .help:focus,
.wallet .help:active {
color: #666666;
background: #ffffff;
text-decoration: none;
}
.fiDetails .alert {
margin-top: -40px;
}
.addFI .alert {
margin-top: -178px;
}
/**
* https://jira.paypal.com/jira/browse/PPWLLTEXP-1737
*
* Making sure the amounts wrap onto the next line and are left-aligned
* Also adjusting the font-size to match the respective labels
*/
.paypalCredit .cs-amount {
float: none;
text-align: left;
font-size: 1.3714285714285714em;
font-size: 1.5rem;
}
.paypalCredit .cs-label {
line-height: 1.5em;
}
.paypalCredit .cs-label span.x-small {
font-size: 0.5142857142857143em;
font-size: 0.5625rem;
}
.confirmCard-btn_confirm {
margin-bottom: 20px;
}
}
/* phone portrait */
@media (max-width: 479px) {
.paypalSources .paypalCredit,
.paypalSources .paypalBalance {
padding-left: 0.5em;
padding-right: 0.5em;
}
.paypalSources .paypalFunds .amount {
right: 0.5em;
}
.cards {
padding-bottom: 10px;
}
.cards .thumbnail,
.cards .ghost .card {
width: 145px;
height: 100px;
min-height: 87px;
padding: 0.3em;
}
.cards .thumbnail.banking .cardName {
margin-bottom: -4px;
font-size: 1em;
}
.cards .thumbnail.banking .type {
font-size: 0.85em;
}
.cards .thumbnail.banking .lastDigits {
margin-top: 21%;
}
.cards .thumbnail.banking .noBankType {
margin-top: 40%;
}
.cards .thumbnail .pad ~ .lastDigits {
margin-top: 7%;
}
.cards .thumbnail.creditOrDebit .lastDigits {
padding-top: 49%;
}
.cards .thumbnail > span:not(.ribbon) {
padding: 0.3em;
margin: 0;
font-size: 1em;
}
.fundingSource .addFI.card {
font-size: 0.8571428571428572em;
font-size: 0.9375rem;
line-height: 1.4em;
}
.fundingSource .addFI.card span {
margin-top: 8%;
}
.creditOrDebit .ribbon {
top: 46%;
}
.bankInfo .check {
width: 287px;
height: 7em;
}
.bankInfo .check.onaccountNum:before,
.bankInfo .check.onroutingNum:before {
width: 26%;
border-width: 2px;
bottom: 0.75em;
}
.bankInfo .check.onaccountNum:before {
/* @noflip */
left: 30%;
}
.ebayGiftCards .giftCard span.value {
padding: 0;
font-size: 1.5em;
}
.ebayGiftCards .giftCard.thumbnail:after {
height: 28px;
background-size: 60%;
}
.cards .savedOffer.thumbnail {
width: auto;
}
.savedOffer.thumbnail .merchantLogo:before {
width: 21px;
bottom: 82px;
left: 12px;
top: -3px;
}
.savedOffer.thumbnail span.merchantLogo {
width: 30px;
height: 30px;
padding: 1px;
margin: -0.7em 0 0 0.1em;
}
.savedOffer.thumbnail .multiline-ellipsis {
height: 28px;
overflow: hidden;
line-height: 14px;
}
.savedOffer.thumbnail .multiline-ellipsis:before {
content: "";
width: 5px;
height: 28px;
float: left;
}
.savedOffer.thumbnail .multiline-ellipsis > .text {
width: 100%;
margin-left: -5px;
float: right;
word-wrap: break-word;
}
.savedOffer.thumbnail .multiline-ellipsis:after {
content: "\02026";
width: 18px;
margin-left: -18px;
padding-right: 5px;
float: right;
position: relative;
top: -14px;
left: 100%;
text-align: right;
background: #ffffff;
}
.savedOffer.thumbnail span.merchant {
width: 85%;
padding-top: 0;
}
.savedOffer.thumbnail .ribbon {
top: 35%;
}
.savedOffer.thumbnail span.bottom {
padding: 0;
margin-top: 0.7em;
}
.savedOffer.thumbnail .value {
margin-top: 1.5em;
}
.savedOffer.thumbnail .percent_discount span:first-child {
top: -3px;
}
.savedOffer.thumbnail .percent_discount span:last-child {
right: -1px;
bottom: -3px;
}
.savedOffer.thumbnail .hasCents {
margin-top: 1em;
}
.savedOffer.thumbnail .offerSummary {
padding-left: 0.5em;
font-size: 0.857142857em;
}
.savedOffer.thumbnail .offerSummary:before {
height: 35px;
margin-top: -14px;
}
.savedOffer.thumbnail .offer {
margin-bottom: -10px;
}
.bankInfo .dob .nativeDropdown {
width: 33.3%;
}
form.confirmDeposits .sampleStatement {
width: 18.5em;
height: 8em;
}
form.confirmDeposits .sampleStatement table {
margin-top: 1em;
}
form.confirmDeposits .sampleStatement tr:last-child {
line-height: 1.2em;
}
form.confirmDeposits .sampleStatement p {
margin-top: 2.5em;
}
form.confirmDeposits .sampleStatement p:before {
width: 30px;
margin-left: -2.2em;
top: -1.2em;
}
.span5.balanceNumeral,
.span5.creditNumeral {
width: auto;
float: right;
}
.span7.moduleHeader {
width: auto;
}
/**
* https://jira.paypal.com/jira/browse/PPWLLTEXP-1276
*
* Reducing the font size of the ribbon text to accommodate
* terms in other languages
*/
.ribbonBadge {
font-size: 0.6em;
}
.confirmCard-btn_confirm,
.addCard-btn_confirm {
margin-bottom: 20px;
}
}
/* tablets - portrait */
@media (max-width: 768px) {
.cardSummary .creditOrDebit .lastDigits {
padding-top: 28%;
}
}
/* Smartphones ----------- */
@media (max-width: 479px) {
.creditOrDebit .lastDigits {
text-align: left;
}
}
/* Tablet Portrait ----------- */
@media (max-width: 768px) {
.addFI.btn.hidden-phone {
top: 10px;
right: 10px;
z-index: 1030;
}
}
/* Smartphones ----------- */
@media (max-width: 640px) {
.selectAddType .thumbnails {
margin: 0;
}
.selectAddType .thumbnails li {
width: 100%;
height: auto;
padding: 0;
margin: 0;
}
.selectAddType .thumbnails li.btn {
border: 0;
border-bottom: 1px solid #bec0c2;
background: transparent;
-webkit-box-shadow: none;
box-shadow: none;
border-radius: 0;
}
.selectAddType .thumbnails:last-child li:last-child {
border: 0;
}
.selectAddType a {
padding: 1.2em;
text-align: left;
text-indent: 4em;
}
.selectAddType a:before {
height: 42px;
margin: 0;
top: 7px;
left: 0;
background-size: 70% auto;
}
.selectAddType .addBankCardLink:before {
height: 49px;
top: 4px;
background-position: center -42px;
background-size: 68% auto;
}
.selectAddType .addGiftCard:before {
background-position: center -91px;
}
.selectAddType .addLoyaltyCard:before {
background-position: center -132px;
}
.selectAddType .addOffers:before {
background-position: center -173px;
}
.addCreditCard.initiateConfirm .btns .btn,
.addDebitCard.initiateConfirm .btns .btn {
width: 80%;
margin: 0 0.5em 1em;
}
.addCreditCard .ccNumber input,
.addDebitCard .ccNumber input {
background-position: 85% -492px;
}
.addCreditCard .ccNumber input[data-ctype="visa"],
.addDebitCard .ccNumber input[data-ctype="visa"] {
background-position: 85% -88px;
}
.addCreditCard .ccNumber input[data-ctype="mastercard"],
.addDebitCard .ccNumber input[data-ctype="mastercard"] {
background-position: 85% -195px;
}
.addCreditCard .ccNumber input[data-ctype="amex"],
.addDebitCard .ccNumber input[data-ctype="amex"] {
background-position: 85% -294px;
}
.addCreditCard .ccNumber input[data-ctype="discover"],
.addDebitCard .ccNumber input[data-ctype="discover"] {
background-position: 85% -591px;
}
.addCreditCard .creditCardInput .csc input,
.addDebitCard .creditCardInput .csc input {
width: 63%;
}
.bankInfo .modal-body {
padding-bottom: 100px;
max-height: 100%;
}
.bankInfo .dob {
width: 100%;
margin: 0;
}
.bankInfo .contextualHelp {
width: 10%;
margin-right: 0;
position: absolute;
right: 0;
top: 22px;
z-index: 10;
}
.bankInfo .contextualHelp.GB {
width: 30px;
margin: 0;
position: relative;
top: 0;
}
.bankInfo .bankCountry {
width: 100%;
margin: 0;
}
.addModal .btns {
margin: 0;
}
.addModal .btns .btn {
min-width: 100%;
}
.addNewAddress .btns .btn {
width: 100%;
margin: 0 0 1em;
}
}
@media (max-width: 479px) {
.addBankCard form {
width: 100%;
}
.confirmBank .btn-group {
width: 100%;
}
.confirmBank .btn-group .btn-large {
padding: 9px 0;
font-size: 14px;
}
.addFI .save,
.addAddressModal .save,
.confirmBank .confirm.btn {
width: 55%;
}
.fiDetails .alert,
.addFI .alert,
.addAddressModal .alert {
margin-top: -66px;
}
}