:root{
  --color1 : #0E8540;	
  --border-color-title-ecommerce :var( --color1);
  --color11: rgba(12, 120, 72, 0.1);
  --medium-text : medium;
  --shinyInput-background : whitesmoke;
  --shinyInput-radius : 0.2em;
  --shinyInput-color : #777;
  --shinyInupt-border : gainsboro;
  --button-shadow-0:  0px 1px 1px rgba(0, 0, 0, 0.03), 0px 3px 6px rgba(0, 0, 0, 0.02);
  --button-shadow-1: 0px 20px 20px rgba(0, 0, 0, 0.05), 0px 5px 11px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1);
}
/*************
 *
 * Shiny Input 
 *
 *************/

.shinyGroup{position:relative; transform: translate(0);}
.flexContForm{    display: flex; flex-wrap: wrap; justify-content: space-between;}
.shinyGroup, .loginFormConnect .line_form{ position: relative;  font-size:medium; margin: 1.5em 0 0.5em 0; /** creer de l'espace pour pour le label qui remonte et a l'ombre sur le hover**/}
.shinyGroup .cell_1_form, .shinyGroup .cell_2_form:not(:has([type=radio])), .loginFormConnect .line_form .cell_1_form, .loginFormConnect .line_form .cell_2_form{display:block;position:relative;}

.loginFormConnect .line_form, .shinyGroup.fullW{width:100%;text-align:left;}
.shinyGroup.halfW{width:45%;display: inline-block;}
.loginFormConnect .line_form input, .loginFormConnect .line_form label, .shinyGroup input, .shinyGroup textarea, .shinyGroup label{font-size: var(--medium-text);}
.shinyGroup textarea{height: 10em;width: 100%; box-sizing: border-box;}
    

.shinyGroup input:not([type=radio]) , .shinyGroup textarea{ width: 100%; line-height:1; padding: 0.5em 0.5em; box-sizing: border-box; text-align: left; color: var(--shinyInput-color); border: 1px solid var(--shinyInupt-border); transition: border-color 250ms; transition: box-shadow 0.3s ease-in-out; background-color: var(--shinyInput-background); letter-spacing : 0.1em;border-radius:var(--shinyInput-radius);    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.03), 0px 3px 6px rgba(0, 0, 0, 0.02);}
.shinyGroup input:focus, .shinyGroup textarea:focus, .loginFormConnect .line_form:focus{box-shadow: rgba(33, 35, 38, 0.6) 0px 10px 10px -10px;outline: none;border-color: var(--shinyInput-color);}
.shinyGroup .cell_1_form{ pointer-events: none;}
.shinyGroup .cell_2_form{position:relative;z-index:0;}
  /* Hide Safari's autofill button*/
.shinyGroup input::-webkit-contacts-auto-fill-button, .shinyGroup textarea::-webkit-contacts-auto-fill-button, .loginFormConnect .line_form  input::-webkit-contacts-auto-fill-button{ visibility: hidden; pointer-events: none; position: absolute;}
.shinyLabel, .shinyGroup:not(:has([type=radio])) label, .loginFormConnect .line_form label{position: aabsolute; z-index:1;top: 0.25em; left: 0.5em; color: var(--shinyInput-color);  pointer-events: none; transform-origin: left center; transition: all 0.2s ease 0s;}


/** Le cell_1_form =>  Quand on click dans le input **/
.shinyGroup .cell_1_form:has(+ .cell_2_form input:focus), 
.shinyGroup .cell_1_form:has(+ .cell_2_form textarea:focus){position:absolute; padding:0.25em 0.5em; top: 0.75em;  opacity:1; transform: translateY(-100%) scale(0.75); border-color: red; background-color: var(--shinyInput-background);z-index:2;}

/** Le label =>  Quand on click dans le input **/
.shinyGroup .cell_1_form:has(+ .cell_2_form input:focus) label, 
.shinyGroup .cell_1_form:has(+ .cell_2_form textarea:focus) label{}

/** le cell_1_form => quand il y a quelque chose dans l'input **/
.shinyGroup .cell_1_form:not(:has(+ .cell_2_form input:placeholder-shown, + .cell_2_form textarea:placeholder-shown, + a.cell_2_form input:-webkit-autofill)){ border-radius: var(--shinyInput-radius);position:absolute;padding:0.25em 0.5em; top: 0.75em; opacity:1; transform: translateY(-100%) scale(0.75);  background-color: var(--shinyInput-background);z-index:1;}

