@font-face {
  font-family: 'Roboto';
  src: url("Fonts/Roboto-Regular-webfont.woff") format("woff");
  font-weight: 400; 
  font-style: normal;
}
@font-face {
  font-family: 'Roboto';
  src: url("Fonts/Roboto-Medium-webfont.woff") format("woff");
  font-weight: 500; 
  font-style: normal;
}
@font-face {
  font-family: 'Roboto';
  src: url("Fonts/Roboto-Bold-webfont.woff") format("woff");
  font-weight: 700; 
  font-style: normal;
}
@font-face {
  font-family: 'RobotoCnd';
  src: url("Fonts/RobotoCondensed-Regular-webfont.woff") format("woff");
  font-weight: 400; 
  font-style: normal;
}
@font-face {
  font-family: 'RobotoCnd';
  src: url("Fonts/RobotoCondensed-Bold-webfont.woff") format("woff");
  font-weight: 700; 
  font-style: normal;
}

/* Fontello */
@font-face {
  font-family: 'icons';
  src: url('Fonts/icons.eot?89098842');
  src: url('Fonts/icons.eot?89098842#iefix') format('embedded-opentype'),
       url('Fonts/icons.woff2?89098842') format('woff2'),
       url('Fonts/icons.woff?89098842') format('woff'),
       url('Fonts/icons.ttf?89098842') format('truetype'),
       url('Fonts/icons.svg?89098842#icons') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "icons";
  font-style: normal;
  font-weight: normal;
  speak: never;

  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */

  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;

  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;

  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;

  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */

  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-user:before { content: '\e800'; } /* '' */
.icon-star-empty:before { content: '\e801'; } /* '' */
.icon-star:before { content: '\e802'; } /* '' */
.icon-basket:before { content: '\e803'; } /* '' */
.icon-search:before { content: '\e804'; } /* '' */
.icon-phone:before { content: '\e805'; } /* '' */
.icon-info:before { content: '\e806'; } /* '' */
.icon-help:before { content: '\e807'; } /* '' */
.icon-ok:before { content: '\e808'; } /* '' */
.icon-location:before { content: '\e809'; } /* '' */
.icon-warning:before { content: '\e80a'; } /* '' */
.icon-cancel:before { content: '\e80b'; } /* '' */
.icon-oeil:before { content: '\e80c'; } /* '' */
.icon-clock:before { content: '\e80d'; } /* '' */
.icon-oeil-off:before { content: '\e80e'; } /* '' */
.icon-pencil:before { content: '\e80f'; } /* '' */
.icon-print:before { content: '\e810'; } /* '' */
.icon-calendar:before { content: '\e811'; } /* '' */
.icon-logout:before { content: '\e812'; } /* '' */
.icon-resize-full:before { content: '\e813'; } /* '' */
.icon-down-open:before { content: '\e814'; } /* '' */
.icon-left-open:before { content: '\e815'; } /* '' */
.icon-right-open:before { content: '\e816'; } /* '' */
.icon-up-open:before { content: '\e817'; } /* '' */
.icon-link-ext:before { content: '\f08e'; } /* '' */
.icon-facebook:before { content: '\f09a'; } /* '' */
.icon-filter:before { content: '\f0b0'; } /* '' */
.icon-menu:before { content: '\f0c9'; } /* '' */
.icon-mail:before { content: '\f0e0'; } /* '' */
.icon-linkedin:before { content: '\f0e1'; } /* '' */
.icon-plus:before { content: '\f0fe'; } /* '' */
.icon-angle-left:before { content: '\f104'; } /* '' */
.icon-angle-right:before { content: '\f105'; } /* '' */
.icon-angle-up:before { content: '\f106'; } /* '' */
.icon-angle-down:before { content: '\f107'; } /* '' */
.icon-minus:before { content: '\f146'; } /* '' */
.icon-youtube-play:before { content: '\f16a'; } /* '' */
.icon-instagram:before { content: '\f16d'; } /* '' */
.icon-pdf:before { content: '\f1c1'; } /* '' */
.icon-sliders:before { content: '\f1de'; } /* '' */
.icon-trash:before { content: '\f1f8'; } /* '' */
.icon-cart-plus:before { content: '\f217'; } /* '' */
.icon-user-plus:before { content: '\f234'; } /* '' */
.icon-user-delete:before { content: '\f235'; } /* '' */
.icon-address:before { content: '\f2ba'; } /* '' */
/* ======================================================
   GLOBAL RESET
====================================================== */
*, html, body, iframe, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, table, th, td, audio, video { 
	margin:0; padding:0; outline:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; 
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img { display:block; }
table { border-collapse:collapse; border-spacing:0; }
table td { vertical-align:top; }
iframe, fieldset, img, a img { border:0 none; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; text-align:left; } 
h1, h2, h3, h4, h5, h6 { font-size:100%; }
blockquote::before, blockquote::after, q::before, q::after { content:''; content:none; }
html>body * a { position:relative; }  /* Gets links displaying over a PNG background */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
textarea, table, td, th, code, pre, samp { 
  word-wrap: break-word; /* passage à la ligne forcé */
  -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; /* césure propre */
}
input, select { vertical-align:middle; }


/* ======================================================
   STYLES ELEMENTS HTML
====================================================== */
:root {
  --mainColor: #c0193c;
  --darkRed: #880b2b;
  --darkRed2: #650b21;
  --gray: #7F7F7F;
  --lightGray: #cfcecd;
  --lighterGray: #F5F4F3;
  --black: #2A2928;
  --white: #fff;
  --darkWhite: #F9F9F9;
}

html { width:100%; height:100%; font-family:'Roboto', Arial, Helvetica, sans-serif; font-size:100%; line-height:1.5; font-weight:400; }
body { width: 100%; height: 100%; color: var(--black); text-align: left; background-color: var(--darkWhite); }
main { margin-top:125px; background-color: var(--white); }
h1 { font-family: "RobotoCnd",Arial, Helvetica, sans-serif; font-size: 2rem; line-height: 1.1; font-weight: 700; }
h1:first-letter { text-transform: capitalize; }
h2 { margin:1em 0; font-size: 1.5rem; line-height: 1.3; font-weight:700; }
h3 { margin:.5em 0; font-family:'RobotoCnd', Arial, Helvetica, sans-serif; font-size: 1.25rem; line-height: 1.25; font-weight:700 }
h4 { margin:1.5em 0 0; font-family:'RobotoCnd', Arial, Helvetica, sans-serif; font-size: 1rem; line-height: 1.5; font-weight: 700; }
h5 { font-size: 1rem; line-height: 1.5; font-weight: 700; }
h6 { font-size: 1rem; line-height: 1.5; font-weight: 700; }
a { color:var(--black); text-decoration: underline; }
a:hover, a:focus { color:var(--mainColor); text-decoration: underline; }
a[href ^= 'tel:'] { text-decoration: none; }
p { margin: 0 0 1.5em; max-width:45rem }
strong, b { font-weight:700; }
em, i { font-style:italic; }
ul li { margin:0.5rem 1rem; padding: 0 0.25rem; list-style:disc; }
ol li { margin:0.5rem 1rem; padding: 0 0.25rem; list-style:decimal; }
img { width: 100%; }


/* ======================================================
   TRANSITIONS & ANIMATIONS
====================================================== */
a, button, .button, .toggle-menu { transition: all ease-in-out 0.2s; }
@keyframes imgFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.15;
  }
}
@keyframes fadeout {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    bottom:-500px;
  }
}

