#ej-checkout-form { 
	max-width: 500px;
	width: 100%;
	margin: 0 auto;
	position: relative;
}

#add-cc-wrapper {
	position: relative;
	margin-top: 30px;
}

#ej-checkout-form  #form-overlay,
#add-cc-wrapper  #form-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.5);
	text-align: center;
	padding-top: 0;
	display: none;
	z-index: 9999999;
}

#ej-checkout-form  #form-overlay i {
	position: relative;
	top: 30%;
}

#add-cc-wrapper  #form-overlay {
	padding-top: 50px;
}

#ej-checkout-form .email-errors p,
#ej-checkout-form .payment-errors p,
#add-cc-wrapper .email-errors p,
#add-cc-wrapper .payment-errors p {
	margin: 0 0 20px;
	padding: 0;
	font-size: 12px;
	line-height: 16px;
	color: red;
}

#ej-checkout-form .input-wrapper, 
#add-cc-wrapper .input-wrapper {
	margin: 0 0 10px;
}

#ej-checkout-form .bt-field,
#add-cc-wrapper .bt-field {
	max-height: 50px;
	width: 100%;
	padding: 0px 0 0 20px;
	background-color: #fafafa;
	border: 1px solid #cdcdcd;
	margin: 0px 0 10px;
	font-size: 18px;
	font-weight: 700;
}

#ej-checkout-form .bt-field iframe,
#add-cc-wrapper .bt-field iframe {
	height: 50px !important;
}

#ej-checkout-form .input-wrapper label,
#add-cc-wrapper .input-wrapper label {
	color: #AAA;
}

#ej-checkout-form .input-wrapper,
#add-cc-wrapper .input-wrapper {
	position: relative;
}

.piw-label {
	position: absolute;
	top: 10px;
	left: 10px;
	font-size: 19px;
	transition: 100ms;
	color: #A2A2A2 !important;
}

.piw-label.shrunk {
	top: -15px;
	left: 0;
	font-size: 10px;
	transition: 100ms;
}

#ej-checkout-form .input-wrapper input,
#add-cc-wrapper .input-wrapper input,
#ej-checkout-wrapper .checkout-reactivate-btn {
	width: 100%;
	padding: 10px;
	background-color: #fafafa;
	border: 1px solid #cdcdcd;
	margin: 0px 0 10px;
	font-size: 18px;
	font-weight: 700;
	-webkit-appearance: none;
	border-radius: 0;
	text-align: center;
}

#ej-checkout-form .input-wrapper input {
	text-align: left;
}

#ej-checkout-form .input-wrapper input.invalid,
#add-cc-wrapper .input-wrapper input.invalid,
#ej-checkout-form .bt-field.invalid,
#add-cc-wrapper .bt-field.invalid {
	border: 1px solid red;
}

#ej-checkout-form .input-wrapper.half-wrap,
#add-cc-wrapper .input-wrapper.half-wrap {
	width: 45%;
	float: left;
}

#ej-checkout-form .input-wrapper.half-wrap.right,
#add-cc-wrapper .input-wrapper.half-wrap.right {
	float: right;
}

#add-cc-wrapper .input-wrapper.half-wrap {
	width: 32%;
}

#add-cc-wrapper .input-wrapper.half-wrap.ml {
	margin-left: 12px;
}

#ej-checkout-form .input-wrapper input[type="submit"],
#add-cc-wrapper .input-wrapper input[type="submit"],
#ej-checkout-wrapper .checkout-reactivate-btn {
	display: block;
	background-color: #5fab32;
	color: #fff;
	border: 0px;
	border-radius: 0px;
	font-family: "Open Sans";
	font-weight: 700;
	cursor: pointer;
	text-align: center;
}

#paypal-button {
	display: inline-block;
	width: 100%;
	margin: 0 auto 15px;
	height: 36px;
	text-align: center;
	position: relative;
	overflow: hidden;
}

#paypal-button > div {
	height: 35px !important;
}

#paypal-button .zoid-outlet {
	height: 35px !important;
}

#paypal-button .smother {
	display: block;
	height: 100%;
	width: 100%;
	background: rgba(255,255,255,0.75);
	position: absolute;
	z-index: 99999;
	cursor: pointer;
}

#paypal-button .zoid-outlet {
	width: 100% !important;
}

.checkout-hr {
	font-size: 14px;
	line-height: 18px;
	color: #000;
	font-weight: bold;
	border-bottom: 1px solid #000;
	margin: 20px 0 30px;
	text-transform: uppercase;
}

.checkout-hr i {
	float: right;
}

#cc-icon {
	display: inline-block;
	width: 100%;
	height: 35px;
	line-height: 35px;
	border-radius: 2px;
	border: 1px solid #666;
	margin-bottom: 15px;
	text-align: center;
	background: #EEE;
	color: #666;
	font-size: 14px;
}

h2.total {
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	line-height: 22px;
	margin: 0 0 10px;
}

#applepay-button-container {
	height: 35px;
	width: 100%;
	border: 1px solid #000;
	border-radius: 2px;
	margin-bottom: 15px;
	cursor: pointer;
}

