/* Layout This contains the layout properties for your order form, including width, height, margin, padding, position, float, display and text-align. ===============================================================*/ 

/* TOP LEVEL STYLES ===============================================================*/ 

#wrapper { padding: 48px 24px; } #wrapper #content, #wrapper #rightbar { max-width: 500px; margin: 0 auto; } #wrapper #header, #wrapper #footer { max-width: 840px; margin: 0 auto; } #content-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; } #wrapper #rightbar, #wrapper #content { flex: 1; } #wrapper #rightbar { padding-right: 32px; } #wrapper #content { padding-left: 32px; } #companyLogoTopBanner { margin-bottom: 16px; } #wrapper form { display: none; max-width: 840px; margin: 0 auto; } .title { margin-bottom: 8px; } .formTitle { margin-bottom: 24px; } @media only screen and (max-width: 840px) { #wrapper { padding: 24px; } #content-wrapper { flex-direction: column; } #wrapper #rightbar { border: none; margin-bottom: 16px; } #wrapper #rightbar, #wrapper #content, #wrapper #header, #wrapper #footer { width: 100%; } #wrapper #rightbar, #wrapper #content { padding: 0; } #wrapper #content { padding-top: 16px; border-top: 1px solid #f0f0f0; } #wrapper #header, #wrapper #footer { max-width: 500px; } .form-row { flex-direction: column; } } 


/* PRODUCT LIST SUMMARY ===============================================================*/

.product + .product { margin-top: 32px; } .productItem { display: -webkit-box; display: -ms-flexbox; display: flex; } .productDetails, .productPricingOverview { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .productItem { margin-bottom: 8px; } .productDetails { margin-right: 8px; } .productName, .productImage, .productDescription { margin-bottom: 8px; } .productPrices { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; text-align: right; margin-bottom: 8px; } .productQuantity { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .productQuantity .input-field { max-width: 75px; } .productSubTotal { margin-right: 16px; } .productOptions .productOptionsWrapper:not(:last-child) { margin-bottom: 16px; } 

/* ORDER FORM SUMMARY ===============================================================*/

#orderSummaryPromoEntry p {
    font-size: 16px;
    font-weight: bold;
} 

#orderSummaryPromoEntry { display: none; } .orderSummaryPrice { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 8px; } .orderSummaryPrice p { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .orderSummaryTotal { margin: 16px 0; } .orderSummaryPrice span { text-align: right; } .orderSummarySubTotals { padding-bottom: 8px; } 

/* BILLING AND SHIPPING INFO ===============================================================*/

#orderFormBillingEntry .input-field, #orderFormBillingEntry .select-field, #orderFormShippingEntry .input-field, #orderFormShippingEntry .select-field { margin-bottom: 24px; } .cityField, .countryField { -webkit-box-flex: 2; -ms-flex: 2; flex: 2 } 

/* SHIPPING OPTIONS ===============================================================*/



#shippingOptionsContainer .price { padding-right: 4px; } /* PAYMENT PLANS ===============================================================*/

.paymentPlanSummaryHeader, .paymentPlanDetail { margin-bottom: 4px; } .paymentPlanDetail { display: -webkit-box; display: -ms-flexbox; display: flex; } .paymentPlanPaymentDate { width: 120px; } 

/* PAYMENT SELECTION ===============================================================*/ 

.creditCardFormOption { margin-top: 32px; } .payPalFormOption { margin-top: 16px; } .creditCardFormOption .input-field, .creditCardFormOption .select-field { margin-bottom: 24px; } .checkoutLinks .button { border-radius: 20px; } .checkoutLinks .secury-pay { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 16px; color: #b1b1ba; } .checkoutLinks .secury-pay span { padding-left: 8px; } 

/* UPSELLS ===============================================================*/

.upsell { display: -webkit-box; display: -ms-flexbox; display: flex; } .upsellDetails, .upsellPrices { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .upsellTitle { margin-bottom: 8px; } .upsellDetails { margin-right: 8px; } .upsellName, .upsellImage, .upsellDescription { margin-bottom: 8px; } .upsellPrices { text-align: right; } .upsellOriginalPrice { padding-right: 16px; } .upsellButton { margin-top: 16px; }

