@CHARSET "utf-8"; #module-produits-categories {background:#d8eade; padding: 55px 0 70px;} #module-produits-categories #sommaire {font-weight: 400; font-size: 35px; color:#1d4430; min-height: 355px; } #module-produits-categories #sommaire .titre {font-weight:400; font-size: 70px; line-height: 75px; font-family: 'Lobster', cursive;} #module-produits-categories #sommaire p {margin-left: 0; text-align: left; line-height: initial;} #module-produits-categories #sommaire .conteneur { margin-top: 45px; padding: 0 0 20px; box-sizing: border-box; overflow-x: auto; white-space: nowrap; position: relative; overflow-y: hidden; text-align: center;} #module-produits-categories #sommaire .conteneur a, #module-produits-categories #sommaire .conteneur a:visited { white-space: normal; width: 165px; height: 165px; display: inline-block;vertical-align: top; text-decoration: none; position: relative; z-index: 10;} #module-produits-categories #sommaire .conteneur a::before {content:""; display: block;position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 11;background: rgb(32,43,37); background: -moz-linear-gradient(0deg, rgba(32,43,37,0.8) 0%, rgba(32,43,37,0) 100%); background: -webkit-linear-gradient(0deg, rgba(32,43,37,0.8) 0%, rgba(32,43,37,0) 100%); background: linear-gradient(0deg, rgba(32,43,37,0.8) 0%, rgba(32,43,37,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#202b25",endColorstr="#202b25",GradientType=1);} #module-produits-categories #sommaire .conteneur a img {display: block; width: 100%; height: 100%; position: relative; z-index: 10;} #module-produits-categories #sommaire .conteneur a > span {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 12; padding: 20px; box-sizing: border-box; display:-webkit-box;display:-ms-flexbox;display:flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack:start; -ms-flex-pack:start; justify-content:flex-start; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end;} #module-produits-categories #sommaire .conteneur a > span > span {font-weight: 400; color:#fff; font-size: 20px; text-align: left;} #module-produits-categories.sticky #sommaire .conteneur { margin: 0; top: 75px; position: fixed; z-index: 200; margin-bottom: 0; background: #fff;} #module-produits-categories.sticky #sommaire .conteneur a, #module-produits-categories.sticky #sommaire .conteneur a:visited { height: 105px;} #module-produits-categories.sticky #sommaire .conteneur a > span { padding:10px;} #module-produits-categories.sticky #sommaire .conteneur a > span > span {font-size: 17px;} #module-produits-conteneur { margin-top: 30px;} #module-produits-conteneur .global { display:-webkit-box;display:-ms-flexbox;display:flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse;} #module-produits-droite {width: 360px; margin-left: 80px;} #module-produits-centre .commande-estimation-element {padding: 55px 30px 60px; box-sizing: border-box; margin-bottom: 15px; text-align: center;} #module-produits-centre .commande-estimation-element .titre {font-family: 'Lobster', cursive; font-size: 30px; font-weight:400;color:#1d4430; text-align: center;} #module-produits-centre .commande-estimation-element .titre i {width: 31px; height: 31px; display: block; filter: invert(72%) sepia(51%) saturate(424%) hue-rotate(45deg) brightness(99%) contrast(92%); margin:0 auto;} #module-produits-centre .commande-estimation-element .titre::after {content:""; display: block; width: 45px; height: 2px; background: #9ed95b; margin: 20px auto 25px; } #module-produits-centre .commande-estimation-element .soustitre {font-size: 15px; color:#9ed95b; text-transform: uppercase; letter-spacing: 3px; text-align: center; font-weight: 500; margin-bottom: 5px;} #module-produits-centre .commande-estimation-element p {text-align: center; margin-left: 0; line-height: 21px;} #module-produits-centre .commande-estimation-element .date {display: block;} #module-produits-centre .commande-estimation-element .heure {display: block; font-weight: 500;} #modal-date-estimation {max-width: 480px; padding: 45px 20px;} #modal-date-estimation button.mfp-close {color:#032b22; opacity: 1; font-size: 20px; border: 2px solid #032b22; border-radius: 50px; width: 25px;height: 25px;line-height: 22px; margin: 13px; } #modal-date-estimation .titre {font-weight: 700; font-size: 17px; color:#032b22; text-align: center; margin: 10px 0 45px;} #date-estimation-datepicker > div { margin: 0 auto;} #date-estimation-datepicker .ui-widget.ui-widget-content {font-family: 'Maven Pro', sans-serif; border:none;} #date-estimation-datepicker .ui-widget-header {background:none; border: none; font-weight: 600; color:#032b22; font-size: 20px;} #date-estimation-datepicker .ui-datepicker .ui-datepicker-prev-hover {left:2px; top: 2px; } #date-estimation-datepicker .ui-datepicker .ui-datepicker-next-hover {right:2px; top: 2px; } #date-estimation-datepicker .ui-widget-header .ui-icon {cursor:pointer; background: url(../images/icone-fleche.svg) no-repeat center center; background-size: contain; width: 25px; height: 25px;} #date-estimation-datepicker .ui-datepicker .ui-icon-circle-triangle-w { transform: rotate(90deg);} #date-estimation-datepicker .ui-datepicker .ui-icon-circle-triangle-e { transform: rotate(-90deg);} #date-estimation-datepicker .ui-widget-header .ui-state-disabled {display: none;} #date-estimation-datepicker .ui-datepicker th {font-weight: 600; font-size: 13px; color:#9ed95b; text-transform: uppercase;} #date-estimation-datepicker .ui-state-default, #date-estimation-datepicker .ui-widget-content .ui-state-default, #date-estimation-datepicker .ui-widget-header .ui-state-default, #date-estimation-datepicker .ui-button, html #date-estimation-datepicker .ui-button.ui-state-disabled:hover, html #date-estimation-datepicker .ui-button.ui-state-disabled:active {border:none; font-weight: 500; font-size: 13px; background: none; color: #1d4430; text-align: center;} #date-estimation-datepicker .ui-state-active, #date-estimation-datepicker .ui-widget-content .ui-state-active, #date-estimation-datepicker .ui-widget-header .ui-state-active, #date-estimation-datepicker a.ui-button:active, #date-estimation-datepicker .ui-button:active, #date-estimation-datepicker .ui-button.ui-state-active:hover {background:#9ed95b; border-radius:15px;} #date-estimation-datepicker .ui-state-disabled, #date-estimation-datepicker .ui-widget-content, #date-estimation-datepicker .ui-state-disabled, #date-estimation-datepicker .ui-widget-header .ui-state-disabled {color:#a5b6ad;} #date-estimation-datepicker .ui-state-hover, #date-estimation-datepicker .ui-widget-header .ui-state-hover, #date-estimation-datepicker .ui-state-focus, #date-estimation-datepicker .ui-widget-header .ui-state-focus, #date-estimation-datepicker .ui-button:hover, #date-estimation-datepicker .ui-button:focus { border: none; background: none;} #modal-date-estimation .creneau-conteneur label {font-weight: 700; font-size: 17px; color:#032b22; text-align: center; margin: 20px auto; display: block;} #modal-date-estimation .creneau-conteneur select { font-family: 'Maven Pro', sans-serif; margin: 0 auto; display: block; border-radius: 25px; padding:10px;height: auto; background: #fff; color: #032b22;font-weight: 500;font-size: 15px; } #modal-date-estimation .creneau-conteneur select option {font-family: 'Maven Pro', sans-serif; color: #032b22;font-weight: 500;font-size: 15px;} #modal-date-estimation .bouton {margin: 40px auto 10px; display: flex; width: 100%; max-width: 320px; color: #032b22;font-size: 17px; font-weight: 600; background: #9ed95b; min-height: 50px;text-transform: initial;} #commande-estimation-conteneur {background: #ebf1ee;} #global #commande-estimation-conteneur .titre i {background: url(../images/icone-commande.svg) no-repeat center center; background-size: contain;} #global #commande-estimation-conteneur .bouton, #global #commande-estimation-conteneur .bouton:visited {text-transform: initial; font-size: 17px; color:#032b22;} #global #commande-estimation-conteneur .bouton span, #global #commande-estimation-conteneur .bouton:visited span {color:#032b22;} #commande-estimation-conteneur.sticky {top: 75px; position: fixed; width: 360px; z-index: 200;} #commande-estimation-modifier {margin-top: 5px;} #global #commande-estimation-modifier .bouton {background:#fff;} #global #commande-estimation-modifier .bouton i {width: 17px; height: 17px; margin-right: 5px; background: url(../images/icone-calendrier.svg) no-repeat center center; background-size: contain; filter: invert(12%) sepia(66%) saturate(527%) hue-rotate(116deg) brightness(93%) contrast(99%); transition: unset;} #global #commande-estimation-modifier .bouton span {flex: 1;} #global #commande-estimation-modifier .bouton:hover {background:#032b22; color:#fff;} #global #commande-estimation-modifier .bouton:hover i {filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);} #global #commande-estimation-modifier .bouton:hover span {color:#fff;} #commande-estimation-livraison-conteneur { margin-top: 20px; line-height: 25px;} #commande-estimation-livraison-conteneur .gras {display: block;} #commande-estimation-livraison-centre {margin-top: 10px; border-top: 1px solid #c3cdc8; padding-top: 10px;} #commande-estimation-livraison-centre .prix {color: #9ed95b; font-weight: 600; font-size: 20px; margin: 5px 0;} #global #commande-estimation-livraison .bouton {background: #9ed95b; padding: 15px 30px;} #commande-estimation-livraison .gras {display: block;} #module-produits-livraison {border:1px solid #9ed95b; } #module-produits-livraison .titre i {background: url(../images/icone-livraison.svg) no-repeat center center; background-size: contain;} #commande-estimation-livraison-bouton {} #global #commande-estimation-livraison-bouton .bouton {background:#fff;} #global #commande-estimation-livraison-bouton .bouton i {width: 17px; height: 17px; margin-right: 5px; background: url(../images/icone-livraison.svg) no-repeat center center; background-size: contain; filter: invert(12%) sepia(66%) saturate(527%) hue-rotate(116deg) brightness(93%) contrast(99%); transition: unset;} #global #commande-estimation-livraison-bouton .bouton span {flex: 1;} #global #commande-estimation-livraison-bouton .bouton:hover {background:#032b22; color:#fff;} #global #commande-estimation-livraison-bouton .bouton:hover i {filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);} #global #commande-estimation-livraison-bouton .bouton:hover span {color:#fff;} #module-produits-horaires {margin-top:20px;} #module-produits-centre #module-produits-paiement {padding:0;} #module-produits-paiement .bouton {margin:0; width: 100%; text-transform: initial; font-size: 18px; padding:15px 30px; background: #1d4430 !important; cursor: default;} #module-produits-paiement .bouton i {width: 25px; height: 25px; margin-right: 15px; background:url(../images/icone-cadenas.svg) no-repeat center center; background-size: contain;filter: invert(72%) sepia(51%) saturate(424%) hue-rotate(45deg) brightness(99%) contrast(92%);} #module-produits-paiement .bouton > span {color:#fff !important; flex: 1; text-align: left;} #modal-commande-estimation {padding:50px 10px 20px; text-align: center;} #commande-estimation-input {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #commande-estimation-input label { display: block; width: 100%; font-size: 25px; font-family: 'Lobster', cursive; } #commande-estimation-input input { max-width: 250px; margin: 20px auto;} #modal-commande-estimation .bouton { text-transform: initial; font-weight: 500; font-size: 18px; letter-spacing: 0.5px;} #estimation-error p { font-weight: 700; color: #9f1919;} #module-produits {flex:1;} #module-produits .attribut i { width: 32px; height: 32px; background: #9ed95b; border-radius: 65px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #module-produits .attribut i::before {content: ""; display: block; width: 14px; height: 14px; filter: brightness(0) invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);} #module-produits .arechauffer i::before { background: url(../images/icone-microonde.svg) no-repeat center center; background-size: contain;} #module-produits .sansgluten i::before {background: url(../images/icone-sansgluten.svg) no-repeat center center; background-size: contain;} #module-produits .vegetatien i::before {background: url(../images/icone-vegetarien.svg) no-repeat center center; background-size: contain;} #module-produits #categories .titre {background: #1d4430; font-family: 'Lobster', cursive; font-size: 30px; color:#fff; padding: 7px 25px; margin-bottom: 20px;} #module-produits #categories .niveau-1 .titre {background:#d8eade; color:#1d4430; font-size: 23px;} #module-produits #categories .conteneur {display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch;} #module-produits #categories .conteneur .produit {cursor: pointer; margin: 0 0 65px 60px; width: calc(33.333% - 40px); display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #module-produits #categories .conteneur .produit:nth-child(3n+1) {margin-left: 0px;} #module-produits #categories .conteneur .produit .photo {width: 100%; height: auto; position: relative; z-index: 10;} #module-produits #categories .conteneur .produit .photo::after {content: ''; display: block; width: 0; height: 5px; position: absolute; z-index: 11; background:#9ed95b;-webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out;} #module-produits #categories .conteneur .produit .photo img {width: 100%; height: auto; display: block; position: relative; z-index: 10;} #module-produits #categories .conteneur .produit .nom {font-family: 'Lobster', cursive; color: #1d4430; font-size: 25px; text-align: left; margin: 7px 0;} #module-produits #categories .conteneur .produit .introduction {font-weight: 400; font-size: 17px; color:#1d4430;} #module-produits #categories .conteneur .produit .introduction p { margin-left: 0; text-align: left;} #module-produits #categories .conteneur .produit .prix {font-weight: 600; font-size: 20px; color:#9ed95b; margin: 3px 0 7px;} #module-produits #categories .conteneur .produit .prix sup { font-size: 0.7em;} #module-produits #categories .conteneur .produit .prix span {display:block; font-size: 0.75em;} #module-produits #categories .conteneur .produit .quantite {font-weight: 400; font-size: 17px; color:#648373; border-top: 1px solid #c3cdc8; padding-top: 10px; margin-top: 14px;} #module-produits #categories .conteneur .produit .attributs {margin-top: 5px;display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #module-produits #categories .conteneur .produit .attributs .attribut {margin:3px;} #module-produits #categories .conteneur .produit .voir {width: 100%; margin-top: 20px;} #global #module-produits #categories .conteneur .produit .voir .bouton {color:#032b22; font-size: 19px; background: #9ed95b; margin:0; width: 100%; min-height: 65px; text-transform: initial;} #global #module-produits #categories .conteneur .produit .voir .bouton span {color:#032b22;} #module-produits #categories .conteneur .produit .voir .bouton i {width: 25px; height: 25px; display: block; margin-right: 10px; background: url(../images/icone-oeil.svg) no-repeat center center; background-size: contain;filter: invert(12%) sepia(66%) saturate(527%) hue-rotate(116deg) brightness(93%) contrast(99%);} #module-produits #categories .conteneur .produit:hover .photo::after {width: 100%;} #global #module-produits #categories .conteneur .produit:hover .voir .bouton {color:#032b22; background: #ebf1ee;} /* Produit */ #module-loader {position: fixed; z-index: 5000; top: 0; left: 0; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out;display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #module-loader.visible {width: 100vw; height: 100vh;} #module-loader .loader { position: relative; z-index: 5001; background: #fff; padding: 15px; border: 2px solid #ccc;} #module-produits-conteneur #produit { width: 80%; max-width: 1115px; height: 100vh; overflow: scroll; position: fixed; z-index: 5000; top: 0; left: 0; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -ms-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out;} #produit-fermer {position: absolute; top: 10px; left: 10px; width: 30px; height: 30px; background:#fff; border-radius: 50%; box-shadow: 0 4px 10px -6px #000; z-index: 100;display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #produit-fermer i {display: block; width: 22px; height: 22px; background: url(../images/icone-croix.svg) no-repeat center center; background-size: contain;} #produit .produit {width: 100%; background-color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch;} #produit .produit .produit-contenu { width: calc(100% - 364px);} #produit .produit.no-apparentes .produit-contenu {width: 100%;} #form-produit {height: 100%; display: flex; flex-direction: column;} #produit-informations { width: 100%; min-height: 100vh; flex:1;} #produit-panier { position: sticky; left: 0; bottom: 0; min-height: 115px; margin:20px 20px 0 20px; padding: 25px; box-sizing: border-box; background: #fff; -moz-box-shadow: 0 0 15px rgba(2, 3, 3, 0.2); -webkit-box-shadow: 0 0 15px rgba(2, 3, 3, 0.2); -o-box-shadow: 0 0 15px rgba(2, 3, 3, 0.2); box-shadow: 0 0 15px rgba(2, 3, 3, 0.2); display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #produit-panier-gauche { flex:1;} #produit-panier-gauche span {font-weight: 600; font-size: 20px; color:#9ed95b;} #produit-panier-gauche span sup { font-size: 0.65em;} #produit-panier-gauche span .total-ttc {display:block;} #produit-panier-gauche span .total-ttc span { font-size: 0.75em;} #produit-panier-droite {width: 270px; margin-left: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #produit-panier-droite .panier-controles { height: 30px; width: 77px; border-radius: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch;} #produit-panier-droite .panier-controles a, #produit-panier-droite .panier-controles a:visited { width: 21px; color:#fff; background:#1d4430; text-decoration: none; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #produit-panier-droite .panier-controles a.moins { border-radius: 10px 0 0 10px;} #produit-panier-droite .panier-controles a.plus { border-radius: 0 10px 10px 0;} #produit-panier-droite #produit-quantite {flex:1; width: 100% !important; height: 100% !important; box-sizing: border-box; border:1px solid #c3cdc8; font-weight: 600; color:#1d4430; font-size: 15px; font-family: 'Maven Pro', sans-serif; text-align: center;} #produit-panier-droite .bouton {width: auto !important; min-width: 0; margin: 0; min-height: 0; height: 30px; padding: 5px 25px; font-size: 13px; text-transform: uppercase; border-radius: 30px; } /* PHOTOS */ #produit .produit .photos {width: 100%; height: auto; position: relative; z-index: 10;} #produit .produit .photos .photo {width: 100%; height: auto; position: relative; z-index: 10;} #produit-slider-conteneur {position: relative; z-index: 20; display:inline-block; vertical-align:top; width:100%; margin-bottom: 71px;} #produit-slider-loader {width:100%; height:100%; position:absolute; left:0; top:0; z-index:35; background:url(../images/ajax-loader.gif) no-repeat center center #F8F7F7;} #produit-slider-contenu { max-width: 730px; position: relative; z-index: 20; min-height: 45px; } #produit-slider-contenu .carousel { position: relative; z-index: 20; overflow: hidden;} #produit-slider-contenu .carousel ul { width: 10000em; position: relative; list-style: none; margin: 0 !important; padding: 0 !important; height:100%;} #produit-slider-contenu .carousel li {float: left; margin:0 !important; padding:0 !important; height:100%; background:none; line-height: initial; overflow:hidden; } #produit-slider-contenu .carousel li::before {display:none;} #produit-photo {width: 100%; max-height: 485px; margin:0; } #produit-photo img{pointer-events: all; width: 100%; -o-object-fit: contain; object-fit: contain; height: 100%; display: block;} #produit-slider-miniatures-conteneur {width: calc(100% - 40px); margin: 15px 20px; position: relative;display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} /** Shared carousel styles **/ #produit-slider-miniatures { flex: 1; margin: 0 20px; height: 75px;background: #fff; text-align:center; } #produit-slider-miniatures li { cursor: pointer; position:relative; z-index:10; width:112px; height:75px;} #produit-slider-miniatures li > div {margin:0 5px;position:relative; z-index:10; height:100%; width:100%;} #produit-slider-miniatures li img {width: 100%; -o-object-fit: cover; object-fit: cover; height: 100%; display: block;} #produit-slider-miniatures li.active div::before {position:absolute; left:0px; top:0; z-index:12; border: 3px solid #9ed95b; width:100%; height:100%; content:""; box-sizing: border-box;} #produit-slider-miniatures-conteneur .prev-navigation, #produit-slider-miniatures-conteneur .next-navigation { display: block; } #produit-slider-miniatures-conteneur .prev-navigation i, #produit-slider-miniatures-conteneur .next-navigation i {color:#1b1b1b; font-size:30px;} #produit-slider-miniatures-conteneur .prev-navigation.inactive i, #produit-slider-miniatures-conteneur .next-navigation.inactive i {color:#e9e9ea !important; cursor: default; } /* INFORMATIONS PRODUIT */ #produit .produit .produit-centre {padding: 20px 20px 0px 20px;} #produit .produit .produit-centre h2.h1 {text-align: left; margin: 5px 0;} #produit .produit .produit-centre h3 {margin-left:0; text-transform: uppercase; letter-spacing: 3px; font-weight: 400; font-size: 16px;} #produit .produit .produit-centre h3 span {display: inline-block; vertical-align: top;} #produit .produit .produit-centre h3 span::after {content:""; display: block; width: 100%; height: 1px; background: #9ed95b; margin: 0;} #produit .produit .produit-centre ul, #produit .produit .produit-centre ol, #produit .produit .produit-centre p {margin-left: 0; text-align: left;} #produit .produit .produit-centre .prix {font-weight: 600; font-size: 20px; color:#9ed95b; margin-bottom: 20px;} #produit .produit .produit-centre .prix sup { font-size: 0.7em;} #produit .produit .produit-centre .prix .prix-ttc {display:block; font-size: 0.75em;} #produit .produit .produit-centre .produit-introduction { border-bottom: 1px solid #1d4430; padding-bottom: 8px; margin-bottom: 15px;} #produit .produit .produit-centre .introduction {font-size: 17px; color:#1d4430;} #produit .produit .produit-centre .introduction p {margin: 7px 0;} #produit .produit .produit-centre .souspartie {color:#648373;} #produit .produit .produit-centre .souspartie h3 { text-transform: initial; letter-spacing: normal; font-size: 17px; color: #032b22; font-weight: 700; margin: 9px 0;} #produit .produit .produit-centre .souspartie h3 span::after {display: none;} #produit .produit .produit-centre .attributs {color:#648373;} #produit .produit .produit-centre .attribut { margin: 10px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #produit .produit .produit-centre .attribut i { margin-right: 10px;} #produit .produit .produit-centre .attribut span {flex: 1;} #produit .produit .produit-centre .personnalisation {background:#ebf1ee; padding: 20px 35px; margin: 20px 0 15px; box-sizing: border-box;} #produit .produit .produit-centre .personnalisation-select { margin-top:25px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #produit .produit .produit-centre .personnalisation select {width: calc(50% - 10px); height: 30px; margin: 9px 0; background:#fff; border: 1px solid #b9e488; border-radius: 60px; padding: 2px 15px;} #produit .produit .produit-centre .personnalisation select:nth-child(2n+2) {margin-left: 20px; border-color: #a5b6ad;} #produit .produit .produit-centre .commentaire textarea {width: 100% !important; height: 100px; border: 1px solid #b1c0b8; padding: 15px 10px; box-sizing: border-box; font-family: 'Maven Pro', sans-serif; font-size: 13px; color:#1d4430;} #produit .produit .produit-centre .commentaire textarea::-webkit-input-placeholder {opacity:1; font-family: 'Maven Pro', sans-serif; font-size: 13px; color:#a5b6ad;} #produit .produit .produit-centre .commentaire textarea::-moz-placeholder {opacity:1; font-family: 'Maven Pro', sans-serif; font-size: 13px; color:#a5b6ad;} #produit .produit .produit-centre .commentaire textarea:-ms-input-placeholder {opacity:1; font-family: 'Maven Pro', sans-serif; font-size: 13px; color:#a5b6ad;} #produit .produit .produit-centre .commentaire textarea:-moz-placeholder {opacity:1; font-family: 'Maven Pro', sans-serif; font-size: 13px; color:#a5b6ad;} #produit .apparentes { width: 320px; padding: 0 22px 35px; background: #ebf1ee;} #produit .apparentes .apparentes-introduction {font-weight: 400; color:#1d4430; font-size: 17px; margin-bottom: 20px;} #produit .apparentes .apparentes-introduction * {text-align: left;} #produit .apparentes .apparentes-introduction p {margin: 7px 0; text-align: left; line-height: 22px;} #produit .apparentes .apparente {background: #fff; margin-bottom: 25px; cursor: pointer;} #produit .apparentes .apparente-photo {height: 250px; width: 100%;} #produit .apparentes .apparente-photo img {width: 100%; height: 100%; object-fit: cover; display: block;} #produit .apparentes .apparente-contenu {padding:20px;} #produit .apparentes .apparente-titre {color: #1d4430; font-size: 18px; font-weight: 400; font-family: 'Lobster', cursive; margin-bottom: 12px; } #produit .apparentes .apparente-titre a, #produit .apparentes .apparente-titre a:visited {text-decoration: none; color: #1d4430; } #produit .apparentes .apparente-introduction {font-weight: 400; font-size: 17px; color:#1d4430; margin: 10px 0;} #produit .apparentes .apparente-bas {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #produit .apparentes .apparente-prix-conteneur {flex:1; font-weight: 600; font-size:20px; color:#9ed95b;} #produit .apparentes .apparente-prix-conteneur sup { font-size: 0.7em;} #produit .apparentes .apparente-prix-conteneur .apparente-prix-ttc {display:block; font-size: 0.75em;} #produit .apparentes .apparente-voir.bouton {width: 57px; height: 30px; min-height: 0; min-width: 0; margin:0;padding: 5px 10px; font-size: 13px; text-transform: uppercase; border-radius: 30px; } @media all and (max-width:1450px) { #module-produits-droite { margin-left: 40px;} } @media all and (max-width:1345px) { #commande-estimation-conteneur.sticky {width: 310px;} #module-produits-droite {width: 310px; margin-left: 30px;} #module-produits-centre .commande-estimation-element { padding: 35px 15px 40px;} #module-produits #categories .conteneur .produit { width: calc(33.333% - 20px); margin: 0 0 35px 30px;} } @media all and (max-width:1215px) { #module-produits #categories .conteneur .produit { width: calc(50% - 20px); } #module-produits #categories .conteneur .produit:nth-child(3n+1) {margin-left: 30px;} #module-produits #categories .conteneur .produit:nth-child(2n+1) {margin-left: 0px;} } @media all and (max-width:1195px) { #produit .produit .produit-contenu { width: calc(100% - 294px);} #produit .produit .produit-centre .personnalisation { padding: 20px 15px;} #produit .apparentes { width: 250px;} } @media all and (max-width:1030px) { #module-produits-categories { padding: 35px 0 30px;} #module-produits-categories #sommaire { font-size: 28px; min-height: 335px;} #module-produits-categories #sommaire .titre { font-size: 55px; line-height: 55px;} #module-produits #categories .titre { font-size: 27px;} #module-produits #categories .niveau-1 .titre {font-size: 22px;} #module-produits #categories .conteneur .produit .nom {font-size: 23px;} #global #module-produits #categories .conteneur .produit .voir .bouton {font-size: 17px;} #commande-estimation-conteneur.sticky {width: 270px;} #module-produits-droite {width: 270px; margin-left: 20px;} } @media all and (max-width:990px) { #module-produits-categories.sticky #sommaire .conteneur, #commande-estimation-conteneur.sticky {top:35px;} #produit .produit .produit-contenu {width: 100%;} #produit-panier {margin: 20px;} #produit .apparentes {width: 100%;} #produit .apparentes-conteneur-elements-contenu { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack:start; -ms-flex-pack:start; justify-content:flex-start; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start;} #produit .apparentes .apparente {margin-left: 15px; width: calc(50% - 8px);} #produit .apparentes .apparente:nth-child(2n+1) {margin-left: 0;} } @media all and (max-width:900px) { #module-produits-conteneur .global {display: block;} #module-produits-droite {width: 100%;margin-left: 0;} #module-produits-centre .commande-estimation-element {padding: 15px 15px 20px;} #module-produits-centre .commande-estimation-element .titre {font-size: 24px;} #module-produits-centre .commande-estimation-element .titre i {width: 26px; height: 26px;} #module-produits-centre .commande-estimation-element .titre::after { margin: 10px auto 15px;} #commande-estimation-livraison-conteneur { margin-top: 10px;} #commande-estimation-livraison-conteneur .gras {display: initial;} #global #commande-estimation-conteneur .bouton, #global #commande-estimation-conteneur .bouton:visited { min-height: 37px; font-size: 15px;} } @media all and (max-width:780px) { #module-produits-categories { padding: 35px 0 30px;} #module-produits-categories #sommaire { font-size: 25px; min-height: 295px;} #module-produits-categories #sommaire .titre { font-size: 45px; line-height: 45px;} #module-produits-categories #sommaire .conteneur {margin-top: 30px;} #module-produits-categories #sommaire .conteneur a, #module-produits-categories #sommaire .conteneur a:visited { width: 145px; height: 145px;} #module-produits-categories #sommaire .conteneur a > span {padding: 15px;} #module-produits-categories #sommaire .conteneur a > span > span {font-size: 19px; } } @media all and (max-width:767px) { #module-produits-conteneur #produit {width: 100%;} } @media all and (max-width:580px) { #module-produits-categories.sticky #sommaire .conteneur { padding:0 0 10px;} #module-produits-categories.sticky #sommaire .conteneur a, #module-produits-categories.sticky #sommaire .conteneur a:visited { height: 70px;} #module-produits-categories.sticky #sommaire .conteneur a > span > span {font-size: 15px; } #module-produits-categories {padding:25px 0 10px;} #module-produits-categories #sommaire { font-size: 20px; min-height: 265px;} #module-produits-categories #sommaire .titre { font-size: 35px; line-height: 35px;} #module-produits-categories #sommaire .conteneur {margin-top: 30px;} #module-produits-categories #sommaire .conteneur a, #module-produits-categories #sommaire .conteneur a:visited { width: 140px; height: 120px;} #module-produits-categories #sommaire .conteneur a > span {padding: 10px;} #module-produits-categories #sommaire .conteneur a > span > span {font-size: 17px; } #module-produits-categories .global, #module-produits-conteneur .global {padding:0 10px;} #module-produits #categories .titre {font-size: 23px; padding: 7px 15px;} #module-produits #categories .niveau-1 .titre {font-size: 20px;} #module-produits #categories .conteneur .produit { width: calc(50% - 5px); margin:0 0 25px 10px !important;} #module-produits #categories .conteneur .produit:nth-child(2n+1) {margin-left: 0 !important;} #module-produits #categories .conteneur .produit .nom {font-size: 21px;} #module-produits #categories .conteneur .produit .introduction { font-size: 15px;} #module-produits #categories .conteneur .produit .prix { font-size: 18px;} #module-produits #categories .conteneur .produit .quantite {font-size: 16px; line-height: 19px;} #global #module-produits #categories .conteneur .produit .voir .bouton { font-size: 16px; min-height: 50px;} #module-produits #categories .conteneur .produit .voir .bouton i {margin-right: 7px;} #produit .apparentes { padding: 0 14px 35px;} #produit .apparentes .apparente-contenu {padding: 10px;} #produit .apparentes .apparente-titre {font-size: 16px;} #produit .apparentes .apparente-introduction {font-size: 15px;} #produit .apparentes .apparente-prix-conteneur {font-size: 17px;} #produit .apparentes .apparente-voir.bouton {width: 45px;} } @media all and (max-width:580px) { #produit-panier { padding: 15px; min-height: 75px;} } @media all and (max-width:530px) { #produit-panier {text-align: center;} #produit-panier-droite {width: 100%; margin-left: 0; margin-top: 5px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;} #produit-panier-droite .panier-controles {margin-right: 10px;} #produit .produit .produit-centre .personnalisation select {width: 100%;} #produit .produit .produit-centre .personnalisation select:nth-child(2n+2) {margin-left: 0;} } @media all and (max-width:430px) { #module-produits-paiement .bouton { padding: 15px;} #module-produits #categories .conteneur .produit { width: calc(50% - 5px); margin: 0 0 20px 10px !important;} #global #module-produits #categories .conteneur .produit .voir .bouton { padding: 5px;} #module-produits #categories .conteneur .produit .voir .bouton i {width: 20px; height: 20px;} #produit .apparentes .apparente-photo { height: 200px;} #produit .apparentes .apparente-prix-conteneur {flex:unset; width: 100%; margin-bottom: 10px;} } @media all and (max-width:350px) { #modal-date-estimation { padding: 45px 10px;} #module-produits-paiement .bouton { font-size: 17px;} #module-produits-paiement .bouton i {width: 20px; height: 20px; margin-right: 10px;} #module-produits #categories .titre {font-size: 21px; padding: 7px 13px;} #module-produits #categories .niveau-1 .titre {font-size: 19px;} #module-produits #categories .conteneur .produit .nom {font-size: 19px;} #module-produits #categories .conteneur .produit .introduction {font-size: 15px;} #global #module-produits #categories .conteneur .produit .voir .bouton {min-height: 40px; font-size: 13px;} #produit-panier-droite {margin-top: 15px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #produit-panier-droite .panier-controles {margin-right: 0; margin-bottom: 5px;} } @media all and (max-height:630px) { #module-produits-centre .commande-estimation-element {padding: 15px 15px 20px;} #module-produits-centre .commande-estimation-element .titre {font-size: 24px;} #module-produits-centre .commande-estimation-element .titre i {width: 26px; height: 26px;} #module-produits-centre .commande-estimation-element .titre::after { margin: 10px auto 15px;} #commande-estimation-livraison-conteneur { margin-top: 10px;} #commande-estimation-livraison-conteneur .gras {display: initial;} #global #commande-estimation-conteneur .bouton, #global #commande-estimation-conteneur .bouton:visited { min-height: 37px; font-size: 15px;} }