#googlepay-button {
	width: 100%;
	height: 35px;
	border: 1px solid #000;
	border-radius: 2px;
	margin-bottom: 15px;
	cursor: pointer;
	overflow: hidden;
	position: relative;
}

#googlepay-button.disabled {
	opacity: 0.25;
}

#googlepay-button > div {
	position: absolute;
	top: -4px;
}

#applepay-button-container.disabled {
	opacity: 0.25;
}

.payment-information-container {
	position: relative;
}

.payment-information-container .payment-information-overlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: rgba(255,255,255,0.8);
	z-index: 999;
}

#plan_select {
	width: 100%;
	-webkit-appearance: none;
	background: #CCC;
	color: #000;
	border-radius: 3px;
	font-size: 16px;
	line-height: 16px;
	padding: 10px;
}

.choose-your-plan-wrapper {
	position: relative;
}

.choose-your-plan-wrapper:before {
	content: "\f078";
	position: absolute;
	top: 10px;
	right: 15px;
	font-family: "FontAwesome";
	font-size: 16px;
	color: #000;
}

.payment-container h4 {
	position: relative;
	text-align: center;
}

.payment-container h4 span {
	display: inline-block;
	padding: 3px 10px;
	background: #FFF;
	position: relative;
	z-index: 3;
	color: #666;
}

.payment-container h4 span.line {
	position: absolute;
	z-index: 2;
	top: 14px;
	left: 0px;
	width: 100%;
	height: 1px;
	background: #999;
	padding: 0;
}

.ej-ccimg {
	position: absolute; 
	top: 15px; 
	left: 10px; 
	width: 40px; 
	height: auto;
}

.ej-cvvimg {
	position: absolute; 
	top: 15px; 
	right: 10px; 
	width: 40px; 
	height: auto;
}

.payment-info-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.75);
	z-index: 999;
}

#price-option {
	-webkit-appearance: none;
	width: 100%;
	height: 30px;
	font-size: 16px;
	line-height: 30px;
	padding: 0 0 0 10px;
	border: 1px solid #999;
	background: #FFF;
	color: #333;
	border-radius: 0px;
}

.price-option-wrapper {
	position: relative;
}

.price-option-wrapper .caret {
	display: block;
	position: absolute;
	width: 20px;
	height: 20px;
	top: 4px;
	right: 10px;
	z-index: 99;
	font-size: 18px;
	text-align: right;
}

.price-option-wrapper .caret i {
	color: #999;
}

/* ADD apple pay button */
@supports (-webkit-appearance: -apple-pay-button) { 
    .apple-pay-button {
        display: block;
        -webkit-appearance: -apple-pay-button;
    }
    .apple-pay-button-black {
        -apple-pay-button-style: black;
    }
    .apple-pay-button-white {
        -apple-pay-button-style: white;
    }
    .apple-pay-button-white-with-line {
        -apple-pay-button-style: white-outline;
    }
}

@supports not (-webkit-appearance: -apple-pay-button) {
    .apple-pay-button {
        display: inline-block;
        background-size: 100% 60%;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        border-radius: 5px;
        padding: 0px;
        box-sizing: border-box;
        min-width: 200px;
        min-height: 32px;
        max-height: 64px;
    }
    .apple-pay-button-black {
        background-image: -webkit-named-image(apple-pay-logo-white);
        background-color: black;
    }
    .apple-pay-button-white {
        background-image: -webkit-named-image(apple-pay-logo-black);
        background-color: white;
    }
    .apple-pay-button-white-with-line {
        background-image: -webkit-named-image(apple-pay-logo-black);
        background-color: white;
        border: .5px solid black;
    } 
}

@media screen and (max-width: 768px){
	.ej-ccimg {
		top: 7px; 
		width: 34px; 
	}
	.ej-cvvimg {
		top: 8px; 
		right: 5px; 
		width: 30px; 
	}
	.piw-input {
		margin-bottom: 7px !important;
	}
}

@media screen and (max-width: 480px){
	#offboarding-views .offboarding-view {
		width: 98%;
		margin: 0 1%;
		left: 0;
		top: 5%;
	}
	#cc-icon,
	#paypal-button {
		margin: 5px 0;
	}
	.checkout-hr {
		margin: 15px 0;
	}
	h2.total {
		text-align: left;
	}
	#ej-checkout-form .input-wrapper label, 
	#add-cc-wrapper .input-wrapper label {
		font-size: 12px;
	}
	#ej-checkout-form .input-wrapper input, 
	#add-cc-wrapper .input-wrapper input {
		padding: 10px 5px;
		margin: 0;
		font-size: 15px;
	}
	#ej-checkout-form .bt-field, 
	#add-cc-wrapper .bt-field {
		padding: 0 0 0 10px;
		margin: 0;
		font-size: 15px;
	}
	#ej-checkout-form .bt-field iframe, 
	#add-cc-wrapper .bt-field iframe {
		height: 30px !important;
	}
	#ej-checkout-wrapper {
		max-width: 90%;
		margin: 0 auto;
	}
	#paypal-button-container {
		width: 100%;
		overflow: hidden;
		margin: 0;
		position: relative;
		height: 40px;
		border-radius: 2px;
		margin-bottom: 5px;
	}
	#applepay-button-container, #googlepay-button {
		margin-bottom: 5px;
	}
}