﻿.clickable-block {
    border: 1px solid transparent;
}
.clickable-block:hover {
    cursor:pointer;
    border: 1px solid #003366;
}
.clickable-text {
    font-weight:bold;
}
.clickable-text:hover {
    cursor:pointer;
    text-decoration: underline;
}
ul.cm-ctrl-list {
    list-style-type: none;
    -webkit-margin-before: 3px;
    -webkit-margin-after: 0px;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 2px;
    -webkit-padding-end: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    margin-left: 0px;
    padding-left: 0px;
}

#checkout-ctl {
    min-width: 435px;
    -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
}
#checkout-wrapper {
    padding: 3px;
}
.cart-header {
    font-size: large;
    padding: 3px;
}
#checkout-wrapper .checkout-info ul.items{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

div.cart-header .quantity,
div.cart-header .total,
div.primary .quantity {
    float: right;
}
div.primary .name {
    font-weight: bold;
}
div.primary {
    padding: 3px;
}
div.secondary span.name {
    margin-left: 15px;
    font-weight: bold;
}
div.agree {
    margin: 30px 15px 30px 15px;
}
li.item {
    margin-top: 8px;
}
li.item:nth-child(2n) {
    background-color:#f0f0f0;
}
.request li.item:hover {
    background-color:#d6e0e7;
    cursor: pointer;
}
#back-button,
div.continue {
    display: inline-block;
}
.continue {
    float: right;
}

#checkout-wrapper div.error .ui-widget-header {
    color: white;
    background-color: red;
    background-image: initial;
}

#buttons span.internal-buttons.no-cart {
    height: 25px;
}

#checkout-wrapper div.error div.error-content,
#checkout-wrapper div.closed div,
#checkout-wrapper div.waiting div,
#checkout-wrapper div.loading div,
#checkout-wrapper div.empty div {
    text-align: center;
    height: 250px;
}

#checkout-wrapper div.empty div,
#checkout-wrapper div.waiting div,
#checkout-wrapper div.loading div {
    color: #d6e0e7;
}

#checkout-wrapper .val-error {
    color: red;
}
#checkout-wrapper .val-error .checkout-control {
    border: 1px solid red;
    padding: 1px;
}
#checkout-wrapper #checkout-group-creditcard .cc-image {
    width:35px;
    height:22px;
    display:inline-block;
    margin-left: 3px;
    position: relative;
    top: 5px;
}

.qtip.checkout-validation-error {
    border-color: red;
    background-color: #FFFFFF;
    color: red;
}

.qtip.checkout.disclaimer {
    width: 400px;
    min-width: 400px;
}
.qtip .qtip-content .secondary .description {
    overflow-y: auto;
    max-height: 50px;
}

#checkout-wrapper #multi-item-warning {
    padding-left:5px;
    padding-right:5px;
    color:red;
    text-align:center;
    background-color:#f0f0f0;
    padding-bottom:8px;
}

#checkout-wrapper[step="0"] i.fa-refresh,
#checkout-wrapper[step="waiting"] i.fa-refresh,
#checkout-wrapper[step="closed"] div.closed i.fa-rocket,
#checkout-wrapper[step="empty"] i.fa-shopping-cart {
    margin-top: 50px;
}

#checkout-wrapper div.cart-footer span.total,
div.cart-info > span.name,
div.cart-info > span.quantity {
    font-size:large;
}
#checkout-wrapper div.cart-footer {
    padding-top: 10px;
}
div.item-content div.name {
    overflow-x: hidden;
    text-overflow: ellipsis;
}
#checkout-wrapper #ccv-help-button,
#checkout-wrapper #payment-ccv-help-button,
#checkout-wrapper .edit-button,
#checkout-wrapper .delete-button,
#checkout-wrapper .confirmed-icon {
    display: inline-block;
    position: relative;
    top: 4px;
    margin-left: 3px;
}

div.checkout-form fieldset {
    position: relative;
    display: block;
    margin: auto;
    width: 400px;
}
#checkout-wrapper div.receipt i.fa-check {
    color:green;
    float:left;
    top:5px;
    position:relative;
    margin-right:3px;
}
#checkout-wrapper div.checkout-info {
    margin-bottom:3px;
}
#checkout-group-creditcard {
    margin-bottom: 25px;
}

#checkout-wrapper .checkout-form.deferral #checkout-group-address,
#checkout-wrapper .checkout-form.deferral #checkout-group-contact,
#checkout-wrapper .checkout-form .ach-info,
#checkout-wrapper .checkout-form .cc-input,
#checkout-wrapper .checkout-form #cc-stored,
#checkout-wrapper .checkout-form #stored-account,
#checkout-wrapper .checkout-form #payment-stored,
#checkout-wrapper .checkout-form.allow-creditcard.show-creditcard .cc-info.use-saved-card .cc-new,
#checkout-wrapper .checkout-form.allow-ach.show-ach .ach-info.use-saved-account #new-account,
#checkout-wrapper .checkout-form .checkout-type,
#buttons span.internal-buttons,
#buttons span.external-buttons,
#checkout-wrapper[step="1"] #back-button,
#checkout-wrapper div.request {
    display: none;
}

#checkout-wrapper .checkout-form.allow-ach .ach-radio,
#checkout-wrapper .checkout-form.allow-ach.show-ach .ach-info,
#checkout-wrapper .checkout-form.allow-ach.show-ach .ach-info.use-saved-account #stored-account,
#checkout-wrapper .checkout-form.allow-creditcard .cc-radio,
#checkout-wrapper .checkout-form.allow-paypal .paypal-radio,
#checkout-wrapper .checkout-form.allow-invoice .invoice-radio,
#checkout-wrapper .checkout-form.allow-check .check-radio,
#checkout-wrapper .checkout-form.allow-no-charge .no-charge-radio,
#checkout-wrapper .checkout-form.allow-creditcard.show-creditcard .cc-input .cc-save,
#buttons.internal span.internal-buttons,
#buttons.external span.external-buttons,
#checkout-wrapper[step="1"] div.request,
#checkout-wrapper[step="2"] div.request {
    display:block;
}

