@media only screen and (max-device-width:46.875rem) { #Woodbrass input, select, textarea { height:2rem;} }

/*.checkout { border-bottom:1px solid #cccccc; }*/
input, select, textarea { height:auto;width:100%;border:1px solid #ccc;padding:10px 15px;background:#fff;outline:none;box-shadow:none; }

/* Form
======================================== */
.login input:not([type='hidden']), .shipping-method input, .fast-account input:not([type='hidden']), .go-create input:not([type='hidden']), .fast-account select, .commentaire textarea { width:100%;border:1px solid #ccc;padding:10px 15px;background:#fff;outline:none;box-shadow:none; }
@media only screen and (max-device-width:46.875rem) { .login input:not([type='hidden']), .shipping-method input, .fast-account input:not([type='hidden']), .go-create input:not([type='hidden']), .fast-account select, .commentaire textarea { padding:5px 7px;} }
.required-field { border-right:2px solid #0066cc !important;}
.required-label { border-left: 4px solid #0066cc; padding-left: 15px; font-size: 12px;}

/* Checkout StepLine
======================================== */
.checkout-stepline { border-bottom:1px solid #cccccc;box-shadow: -16px 7px 12px -6px #cccccc; }
.checkout-stepline > div, .checkout-stepline > div a { flex-flow:column;color:#666666;align-items:center; }
.checkout-stepline .step .material-icons { display:none; }
.checkout-stepline .step { background:#fff;border:1px solid #666666;display:-webkit-flex;display:-webkit-box;-webkit-align-items:center;display:flex;align-items:center;-webkit-justify-content:center;justify-content:center;width:30px;height:30px; }
.checkout-stepline > div:not(:first-child) .step:before { position:absolute;content:"";background:#666666;top:15px;height:1px;left:calc( -50% + 28px / 2 );right:calc( 50% + 32px / 2 ); }
.checkout-stepline .check .step { border:1px solid #0066cc;color:#0066cc; }
.checkout-stepline .check .step + div { color:#0066cc; }
.checkout-stepline .check:not(:first-child) .step:before { background:#0066cc; }
.checkout-stepline .check:not(.active) .step span { display:none; }
.checkout-stepline .check:not(.active) .step .material-icons { display:block; }
.checkout-stepline .active .step { background:#0066cc;color:#ffffff; }


/* Checkout Login
======================================== */
.fast-account select::-ms-expand { display:none; }
.fast-account select:not(.dobfield) { -webkit-appearance:none;-moz-appearance:none;border-radius:0;background:url(/images/v4/elements/fleche_bas_checkout.jpg) center right 10px no-repeat;background-size:30px 30px; }
.fast-account select.dobfield{ -webkit-appearance:none;-moz-appearance:none;border-radius:0;padding:10px 0;}

.login label, .fast-account label, .go-create label, .commentaire label, .shipping-method .other-cp { position:relative; }
@media screen and (min-device-width: 64.001rem) {
.login input:not([type='hidden'])+.active-input, .shipping-method .other-cp .active-input, .fast-account input:not([type='hidden'])+.active-input, .go-create input:not([type='hidden'])+.active-input, .fast-account select+.active-input, .commentaire textarea+.active-input { position:absolute;left:0;bottom:0;height:2px;right:calc(100%);background:#000;transition:right .25s linear, height .25s linear; }
}
@media screen and (max-device-width: 46.875rem) {
.login input:not([type='hidden'])+.active-input, .shipping-method .other-cp .active-input, .fast-account input:not([type='hidden'])+.active-input, .go-create input:not([type='hidden'])+.active-input, .fast-account select+.active-input, .commentaire textarea+.active-input { position:absolute;left:0;bottom:0;height:2px;right:calc(100%);color:red!important;background:none!important;transition:right .25s linear, height .25s linear; }
}
.login input:not([type='hidden']):focus+.active-input, .shipping-method .other-cp input:focus+.active-input, .fast-account input:not([type='hidden']):focus+.active-input, .go-create input:not([type='hidden']):focus+.active-input, .fast-account select:focus+.active-input, .commentaire textarea:focus+.active-input { right:0;white-space:nowrap; }
.login input:not([type='hidden'])+.active-input.invalid, .fast-account input:not([type='hidden'])+.active-input.invalid, .go-create input:not([type='hidden'])+.active-input.invalid, .fast-account select+.active-input.invalid { display:flex;position:absolute;left:0;color:#cc0000;margin-top:7px;height:auto;bottom:inherit;right:0;white-space: pre-wrap;background: #fff;border: 1px solid #cecece;padding: 2px; }
.shipping-method .other-cp { flex-basis:55%; }
.shipping-method .other-cp input:focus+.active-input { left:0;right:0; }
.shipping-method .active-input.invalid { display:flex;margin:-10px -10px 10px -10px;padding:10px;position:absolute;left:0;right:0; }
.shipping-method.close:not(.paypal-close){width:0;height:0;padding:0;}
.commentaire textarea { resize:none;margin:0; }
.commentaire textarea+.active-input { left:0;right:100%; }
.commentaire textarea:focus+.active-input { right:.1625rem; }
@media screen and (-webkit-min-device-pixel-ratio:0) { 
	.commentaire textarea { resize:none;margin:0 0 -4px 0; } 
	.commentaire textarea:focus+.active-input { right:0; }
}

/*.fast-account { max-height:calc( 85vh - 40px );overflow-y:auto; }*/
.fast-account input[type="checkbox"] { display: none; }
.fast-account input[type="checkbox"] + label {display: block;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none; }
.fast-account input[type="checkbox"] + label:before { content:'';display:block;width:1.25rem;height:1.25rem;border:1px solid #000;position:absolute;left:.3125rem;top:50%;transform:translateY( -50% );-webkit-transition:all .12s, border-color .08s;transition:all .12s, border-color .08s; }
.fast-account input[type="checkbox"]:checked + label:before { width:.625rem;top:calc( 50% - .625rem );left:.625rem;border-radius:0;border-top-color:transparent;border-left-color:transparent;-webkit-transform:rotate( 45deg );transform:rotate( 45deg ); }
.fast-account .dob input+.active-input { left:0;right:100%; }
.fast-account .dob input:focus+.active-input { right:0; }

/* Checkout Tunnel
======================================== */
.tunnel-wrapper{flex-wrap:wrap;}
.tunnel-index{position: absolute;width: 30px;height: 30px;border-radius:50%;background-color:black;color: white;left: -10%;text-align: center;font-weight: bold;display: flex;justify-content:center;align-items: center;}
.tunnel:before{content: '';width: 1px;height: 100%;position: absolute;background-color:#cccccc;left: calc(-10% + 15px);}
.tunnel{position:relative;}

/* Checkout Shipping
======================================== */
.shipping-item {margin:20px 0px;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; min-height:80px; border: 1px solid #cccccc; background-color:white;}
.shipping-item__container {display:flex; align-items:center; justify-content:space-between;}
.shipping-item.active-item{ border:2px solid #0066cc;}
.shipping-item #phone_zone{margin:0px 20px 20px 20px;}
.shipping-item .wb-choice { display:flex;flex-direction:column;align-items:center;justify-content:center;-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute;top:-1px;right:100%;bottom:-1px;left:-16px;background:#0066cc;color:#ffffff;visibility:visible;-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl;transform:rotate(180deg);font-weight:bold;font-size:10px;line-height:36px; }
.shipping-item img{max-height:30px;}
.edit-addr { display:flex;align-items:flex-end;justify-content:space-between;flex-flow:column nowrap; }
.error-addr .faded-btn { background:transparent;color:#fff;border:1px solid #fff; }
.error-addr .faded-btn:hover { background:#fff;color:#cc0000;border:1px solid #fff; }
.error-addr .address { border-top:none; }
.listAddr .addr { border:1px solid #ccc; }
.shop-recap .address{border : 2px solid lightgray;}
.formAddr-popup-btn {text-decoration:underline; cursor: pointer;}


.shipping input[type="radio"], .listAddr input[type="radio"] { display:none; }
.shipping .shipping-item > input[type="radio"] + label, .listAddr input[type="radio"] + label { position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;padding:1.25rem 1.25rem 1.25rem 3.75rem; }
.shipping input[type="radio"]:not([name^="shipping-method"]) + label:before, .listAddr input[type="radio"] + label:before { content:'';display:block;width:20px;height:20px;border-radius:50%;border:1px solid #000;position:absolute;left:20px;top:50%;transform:translateY( -50% );}

.shipping input[type="radio"]:checked:not([name^="shipping-method"]) + label:after {
    content: '';
    display: block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #0066cc;
    position: absolute;
    left: 22.5px;
    top: 50%;
    transform: translateY(-50%);
}

.listAddr input[type="radio"]:checked + label:after {
    content: '';
    display: block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    position: absolute;
    left: 22.5px;
    top: 50%;
    transform: translateY(-50%);
}
.shipping input[type="radio"]:checked .shipping-item { border: 1px solid #0066cc;}

.fancybox-wrap .loader-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    backdrop-filter: blur(2px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.fancybox-wrap .loader-overlay.active {
    visibility: visible;
    opacity: 1;
}

input[name=shipping]:checked ~ .shipping-method { max-height:5000px;padding:.625rem!important;border-top:1px solid #ccc;transition:none; }
@media screen and (-webkit-min-device-pixel-ratio:0) { input[name=shipping]:checked ~ .shipping-method { border-top:none; } }
.shipping-method{transition: all .2s ease-in-out; opacity:1; height: auto;}
.shipping-method-hide{opacity:0; height:0px;}
.shipping-method .method-item {border: 2px solid transparent;}
.shipping-method .method-item.active {border: 2px solid #0066cc;}
.shipping-method, input[name=shipping]:checked ~ .shipping-method.close { border-top:none;overflow:hidden;transition:none; }
.shipping .shipping-method .ennonce { padding:.625rem; }
.shipping .shipping-method input[type="radio"] + label { padding:.625rem .625rem .625rem 3.075rem; }
.shipping .shipping-method input[name="shipping-method"] + label {padding:0px;}
.shipping .shipping-method input[type="radio"] + label > div { width:100%; }
.shipping .shipping-method input[type="radio"] + label:before { left:.625rem; }
.shipping .shipping-method input[type="radio"]:checked + label:before { left:.9375rem; }
.shipping .shipping-method input[type="radio"]:checked + label:after {left: 1.09rem;}
.shipping .shipping-method input[type="radio"]:checked + label + div .faded-btn { display:block; }

.bubble { border-left:1px solid #b3b3b3;position:absolute;background:#fff;z-index:1; }
.bubble .content { display:flex;flex-flow:column;align-items:center;justify-content:flex-start;width:100%;height:100%;overflow-y:auto; }
.bubble .content #maps { width:calc( 100% - 30px );height:inherit;margin:20px 15px 15px 15px; }
.bubble .content > * { width:100%; }
.bubble .arrow { width:15px;height:15px;display:inline-block;border:1px solid #b3b3b3;position:absolute;transform:rotate(45deg);left:-8.5px;background:#fff;border-top:none;border-right:none; }

.bubble .content ul { padding:0;list-style:none; }
.bubble .content ul .sday { width:80px; }

.bubble.centered { position:fixed;top:50%;left:50%;transform:translate(-50%, calc(-50% + 0.5px));z-index:11;max-width:85vW;max-height:85vh;overflow-y:auto; }
.bubble.centered .close:after { font-size:18px;position:absolute;margin-left:10px; }


/* Checkout Payment
======================================== */
.payment-disable, .livraison-disable, .demat-disable{ opacity:30%;pointer-events:none;}
.payment>div{margin:20px 0;box-shadow: rgba(149, 157, 165, 0.2) 0 8px 24px;background-color:white; min-height:80px;}
.shipping>div{margin:20px 0;box-shadow: rgba(149, 157, 165, 0.2) 0 8px 24px;background-color:white; min-height:80px;}
.form-payment img{max-height:20px;}

#almaPay ~ div img {margin: 10px 0;}

.backToShipping, .backToAddress{border: 1px solid black;padding: 3px 20px;border-radius: 30px;position: absolute;left: -70px;top: -50px;background-color: white;cursor:pointer;}
.tunnel-paiement.payment-disable .backToShipping{display: none;}
.tunnel-livraison.livraison-disable .backToAddress{display: none;}

@media only screen and (max-width: 61.63rem) { .payment { border:none!important;} }

.payment input[type="radio"], .payment input[type="checkbox"], .cgv input[type="checkbox"] { display:none; }
.payment input[type="radio"] + label, .payment input[type="checkbox"] + label, .cgv input[type="checkbox"] + label { position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;padding:1.25rem 1.25rem 1.25rem 3.75rem; }
.payment input[type="radio"] + label:before, .payment input[type="checkbox"] + label:before, .cgv input[type="checkbox"] + label:before { content:'';display:block;width:1.25rem;height:1.25rem;border-radius:50%;border:1px solid #000;position:absolute;left:1.25rem;top:50%;transform:translateY( -50% );-webkit-transition:all .12s, border-color .08s;transition:all .12s, border-color .08s; }
.payment input[type="radio"]:checked + label:after, .payment input[type="checkbox"]:checked + label:after, .cgv input[type="checkbox"]:checked + label:after { content:'';display:block;width:.9rem;height:.9rem;border-radius:50%;background:#0066cc;position: absolute;left:1.45rem;top:50%;transform:translateY( -50% ); }
.payment input[type="radio"]:not(:checked) + label.partial:after{
    content:'+';font-size:24px;display:flex;align-items:center;width:.9rem;height:.9rem;position: absolute;left:1.45rem;
    @media only screen and (max-device-width: 46.875rem) {
        left:15px;
    }
}

@media only screen and (max-width: 61.63rem) { .payment > div.row { border:1px solid #ccc;}  }
.payment .payment-desc { padding:0!important;max-height:0;overflow:hidden;transition:max-height 0s linear; }
.payment input[type=radio]:checked ~ .payment-desc { ;padding:.625rem!important;border-top:1px solid #ccc;max-height:5000px;transition:max-height 1s linear; }

.shipping-item input:not([type='hidden']) ~ .active-input, .payment input:not([type='hidden']) ~ .active-input, .cgv input:not([type='hidden']) ~ .active-input { z-index:-1;position:absolute;top:0;left:0;bottom:0;right:100%;transition:right .25s linear; }
.active-input.invalid { z-index:1!important;color:#fff;right:0;background:#cc0000;white-space:nowrap; }

.cgv input:not([type='hidden']) ~ .active-input.invalid { z-index:1!important;color:#fff;right:0;background:#cc0000;white-space:nowrap;bottom:auto;padding:10px 0;top:-20px; }

.form-paye { display:none; }

.shop-recap .televendeur, .shop-recap .redeem { flex:1 1 auto; }
.shop-recap .televendeur label, .shop-recap .redeem label { display:flex;align-items:stretch;flex-flow:wrap; }
.shop-recap .televendeur label .active-input, .shop-recap .redeem label .active-input { position:absolute;left:.3125rem;bottom:0;height:2px;right:calc(100% - .3125rem);background:#000;transition:right .25s linear, height .25s linear; }
.shop-recap .televendeur label input:focus ~ .active-input, .shop-recap .redeem label input:focus ~ .active-input { right:.3125rem;white-space:nowrap; }
.shop-recap .televendeur label input ~ .active-input.invalid, .shop-recap .redeem label input ~ .active-input.invalid { color:#fff;height:auto;padding:11px 15px;bottom:0;right:.3125rem;background:#cc0000;white-space:nowrap; }
.shop-recap .televendeur label input ~ .active-input.valid { bottom:0;height:2px;right:.3125rem;background:#00cc66;white-space:nowrap; }
.shop-recap .televendeur label div, .shop-recap .redeem label div { flex:1 1 100%; }
.shop-recap .televendeur label input, .shop-recap .redeem label input { flex:1 1 auto;border:1px solid #e2e2e2;padding:10px 15px;background:#fff;outline:none;box-shadow:none; }
.shop-recap .televendeur label button, .shop-recap .redeem label button { border:none;flex:0 0 auto; padding:0 .8rem;align-items: center; }
.shop-recap .shop-content {max-height:350px; overflow: scroll;}
.sub-total { border-top:1px solid #ccc; }

.shop-total-detail.bb { border-top:1px solid #ccc; }

.recap-panier{z-index:2;}
.recap-panier .shop-recap-toggle.active{background-color:white;color:black;border:3px solid black;}
.recap-panier .shop-recap-toggle{ color: white;background-color:#0066CC;cursor:pointer;}
.recap-panier{position:sticky;height: fit-content;position: -webkit-sticky;top:150px;background-color:white;}
.recap-panier .btnAjouterCheckout {display: none;}

/* Recap Cart - checkout
======================================== */
#redeemcode-open{
    font-size: 15px;
    text-decoration: underline;
    cursor: pointer;
}

/* Popup Info Shiooing - Payment
======================================== */
#content h2 { text-transform:uppercase;margin:0 0 40px 0; }

/* Checkout Success
======================================== */
.checkout-success-products:nth-child(even) {
	background: #f2f2f2;
}
.checkout-vertical-align {
	display: table;
	height: 100%;
}
.checkout-vertical-align > div {
	display: table-cell;
	vertical-align: middle;
}
.checkout-success-redeem { margin-top:0.625rem; }
.checkout-success-redeem + .checkout-success-redeem { margin-top:0; }


/* WithdrawalConsent */
.WithdrawalConsent{border: 2px solid #cc0000;background-color:#e4e8ed!important;}

form[name=WithdrawalConsent__Form] input[type="checkbox"] + label:before {
    border: 1px solid #000;
    content: '';
    width: 1rem;
    height: 1rem;
    margin-left: 10px;
 }

form[name=WithdrawalConsent__Form] input[type="checkbox"]:checked + label:before {
    /*border:none;*/
    top: calc(50% - 1rem);
    border-radius: 0;
    border-top-color: transparent;
    border-left-color: transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.WithdrawalConsent {
    border: 2px solid #cc0000;
}

.WithdrawalConsent.active {
    border: 2px solid #00cc66;
}

@media only screen and (max-device-width: 46.875rem){
    form[name=WithdrawalConsent__Form] input[type="checkbox"] + label:before {
        margin-left: -10px;
        position: absolute;
        top: calc(50% - 1rem);
        transition: all .12s, border-color .08s;
    }

    form[name=WithdrawalConsent__Form] input[type="checkbox"]:checked + label:before {
        top: calc(50% - 1rem);
        left: 1rem;
        border-radius: 0;
        border-top-color: transparent;
        border-left-color: transparent;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        transition: all .12s, border-color .08s;
    }
}
/* Responsive v4
======================================== */

@media only screen and (max-device-width: 46.875rem) {

    .checkout-stepline .check:not(.active) .step .material-icons { font-size: 2rem; }
    .checkout-stepline > div:not(:first-child) .step:before {
        top:16px!important;
        left: calc( -30% + 12px / 2 );
        right: calc( 70% + 12px / 2 );
        background: #c7c7c7;
    }

    .fast-account select { height:32px; }
    .fast-account input[type="checkbox"]:checked + label:before { width:2.2rem;top:calc( 50% - 2.5rem );left:2.2rem; }
    .fast-account input[type="checkbox"] + label:before { width:4rem;height:4rem; }

    .listAddr .addr { border:none; }
    .shipping-item { border:none; }
    .edit-addr { display:block;}

    .shipping-item #phone_zone{margin:0px 10px 10px 10px;}
    .shipping-item .shipping-method{max-height:0px}
    .shipping-item.active-item .shipping-method{max-height:initial;}
    .shipping-item .wb-choice { top:-14px;right:initial;bottom:initial;left:-2px;padding-left:15px;padding-right:15px;-webkit-writing-mode:horizontal-tb;writing-mode:horizontal-tb;transform:rotate(0deg);font-size:8px;font-weight:bold;line-height:14px; }
    .shipping input[type="radio"] + label, .listAddr input[type="radio"] + label { position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;padding:.5rem .5rem .5rem 3rem; }
    .shipping input[type="radio"]:not([name^="shipping-method"]) + label:before, .listAddr input[type="radio"] + label:before { width:16px;height:16px; left:14px;}
    .shipping input[type="radio"]:checked:not([name^="shipping-method"]) + label:after, .listAddr input[type="radio"]:checked + label:after { width:12px;height:12px;left:16px;}
    .shipping .shipping-method input[type="radio"]:checked + label:before { left:2.5rem; width:40px;height: 70px; }
    .shipping-retrait{display: flex;align-items: center;}

    .shipping .shipping-method input[type="radio"] + label:before { height:90px; width:90px; }

    .backToShipping, .backToAddress{left:0;}
    .payment input[type="radio"] + label, .payment input[type="checkbox"] + label, .cgv input[type="checkbox"] + label {padding:.5rem .5rem .5rem 3rem; }
    .payment input[type="radio"] + label:before, .payment input[type="checkbox"] + label:before, .cgv input[type="checkbox"] + label:before { width:16px;height:16px; left:14px;}
    .payment input[type="radio"]:checked + label:after, .payment input[type="checkbox"]:checked + label:after, .cgv input[type="checkbox"]:checked + label:after { width:12px;height:12px;left:16px;}
    .pymt-image{ flex-direction: column; flex-wrap: wrap;max-height: 80px;justify-content: center;align-self:center;}

    .recap-panier {bottom:x;top:unset;}
    .lftb { border-left: 2px solid #21b414; }
    .rgtb { border-right: 2px solid #21b414; }
    .close-bubble { font-size: 1.5rem!important;height:1.5rem!important;width:1.5rem!important; }
    .close { right: 15px!important; }
    .close:not(.paypal-close){top:30px;}
    #redeemcode-close{top:10px;}

    .bdLeft { border-left: 2px solid #21b414;  }
    .bdRight {  border-right: 2px solid #21b414; }
    #maps { height: 400px; }
    .tooltip-sm { width:100%; list-style:none; }
    .tooltip-payment-sm:empty { display:none!important; }
    .tooltip-retrait-sm, .tooltip-payment-sm { position: fixed; top: 0; right:0; width: 45rem!important; height: 100vh; background: #fff; z-index: 11; }
    .tooltip-retrait-sm:empty {margin-right: -45rem;}

    .btnAjouterCheckout, .shop-recap .btnAjouterCheckout {border: 1px solid #00cc66;}
    .shop-recap .btnAjouterCheckout[disabled] {border-color: #e0e0e0;}
}

.address.delivery.retrait, #fancy-popup, #fancy-popup-btn{display: none;}
.fancybox-skin{border-radius: 0;}
span.info{    display: flex;
    border: 1px solid #999;
    color: #999;
    font-size: 16px;
    max-width: 20px;
    max-height: 20px;
    min-width: 20px;
    min-height: 20px;
    border-radius: 20px;
    flex: 1;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.no-select-error{display: none;}

button[disabled], button[disabled]:hover{background: #E0E0E0;}

@media only screen and (min-device-width:46.876rem) {
    .hipay-field-container { border:1px solid #E2E2E2;margin: 0;}
    .hipay-form-row:not(:first-child){ margin:0;}
    .hipay-form-row:not(:first-child) .hipay-field-container{ padding: 10px 20px;}
    .hipay-field { margin-bottom: 0;bottom:5px;left:20px; width:calc(100% - 40px);}
    .hipay-field-label{ bottom : 17px;left:20px;}
    .HiPayField--focused+.hipay-field-label, .hipay-field:not(.HiPayField--empty)+.hipay-field-label{
        -webkit-transform:scale(.85) translateY(-10px);
        -ms-transform:scale(.85) translateY(-10px);
        transform: scale(.85) translateY(-10px)
    }
    .hipay-form-row:not(:first-child) .hipay-field-container .hipay-field, .hipay-form-row:not(:first-child) .hipay-field-container .hipay-field-label { left: 60px; width:calc(100% - 80px);}
    .hipay-field-container img{ max-height: 100%;width: auto;}
	.hipay-secure-label img {max-height: 40px;width: auto;}
}
@media only screen and (max-device-width:46.875rem) {
    .hipay-form-container{max-width:100%;padding-right:5px;}
    .hipay-field-container{height: 40px;align-items: center;border: 1px solid;margin: 0 5px;}
    .hipay-field {margin-bottom: 2px;}
    .hipay-field.HiPayField--empty + .hipay-field-label{bottom: auto;}
    .HiPayField--focused+.hipay-field-label, .hipay-field:not(.HiPayField--empty)+.hipay-field-label{
        -webkit-transform:scale(.75) translateY(-15px);
        -ms-transform:scale(.75) translateY(-15px);
        transform: scale(.75) translateY(-15px);
    }
    .hipay-form-row { margin-bottom: 8px; }
    .hipay-form-row:not(:first-child) .hipay-field-container .hipay-field,
    .hipay-form-row:not(:first-child) .hipay-field-container .hipay-field-label { left: 35px; width:calc(100% - 30px);}

    .hipay-form-row:first-child .hipay-field-container .hipay-field,
    .hipay-form-row:first-child .hipay-field-container .hipay-field-label { left: 20px; width:calc(100% - 20px);}

    #hipay-error-message{
        flex-direction: row;
        align-items: flex-start;
    }
    #hipay-error-message ul{ margin: 0;margin-top: auto;text-align: left;}

    .hipay-field-container img{ max-height: 75%;width: auto;}
    .hipay-secure-label img {max-height: 20px;width: auto;}
}
#hipay-error-message{color : #F7585F;text-align: center;}
#hipay-error-message img{max-width: 50%;}
#hipay-error-message ul { flex-direction: column;}
.hipay-field-baseline, .hipay-field-error { display: none;}

#screen_hipay{
    display: none;
    top: 0;
    left: 0;
    z-index: 99;
    background: #fff;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

#screen_hipay .logo img{display:none;}

#screen_hipay button{
    background: #000000;
    color: #fff;
    width: 250px;
    height: 42px;
    margin-top: 5rem;
}

.spin {
    -webkit-animation-name: spin;
    -webkit-animation-duration: 4000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;

    -moz-animation-name: spin;
    -moz-animation-duration: 4000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;

    -ms-animation-name: spin;
    -ms-animation-duration: 4000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;

    animation-name: spin;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
    @-ms-keyframes spin {
        from {
            -ms-transform: rotate(0deg);
        } to {
              -ms-transform: rotate(360deg);
          }
    }
    @-moz-keyframes spin {
        from {
            -moz-transform: rotate(0deg);
        } to {
              -moz-transform: rotate(360deg);
          }
    }
    @-webkit-keyframes spin {
        from {
            -webkit-transform: rotate(0deg);
        } to {
              -webkit-transform: rotate(360deg);
          }
    }
    @keyframes spin {
        from {
            transform: rotate(0deg);
        } to {
              transform: rotate(360deg);
          }
    }

#phone_zone{
    color:var(--color--white);
    &.missing{
        background: var(--color-blue-wb);
    }
    &.invalid{
        background: #CC1900;
    }
    &.valid{
        background: #00D058;
    }
    & .input{
        position: relative;
        flex-flow: nowrap;
        overflow-x: clip;
        & input{
            border: 1px solid #ccc;
            border-left:0 solid;
        }
    }

}
.number_zone{margin: auto;}
.shipping_nbr {border-radius: 30px; position: absolute;right: 0;}

.ctrl_recaptcha{
    &:not(.loaded){
        display: none;
    }
}
#payment_method_form{

    & input::placeholder{
        text-transform: uppercase;
        color: var(--color-gray-solid);
    }

    & input.pymt-input:not(:checked) ~ .pymt-multi-choice{
        display: none;
    }

    & .pymt-multi-choice {
        border-top : 1px solid #CCC;

        & .pymt-choice {
            margin-left: -10px;
            gap: 10px;
            & .btn_choice {
                span {
                    cursor: pointer;
                    position: relative;
                    border-radius: 253px;
                    border: 1px solid #DDD;
                    background: #FFF;
                    color: #000;
                    font-feature-settings: 'clig' off, 'liga' off;
                    font-family: "Open Sans", serif;
                    font-size: 13px;
                    font-style: normal;
                    font-weight: 700;
                    line-height: normal;
                }

                input:checked + span {
                    border: 1px solid #DCDCDC;
                    background: #06C;
                    color: #FFF;
                }
            }
        }

        & form {
            & label {
                & input {
                    border-radius: 4px;
                    &[type="number"]::-webkit-inner-spin-button,
                    &[type="number"]::-webkit-outer-spin-button {
                        -webkit-appearance: none;
                        margin: 0;
                    }
                }
                & span:first-child {
                    position: absolute;
                    margin-top: -20px;
                }
                & span.active-input {
                    position: absolute;
                    top:calc(100% - 5px);
                }
            }
            & .pymt-description {
                white-space: pre-line;
            }

            & .btnAjouter {
                border-radius: 4px;
                background: #000;
                color: #FFF;
                font-family: "Open Sans", serif;
                font-size: 14px;
                font-style: normal;
                font-weight: 700;
                line-height: normal;
                &:disabled{
                    background: var(--color-gray-light);
                    color: var(--color-gray-medium);
                }
            }

        }

    }

    & .pymt-multi-recap {
        border-top: 1px solid #CCC;
        & .pymt-multi-recap__icon { grid-area: pymt-multi-recap__icon;}
        & .pymt-multi-recap__label { grid-area: pymt-multi-recap__label;}
        & .pymt-multi-recap__amount { grid-area: pymt-multi-recap__amount;}
        & .pymt-multi-recap__delete {
            grid-area: pymt-multi-recap__delete;
            & button{
                cursor: pointer;
            }
        }
        display: grid;
        grid-template-rows: auto;
        grid-template-columns: 1fr 10fr 1fr auto;
        grid-template-areas:
        'pymt-multi-recap__icon pymt-multi-recap__label pymt-multi-recap__amount pymt-multi-recap__delete'
        ;
        align-items: center;
    }

    & .pymt-multi-left2pay{
        border-top: 1px dotted #CCC;
    }

    & .pymt-multi-form {
        position: relative;

        & .fadeOut-display{
            top: auto;
            bottom: 0;
        }

        & > form {
            display: grid;
            grid-template-rows: auto auto auto;
            grid-template-columns: auto;

            & .pymt-input {
                display: flex;
                flex-flow: wrap;
                gap: 10px;
                position: relative;

                & div[id^='btn_recaptcha_'] {
                    position: absolute;
                    left: 0;
                    top: 0;
                }

                & div.flex {
                    flex-wrap: wrap;
                }

                & input:read-only {
                    background: var(--color--white);
                    border: 0 solid var(--color--white);
                }

                & label {
                    white-space: nowrap;
                }

                & input.priceEUR:after {
                    content: "€";
                }

                justify-content: space-between;
            }
        }
    }

    & .option-payment.disabled{
        display: none;
    }
}