/* ======================================================
   CLASSES GENERALES
====================================================== */
#accesslinks { position: absolute; left: -999px; }
.wrapper { margin: 0 auto; padding:2rem 3% }
.inner { margin:0 auto; max-width: 90rem; }
.text { margin:2em auto; max-width:60rem }
.center { text-align:center; }
.center p { margin: 0 auto 1.5em; max-width: 40rem; text-align:left; }
.capitalize { text-transform:capitalize; }
.bigger { font-size:1.15em }
.smaller { font-size:0.85em }
.text ul { margin:0 0 1.5em; max-width:45rem }
.text table { width:100%; max-width:45rem }
.text td { padding: .5rem 1rem; border-top: 1px solid var(--lighterGray); border-bottom: 1px solid var(--lighterGray); }
.text tr td:first-child { font-weight:500 }
.text img { width: auto; }
.flex-grid { display: flex; flex-flow: column wrap; gap: 1em; }
.grid-item { margin:1em 0; }
.flex-item { position: relative; width: 100%; flex-grow: 0; }
.flex-vcenter { align-self: center; }
.flex-text { padding:0 1em; background-color:var(--white); }
.responsive { position: relative; max-width: 100%; padding-top: 56.25%; width: 100%; }
.responsive iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.responsive img { margin:.5em auto; width: 100%; height: auto; max-height: none; max-width: none; }
a.button, button { display:inline-block; margin: 1em 0; padding:.5em 1em; min-width: 150px; font-family: 'RobotoCnd', arial, sans-serif; font-size:inherit; font-weight: 700; color: var(--white); text-transform: uppercase; text-decoration:none; text-align:center; white-space:nowrap; border: 0; background-color: var(--mainColor); border: 1px solid var(--white); border-radius: .5rem; cursor:pointer; }
a.button:hover, a.button:focus, button:hover, button:focus { color: var(--white); text-decoration:none; background-color: var(--darkRed); }
a.button:-moz-focusring, a.button:focus-visible, button:-moz-focusring, button:focus-visible { outline: 2px solid var(--mainColor); }
a.btn-white, button.btn-white { padding:.5em 1em; font-weight: 500; color: var(--black); text-transform:initial; background-color: var(--white); border-color:var(--black); }
a.btn-white:hover, a.btn-white:focus, button.btn-white:focus, button.btn-white:hover { color: var(--white); background-color: var(--mainColor); border-color:var(--mainColor); }
a.btn-small, button.btn-small { padding:0 .5em; min-width:inherit; font-size:.9rem; font-weight:500; text-transform:initial; }
.btn-delete { font-weight: 500; color: var(--black); text-transform:initial; background-color: var(--white); border-color:var(--black); }
.more { font-weight:bold; }
.clear-fix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.lozad { opacity: 0; transition: opacity .7s ease-out 0.2s; }
.loaded { opacity: 1; }
blockquote { position: relative; padding:0 2.5em; font-style:italic; }
blockquote::before { position: absolute; top: 0; left: 0; content:'"'; font-size:3.4em; line-height:1 }
.ctn-msg { position: fixed; bottom: 5%; left: 50%; transform: translateX(-50%); margin:auto; padding:1em; width:90vw; max-width: 480px; color:var(--black); background-color:var(--white); border-radius:1em; box-shadow:0 0 20px rgba(0, 0, 0, .5); z-index:100 }
.msg-hide { animation-duration: 500ms; animation-delay: 4s; animation-fill-mode: forwards; animation-name: fadeout; }
.success { margin:1em 0; }
.success p::before { display:inline-block; margin-right: .5em; font-family: 'icons'; content: '\e808'; font-size: 1em; font-weight: normal; line-height: 1; }
.error { margin:1em 0; color: var(--mainColor); font-weight:500 }
.error p::before { display:inline-block; margin-right: .5em; font-family: 'icons'; content: '\e80a'; font-size: 1em; font-weight: normal; line-height: 1; }

/* Cookies consent */
.cc_div { font-family: "Roboto",Arial, Helvetica, sans-serif; }

/* Specific */
.pretitle { display:block; font-family: 'RobotoCnd', arial, sans-serif; font-size:1.25rem; font-weight:700 }
span.new, span.download, h1.add-new::before { clip-path: polygon(0px 0px, 100% 0px, 100% 100%, 0px 100%, 20px 50%); padding:10px 10px 10px 30px; font-weight: 700; color: var(--white); background-color:var(--mainColor); }
h1.add-new::before { position: absolute; top: 0; left: 0; display:inline-block; content:'Nouveauté'; margin-right: 1em; font-size:.85rem; }
span.redText { color:var(--mainColor); }

#breadcrumbs { padding: 0 3%; font-family: 'RobotoCnd', arial, sans-serif; font-size:.875rem; color:var(--gray); background-color: var(--darkWhite); white-space:nowrap; overflow-x:auto; }
#breadcrumbs a { display: inline-block; padding:.75rem 0; color:var(--mainColor); text-decoration:none }
#breadcrumbs a:hover, #breadcrumbs a:focus { text-decoration:underline }
#breadcrumbs span { display: inline-block; padding:.75rem 0 }
#breadcrumbs span.disable { opacity:.5 }
a.btn-prevcat { margin:0 0 1.5em; padding:.5rem .8rem; width: fit-content; color: var(--black); text-decoration:none; background-color: var(--white); border: 1px solid var(--black); border-radius: .5em; }
a.btn-prevcat:hover, a.btn-prevcat:focus { color:var(--mainColor); border-color:var(--mainColor); }
a.btn-prevcat::before { display: inline-block; margin-right:.5em; font-family: 'icons'; content: '\f104'; }
.addMarginTop { border-top:2.8125rem solid var(--darkWhite) }

/* ======================================================
   FORMULAIRE
====================================================== */
.fieldset { width: 100%; margin-bottom: 2em; }
form p, form .line { max-width:calc(480px - 2.5%); text-align: left; clear:both; }
form .line.full, form .line.code-image, form .line.mi-checkbox { width:100%; max-width:inherit; }
form .line.hidden { display:none }
label, .label { display:block; margin: .75rem 0; font-size: 1rem; font-weight: 500; line-height: 1.3; color: var(--black); text-align: left; cursor:pointer; }
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], input[type="time"], textarea { padding:0.5em 1em; width: 100%; max-width:calc(480px - 2.5%); font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5; color:var(--black); background-color: var(--white); border:1px solid var(--lightGray); border-radius:.5rem }
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="time"]:focus, textarea:focus { border-color:var(--mainColor); outline: 1px solid var(--mainColor); outline-offset: 0; }
textarea { height:10rem; }

/* Submit */
button, input[type="submit"] { font-family: "RobotoCnd", Arial, Helvetica, sans-serif; cursor: pointer; }
.ctn-btns { margin: 1em 0; }

/* Select de base */
select.select, select.select::picker(select) { appearance:base-select }
select.select { padding:.2em .5em; max-width: 180px; font-family:"Roboto", Arial, Helvetica, sans-serif; font-size:.9rem; font-weight: 500; color:var(--black); background-color:var(--lighterGray); border: 1px solid var(--lightGray); border-radius:.5rem }
select.select:focus { border-color:var(--mainColor); outline: 1px solid var(--mainColor); outline-offset: 0; }
select.select::picker-icon { font-family: 'icons'; content:'\f107';  }
select.select::picker(select) { padding: .5em; color:var(--black); background-color:var(--white); border:1px solid var(--lightGray); border-radius:.5rem; box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2) }

/* Select avec container */
.formfield-text, .formfield-texteara, .formfield-select, .formfield-checkbox, .formfield-radio { position: relative; max-width: 240px; }
.formfield-select--container { position: relative; margin: 0; padding-right: 20px; min-width:100px; max-width: 140px; background-color: var(--lighterGray); border: 1px solid var(--lighterGray); border-radius: .5rem; overflow: hidden; /* Le select natif pourra dépasser sans être vu */ }
#form-filters .formfield-select label { margin:0; font-size:.75rem; font-weight:400; color:var(--gray) }
.formfield-select--container::after { position: absolute; top: 50%; transform: translateY(-50%); right: 5px; display: inline-block; font-family: 'icons'; font-size: .8rem; content: '\f107'; pointer-events: none; }
.formfield-select--container select { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; padding: .5em .75em; width: 110%; /* On est sûr de ne plus voir la flèche native */ height: auto; font-family: "Roboto",Arial, Helvetica, sans-serif; font-size: .9rem; line-height: 1.2; font-weight: 500; color:var(--black); background-color: var(--lighterGray); border: 0; border-radius: 0; overflow: hidden; text-overflow: ellipsis; /* On empèche le texte d'aller jusqu'au bout s'il est trop long */ }
.formfield-select--container select::-ms-expand { display: none; /* cacher la flèche pour IE */ }
.formfield-select--container:focus-within { border-color:var(--mainColor); outline: 1px solid var(--mainColor); outline-offset: 0; }
.formfield-select--container.select-list { overflow:inherit; }
.formfield-select--container.select-list input[type="text"] { width: 108%; line-height: 1.2; border:0; outline: none; outline-offset: 0; }
.formfield-select--container.select-list:focus-within .list-filters { display:block; }
.formfield-select--container.select-list .list-filters label { cursor:auto; }

/* Password */
.mi-password { position:relative; max-width:360px }
.mi-password input { padding-right:40px }
.mi-password i.icon-oeil { position:absolute; right:0; bottom:0; margin:.5em; background-color:var(--white); cursor:pointer; }

/* Radios & Checkbox */
.mi-checkbox, .mi-checkbox-ac, .mi-radio { position: relative; margin:1em 0; padding-left:30px }
.mi-radio label .smaller, .mi-checkbox label .smaller { display: contents; }
.mi-radio label, .mi-checkbox label, .mi-checkbox-ac label { margin: 0; position: relative; display: inline-block; color: var(--black); text-transform:inherit; }
.mi-checkbox label, .mi-checkbox-ac label { display: block; }
.mi-checkbox span, .mi-checkbox-ac span { white-space: normal; }
.mi-radio label:last-child, .mi-checkbox label:last-child { margin-bottom: 0; }
.mi-radio label:focus-within, .mi-checkbox label:focus-within { color: var(--black); font-weight: 700; }
input[type="radio"], input[type="checkbox"] { position: absolute; display: inline-block; left: 0; top:0; /* Add if not using autoprefixer */ -webkit-appearance: none; /* Remove most all native input styles */ appearance: none; /* For iOS < 15 */ background-color: var(--lighterGray); /* Not removed via appearance */ margin: 0; font: inherit; color: var(--black); width: 22px; height: 22px; border: 1px solid var(--lightGray); border-radius: 50%; cursor: pointer; }
input[type="radio"]:checked, input[type="checkbox"]:checked { border-color: var(--lightGray); }
input[type="checkbox"] { top:0; border-radius: 0.15em; }
input[type="radio"]::before, input[type="checkbox"]::before { position: absolute; top: calc(50% - 5px); left: calc(50% - 5px); display: block; content: ""; width: 10px; height: 10px; transform: scale(0); transition: 120ms transform ease-in-out; }
input[type="radio"]::before { border-radius: 50%; background-color: var(--black); }
input[type="checkbox"]::before { clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); transform-origin: bottom left; box-shadow: inset 1em 1em var(--black); background-color: var(--black); }
input[type="radio"]:checked::before, input[type="checkbox"]:checked::before { transform: scale(1); }
input[type="radio"]:focus, input[type="checkbox"]:focus { border-color:var(--mainColor); outline: 1px solid var(--mainColor); outline-offset: 0; }
.checkbox--disabled { cursor: not-allowed; }