/** le cell_1_form => quand il n'y a rien dans l'input **/
.shinyGroup .cell_1_form:has(+ .cell_2_form input:placeholder-shown, + .cell_2_form textarea:placeholder-shown, + a.cell_2_form input:-webkit-autofill){border-radius: var(--shinyInput-radius);position:absolute;padding:0.4em 0.5em; z-index: 2; transition: 0.3s ease-in-out;}


/** le label => quand il y a quelque chose dans l'input **/
.shinyGroup .cell_1_form:not(:has(+ .cell_2_form input:placeholder-shown, + .cell_2_form textarea:placeholder-shown, + a.cell_2_form input:-webkit-autofill)) label{ }

/** Le label => quand  il y a quelque chose dans l'input **/
.shinyGroup .cell_1_form:has(+ .cell_2_form input:not(:placeholder-shown)) label, 
.shinyGroup .cell_1_form:has(+ .cell_2_form textarea:not(:placeholder-shown)) label,
.shinyGroup .cell_1_form:has(+ .cell_2_form input:-webkit-autofill) label{ }

.shinyGroup .cell_1_form:has(+ .cell_2_form input:focus) label{z-index:1 !important;}

.shinyGroup ul{text-align:left;display:inline-block;}
.shinyGroup li{display:flex;}
.shinyGroup li label{flex-grow : 1;}

.shinyGroup select{ width: 100%;box-sizing:border-box; padding: 0.5em; background: whitesmoke;font-size: var(--font-size-medium);}
div[class^=line_form] { width:100%; display: block;}
.labelInputCheckBox{cursor:pointer;}
.fpayment .labelInputCheckBox {position:relative;padding-left:40px;color: var(--shinyInput-color);}
.fpayment [type="checkbox"]:not(:checked), .fpayment [type="checkbox"]:checked { position: absolute; left: -9999px;}
.fpayment [type="checkbox"]:not(:checked) + label:before,
.fpayment [type="checkbox"]:checked + label:before { content: '';    position: absolute;     box-shadow: var(--button-shadow-0);   left: 1px;    top: -4px;    width: 25px;    height: 25px;  border:1px solid var(--shinyInupt-border);  background-color: var(--shinyInput-background);   border-radius: var(--shinyInput-radius);}
.fpayment [type="checkbox"]:not(:checked) + label:after,.fpayment [type="checkbox"]:checked + label:after {    content: "\e1ca";    font-family: gandg !important;    position: absolute;        top: -0.25em;left: 0em;font-size: 1.5em;color: black;    transition: all .2s;    line-height: initial;}
.fpayment [type="checkbox"]:not(:checked) + label:after {opacity: 0; transform: scale(0); }
.fpayment [type="checkbox"]:checked + label:after {opacity: 1; transform: scale(1); }

.viewCartSHOP thead{display:none;}
.bfpayment {display: flex;align-content: flex-start;flex-wrap: wrap;    width: 95%;flex-direction: row;align-items: flex-start;width:100%;max-width:1300px;margin:auto;}
.fpayment .input_submit{display:none;} 
.inpRGPD .cell_1_form{display: none;}
.loadingCircle.one, .loadingCircle.three {display:none;}
.loadingCircle.two {height: 150px;  width: 150px;          left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);;  border:none ; animation-name:flip;background-image: url("../apple-touch-icon.png");  background-color:white; border-radius: 50%; animation-duration: 2s;background-position: center;background-repeat: no-repeat;background-size: 100% ;}
.resumePaiementSHOP, .basketSHOP{ min-width: 400px; flex-basis:45%; flex-grow:1;    padding: 0 2%;position: sticky; top:85px;
    box-sizing: border-box;margin-top:30px;}
.resumePaiementSHOP{border-left:1px solid gainsboro;}
.bfixBasketSHOP{position:sticky; top:0;}
.replaceButtonValid {min-height:400px;}
.inpRGPD{margin: 1.5em 0;}
#div_container_7_fr{display: block;}

/*************
 *
 * Cart
 *
 *************/