#checkout-wrapper .checkout-form.allow-creditcard.show-creditcard .cc-info.use-saved-card #cc-stored,
#checkout-wrapper .checkout-form.allow-creditcard.show-creditcard .cc-info.use-saved-card #payment-stored,
#checkout-wrapper .checkout-form.allow-creditcard.show-creditcard .cc-input {
    display:inline-block;
}

#checkout-wrapper div.ach-confirmation,
#checkout-wrapper div.ach-profile,
#checkout-wrapper div.empty,
#checkout-wrapper div.closed,
#checkout-wrapper div.waiting,
#checkout-wrapper div.loading,
#checkout-wrapper div.cart-header .quantity,
#checkout-wrapper div.cart-header .total,
#checkout-wrapper div.cart-info,
#checkout-wrapper div.checkout-info,
#checkout-wrapper div.autopay,
#checkout-wrapper div.receipt,
#checkout-wrapper div.error {
    -webkit-transition: opacity 1s ease;
    -moz-transition: opacity 1s ease;
    -ms-transition: opacity 1s ease;
    -o-transition: opacity 1s ease;
    transition: opacity 1s ease;
    opacity: 0; 
    height: 0;
    overflow: hidden;
}
#checkout-wrapper[step="closed"] div.closed,
#checkout-wrapper[step="empty"] div.empty,
#checkout-wrapper[step="ach"] div.ach-confirmation,
#checkout-wrapper[step="profile"] div.ach-profile,
#checkout-wrapper[step="autopay"] div.autopay,
#checkout-wrapper[step="waiting"] div.waiting,
#checkout-wrapper[step="0"] div.loading,
#checkout-wrapper[step="1"] div.cart-header .quantity,
#checkout-wrapper[step="1"] div.cart-info,
#checkout-wrapper[step="2"] div.cart-header .total,
#checkout-wrapper[step="2"] div.checkout-info,
#checkout-wrapper[step="3"] div.receipt,
#checkout-wrapper[step="4"] div.error {
    opacity: 1;
    height: auto;
    overflow:visible;                
}

#checkout-wrapper[step="1"] .continue,
#checkout-wrapper[step="3"] .continue ,
#checkout-wrapper[step="profile"] .continue,
#checkout-wrapper[step="empty"] .continue {
    position: relative;
    top: -28px;
}

#checkout-wrapper .checkout-group {
    margin-right: 2px;
    display: inline-block;
}
#checkout-cardnumber input,
#checkout-stored-card select,
#checkout-stored-payment select,
#checkout-stored-ach select {width:340px; min-width: 340px;}
#payment-cvv2 input,
#checkout-cvv2 input {width:40px; min-width:40px;}
#checkout-expmonth select {width: 55px;}
#checkout-expyear select {width: 70px;}
#checkout-firstname input {width: 150px;}
#checkout-lastname input {width: 218px;}
#checkout-street input,
#checkout-bank-account-number input,
#checkout-bank-routing-number input,
#checkout-bank-account-name input,
#checkout-bank-name input,
#checkout-companyname input {width: 390px;}
#checkout-city input {width: 215px;}
#checkout-state input {width: 80px;}
#checkout-zip input {width: 84px;}
#checkout-country select {width: 150px;}
#checkout-phone input {width: 150px;}
#checkout-email input {width: 232px;}
#checkout-group-creditcard .cc-info {width: 100%}
#checkout-expiration {display:block;}
#checkout-expmonth span,
#checkout-expyear span {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}
.checkout-namesep {
    display:none;
    margin:auto; 
    text-align:center;
}
#checkout-save-card,
#payment-save-card,
.checkout-autopay {
    position: relative;
    top: 10px;
}
#checkout-save-card input,
#payment-save-card input,
.checkout-autopay input {
    position: relative;
    top: 2px;
}
#checkout-save-card span,
#payment-save-card span,
.checkout-autopay span {
    padding-left: 3px;
}
.checkout-autopay div.note,
.use-saved-account label.note {
    font-style: italic;
    padding-bottom: 3px;
    font-weight: normal;
}
.checkout-type > span {
    margin-left:3px;
}

label.required > span:before {
    content:'*'
}
#checkout-agreement {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    width:400px;
    font-size:10px;
}
#disclaimer-content a,
#agreement-content a {
    text-decoration: underline !important;
}

#checkout-wrapper .receipt-footer .cc-purchase-info {
     margin-left: 35px;
    margin-top: 15px;
}

#checkout-ctl .en-IE #checkout-city,
#checkout-ctl .en-IE #checkout-state,
#checkout-ctl .en-IE #checkout-zip {
    display: block;
}

#checkout-ctl .en-IE #checkout-city input,
#checkout-ctl .en-IE #checkout-state input,
#checkout-ctl .en-IE #checkout-zip input {
    width: 390px;
}
#checkout-wrapper .ach-confirm-label {
    font-weight: bold;
    font-size: 15px;
}
.ach-confirm-content > div {
    margin: 10px;
}
/* New Stripe Intent Support*/
.StripeElement {
    margin-top: 20px;
}
#stripe-payment-element {
    width: 400px;
}
#verified-msg {
    font-style: italic;
}