/* Code image */
form .legend { font-size: 1.2em; font-weight: bold; }
form .code-image { clear:both; text-align: left; }
form .code-image img { border:medium none; float:left; margin:0 0.5em 0 0; width:160px; border-radius:inherit; }
form .code-image input { height:50px; width:160px; text-align:center; letter-spacing:0.3em; text-transform:uppercase; }
a.btn-reloadimgcode { display: inline-block; margin: 0 .5em; font-size: .8em; }

/* Recherche par mot-clé */
#form-search { position: relative; font-size: 1rem; }
#form-search input[type="text"] { padding:1rem 80px .5rem 1rem; background-color:var(--white); border-radius:.5rem; border:none }
#form-search input[type="text"]:focus { outline: none; outline-offset: 0; }
#form-search button { position: absolute; right: 0; margin:.75rem .5rem; padding:.5rem; min-width: inherit; font-size:1rem; line-height: 1; color: var(--mainColor); background-color:transparent; border-radius:0; border:none; }
#form-search button:hover, #form-search button:focus { color:var(--darkRed); }
#form-search button [class^="icon-"]::before, #form-search button [class*=" icon-"]::before { margin:0 }

/* Filtres */
#form-main-filters { display:flex; flex-flow:column; gap:.5em }
#form-filters { margin-top:2em; display:flex; flex-flow:row; justify-content: flex-end; align-items: flex-end; gap:0 1em }

/* Simulation de select (choix multiple pour filtre) */
.filter-title { display: inline-block; padding: .5em .75em; width: 100%; min-width: 120px; font-size: 1rem; line-height: 1.2; font-weight: 400; color:var(--black); }
.filter-category-tree { /*width: 100%; max-height:320px; background-color: var(--white); border-radius: 5px; box-shadow: 0px 0px 3px rgba(0,0,0,.2); overflow-y: auto; z-index: 20*/ }
.filter-category-tree > li { margin: .5rem 0 2rem; padding: 0; list-style: none; }
.filter-category-tree .open-cat { font-weight: 500; }
.filter-category li { position: relative; margin: .75rem 0; padding: 0 0 0 2rem; line-height: 1; list-style: none; }
.filter-category li input { position: absolute; left: 0; top: 0; }
.filter-category li label { font-size: 1rem; color: var(--black); font-weight: 400; text-transform: inherit; }
ul.filter-category ul { display:none; }
ul.filter-category input[type="checkbox"]:checked ~ ul { display:block; margin-bottom:2rem }

/* Order */
.adr-facture .formfield-select--container, .adr-livraison .formfield-select--container { max-width:240px }

/* Contact */
form.form-contact { margin-bottom:3rem }
form.form-contact .line { clear:none; }