.cartTable {border:0;border-collapse: collapse;margin: 0;padding: 0;width: 100%;table-layout: fixed;font-size:medium !important;}
.cartTable thead {display: none;}
.cartTable tr {border-bottom: 1px solid whitesmoke;display: grid;grid-template-columns: 1fr 2fr;align-items: center;grid-template-rows: repeat(4,1fr);grid-column-gap: 0px;grid-row-gap: 0px;padding: 0.75em 0.5em;}
.cartTable>tbody td {padding: 0.25em;line-height: 1;margin: 0;border: 0;}
.simpleCart_items .cartTable>tbody .item-thumb, .simpleCart_resum  .cartTable>tbody .item-thumb{grid-area: 1 / 1 / 4 / 2;width: 6em;height: 8em;}
.simpleCart_items .cartTable>tbody .item-name, .simpleCart_resum .cartTable>tbody .item-name {grid-area: 1 / 2 / 2 / 3;}
.simpleCart_items .cartTable>tbody .item-name a, .simpleCart_resum .cartTable>tbody .item-name a{    pointer-events: none;	}
.simpleCart_items .cartTable>tbody .item-desc, .simpleCart_resum .cartTable>tbody .item-desc {grid-area: 2 / 2 / 3 / 3;}
.simpleCart_items .cartTable>tbody .item-price, .simpleCart_resum .cartTable>tbody .item-price {grid-area: auto;text-align: right;width: 9em;}
.simpleCart_items .cartTable td.item-quantity , .simpleCart_resum .cartTable td.item-quantity {grid-area: 4 / 1 / 5 / 2;display: flex; justify-content: space-evenly; align-self: center; align-items: center; }
.simpleCart_items .cartTable .simpleCart_remove:before {background-color: var(--shinyInput-background); border:1px solid var(--shinyInupt-border); box-shadow: var(--button-shadow-0);border-radius: var(--shinyInput-radius);color : var(--shinyInput-color);}
.simpleCart_remove {margin: 0 auto; width: auto; padding: 0.5em; text-align: center;}
.simpleCart_items .cartTable td.item-quantity .simpleCart_decrement,.cartTable td.item-quantity .simpleCart_increment { width: 25%; background-color: var(--shinyInput-background); border:1px solid var(--shinyInupt-border); border-radius: var(--shinyInput-radius); box-shadow: var(--button-shadow-0); color: var(--shinyInput-color);}
.simpleCart_items .cartTable td.item-remove {grid-area: 4 / 2 / 5 / 3;font-size: medium;text-align: right;}
.cartTable td:last-child {border-bottom: 0;}

.cartTable .item-deliverydate{display : none;}
    
.cartTable tbody tr:nth-child(even){background-color: var(--color11);}

    
    .viewCartSHOP.disabled .item-remove, .viewCartSHOP.disabled .simpleCart_decrement,.viewCartSHOP.disabled  .simpleCart_increment{display:none;}
   .viewCartSHOP.disabled  td.item-quantity:before , .simpleCart_resum td.item-quantity:before{
        content: attr(data-title) " :\000020";
    }
   .viewCartSHOP.disabled  td.item-quantity, .simpleCart_resum td.item-quantity{justify-content: start;}
    
.cartTable tr {
    grid-template-rows: inherit;
    grid-row-gap: 0.5em;
}
.findcateg{display:block}
.cartTable>tbody .item-thumb{width: 8em;}
.cartTable>tbody .item-thumb {grid-area: 1 / 1 / 5 / 2 !important;}
.cartTable>tbody .item-name {grid-area: 1 / 2 / 2 / 4 !important;}
.cartTable>tbody .item-quantity { grid-area: 2 / 2 / 3 / 3 !important; }
.cartTable>tbody .item-total{ grid-area: 2 / 3 / 3 / 4 !important; }
.cartTable>tbody .item-remove{ grid-area: 4 / 2 / 5 / 4 !important; }
.headP{background-color : var(--color1); display: flex;     flex-direction: column;}
.headP .t_g{color : white;}
.hr{width:90%;height:1px; background-color: gainsboro; margin:auto;}
.floatR{float:right;}
#payment-form #submit {
    padding: 0.5em 2em;
    box-sizing:border-box;
     border: 0px;
    border-radius: var(--shinyInput-radius);
    color: white;
    margin: 1.5em 0 1.5em 50%;
    transform: translateX(-50%);
    text-align: center;
    font-size: large;
    transition: all 0.5s ease 0s;
    cursor: pointer;
    width: initial;
    background-color: var(--color1);
    box-shadow: 0px 81px 32px rgba(0, 0, 0, 0.01), 0px 45px 27px rgba(0, 0, 0, 0.05), 0px 20px 20px rgba(0, 0, 0, 0.09), 0px 5px 11px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1);
}
.errorLabel{color: firebrick;text-align:center;}

@media screen and (max-width:600px){
	.basketSHOP{position:static;}
	@media screen and (max-width: 600px) {
    .simpleCart_items .cartTable td.item-quantity .simpleCart_decrement, .cartTable td.item-quantity .simpleCart_increment {   width: inherit;}