/* ======================================================
   HEADER
====================================================== */
#header.wrapper { position: fixed; top: 0; left: 0; padding: 0; width: 100vw; max-width: inherit; height: auto; background: linear-gradient(to top, var(--darkWhite), var(--white) 70%, var(--white) 100%); z-index: 20; }
#header.fixed { border-bottom:2px solid var(--mainColor) }
#header .inner { height: 100%; }
#header .flex-grid { flex-flow: column; gap:0 }
#header .flex-item { position: relative; margin-left: 1rem; padding: 0; width: auto; }
#header .flex-item:nth-child(2) { margin-left: 0; flex-grow: 1; }
a.lnk-logo { display:block; }
img.logo { display:block; margin: 1rem 0 0; width: auto; height:50px; }
.ctn-functions { display:flex; flex-flow: row wrap; justify-content:space-between; }
.blk-function { display:block; width:auto }
.link-function { display: inline-block; padding:1rem; font-size: 1.5rem; line-height:1; color: var(--black); cursor:pointer; }
.link-function:hover, .link-function:focus { color:var(--mainColor); }
.link-function [class^="icon-"]::before, .link-function [class*=" icon-"]::before { margin:0 }
.accountAuth { margin:calc(.5rem - 1px); padding:.5rem; border:1px solid; border-radius:50% }
.link-search { order:2 }
.link-cart { order:3 }
.link-account { order:4 }
.pop-search, .pop-cart, .pop-user { display: none; }
.pop-search { position: absolute; left: 50%; transform: translateX(-50%); margin: 0; width: 96vw; background-color: var(--white); border: 1px solid var(--lightGray); border-radius: .5em; }
.search-items { position: relative; margin-top: 0; padding: 1rem; width: 100%; max-height:90vh; overflow-y: auto; font-size: 1rem; text-align: left; background-color: #fff; border-radius: 5px; box-shadow:0px 0px 15px 0px rgba(0, 0, 0, 0.2); z-index: 10 }
.pop-search .products { margin-top:1em }
.pop-search .tags a { display: inline-block; margin: .5em; padding: 0 0.3em; text-decoration: none; background-color: var(--white); border: 1px solid var(--lightGray); border-radius: 5px; }
.pop-search .tags a:hover, .pop-search .tags a:focus { color:var(--mainColor); border-color:var(--mainColor); }
.pop-search .products a { display: block; margin: .5em 0; line-height: 1.3; text-decoration: none; }
.pop-search .products a::after { content: ""; clear: both; display: block; }
.pop-search .products img { float: left; object-fit: contain; object-position: center; margin-right: .5em; width: 50px; height: auto; max-height: 50px; }
.count { position: absolute; display: block; top: 0; right: 4px; margin: 0; padding: 0; width: 1.4em; height: 1.4em; font-size: 0.85rem; font-weight: 400; line-height: 1.4em; color: var(--white); background: var(--mainColor); border-radius: 50%; text-align: center; }
.list-cart { display:none; position:absolute; top: 4em; right:0; padding: 1em; width: 240px; max-height: calc(100vh - 90px); overflow: auto; font-size: 0.85rem; color: var(--black); background: var(--white); border-radius: 5px; box-shadow:0px 0px 15px 0px rgba(0, 0, 0, 0.2); text-align: left; z-index: 10; }
.list-cart li { margin: 0; padding:.75em 0; border-top: 1px solid var(--darkWhite); list-style:none; }
.list-cart li:first-child, .list-cart li:last-child { border-top:none; }
.link-cart:hover ul.list-cart { display:block; }
.list-cart a.button { display: block; margin: 0; font-size:1rem }
.menu-account { display:none; position:absolute; top: 4em; right:0; padding: 1em; width: 240px; max-height: calc(100vh - 90px); overflow: auto; font-size: 0.85rem; color: var(--black); background: var(--white); border-radius: 5px; box-shadow:0px 0px 15px 0px rgba(0, 0, 0, 0.2); text-align: left; z-index: 10; }
.menu-account li { margin: 0; padding:.75em 0; border-bottom: 1px solid var(--darkWhite); list-style:none; text-align:right; }
.menu-account li:first-child { font-weight:500 }
.menu-account li:first-child, .menu-account li:last-child { border-bottom:none; }
.menu-account a { text-decoration:none; }
.menu-account a:hover, .menu-account a:focus { text-decoration:underline; }
.link-account:hover ul.menu-account { display:block; }
.wish-icon { position: absolute; display: block; top:0; right:0; margin: 0; padding: 0; width: 15px; height: 15px; font-size: 0.85rem; line-height: 1; color: var(--mainColor); }

/* ======================================================
   MENU
====================================================== */
#toggle-menu { display:inline-block; padding:1rem; font-size:1.5rem; line-height: 1; font-weight: normal; color:var(--black); text-decoration: none; text-align: center; cursor:pointer; order:1 }
#toggle-menu::before { display:inline-block; font-family: 'icons'; content: '\f0c9'; }
#toggle-menu.active::before { content: '\e80b'; }
#toggle-menu:hover, #toggle-menu:focus, #toggle-menu:hover i, #toggle-menu:focus i { color:var(--mainColor); }
#blk-menu { display: none; position: absolute; width: 100vw; background-color: var(--lighterGray); box-shadow:0 15px 15px 0 rgba(0, 0, 0, 0.3); }
.menu { position: relative; }
.menu.active { display: block; }
.menu li { position: relative; display: block; margin:0; padding: 0; list-style: none; }
.menu a { position: relative; display:inline-block; padding:1rem; width: 100%; font-size:1rem; line-height:1; font-weight: 500; color:var(--black); text-decoration:none; white-space: nowrap; border: 1px solid var(--lightGray); border-top-color: var(--white); border-left: none; border-right: none; }
.menu > li > a { background-color: var(--lighterGray); z-index:2 }
.menu a:hover, .menu a:focus { color:var(--mainColor); }
.menu > li.active > a { color:var(--mainColor); }
.s-menu { display: none; padding-bottom: 4rem; max-height: 40vh; overflow: auto; background: var(--lightGray); }
.s-menu::after { display:inline-block; position:absolute; bottom:0; left: 0; width:100%; height:4rem; background:linear-gradient(to top, var(--gray), transparent); content:'' }
.s-menu > li > a { font-weight: 400; border-top-color:var(--lighterGray); }
.s-menu > li:first-child > a { border-top:none; }
.menu span.btnOpen { display: inline-block; position: absolute; top:0; right:0; padding:1rem; color: var(--black); line-height: 1; z-index:3 }
.menu span.btnOpen::before { display: inline-block; padding: 0 .5rem; font-family: 'icons'; font-size: 1rem; line-height: 1; content: '\f107'; }


/* ======================================================
   HOMEPAGE
====================================================== */
#top-home { padding: 0 3%; background: linear-gradient(150deg, var(--mainColor) 0%, var(--darkRed2) 100%); font-size: 1.15em; color: var(--white); }
#top-home .flex-grid { gap:0 }
#top-home .flex-item { padding: 2rem 0; overflow-y:clip; }
#top-home .flex-item:first-child { border-bottom:1px solid var(--white) }
#top-home .pretitle { position: relative; line-height: 1; z-index:2 }
#top-home h2 { position: relative; margin:1rem 0; font-size:2rem; line-height: 1; font-weight:700; z-index:2 }
#top-home p { position: relative; margin:0; z-index:2 }
#top-home a.button { position: relative; font-size: 1.25rem; z-index:2 }
#top-home img { position: absolute; bottom:5rem; left:0; object-fit:contain; width:100%; height:100%; opacity:0; z-index:1; animation-duration: 1s; animation-fill-mode: forwards; animation-name: imgFadeIn; }
#top-home .flex-item:first-child img { height: 50%; object-position:bottom right; }
#top-home .flex-item:last-child img { height: 50%; object-position:bottom right; }

#news.wrapper { position: relative; }
#news .flex-grid { flex-direction: column-reverse; gap:0 }
#news .flex-item { padding: 2rem 3% 0; }
#news .flex-item:last-child { padding:0 }
#news h2 { margin:1rem 0; font-size:2rem; line-height: 1; font-weight:700; color:var(--mainColor); }
#slider { margin-bottom: 0; max-width:inherit; max-height:inherit; }
#slider .slide { height: 100%; flex-flow: row nowrap; justify-content:stretch; }
#slider .slide-img img { display: block; width: 100%; height: 100%; max-height: calc(94vw * 9 / 16); object-fit: cover; object-position: center; border-radius: 1em; }
.slick-prev, .slick-next { display: none !important; top:50%; width: 36px; height: 36px; color: var(--white); background: transparent; border:1px solid transparent; border-radius: 50%; z-index:2 }
.slick-prev { left: 1% }
.slick-next { right: 1% }
.slick-prev::before, .slick-next::before { font-family: 'icons'; content: '\e816'; font-size: 20px; line-height: 1; opacity: .5; color: inherit; }
.slick-prev::before { content: '\e815'; }
.slick-prev:hover, .slick-next:hover, .slick-prev:focus, .slick-next:focus { color:var(--mainColor); opacity: 1; background:var(--white); border:1px solid var(--mainColor); }
.slick-dots { bottom:.5em }
.slick-dots li button::before { font-size: 10px; color:var(--white); opacity:.5 }
.slick-dots li.slick-active button::before { color:var(--white); opacity:1 }

body.home #content.wrapper { background-color:var(--lighterGray); }
body.home #content .flex-grid { gap:0 }
body.home #content h1 { margin:.5em 0; font-size:2rem; line-height: 1; color:var(--mainColor); }
body.home #content .flex-item img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 1em; }

#partners.wrapper { position: relative; color:var(--white); background-color:var(--black); }
#partners img.bkg-image { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit:cover; object-position:center; filter: grayscale(100%); opacity:.5; z-index:1 }
#partners::before { display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; content: ''; background: linear-gradient(90deg,rgba(42, 41, 40, 1) 0%, rgba(42, 41, 40, 1) 30%, rgba(42, 41, 40, 0) 100%); z-index:2 }
#partners .inner { position: relative; z-index:3 }
#partners h1 { margin:.5em 0; font-size:2.25rem; line-height: 1; color:var(--white); }
a.lnk-producer { display:inline-block; margin:1rem 1rem 1rem 0; padding:.5rem 1rem; height:4rem; width:auto; max-width:150px; background-color:var(--white); border-radius:.5rem; vertical-align:middle; }
a.lnk-producer img { display:inline-block; object-fit:contain; object-position:center; height:100%; width:100%; }

/* ======================================================
   PAGES
====================================================== */
.bg-lightgray { background-color:var(--lighterGray); }
.bg-gray { background-color:var(--gray); }
#content-head { padding:2rem 3% 2rem; color: var(--white); background: linear-gradient(150deg, var(--mainColor) 0%, var(--darkRed2) 100%); }
#content-head h1 { color:var(--white); }
.ctn-standard #content-head h1 { max-width:45rem }
.intro { margin-top: 1rem; font-size:1.15em; line-height: 1.25; font-weight:500 }
#content-head .intro a { color:var(--white) }
.img-main { object-fit: cover; object-position: center; margin:-3.5rem auto 1.5rem; width: 100%; height: 100%; max-height:240px; border-radius: 1em; }
.flex-grid.blk-img-txt { margin:3rem 0; gap:0; background-color:var(--white); border-radius:.5rem }
.blk-img-txt .flex-item:last-child { padding: .5em 1rem 0; flex-grow:1 }
.blk-img-txt img { object-fit: cover; object-position: center; width: 100%; height: 100%; max-height: 240px; border-radius:.5rem .5rem 0 0; }
.flex-grid.blks-3, .flex-grid.blks-4 { margin:2rem 0; gap:2rem; }
.blks-3 .flex-item, .blks-4 .flex-item { padding-bottom: .5rem; width: 100%; background-color:var(--white); border: 1px solid var(--gray); border-radius:.5rem; text-align:center; }
.blks-3 h3, .blks-3 h4, .blks-4 h3, .blks-4 h4 { padding:.5rem 1rem 0 }
.blks-3 p, .blks-3 p, .blks-4 p, .blks-4 p { margin-bottom:1em; padding:0 1rem; text-align: justify; text-justify: auto; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; }
.blks-3 img, .blks-3 img, .blks-4 img, .blks-4 img { border-radius:.5rem .5rem 0 0; }

/* ======================================================
   ACTUALITES
====================================================== */
.flex-grid.ctn-news { margin:2rem 0; gap:2rem; }
.ctn-news .flex-item { margin:0 auto; padding-bottom: .5rem; width: 100%; max-width: 540px; background-color:var(--white); border: 1px solid var(--gray); border-radius:.5rem; text-align:center; }
.ctn-news a { color:var(--black); text-decoration:none; }
.ctn-news a:hover, .ctn-news a:focus { color:var(--mainColor); }
.ctn-news h3 { padding:.5rem 1rem 0; text-align:left; }
.ctn-news p { margin-bottom:1em; padding:0 1rem; text-align: justify; text-justify: auto; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; }
.ctn-news .blk-img { position: relative; width:100%; height: calc(94vw * 2 / 3); max-height:360px; border-radius:.5rem .5rem 0 0; overflow:hidden; }
.ctn-news img { object-fit: cover; object-position: center; width: 100%; height:100%; transform: scale(1); transition:transform ease-out 0.2s; }
.ctn-news a:hover img, .ctn-news a:focus img { transform: scale(1.1); transition:transform ease-out 0.2s; }
.ctn-newsitem #content-head { padding-bottom: 5rem; }
.ctn-newsitem .ctn-image { margin: -5rem auto 2rem; width: 100%; }
.ctn-newsitem .ctn-image img { border-radius: 1em; }
.ctn-newsitem .text { margin: 0; }

/* ======================================================
   CATALOGUE
====================================================== */
.products.wrapper { padding: 2rem 3% 0; }
.pagenumber { font:400 1rem/1.5 "Roboto",Arial, Helvetica, sans-serif; }
div[data-service] div[data-placeholder] {
  font-size: .8em; padding: 1em; border: 1px solid var(--lightGray); color: var(--gray); margin: .5em
}
#toggle-filters { position: absolute; left: -1rem; top: .2rem; display:inline-block; padding:1rem; font-size:1.5rem; line-height: 1; font-weight: normal; color:var(--black); text-decoration: none; text-align: center; cursor:pointer; order:1 }
#toggle-filters::before { display:inline-block; font-family: 'icons'; content: '\f1de'; }
#toggle-filters.active::before { content: '\e80b'; }
#toggle-filters:hover, #toggle-filters:focus, #toggle-filters:hover i, #toggle-filters:focus i { color:var(--mainColor); }
#ctn-filters { display: none; position: fixed; top: 0; left: 0; padding: 1rem; width: 100%; height: auto; min-height: 100vh; background-color: var(--white); z-index: 50; }
#ctn-filters.active { display:block; }
.btn-close-filters { position:relative; display: inline-block; margin-bottom:1.5em; font-size: 1em; background-color:#fff; cursor: pointer; z-index: 1; }
.btn-close-filters::before { display:inline-block; margin-right:.5em; font-family: 'icons'; content: '\e80b'; font-size: 1em; line-height: 1; }

.list-categories li { margin: 0; padding: 0; list-style: none; }
.list-categories a { display: block; padding: .75rem 0; line-height: 1; border-bottom: 1px solid var(--lighterGray); text-decoration: none; }
.list-categories a:hover, .list-categories a:focus { color:var(--mainColor); }

a.link-reset { display: inline-block; margin: 2rem 0; padding:.5rem .75rem; font-size: .9rem; line-height: 1.2; font-weight: 500; color: var(--gray); border: 1px solid var(--lightGray); border-radius: .5rem; text-decoration: none; }
a.link-reset::before { display: inline-block; margin-right: .5em; font-family: "icons"; content: '\e80b'; }
a.link-reset:hover, a.link-reset:focus { color:var(--mainColor); border-color:var(--mainColor); text-decoration:none; }
.ctn-categories { margin:0 0 2rem; padding-bottom: .5rem; display: flex; flex-flow: row nowrap; align-items: baseline; gap:0 2rem; overflow-x: auto; overflow-y:hidden; }
.ctn-categories a { display:block; font-size: .75rem; line-height: 1.2; text-decoration: none; flex-basis: 0; }
.ctn-categories img { object-fit: contain; object-position: center; margin-bottom:.3rem; width:80px; height:80px; background-color:var(--white); border:1px solid var(--white); border-radius:.5rem; transition: all ease-in-out 0.2s; }
.ctn-categories a:hover img, .ctn-categories a:focus img { border-color:var(--mainColor); transition: all ease-in-out 0.2s; }
.ctn-products { position: relative; margin:1rem 0 3rem; }
.ctn-products h2 { margin: 0 0 2rem; padding-top:1rem; font-size:1.5em }
.flex-grid.product-list { clear:both; margin: 0 0 3rem; align-items: stretch; gap:2rem 3rem; }
a.product { display:block; padding: 1em; height: 100%; text-decoration:none; background-color: var(--white); border-radius: .5rem; }
a.product .image::after { position: absolute; padding: .5rem 1rem; top:50%; left: 50%; transform: translate(-50%, -50%); display:inline-block; font-weight: 700; color: var(--white); background-color: var(--mainColor); border-radius: .5rem; content:'Voir le produit'; white-space: nowrap; opacity:0; transition: opacity .2s ease-out; }
a.product:hover .image::after, a.product:focus .image::after { opacity:1; transition: opacity .2s ease-out; }
a.product img { object-fit: contain; object-position: center; margin:0 auto; width:100%; height:100%; max-width:250px; max-height:250px; min-height:120px; }
a.product:hover img, a.product:focus img { opacity:.3; transition: opacity .5s ease-out; }
a.product .image { position: relative; margin: 0 auto; width: 100%; height:auto; }
a.product span.new, a.product span.download { position:absolute; bottom:0; left:0; font-size: .8em; }
a.product .description { position: relative; margin:.5em 0; }
a.product h3 { margin:0; font-size:1.25rem; color:var(--mainColor); }
a.product h3:first-letter { text-transform:capitalize; }
a.product .producer { font-size:.75rem; line-height: 1rem; font-weight: 500; color: var(--black); }
a.link-wish { position:absolute; bottom:50px; right:.3em; width: auto; height: 36px; font-size:1.5em; line-height:1; background-color:var(--white); border-radius:50%; text-align:center; }
a.link-wish i { line-height:36px }
a i.icon-favori-filled:before { content: '\e805'; color:var(--mainColor); }
.item-action { position: absolute; left: 0; bottom: 0; padding:0 0 0 .5em; width: 100%; height: auto; display:flex; flex-flow:row wrap; justify-content: space-between; align-items: baseline; gap:0 .5em }
.price { font-size:1rem; }
.base-price { margin-right:.5em; font-size:.8em; font-weight:400; text-decoration:line-through; }

/* 
  PAGINATION
*/
.pagination { padding:0 0 4rem; text-align: center; clear: both; }
.pagination a { color:var(--mainColor); text-decoration:none; }
.pagination a:hover, .pagination a:focus { color:var(--mainColor); }
.pagination .ctn-links { float:left; }
.pagination .si-btn, .pagination .pag-link, .pagination .current { display: inline-block; margin:0 0.25em; padding: 0; width: 36px; height: 36px; font-size: 1rem; line-height: 34px; font-weight: 400; color:var(--mainColor); border:1px solid var(--white); border-radius: 5px; }
.pagination .pag-link, .pagination .current { border:1px solid var(--lightGray); }
.pagination .pag-link:hover, .pagination .pag-link:focus { color: var(--white); text-decoration:none; background: var(--mainColor); border: 1px solid var(--mainColor); }
.pagination .current { color: var(--white); background: var(--mainColor); border: 1px solid var(--mainColor); }
.pagination .disabled { display:none; }

/* 
  DETAIL ARTICLE
*/
article.product #content-head { padding-bottom: 5rem; }
article.product h1.add-new { padding-top:45px }
article.product .producer a { font-size: 1.3rem; font-weight:500; color: var(--white); text-transform: uppercase; text-decoration:none }
article.product .producer a:hover, article.product .producer a:focus { color: var(--white); text-decoration:underline }
article.product #content-details { padding:1rem 3% 3rem; }
.shop-item-detail { min-height: 300px; background: linear-gradient(to bottom, var(--lighterGray), var(--white) 300px); }
.shop-item-detail .ctn-image { margin:-4rem auto 1rem; width: 100%; }
.shop-item-detail img.fit-contain  { object-fit: contain; object-position: center; margin:0 auto; padding:1rem; width:100%; height:100%; max-height:240px; background-color: var(--white); border-radius: 1rem; }
.shop-item-detail .ctn-thumbs { display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; gap:1rem 2rem; margin-top:1rem; }
.shop-item-detail .ctn-thumbs a { display: block; width: 100px; height: 100px; background-color: var(--white); border:1px solid var(--lightGray); border-radius:1rem }
.shop-item-detail .ctn-thumbs a img { object-fit:contain; object-position:center;
  padding: .5rem; width:100%; height:100%; border-radius: 1rem; }
.shop-item-detail .top-infos { position:relative }
.shop-item-detail h2 { margin:.5em 0; font-family:'RobotoCnd', Arial, Helvetica, sans-serif; font-size: 1.5rem; line-height: 1.25; font-weight:700 }
a.wishlist-add { float:right; margin:.2rem 0 0 1rem; font-family: "RobotoCnd",Arial, Helvetica, sans-serif; font-size: .75rem; font-weight: 500; color: var(--gray); text-decoration:none; }
a.wishlist-add:hover, a.wishlist-add:focus { color:var(--mainColor); text-decoration:underline; }
.flex-grid.grid-images { flex-direction: row; gap: 0; }
.grid-images .flex-item { padding: 1em; width: calc(100% / 2); flex-grow:0; align-self:center; text-align: center; }
.grid-images img { margin: auto; max-width:160px; }
.blk-payment img { display: inline-block; margin: .2em; width: auto; height:30px; }
.ctn-variations, .ctn-documents, .ctn-standards { margin:2rem 0; }
.blk-variation { margin:1em 0; padding:1rem 1rem .5rem; max-width:45rem; display:flex; flex-flow:row wrap; gap:0 1rem; align-items: baseline; font-family: "RobotoCnd",Arial, Helvetica, sans-serif; background-color:var(--white); border:1px solid var(--lightGray); border-radius:.5rem }
.blk-variation .details { width: 100%; min-height: 1.5rem; flex-grow:1; line-height:1.2 }
.blk-variation .price { font-weight:700; white-space: nowrap; }
.blk-variation .stock { flex-grow: 1; white-space: nowrap; }
.stock-ok { font-size:.75em; font-weight: 500; color:#2FB100 }
.stock-limit { font-size:.75em; font-weight: 500; color:#EFDB00 }
.stock-off { font-size:.75em; font-weight: 500; font-style: italic; color: var(--gray) }
.form-add2cart { display: flex; flex-flow: row nowrap; align-items: center; gap:.5rem 1rem; white-space:nowrap; }
.form-add2cart p { clear: none; }
.ctl-qty { display:inline-flex; align-items:center; }
.value-control { margin: 0; padding: 0; width: 36px; min-width: inherit; height: 36px; font-size: 1rem; line-height: 36px; color: var(--lightGray); background: transparent; border: none; cursor: pointer; }
.value-control:focus, .value-control:hover { color:var(--mainColor); background: transparent; border:none; }
input[type="number"].value-input { margin: 0 1px; padding: 2px; height: 36px; width: 36px; font-family: "RobotoCnd",Arial, Helvetica, sans-serif; font-size: 1rem; line-height: 1; background-color:var(--lighterGray); border:none; text-align: center; }
input[type="number"].value-input::-webkit-outer-spin-button, input[type="number"].value-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"].value-input { -moz-appearance: textfield; }
button.btn-buy { position: relative; margin:0; padding:.2em .6em .7em; min-width: inherit; font-size: 1rem; color:var(--white); text-transform:initial; background-color:var(--mainColor); border:none; }
button.btn-buy:hover, button.btn-buy:active, button.btn-buy:focus { background-color:var(--darkRed); }
button.btn-buy i { font-size:1.2em; line-height:1; font-weight:normal; font-style:normal; }
button.btn-buy span { font-family: "RobotoCnd",Arial, Helvetica, sans-serif; font-size:.5rem; font-weight:700; text-transform:uppercase; }
.screen-reader span { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); margin: 0; padding: 0; width: auto; height: auto; border: 0; white-space: nowrap; transition: all ease-in-out 0.2s; }
a.linkDoc { display: inline-block; margin-right: 2rem; white-space: nowrap; text-decoration: none; }
a.linkDoc:hover, a.linkDoc:focus { text-decoration:underline }
a.linkDoc::before { margin-right: 0.5em; font-family: "icons"; font-size: 1.2em; font-weight: normal; content: "\f1c1"; }
.related-products { background-color:var(--lighterGray); clear:both; }
.related-products div.center { margin:3rem auto; }
/* 
  CART
*/
.tb-panier { width: 100%; }
.tb-panier .item-row { border-bottom:5px solid var(--darkWhite); padding: 0.5em 0; }
.tb-panier .item-row.head, .tb-panier.tb-bottom .item-row { border-bottom: none; }
.tb-panier .item-column { padding-bottom: 0.5em; line-height:1.4; }
.tb-panier .red { font-weight: 700; color: var(--mainColor); text-transform: none; }
.tb-panier .red:before { margin-right: 0.5em; font-family: "icons"; font-weight: normal; content: "\e80a"; }
.tb-panier .head .item-column { display: none; }
.tb-panier .item-column img { float: left; margin-right: 1em; width: 100%; max-width: 80px; height: 100%; max-height: 80px; object-fit: contain; object-position: center; }
.tb-panier .total, .tb-panier .price { width: 100%; white-space: nowrap; }
.tb-panier .tarticles, .tb-panier .tamount { float: left; font-weight: 700; width: 50%; }
.tb-panier .total, .tb-panier .tamount { text-align: right; }
.tb-panier .total::before { content: "Total: "; }
.tb-panier .ln-frais .total, .tb-panier .ln-frais .item-column { float: left; }
.tb-panier .ln-frais .total { float: right; }
.tb-panier .actions { padding:.5em 0 .5em 1em; text-align: right; }
.tb-panier .btn-wishlist { margin:0 .5em; font-size: 1.3em; line-height: 1; text-decoration:none; white-space:nowrap }
.tb-panier .btn-wishlist i { vertical-align: middle; }
.tb-panier .item-column .si-btn { float: right; line-height: 35px; margin-right: 0; margin-left: 70px; text-indent: -55px; text-decoration: none; }
.tb-panier .action-line .item-column { display: table-cell; padding:1em; vertical-align: baseline; text-align: right; }
.tb-panier .qty form { display: inline-block; }
.tb-panier .qty .btn-qty-ok { margin: 0; padding: 0 0.3em; }
.blk-qty { float: left; margin:5px 0; line-height: 25px; }
.blk-qty span { display: none; }
input.qty-input { margin: 0 1px; padding: 2px; height: 36px; width: 36px; font-family: "RobotoCnd",Arial, Helvetica, sans-serif; font-size: 1rem; line-height: 1; background-color:var(--lighterGray); border:none; text-align: center; }
input.qty-input::-webkit-outer-spin-button, input.qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input.qty-input { -moz-appearance: textfield; }
.btn-del-item, .btn-plus, .btn-minus { display: inline-block; margin: 0; padding: 0; width: 36px; min-width: inherit; height: 36px; font-size: 1rem; line-height: 36px; color: var(--gray); text-decoration: none; text-align: center; }
.btn-plus::before, .btn-minus::before { font-family: 'icons'; font-size:inherit; font-weight: normal; }
.btn-plus::before { content: '\f0fe'; }
.btn-minus::before { content: '\f146'; }
.btn-del-item span, .btn-plus span, .btn-minus span { display: none; }
.btn-del-item:hover, .btn-plus:hover, .btn-minus:hover, .btn-del-item:focus, .btn-plus:focus, .btn-minus:focus { color: var(--mainColor); text-decoration: none; }
a.btn-del-item:-moz-focusring, a.btn-del-item:focus-visible { color: var(--mainColor); text-decoration:none; outline: 1px solid var(--mainColor); outline-offset: 0; }
form#form-promo input[type="text"] { display: inline-block; padding: .5em; width: 210px; border-radius:5px 0 0 5px; vertical-align:baseline; }
form#form-promo input[type="text"]:focus { outline:none; }
form#form-promo button { margin:0; padding: .5em; min-width:inherit; font-size: 1rem; line-height: 1.5; border:1px solid var(--mainColor); border-radius:0 5px 5px 0; vertical-align:baseline; }
.ctn-liste { margin:0 0 2em }
ul.list-promos { margin: 0 0 1em; list-style:none; }
ul.list-promos li { display:inline-block; margin:.5em }
ul.list-promos li a { display:inline-block; padding:.1em .5em; background-color: var(--white); border:1px solid var(--gray); border-radius:5px; text-decoration:none; }
ul.list-promos li a:hover, ul.list-promos li a:focus { color: var(--mainColor); border-color:var(--mainColor) }
label[for="save-envoi"], label[for="save-pay"] { font-weight: 400; color: var(--gray); }
.infos-livraison { padding:0 2rem }
/* Bouttons de commande */
a.btn-big, button.btn-big { font-size:1.25em; }
.btn-big::after { margin-left: 0.5em; font-family: "icons"; font-weight: normal; content: "\e816"; transition:all ease-in-out 0.2s }
.btn-big:hover::after, .btn-big:focus::after { margin-left: 1em; transition:all ease-in-out 0.2s }
.img-paymentmode { display: inline-block; margin:0 .2em; height: 20px; width: auto; vertical-align: middle; }
.link-back { display:inline-block; margin:1em 0; }
.link-back::before { display: inline-block; margin-right: .5em; font-family: 'icons'; font-size: 1em; font-weight: normal; content:'\e815'; }

/* 
  CART HISTORY
*/
#cart-history { position: relative; margin: 20px auto; padding: 2.5em; width: auto; max-width: 736px; background-color: var(--white); box-shadow:0px 0px 15px 0px rgba(0, 0, 0, 0.2); border-radius: 1em; }
#cart-history .ctn-btns { text-align: center; }

/*
  COMPTE : identification, enregistrement, mot passe, historique, adresses etc.
*/
section:last-child { padding-bottom:4em }
#content.ctn-login, #content.ctn-order, #content.ctn-order-confirmation, #content.ctn-customer, #content.ctn-password, #content.ctn-register, #content.ctn-change-pass, #cart, #wishlist { padding:0; }
.ctn-customer .wrapper { background-color:var(--lighterGray); }
ul.menu-profile { margin:0 auto; background-color: var(--lighterGray); border-radius: .5rem; white-space:nowrap; overflow-x:auto; }
ul.menu-profile li { display:inline-block; margin:0; padding:0; list-style:none; border-right: 1px solid var(--white); }
ul.menu-profile li:last-child { border-right:none; }
ul.menu-profile li a { display:block; padding:.5em 1em; font-weight:500; text-decoration:none; }
ul.menu-profile li a:hover, ul.menu-profile li a:focus { color: var(--white); background-color:var(--mainColor); }
ul.menu-profile li:first-child a { border-radius:.5rem 0 0 .5rem }
.form-account, .form-address { margin:1em auto 3em; max-width:60rem }
.form-account.flex-grid { align-items:flex-end; }
.form-account .flex-grid, .form-address .flex-grid { align-items:baseline; gap:1em 5% }
.form-account .line, .form-address .line { position: relative; width: 100%; flex-grow: 0; }
.form-account .ctn-password { display: none; }
.ctn-customer .blk-login { padding:3em 0 }
.ctn-customer .blk-login h3 { display:inline; }
.ctn-customer .blk-login a.button { margin: 0; vertical-align:baseline; }
.ctn-customer .blk-customer { padding-bottom:2em }
.ctn-login .flex-grid { align-items:last baseline; }
.ctn-login .flex-item:first-child { padding: 1em 0 0; }
.ctn-login .flex-item:last-child { padding: 0 0 1em; }
.ctn-adresses, .ctn-mode-envoi, .ctn-mode-paiement, .ctn-conditions { border-top:2px solid var(--lightGray) }
.ctn-adresses h3, .ctn-mode-envoi h3, .ctn-mode-paiement h3, .ctn-conditions h3 { margin-top:0; }
.form-account-short { max-width:360px }

.tb-list, .tb-cmd { margin: .5em 0; width: 100%; font-size: .9em; }
.tb-list tr:hover { background-color:var(--lighterGray); }
.tb-list tr.no-border:hover { background-color:inherit; }
.tb-list thead tr:hover { background-color:inherit; }
.tb-list th { padding:.5em; font-size:.85rem; line-height: 1; font-weight:400; color:var(--gray); text-transform:uppercase; vertical-align:baseline; white-space:nowrap; }
.tb-list td { padding:.5em; border-bottom: 1px solid var(--black); text-align: left; vertical-align: baseline; }
.tb-list td.td-btns { text-align:right; }
.tb-list td[colspan="4"] { border: none; text-align:left; }
.tb-list .no-border td { /*border-bottom: 0 none;*/ }
.tb-list .hidden-ln { display: none; }
.tb-list tr.hidden-ln:hover { background-color:var(--white); }
.tb-list .adr { float:left; margin:10px 0 0 0; width:46%; }
.tb-list .adr h4 { padding: 0; }
.tb-list .tracking { clear: both; margin: 10px 0 0; }
.tb-list .tracking h4 { padding: 10px 0 0; }
.tb-list .cmd-details { padding: 1em 1em 3em; }
.tb-list .blk-btn { width:100% }
.tb-list .blk-btn .btn { display: inline-block; }
/* Commandes */
.item-orders { padding:2em 0 }
.list-commandes { min-width: 390px; }
.tb-list.list-commandes tr:first-child:hover { background-color:inherit; }
.list-commandes tr td:first-child { width:50px }
.list-commandes .col-payment, .list-adresses .col-address { display: none; }
.cmd-add2cart::before { display:inline-block; margin-right: .5em; font-family: 'icons'; content: '\e803'; font-size:1em }
.tb-cmd tr td:first-child { width:auto }
.tb-cmd tr:hover { background-color:inherit; }
.tb-cmd td { border-color:var(--lighterGray) }

.form-preferences { margin:1em 0; max-width:360px }
/*********LIST MON COMPTE************/
.list-set .list-item { position: relative; }
.list-collapsible-content { overflow-y: auto; }
/* Wish lists */
.wishlists {  }
ul.list-inline li { display: inline-block; margin:.5em; list-style:none; }
ul.list-inline li:first-child { margin-left:0 }
#addToWishlist-popup, #wishlist-popup { position: relative; margin: auto; padding: 2em; max-width: 30rem; background-color: #fff; box-shadow:0px 0px 15px 0px rgba(0, 0, 0, 0.2); border-radius: 1em; }
.ctn-wishlist-name h3 { display: inline-block; margin-right:1em }
.ctn-wishlist-name a.button { margin:1rem .5em; padding: 0 .5em; min-width: inherit; font-size:.9em; font-weight: 500; color: var(--black); text-transform: initial;
  background-color: var(--white); border-color: var(--black); }
.ctn-wishlist-name a.button:hover, .ctn-wishlist-name a.button:focus { color: var(--white); background-color: var(--mainColor); border-color: var(--mainColor); }
#form-wishlist { display:inline-block; }
/* Staff */
form.form-staff-rights { display:inline-block; }
form.form-staff-rights select, form.form-staff-rights select::picker(select) { appearance:base-select }
form.form-staff-rights select { padding:.2em .5em; font-family:"Roboto", Arial, Helvetica, sans-serif; font-size:.9rem; font-weight: 500; color:var(--black); background-color:var(--lighterGray); border: 1px solid var(--lightGray); border-radius:.5rem }
form.form-staff-rights select:focus { border-color:var(--mainColor); outline: 1px solid var(--mainColor); outline-offset: 0; }
form.form-staff-rights select::picker-icon { font-family: 'icons'; content:'\f107';  }
form.form-staff-rights select::picker(select) { padding: .5em; color:var(--black); background-color:var(--white); border:1px solid var(--lightGray); border-radius:.5rem; box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2) }

/*
  PLUGINS / WIDGETS
*/
/* POP-UP */
.white-popup { background-color: var(--white); border-radius:1em; box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2) }
.mfp-bg { background-color:var(--white) }
img.mfp-img { margin: 40px auto; padding: 1rem; background: var(--white); }
.mfp-content .mfp-close { margin: 1rem; padding: 0 1rem; right: 0; width: auto; min-width: inherit; background-color:var(--black); color: #fff; opacity: 1; }
.mfp-content .mfp-close:hover { background-color:var(--mainColor); }
.mfp-inline-holder .mfp-close { top:-50px; right:-17px;  }
.mfp-arrow-left::before { border-right-color:var(--mainColor); opacity: 1; }
.mfp-arrow-right::before { border-left-color:var(--mainColor); opacity: 1; }
/* ACCORDION */
.accordion.ui-widget { font-family: inherit; }
.accordion .ui-state-default { display: inline-block; margin:0; padding:1rem 3rem 1rem 0; font-size:1.5rem; font-weight: 700; color: var(--black); background:transparent; border: none; }
.accordion .ui-state-active, .accordion .ui-state-hover { color:var(--mainColor); background:transparent; }
.accordion .ui-widget-content { border: none; background:transparent; padding: 0 0 2rem; }
.accordion .ui-widget-content .ui-state-default { margin: 0; padding:1rem 2rem; font-size: 1rem; background:transparent; }
.accordion .ui-widget-content .ui-state-active { background:transparent; }
.accordion div.ui-accordion-content .ui-widget-content { padding-left: 2rem; }
.accordion .ui-widget-content p { margin: 0; }
.accordion .ui-corner-all, .accordion .ui-corner-top { border-radius: 0; }
.accordion .ui-icon { background: transparent; position: absolute; right:0; top:1.25rem; text-indent: 0; font-size: 1.5rem; font-weight: normal; width:36px; height:36px; }
.accordion .ui-widget-content .ui-icon { top:1rem }
.accordion .ui-widget-content .ui-state-active .ui-icon { color:var(--mainColor); }
.accordion .ui-icon-triangle-1-e:before { font-family: 'icons'; content: '\f105'; line-height:36px }
.accordion .ui-icon-triangle-1-s:before { font-family: 'icons'; content: '\f107'; line-height:36px }
.accordion .text { margin: 0; }

/* ======================================================
   FOOTER
====================================================== */
footer { position: relative; z-index: 1; }
footer a { color: var(--white); text-decoration: none; white-space:nowrap; }
footer a:hover, footer a:focus { color: var(--white); text-decoration: underline; }
footer .wrapper { padding: 4rem 3% !important; color: var(--white); background-color:var(--darkRed); }
footer .flex-grid { gap:2rem 3rem; align-items: last baseline; }
footer .flex-item { flex-basis:fit-content; flex-grow:initial; }
footer .flex-item:nth-child(3) { flex-grow: 1; }
footer img.logo { margin:.5em 0; height:36px; }
.copyright-box { margin:3rem 0 0 }
.btn-go-top { display:block; position:absolute; top:2rem; right:1rem; font-size: 1.4em; line-height: 1.4; border: 1px solid var(--white); border-radius: 3em; }
a.link-tel::before { display:inline-block; margin-right: .5em; font-family: 'icons'; content: '\e805'; font-size:1em }
a.link-mail::before { display:inline-block; margin-right: .5em; font-family: 'icons'; content: '\f0e0'; font-size:1em }
a.link-map::before { display:inline-block; margin-right: .5em; font-family: 'icons'; content: '\e809'; font-size:1em }
.signature { font-size:.7em; white-space:normal; }
.btn-social { display: inline-block; margin: .5rem 1em .5rem 0; width: 36px; height: 36px; font-size: 1.2rem; line-height: 34px; text-align: center; border: 1px solid var(--white); border-radius: .5rem; }
#blk-cookies { position: fixed; clear: both; padding: 1em; bottom: 0; width: 100%; color: var(--white); text-align: center; background-color: var(--gray); box-shadow: 0 -10px 15px 1px rgba(0,0,0,.2); z-index: 101; }
.btn-cookies-accept { background-color: var(--white); }
.debug { display: none; }

/**=====================================================
   Smartphone / paysage
====================================================== */
@media (min-width:640px) {
  .flex-grid { flex-direction: row; gap:1em 2%; }
  .reverse { flex-direction: row-reverse; }
  .flex-item { width: calc(98% / 2); }
  #top-home { font-size: 1.25em; }
  #top-home .flex-item { padding:4rem 2rem 4rem 0; width:50%; }
  #top-home .flex-item:last-child { padding-right:0 }
  #top-home .flex-item:first-child { border:none; }
  #top-home h2 { font-size:2.25rem; }
  #top-home .flex-item:first-child img { top:-20%; bottom:inherit; left:-5%; height: 120%; object-position:top left; transform:rotate(-15deg); }
  #top-home .flex-item:last-child img { bottom:-1em; height: 100%; }
  #news.wrapper { margin-top: -4rem; margin-bottom: -4rem; z-index: 10; }
  #news .flex-grid { flex-direction:row; }
  #news .flex-item { padding:5rem 2rem 5rem 0; width:50%; }
  #slider .slide-img img { max-height:inherit; }
  body.home #content .flex-item { padding:3rem 2rem 3rem 0; width:50%; }
  body.home #content h1 { font-size:2.25rem; }
  #partners .container { padding: 1rem 0 }
  .img-main { float:right; margin:-3rem 0 1rem 1rem; max-width:240px; max-height:240px; }
  .blk-img-txt .flex-item:first-child { width:calc((100% - 4rem) / 3) }
  .blk-img-txt .flex-item:last-child { padding:2rem }
  .blk-img-txt img { max-height:inherit; border-radius:.5rem 0 0 .5rem; }
  .product-list .flex-item { width: calc((100% - 3rem) / 2); }
  a.product .image { max-width: 250px; height:200px }
  a.product .image img { object-position: bottom center; max-width: inherit; max-height:inherit; min-height:inherit; }
  a.product span.new, a.product span.download { left:-20px; }
  .ctn-login .flex-item:first-child { padding:1em 3em 1em 0; }
  .ctn-login .flex-item:last-child { padding: 1em 3em; border-left:1px solid var(--black); }
  .form-account .line, .form-address .line { width: calc(95% / 2); }
  #form-login.form-account .line { width:100% }
  .menu a {  }
  .menu span.btnOpen { right: 5vw; }
}

/**=====================================================
   ECRANS taille moyenne : tablettes, petits notebooks
====================================================== */
@media (min-width:768px) {
  h1 { font-size:2.5rem }
  h2 { font-size:2rem }
  h3 { font-size:1.25rem }
  h4 { font-size:1rem }
  .bigger { font-size:1.25em }
  .smaller { font-size:0.75em }
  .intro { font-size:1.5em }
  .pretitle { font-size:1.5rem; }
  .flex-grid { flex-direction: row; gap:1em 2%; }
  .reverse { flex-direction: row-reverse; }
  .flex-item { width: calc(98% / 2); }
  #content-head { padding: 3rem 3%; }
  #news h2 { font-size:2.25rem; }
  .img-main { margin: -4rem 0 2rem 2rem; max-width:360px; max-height:360px; }
  .flex-grid.blks-3, .flex-grid.blks-4 { margin:3rem 0; }
  .blks-3 .flex-item { width:calc((100% - 4rem) / 3) }
  .blks-4 .flex-item { width:calc((100% - 2rem) / 2) }
  .flex-grid.ctn-news { margin:3rem 0; }
  .ctn-news .flex-item { margin: 0; width:calc((100% - 4rem) / 3) }
  .ctn-news .blk-img { height:calc(((94vw - 4rem) / 3) * 2 / 3); max-height: calc((86rem / 3) * 2 / 3); }
  .shop-item-detail img.fit-contain  { max-height:360px }
}
@media (min-width:1024px) {
  main { margin-top:140px; }
  footer .flex-grid { gap:2rem 5rem; }
  #header.wrapper { padding:0 3% }
  #header .flex-grid { flex-flow: row nowrap; align-items:flex-end; gap:0; padding-bottom: 1rem; }
  #header .flex-item { margin-left:0 }
  #header .flex-item:nth-child(2) { text-align: right; }
  img.logo { margin: 0 30% .1rem 0; }
  .ctn-functions { justify-content:flex-end; align-items:flex-end; margin-right: .6rem; margin-top: 1rem; }
  .blk-function { position: relative; }
  .link-search { width:auto; height:auto; }
  .pop-search { left: inherit; right: 0; top: 0; transform:none; margin: 0; width:480px; max-width:480px; background-color:transparent; border:none; }
  #form-search input[type="text"] { border-bottom:2px solid var(--lightGray); border-radius:0 }
  #form-search input[type="text"]:focus { border-color: var(--mainColor); }
  #toggle-menu { display: none; }
  #blk-menu { display: block; position: relative; width: auto; background-color: transparent; box-shadow:none; }
  .menu > li { position: relative; display:inline-block; margin: 0 1rem; }
  .menu > li:last-child { margin-right:0 }
  .menu li:hover .s-menu, .menu li:focus-within .s-menu { display: block; }
  .menu a { padding:1rem; width:auto; border:none; }
  .menu > li > a { background-color: transparent; }
  a.link-menu::after { display: inline-block; margin-left: 1em; font-family: 'icons'; content: '\f107'; font-size: 1rem; line-height: 1; }
  .s-menu { display: none; position: absolute; left:-1rem; top: auto; padding:1rem; width: auto; max-height: inherit; background-color: var(--white); border-radius:.5rem; box-shadow:0px 0px 15px 0px rgba(0, 0, 0, 0.2) }
  .s-menu::after { display:none; }
  .s-menu.active { display: block; }
  .s-menu a { display: block; padding:.5rem 2rem .5rem 1rem; text-align:left; transition:all ease-out .3s; }
  .s-menu a:hover, .s-menu a:focus { padding-left: 1.75rem; padding-right:1.25rem; transition:all ease-in 0.2s; }
  .s-menu a::before { display: block; position: absolute; left: 1rem; font-family: 'icons'; content: '\f105'; font-size: 1rem; line-height: 1; opacity:0; transition:all ease-out 0.2s; }
  .s-menu a:hover::before, .s-menu a:focus::before { opacity:1; transition:all ease-in .3s; }
  .menu span.btnOpen { display:none; }
  .slick-prev, .slick-next { display: inline-block !important }
  .img-main { max-width:480px; max-height:480px; }
  .blks-4 .flex-item { width:calc((100% - 6rem) / 4) }
  #products.wrapper { padding-top:0 }
  #products .inner { position:relative; min-height: 480px; }
  .list-categories a:hover, .list-categories a:focus { padding-left: .75rem; }
  .list-categories a::before { display: block; position: absolute; left: 0; font-family: 'icons'; content: '\f105'; font-size: 1rem; line-height: 1; opacity:0; transition:all ease-out 0.2s; }
  .list-categories a:hover::before, .list-categories a:focus::before { opacity:1; transition:all ease-in .3s; }
  #toggle-filters, .btn-close-filters { display:none; }
  #ctn-filters { position: absolute; display:block; padding:.8rem 4rem 0 0; width: 25%; min-height: inherit; z-index:10 }
  #form-filters { float:right; margin-top: 0; }
  .ctn-categories { margin:2rem 0 2rem 25%; }
  .ctn-products { margin:2rem 0 3rem 25%; }
  .product-list .flex-item { width: calc((100% - 6rem) / 3); }
  .related-products .product-list .flex-item { width: calc((100% - 9rem) / 4); }
  article.product #content-head { padding-bottom: 3rem; }
  .ctn-newsitem #content-head { padding-bottom: 3rem; }
  .intro { width:45rem }
  article.product .producer { width: 60% }
  .shop-item-detail .ctn-image { float: right; width: 40% }
  .ctn-newsitem .ctn-image { float: right; margin:-4rem 0 2rem 2rem; width: 40% }
  .shop-item-detail img.fit-contain  { padding: 2rem; height:auto; max-height:540px }
  .shop-item-detail .ctn-thumbs a { width: 140px; height: 140px; }
  .shop-item-detail .top-infos { padding-right: 5%; width: 60% }

  .tb-panier { display: table; }
  .tb-panier .item-row { display: table-row; }
  .tb-panier .item-column { display: table-cell; padding: 1rem; vertical-align: baseline; border-bottom:5px solid var(--darkWhite); }
  .tb-panier.tb-bottom .item-column { border-bottom: none; }
  .wishlist .actions { width:300px }
  .tb-panier .head .item-column { display: table-cell; padding:1rem; font-size:.85rem; color: var(--gray); text-transform: uppercase; vertical-align: bottom; border:none; }
  .tb-panier .item-column:first-child, .tb-panier .ln-frais .item-column:first-child { padding-left: 0; width:auto; }
  .tb-panier .total::before { content: ''; }
  .tb-panier .qty, .tb-panier .tarticles { width: 220px; }
  .tb-panier .total, .tb-panier .price, .tb-panier .ttext, .tb-panier .tarticles, .tb-panier .tamount, .tb-panier .ln-frais .item-column { float: none; width: 220px; }
  .tb-panier .price { width: 100px; text-align:right; }
  .tb-panier .discount { width: 90px; text-align:right; }
  .tb-panier .total { width: 150px; text-align:right; }
  .tb-panier .item-column .only-mobile { display: none; }
}

/**=====================================================
   ECRANS + grands
====================================================== */
@media (min-width:1280px) {
  h1 { font-size:3rem }
  h2 { font-size:2.25rem }
  h3 { font-size:1.5rem }
  h4 { font-size:1.25rem }
  main { margin-top:150px; }
  #header .flex-grid {  }
  #header .flex-item {  }
  img.logo { margin: 0 30% .2rem 0; height:50px; }
  .tb-panier .price { width: 120px; text-align:right; }
  .tb-panier .discount { width: 100px; text-align:right; }
  .tb-panier .total { width: 180px; text-align:right; }
  #top-home .flex-item { padding: 5rem 5% 7rem; width:50%; }
  #top-home .flex-item:last-child { padding-left: 0; padding-right:10% }
  #news .flex-item { padding: 6rem 5%; width:50%; }
  body.home #content .flex-item { padding:5rem 5% 5rem 0; width:50%; }
  #partners .container { padding: 3rem 5% }
}
@media (min-width:1440px) {
  main { margin-top:180px; }
  #header .flex-grid {  }
  #header .flex-item {  }
  img.logo { margin: 75px 30% .1rem 0; height:75px; transition: all ease-in-out 0.2s; }
  #header.fixed img.logo { height:45px; transition: all ease-in-out 0.2s; }
  .img-main { margin: -4rem 4rem 4rem; max-width:540px; max-height:540px; }
  .signature { font-size:.6em; }
  .debug { display: block }
}