/* Couleurs à remplacer, au besoin :
Jaune :		#ff9e0d
Rouge :		#c91c1b
Gris :		#d1d1d1, #ccc, #666, #ebebeb
Gris pâle : #f3f3f3
Texte :		#333
*/

/*--------------------------------------------------------------------------------------- */
/* Polices locales via font-face */
/*--------------------------------------------------------------------------------------- */
@font-face {
  font-family: "icons";
  src: url("../font/icons.eot?rlnb6e");
  src: url("../font/icons.eot?rlnb6e#iefix") format("embedded-opentype"),
    url("../font/icons.ttf?rlnb6e") format("truetype"),
    url("../font/icons.woff?rlnb6e") format("woff"),
    url("../font/icons.svg?rlnb6e#icons") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "nunitobold";
  src: url("../font/nunito-bold-webfont.eot");
  src: url("../font/nunito-bold-webfont.eot?#iefix") format("embedded-opentype"),
    url("../font/nunito-bold-webfont.woff2") format("woff2"),
    url("../font/nunito-bold-webfont.woff") format("woff"),
    url("../font/nunito-bold-webfont.ttf") format("truetype"),
    url("../font/nunito-bold-webfont.svg#nunitobold") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "nunitolight";
  src: url("../font/nunito-light-webfont.eot");
  src: url("../font/nunito-light-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("../font/nunito-light-webfont.woff2") format("woff2"),
    url("../font/nunito-light-webfont.woff") format("woff"),
    url("../font/nunito-light-webfont.ttf") format("truetype"),
    url("../font/nunito-light-webfont.svg#nunitolight") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "nunitoregular";
  src: url("../font/nunito-webfont-webfont.eot");
  src: url("../font/nunito-webfont-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("../font/nunito-webfont-webfont.woff2") format("woff2"),
    url("../font/nunito-webfont-webfont.woff") format("woff"),
    url("../font/nunito-webfont-webfont.ttf") format("truetype"),
    url("../font/nunito-webfont-webfont.svg#nunitoregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "open_sans_condensedbold";
  src: url("../font/opensans-condbold-webfont.eot");
  src: url("../font/opensans-condbold-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("../font/opensans-condbold-webfont.woff2") format("woff2"),
    url("../font/opensans-condbold-webfont.woff") format("woff"),
    url("../font/opensans-condbold-webfont.ttf") format("truetype"),
    url("../font/opensans-condbold-webfont.svg#open_sans_condensedbold")
      format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "latobold";
  src: url("../font/Lato-Bold-webfont.eot");
  src: url("../font/Lato-Bold-webfont.eot?#iefix") format("embedded-opentype"),
    url("../font/Lato-Bold-webfont.woff2") format("woff2"),
    url("../font/Lato-Bold-webfont.woff") format("woff"),
    url("../font/Lato-Bold-webfont.ttf") format("truetype"),
    url("../font/Lato-Bold-webfont.svg#latobold") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "latoregular";
  src: url("../font/Lato-Regular-webfont.eot");
  src: url("../font/Lato-Regular-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("../font/Lato-Regular-webfont.woff2") format("woff2"),
    url("../font/Lato-Regular-webfont.woff") format("woff"),
    url("../font/Lato-Regular-webfont.ttf") format("truetype"),
    url("../font/Lato-Regular-webfont.svg#latoregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "guifx";
  src: url("../font/guifx_v2_transports-webfont.eot");
  src: url("../font/guifx_v2_transports-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("../font/guifx_v2_transports-webfont.woff2") format("woff2"),
    url("../font/guifx_v2_transports-webfont.woff") format("woff"),
    url("../font/guifx_v2_transports-webfont.ttf") format("truetype"),
    url("../font/guifx_v2_transports-webfont.svg#guifx_v2_transportsregular")
      format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "AmaticSC";
  src: url("../font/AmaticSC-Regular.eot");
  src: url("../font/AmaticSC-Regular.eot?#iefix") format("embedded-opentype"),
    url("../font/AmaticSC-Regular.woff2") format("woff2"),
    url("../font/AmaticSC-Regular.woff") format("woff"),
    url("../font/AmaticSC-Regular.ttf") format("truetype"),
    url("../font/AmaticSC-Regular.svg#AmaticSC-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Christed";
  src: url("../font/ChristedFontRegular.eot");
  src: url("../font/ChristedFontRegular.eot?#iefix") format("embedded-opentype"),
    url("../font/ChristedFontRegular.woff2") format("woff2"),
    url("../font/ChristedFontRegular.woff") format("woff"),
    url("../font/ChristedFontRegular.ttf") format("truetype"),
    url("../font/ChristedFontRegular.svg#Christed") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "CuteBeSpecial";
  src: url("../font/CuteBeSpecialbySitujuh.eot");
  src: url("../font/CuteBeSpecialbySitujuh.eot?#iefix")
      format("embedded-opentype"),
    url("../font/CuteBeSpecialbySitujuh.woff2") format("woff2"),
    url("../font/CuteBeSpecialbySitujuh.woff") format("woff"),
    url("../font/CuteBeSpecialbySitujuh.ttf") format("truetype"),
    url("../font/CuteBeSpecialbySitujuh.svg#CuteBeSpecial") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Hero";
  src: url("../font/Hero.eot");
  src: url("../font/Hero.eot?#iefix") format("embedded-opentype"),
    url("../font/Hero.woff2") format("woff2"),
    url("../font/Hero.woff") format("woff"),
    url("../font/Hero.ttf") format("truetype"),
    url("../font/Hero.svg#Hero") format("svg");
  font-weight: normal;
  font-style: normal;
}

.incTinyMce.vacances * {
  color: red !important;
  float: left;
  width: 100%;
  margin-top: 20px;
}

/*--------------------------------------------------------------------------------------- */
/* Style Reset - Normalize */
/*--------------------------------------------------------------------------------------- */
/*! normalize.css v1.1.0 | MIT License | git.io/normalize */
abbr,
address,
article,
aside,
audio,
b,
blockquote,
body,
canvas,
caption,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
picture,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
main,
mark,
menu,
nav,
object,
ol,
p,
pre,
q,
samp,
section,
small,
span,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
ul,
var,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: 0 0;
}
a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: 0 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
picture,
main,
nav,
section,
summary,
iframe {
  display: block;
}
address,
caption,
cite,
code,
dfn,
th,
var {
  font-style: normal;
  font-weight: 400;
}
caption,
th {
  text-align: left;
}
a:active,
embed,
object {
  outline: 0;
}
audio,
canvas,
video {
  vertical-align: middle;
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden] {
  display: none;
}
html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
button,
html,
input,
select,
textarea {
  font-family: sans-serif;
}
body {
  margin: 0;
}
a:focus,
button:focus {
  outline: thin dotted;
}
abbr[title] {
  border: 0;
  text-decoration: none;
}
b,
strong {
  font-weight: 700;
}
dfn {
  font-style: italic;
}
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  display: block;
  height: 0;
  padding: 0;
  border: 0;
}
mark {
  background: #ff0;
  color: #000;
}
p,
pre {
  margin: 0 0 1em;
}
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  _font-family: "courier new", monospace;
  font-size: 1em;
}
pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}
q {
  quotes: none;
}
q:after,
q:before {
  content: "";
  content: none;
}
small {
  font-size: 100%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
nav ol,
nav ul {
  list-style: none;
  list-style-image: none;
  margin: 0;
}
img {
  border: 0;
  -ms-interpolation-mode: bicubic;
}
svg:not(:root) {
  overflow: hidden;
}
figure,
form {
  margin: 0;
}
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}
legend {
  border: 0;
  padding: 0;
  white-space: normal;
  *margin-left: -7px;
}
button,
input,
select,
textarea {
  font-size: 100%;
  margin: 0;
  vertical-align: baseline;
  *vertical-align: middle;
}
button,
input {
  line-height: normal;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
  *overflow: visible;
}
button {
  padding: 0;
  border: 0 none;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
  *height: 13px;
  *width: 13px;
}
input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
textarea {
  overflow: auto;
  vertical-align: top;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*--------------------------------------------------------------------------------------- */
/* Styles generaux */
/*--------------------------------------------------------------------------------------- */

/* - - - - - Box-model - - - - - */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box !important;
  -moz-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

td,
th {
  vertical-align: top;
}
hr {
  margin: 1em 0;
  border-top: 1px solid #d1d1d1;
}
img {
  display: block;
  vertical-align: middle;
}
blockquote {
  margin-bottom: 1em;
  font-style: italic;
}
cite {
  font-weight: bold;
}
q {
  font-style: italic;
}

/* Méthode de clear float */
.clear {
  clear: both;
}
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: ".";
  clear: both;
  height: 0;
}
.ie8 .clearfix {
  zoom: 1;
}

/* Fixe espacement inline-block | Si on ne peut pas retirer les espaces blancs en programmation */
.ie8 .ibfix {
  letter-spacing: -1em;
  word-spacing: -1em;
}
.ie8 .ibfix > * {
  letter-spacing: normal;
  word-spacing: normal;
}

.ibfix {
  font-size: 0rem;
}
.ibfix > * {
  font-size: 1rem;
  zoom: 1;
}

/* Cacher pour les lecteurs d'écrans et navigateurs */
.hidden,
.champCache {
  display: none !important;
  visibility: hidden;
}

/* Passe la navigation, pour screen reader */
.passeNav {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Correction pour AddThis */
#_atssh {
  top: 0;
}

/* Mobile vs Desktop */
.mobile {
  display: none !important;
}

@media only screen and (max-width: 767px) {
  .desktop {
    display: none !important;
  }
  .mobile {
    display: block !important;
  }
}

/* Icon font - Fontello
--------------------------------------------------------------------------------------- */
/*[class^="icon-"]:before, [class*=" icon-"]:before,
.incTinyMce ul li:before{
	display: inline-block;
	width: 1em;
	font:normal normal 1em/1em "icons";
	speak: none;
	text-decoration: inherit;
	text-align: center;
	font-variant: normal;
	text-transform: none;
}*/

[class^="icon-"],
[class*=" icon-"],
.incTinyMce ul li:before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icons" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-right:before {
  content: "\e800";
} /* '' */
.icon-double-right:before {
  content: "\e800\e800";
  white-space: nowrap;
  letter-spacing: -2px;
}
.icon-left:before {
  content: "\e801";
} /* '' */
.icon-double-left:before {
  content: "\e801\e801";
  white-space: nowrap;
  letter-spacing: -2px;
}
.icon-up:before {
  content: "\e802";
} /* '' */
.icon-down:before {
  content: "\e803";
} /* '' */
.icon-menu:before {
  content: "\e804";
} /* '' */
.icon-search:before {
  content: "\e805";
} /* '' */
.icon-cancel:before {
  content: "\e806";
} /* '' */
.icon-facebook:before {
  content: "\e807";
} /* '' */
.icon-twitter:before {
  content: "\e808";
} /* '' */
.icon-pinterest:before {
  content: "\e809";
} /* '' */
.icon-gplus:before {
  content: "\e80a";
} /* '' */
.icon-linkedin:before {
  content: "\e80b";
} /* '' */
.icon-check:before {
  content: "\e80c";
} /* '' */
.icon-print:before {
  content: "\e80d";
} /* '' */
.icon-cart:before {
  content: "\e80e";
} /* '' */
.icon-mosaic:before {
  content: "\e80f";
} /* '' */
.icon-user:before {
  content: "\e810";
} /* '' */
.icon-star:before {
  content: "\e811";
} /* '' */
.icon-star-half:before {
  content: "\e812";
} /* '' */
.icon-remove:before {
  content: "\e813";
} /* '' */
.icon-logout:before {
  content: "\e814";
} /* '' */
.icon-share:before {
  content: "\e815";
} /* '' */
.icon-play-circled2:before {
  color: #fff;
  content: "\e816";
} /* '' */
.icon-arrow_left:before {
  content: "\e900";
}
.icon-arrow_right:before {
  content: "\e901";
}
.icon-zoom:before {
  content: "\e902";
}
.icon-newsletter:before {
  content: "\e905";
  font-size: 44px;
  color: #fff;
}

/* Body et HTML
--------------------------------------------------------------------------------------- */
body {
  font: 400 15px/22px "nunitoregular", Arial, sans-serif;
  color: #666;
  background: #f5f5f5;
}

.adulte {
  background: none #f5f5f5;
}

@media only screen and (max-width: 960px) {
  body {
    background: none #f5f5f5;
  }
}

.grid {
  display: none;
  position: absolute;
  width: 100%;
  height: 1000px;
  background: url(../gx/m/_grid.png) 50% 0 repeat-y;
  opacity: 0.5;
  z-index: 9999;
  pointer-events: none;
}

/* Conteneurs
--------------------------------------------------------------------------------------- */
.conteneur {
  position: relative;
  width: 100%;
  min-width: 300px;
  max-width: 960px;
  margin: 0 auto;
}

/* IE8 est barré à 960px */
.no-mediaqueries .conteneur {
  width: 980%;
  min-width: 300px;
  max-width: 980px;
}

main {
  min-height: 500px;
  min-width: 320px;
}
.ie8 main {
  min-height: 0;
}

@media only screen and (max-width: 960px) {
  main {
    padding: 0 16px;
  }
}

@media only screen and (max-width: 767px) {
  main {
    padding: 0 10px 0 10px;
  }
}

.bloc {
  min-height: 500px;
  border: 5px solid #e7e7e7;
  border-radius: 5px;
  background: #fff;
}
.blocPadding {
  padding: 40px 20px;
}

@media only screen and (max-width: 767px) {
  .blocPadding {
    padding: 14px;
  }
}

/* Titres
--------------------------------------------------------------------------------------- */
h1,
.h1mobile {
  font: 400 35px/40px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  margin-bottom: 0.8em;
}
h2 {
  font: 400 26px/30px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  margin-bottom: 0.8em;
}
h3 {
  font: 400 19px/23px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  text-transform: uppercase;
  margin-bottom: 0.8em;
}
h3 .petitH3 {
  font: 700 12px/16px "open_sans_condensedbold", Arial, sans-serif;
  font-weight: normal;
}
h4 {
  font: 400 16px/20px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  margin-bottom: 1em;
}

.h1mobile {
  margin: 20px 20px 0;
  text-align: center;
}

.incTinyMce h2,
.incTinyMce h3,
.incTinyMce h4 {
  margin: 1.3em 0 0.5em;
}

.alignC {
  text-align: center;
}

/* Hyperliens
--------------------------------------------------------------------------------------- */
a {
  color: #333;
  text-decoration: none;
  -webkit-transition: color 0.15s linear 0s;
  transition: color 0.15s linear 0s;
}
a:hover,
a:focus,
a:active {
  color: #333;
  outline: none;
}

.btnGen {
  display: inline-block;
  height: 35px;
  font: 16px/35px "nunitobold";
  color: #fff;
  text-align: center;
  padding: 0 30px;
  border-radius: 35px;
}

/* bouton vert */
.btn1 {
  background-color: #86a740;
}
.btn1:hover {
  color: #fff;
  background-color: #6d8e27;
}

/* bouton blanc */
.btn2 {
  color: #6d8e27;
  background-color: #fff;
}
.btn2:hover {
  background-color: #fff;
}

/* Textes et CMS
--------------------------------------------------------------------------------------- */
.incTinyMce a {
  color: #2ebedd;
  text-decoration: underline;
}
.incTinyMce a:hover,
.incTinyMce a:focus,
.incTinyMce a:active {
  color: #2ebedd;
}

.incTinyMce abbr[title] {
  border-bottom: 1px dotted;
}
.incTinyMce img {
  max-width: 100%;
  max-height: 100%;
}

/* - - - Listes - - - */
.incTinyMce ul,
.incTinyMce ol {
  margin-bottom: 1em;
  overflow: hidden;
}
.incTinyMce ul {
  list-style-type: none;
}
.incTinyMce ul li {
  position: relative;
  margin-left: 24px;
}
.incTinyMce ul li:before {
  content: "\2022";
  position: absolute;
  top: 4px;
  left: -18px;
  color: #2ebedd;
}
.incTinyMce ol li {
  margin-left: 30px;
}
.incTinyMce ol ol > li {
  list-style: lower-alpha;
}

.incTinyMce strong,
.incTinyMce b {
  font-family: "nunitobold";
  font-weight: 400;
}

/* - - - Image en float - - - */
.mortaise {
  float: left;
  margin: 0.25em 1.25em 1.25em 0;
  text-align: center;
  font-size: 12px;
}
.mortaise img {
  /*border:1px solid #666;*/
}

.intro {
  font: 400 16px/22px "nunitobold", Arial, sans-serif;
  color: #000;
}

.note {
  font-size: 11px;
  line-height: 1.5em; /*font-style: italic;*/
}

.vide {
  margin-bottom: 50px;
  padding: 40px 20px;
  border: 1px solid #d1d1d1;
  background-color: #f3f3f3;
  text-align: center;
  font: 400 20px/36px "open_sans_condensedbold", Arial, sans-serif;
  color: #000;
}
.rechVide {
  margin-top: 26px;
}

.cacher {
  display: none;
}

@media only screen and (max-width: 1170px) {
  .rechVide {
    margin: 26px 20px 0;
  }
}

@media only screen and (max-width: 767px) {
  .vide {
    margin-bottom: 24px;
    padding: 20px;
    font: 400 16px/24px "open_sans_condensedbold", Arial, sans-serif;
  }
}

/* Points de suspension a la fin de la fonction couperTexte */
.hellip {
  white-space: nowrap;
  color: #333;
  font-size: 0.9em;
}

/* - - - Responsive video - - - */
.videoConteneur {
  max-width: 520px;
  margin: 0 auto;
}
.video {
  position: relative;
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%; /* Ratio 16/9 */
  padding-top: 30px; /* Hauteur des controles */
}

.video iframe,
.video object,
.video embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* - - - Style par défaut d'un tableau - - - */
.incTinyMce table {
  margin-bottom: 1em;
  border: 1px solid #666;
}
.incTinyMce table th {
  font: 400 16px/20px "open_sans_condensedbold", Arial, sans-serif;
  color: #fff;
  text-transform: uppercase;
  border: 1px solid #666;
  background: #333;
}
.incTinyMce table td,
.incTinyMce table th {
  min-width: 50px;
  padding: 0.25em 0.5em;
}
.incTinyMce table tr:nth-child(even) {
  background: #eee;
}
.incTinyMce table th strong,
.incTinyMce table th b {
  font-family: "open_sans_condensedbold";
}

/* tableau page Nous joindre */
.incTinyMce table#tbContact {
  border: 0;
}
.incTinyMce table#tbContact td {
  padding: 0.5em 0;
}
.incTinyMce table#tbContact tr:nth-child(even) {
  background: #fff;
}

@media only screen and (max-width: 910px) {
  .incTinyMce table#tbContact,
  .incTinyMce table#tbContact tr,
  .incTinyMce table#tbContact td {
    display: block;
  }
}

/* Icones
--------------------------------------------------------------------------------------- */
/* Creer une icone sur les liens PDF et RSS */
.lienPDF {
  display: inline-block;
  margin: 1em 0;
  line-height: 30px;
}
.lienPDF:before {
  content: "";
  display: inline-block;
  width: 29px;
  height: 31px;
  margin-right: 6px;
  background: url(../gx/m/icone-pdf.png) 0 0 no-repeat;
  vertical-align: -10px;
}

.lienRSS {
  display: inline-block;
  margin: 1em 0;
}
.lienRSS:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  background: url(../gx/m/icone-rss.png) 0 0 no-repeat;
  vertical-align: -3px;
}

/*--------------------------------------------------------------------------------------- */
/* Formulaires */
/*--------------------------------------------------------------------------------------- */
input,
select {
  vertical-align: middle;
}
input[type="radio"],
input[type="checkbox"] {
  vertical-align: -1px;
  margin-right: 10px;
}
input[readonly] {
  background-color: #eee;
}
textarea {
  resize: vertical;
}
label {
  display: block;
  margin-bottom: 5px;
}

/* Couleur de l'etoile pour champs obligatoires */
label abbr,
.note abbr {
  padding: 0 2px;
  border: 0 none !important;
  color: #86a740;
  cursor: help;
}

/* - - - Input default - - - */
.form input[type="text"],
.form input[type="email"],
.form input[type="password"],
.form input[type="tel"],
.form input[type="number"],
.form input[type="search"],
.form input[type="url"],
.form select,
.form .customSelect,
.form textarea,
.multiSelect {
  width: 100%;
  max-width: 350px;
  height: 36px;
  padding: 8px 10px;
  border: 1px solid #cac9c9;
  border-radius: 0;
  -webkit-appearance: none;
  font: 400 15px/18px "nunitolight", Arial, sans-serif;
  color: #636466;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: box-shadow ease-in-out 0.3s;
  transition: box-shadow ease-in-out 0.3s;
}

.ie8 .form input[type="password"] {
  font-family: Arial, Helvetica, sans-serif !important;
}

input[type="number"] {
  -moz-appearance: textfield;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.form textarea {
  height: 104px;
  max-width: 9999px;
}

@media only screen and (max-width: 640px) {
  .form input[type="text"],
  .form input[type="email"],
  .form input[type="password"],
  .form input[type="tel"],
  .form input[type="number"],
  .form input[type="search"],
  .form input[type="url"],
  .form select,
  .form .customSelect,
  .form textarea,
  .multiSelect {
    max-width: 100%;
  }
}

/* - - - Shadow focus - - - */
.form input[type="text"]:focus,
.form input[type="email"]:focus,
.form input[type="password"]:focus,
.form input[type="tel"]:focus,
.form input[type="search"]:focus,
.form input[type="url"]:focus,
.form select:focus,
.form textarea:focus,
.form .customSelect.customSelectFocus,
.multiSelect.focus {
  outline: 0;
  border: 1px solid #2ebedd;
  border: 1px solid rgba(46, 190, 221, 1);
  /*-webkit-box-shadow:0 0 5px rgba(46,190,221,1);
	box-shadow:0 0 5px rgba(46,190,221,1);*/
}

/* - - - Custom Select - - - */
.customSelect,
.multiSelect {
  background: url(../gx/m/select.png) right -34px no-repeat #fff;
}
.customSelect.customSelectFocus,
.multiSelect.focus {
  background-position: right 14px;
}
.wrapper {
  position: relative;
  display: inline-block;
}
span.customSelectInner {
  width: 100% !important;
}

/* - - - Placeholders - - - */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #231f20; /*font-style:italic;*/
}
input::-moz-placeholder,
textarea::-moz-placeholder {
  opacity: 1;
  color: #231f20; /*font-style:italic;*/
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #231f20 !important; /*font-style:italic;*/
}

/* - - - Buttons - - - */
/*button, .button{
	display:inline-block;
	text-decoration:none !important;
	background-color: transparent;
	-webkit-transition: background 0.15s linear 0s, color 0.15s linear 0s;
	transition: background 0.15s linear 0s, color 0.15s linear 0s;
}
.button{
	padding:0 35px;
	border-radius:5px;
	background-color:#ff9e0d;
	text-align: center;
	font:700 14px/48px Arial, Helvetica, sans-serif;
	color:#000;
	text-transform: uppercase;
}

button:hover, button:focus, button:active{ outline:none; }
.button:hover, .button:focus, .button:active{ background-color: #ffaf0f; color:#000; outline:none; } */

.boutonInactif,
.boutonInactif:hover,
.boutonInactif:focus,
.boutonInactif:active {
  background-color: #999;
  color: #000;
  cursor: default;
  filter: none;
}

.buttonSec {
  display: inline-block;
  height: 35px;
  font: 13px/35px "nunitobold";
  color: #333;
  text-decoration: none !important;
  padding: 0 17px;
  border: 1px solid #d1d1d1;
  border-radius: 35px;
  background-color: #ebebeb;
  vertical-align: -1px;
  -webkit-transition: background 0.15s linear 0s, color 0.15s linear 0s;
  transition: background 0.15s linear 0s, color 0.15s linear 0s;
}

.buttonSec:hover,
.buttonSec:focus,
.buttonSec:active {
  color: #333;
  background-color: #fff;
}

@media only screen and (max-width: 767px) {
  .button {
    padding: 0 15px;
  }
}

/* - - - Avertissements et erreurs - - - */
.messageInfo,
.messageSucces,
.messageAvertissement,
.messageErreur,
.transportGratuit {
  margin-bottom: 30px;
  padding: 10px;
  border: 1px solid;
  border-radius: 4px;
  text-align: center;
}
.transportGratuit {
  margin-top: 10px;
  line-height: 20px;
}

.colPanier > .messageInfo,
.colPanier > .messageSucces,
.colPanier > .messageAvertissement,
.colPanier > .transportGratuit,
.colPanier > .messageErreur {
  margin-right: 300px;
}
.colPrincipale > .messageInfo,
.colPrincipale > .messageSucces,
.colPrincipale > .messageAvertissement,
.colPrincipale > .messageErreur {
  margin-left: 270px;
}

@media only screen and (max-width: 767px) {
  .colPanier > .messageInfo,
  .colPanier > .messageSucces,
  .colPanier > .messageAvertissement,
  .colPanier > .transportGratuit,
  .colPanier > .messageErreur {
    margin-right: 0;
  }
  .colPrincipale > .messageInfo,
  .colPrincipale > .messageSucces,
  .colPrincipale > .messageAvertissement,
  .colPrincipale > .messageErreur {
    margin-left: 0;
  }
}

.messageInfo {
  color: #006592;
  background-color: #c6edff;
  border-color: #006592;
}
.messageSucces {
  color: #004d07;
  background-color: #dff2bf;
  border-color: #004d07;
}
.messageAvertissement {
  color: #7a440a;
  background-color: #ffffb3;
  border-color: #7a440a;
}
.transportGratuit {
  color: #f7941d;
  background-color: #fff4c6;
  border-color: #ffce93;
}
.transportGratuit strong {
  color: #f7941d;
}
.transportGratuit span {
  color: #f7941d;
  font-weight: bold;
  font-size: 20px;
  line-height: 30px;
}
.transportGratuit a.petit {
  color: #f7941d;
  text-decoration: underline;
  font-size: 11px;
  line-height: 28px;
}
.transportGratuit a.retour {
  color: #000;
}
.messageErreur {
  color: #c00;
  background-color: #fdd;
  border-color: #c00;
}

.erreur,
.erreur label,
.erreur a,
.erreur abbr {
  color: #c00 !important;
}
.erreur input,
.erreur textarea,
.erreur select,
.erreur .customSelect,
input.erreur,
textarea.erreur,
select.erreur,
.customSelect.erreur {
  border: 1px solid #c00 !important;
}

.form .erreur input:focus,
.form .erreur textarea:focus,
.form .erreur select:focus,
.form .erreur .customSelect.customSelectFocus,
.form input.erreur:focus,
.form textarea.erreur:focus,
.form select.erreur:focus,
.form customSelect.customSelectFocus.erreur {
  -webkit-box-shadow: 0 0 5px rgba(204, 0, 0, 0.8);
  box-shadow: 0 0 5px rgba(204, 0, 0, 0.8);
}

/* Form Layout
--------------------------------------------------------------------------------------- */
.form .col1,
.form .col2 {
  float: left;
  width: 47.5%;
  margin-bottom: 1em;
}
.form .col1 {
  clear: left;
}
.form .col2 {
  margin-left: 5%;
}
.form .colFull {
  clear: left;
  margin-bottom: 20px;
}

.form .rang {
  clear: left;
  width: 100%;
  height: 36px;
  margin-bottom: 20px;
}

.form .rang label {
  clear: left;
  float: left;
  width: 170px;
  line-height: 36px;
}
.form .rang input,
.form .rang .wrapper,
.form .rang textarea {
  float: left;
  width: 100%;
  margin-left: 20px;
}
.form .rang .wrapper {
  width: 68%;
}
.form .rang select {
  /*width:300px;*/
  width: 100% !important;
}
.form .rang textarea {
  width: 100%;
  max-width: 600px;
}

.form .radiocheck {
  clear: left;
  margin-bottom: 20px;
}
.form .radiocheck input {
  display: inline-block;
  width: auto;
}

.form .radiocheck label {
  display: inline;
}

@media only screen and (max-width: 960px) {
  .form .rang {
    height: auto;
    margin-bottom: 10px;
  }
  .form .rang label,
  .form .rang input,
  .form .rang .wrapper {
    float: none;
    width: 100%;
    margin-left: 0;
  }
  .form .rang select {
    width: 100%;
  }
}

@media only screen and (max-width: 640px) {
  .form .col1,
  .form .col2 {
    width: 100%;
  }
  .form .col2 {
    margin-left: 0;
  }
}

/*--------------------------------------------------------------------------------------- */
/* Elements UI */
/*--------------------------------------------------------------------------------------- */

/* - - - Menu deroulant pour mobile - - - */
.menuDeroulant {
  position: relative;
  width: 100%;
  height: 42px;
  padding: 0 36px 0 12px;
  border: 1px solid #86a740;
  border-radius: 0;
  background-color: #fff;
  text-align: left;
  font: 400 16px/42px "nunitolight", Arial, sans-serif;
  color: #333;
}

.menuDeroulant:after {
  content: "";
  position: absolute;
  top: 17px;
  right: 14px;
  display: block;
  width: 10px;
  height: 8px;
  background: url(../gx/m/select.png) 0 0 no-repeat;
}

.menuDeroulant:hover,
.menuDeroulant:focus,
.menuDeroulant:active {
  color: #333;
  background-color: #f3f3f3;
}

@media only screen and (max-width: 767px) {
  .listeDeroulante {
    display: none;
    position: absolute;
    top: 42px;
    left: 0;
    z-index: 3;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #86a740;
    border-top: 0;
    background-color: #f3f3f3;
    -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
  }

  #menuSide .listeDeroulante h6 {
    font: 400 14px/24px "open_sans_condensedbold", Arial, sans-serif;
    color: #333;
    text-transform: uppercase;
  }
  #menuSide .listeDeroulante h6 a {
    color: #333;
  }
}

/* - - - Multi-select pour filtre - - - */
.multiSelect {
  position: relative;
  height: auto;
  min-height: 36px;
  padding-right: 30px;
  cursor: default;
}

.multiSelect ul {
  display: none;
  position: absolute;
  top: 36px;
  left: 0;
  z-index: 2;
  min-width: 240px;
  max-height: 343px;
  overflow-y: auto;
  padding: 5px 10px;
  border: 1px solid #ccc;
  list-style: none;
  background-color: #fff;
  line-height: 24px;
}

@media only screen and (max-width: 767px) {
  .selectionnes {
    display: none;
  }
  .multiSelect {
    background: none;
    border: 0;
  }
  .multiSelect ul {
    display: block;
    position: static;
    top: 0;
    min-width: 0;
    max-height: 9999px;
    padding: 0;
    border: none;
    background-color: transparent;
  }
}

/*--------------------------------------------------------------------------------------- */
/* En-tete */
/*--------------------------------------------------------------------------------------- */
#entete {
  position: relative;
  background-color: #ffffff;
}
#entete .enteteDesktop {
  height: 110px;
}

#entete .enteteDesktop.desktop {
  display: none !important;
}
#entete .enteteMobile.mobile {
  display: block !important;
}

#logo {
  display: block;
  position: absolute;
  top: 8px;
  left: 0;
  width: 146px;
  z-index: 10;
}

@media only screen and (min-width: 1024px) {
  #entete .enteteDesktop.desktop {
    display: block !important;
  }
  #entete .enteteMobile.mobile {
    display: none !important;
  }
}

@media only screen and (max-width: 960px) {
  #logo {
    width: 140px;
    top: 8px;
    left: 14px;
  }
}

@media only screen and (max-width: 767px) {
  #entete {
    margin-bottom: 0;
  }
}

/* En-tete mobile
--------------------------------------------------------------------------------------- */
.enteteMobile {
  display: none;
  min-width: 320px;
  height: 60px;
  color: #231f20;
  z-index: 10;
}
#btnMenuMobile {
  float: left;
  display: block;
  padding: 0 20px;
  background-color: #fff;
}
#btnMenuMobile:before {
  font: normal normal 22px/60px "icons";
  color: #231f20;
  content: "\e804";
}
.logoMobile {
  display: block;
  position: absolute;
  top: 5px;
  left: 50%;
  width: 84px;
  margin-left: -42px;
  z-index: 10;
}

.enteteMobile .connexion,
.enteteMobile .listeSouhaitEntete,
.enteteMobile .panier {
  display: block;
  float: right;
  width: 56px;
  height: 60px;
  font: normal normal 25px/60px "icons";
  text-align: center;
  color: #231f20;
  -webkit-transition: none;
  transition: none;
}
.enteteMobile .connexion:before {
  content: "\e810";
}
.enteteMobile .panier {
  position: relative;
}
.enteteMobile .panier:before {
  content: "\e80e";
}
.enteteMobile .panier.ouvert {
  background-color: #231f20;
  color: #86a740;
}

.enteteMobile .listeSouhaitEntete:before {
  content: "\e811";
}

.contientItems:after {
  content: "";
  position: absolute;
  top: 16px;
  right: 11px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #86a740;
}

#menuMobile a {
  font: 1.063em/21px "nunitobold";
  color: #fff;
}
#menuMobile .mSec a {
  font-family: "nunitolight";
}
#menuMobile .mSec.connexion {
  padding-left: 10px;
}
#menuMobile .mSec.connexion a {
  display: inline-block;
  color: #ccc;
  padding: 14px 0 14px 6px;
}
#menuMobile .connexion a.pipe:after {
  margin-left: 14px;
  content: "";
  border-right: 1px solid #ccc;
  height: 16px;
  display: inline-block;
  vertical-align: -2px;
}
#menuMobile a.twitter {
  margin-left: 14px;
}
#menuMobile a.twitter,
#menuMobile a.facebook {
  padding: 9px 0;
}
#menuMobile a.twitter:active,
#menuMobile a.facebook:active,
#menuMobile li.basket a:active {
  color: #fff;
  background: none;
}
#menuMobile li.basket {
  display: inline-block;
  width: 100%;
  border-bottom: none;
}

@media only screen and (max-width: 400px) {
  .enteteMobile .listeSouhaitEntete {
    display: none;
  }
}

/* Menu principal
--------------------------------------------------------------------------------------- */
#menu {
  clear: both;
  border-top: 2px solid rgba(204, 204, 204, 0.35);
  font: 400 18px/56px "nunitobold", Arial, sans-serif;
  color: #333;
  text-align: left;
  margin-left: 163px;

  display: flex;
}

#menu nav {
  display: flex;
}
#menu nav > ul {
  display: table-row;
}
#menu nav > ul > li {
  position: relative;
  display: inline-block;
  margin-left: 30px;
  vertical-align: top;
  /*width:33.333%;  (100 / nbItems) - Changer également dans la règle ".no-mediaqueries #menu nav > ul > li" plus bas */
}

li.lienJeunesse a img {
  height: 56px;
}
#menu nav > ul > li:first-child {
  margin-left: 0;
}

#menu li a {
  display: block;
  color: #231f20;
  border-bottom: 3px solid #fff;
}
#menu li:hover > a,
#menu a:focus,
#menu a:active {
  color: #9e9e9e;
}
#menu li:hover.couleurCat1 a {
  color: #44c8f5;
}
#menu li:hover.couleurCat2 a {
  color: #e5a900;
}
#menu li:hover.couleurCat3 a {
  color: #6d8e27;
}
#menu .actif {
  /*color: #fff;*/
  border-bottom: 3px solid #86a740;
}

#menu li.couleurCat1 a,
#menu li.couleurCat2 a,
#menu li.couleurCat3 a {
  padding-right: 15px;
}

#menu li.couleurCat1 a,
#menu li.couleurCat1 a.actif,
#menuMobile li.couleurCat1 a {
  color: #2ebedd;
}
#menu li.couleurCat2 a,
#menu li.couleurCat2 a.actif,
#menuMobile li.couleurCat2 a {
  color: #ffcc3d;
}
#menu li.couleurCat3 a,
#menu li.couleurCat3 a.actif,
#menuMobile li.couleurCat3 a {
  color: #86a740;
}

#menu li.couleurCat1 a:after,
#menu li.couleurCat2 a:after,
#menu li.couleurCat3 a:after {
  position: absolute;
  top: 28px;
  right: 0;
  width: 8px;
  height: 7px;
  content: "";
}
#menu li.couleurCat1 a:after {
  background: url(../gx/m/sprite-flecheMenu.png) 0 0 no-repeat;
}
#menu li.couleurCat2 a:after {
  background: url(../gx/m/sprite-flecheMenu.png) -15px 0 no-repeat;
}
#menu li.couleurCat3 a:after {
  background: url(../gx/m/sprite-flecheMenu.png) -45px 0 no-repeat;
}

#menu .panier,
#menuMobile .panier {
  float: right;
  line-height: 46px;
  margin-top: 5px;
}
#menuMobile .panier {
  float: left;
  margin: 27px 0 0 16px;
}
#menu .panier .panierCount:before,
#menuMobile .panier .panierCount:before {
  content: "\e80e";
  color: #231f20;
  margin-right: 10px;
  vertical-align: -2px;
  font: normal normal 25px/46px "icons";
}

#menuMobile .panier .panierCount:before {
  color: #fff;
}

#menu .panier .panierCount,
#menuMobile .panier .panierCount {
  font: 17px "latobold";
  color: #86a740;
  padding: 0 27px 0 20px;
}

@media only screen and (max-width: 800px) {
  #menu {
    margin-right: 16px;
  }
}

.no-mediaqueries #menu .conteneur {
  float: left;
  display: block;
  min-width: 0;
  max-width: 398;
}
.no-mediaqueries #menu > nav > ul {
  float: left;
  display: table-row;
  width: 398px;
}
.no-mediaqueries #menu > nav > ul > li {
  display: inline-block;
}
.no-mediaqueries #menu {
  font-size: 15px;
  border-bottom: 0;
}
.no-mediaqueries #menu > nav > ul > li {
  float: left;
}

#menu li:hover .sousMenu {
  display: block;
}

/* - - - Sous menu - - - */
#menu .sousMenu {
  display: none;
  position: absolute;
  top: 59px;
  left: -18px;
  z-index: 10000;
  background-color: #f5f5f5;
  text-align: left;
  font: 400 14px/16px "nunitobold", Arial, sans-serif;
  text-transform: none;

  -moz-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
}

#menu .sousMenu ul {
  float: left;
  width: 340px;
  padding: 0;
}

#menu .menuGauche .sousMenu {
  left: auto;
  right: 0;
}

@media only screen and (max-width: 960px) {
  #menu .menuGauchePlus .sousMenu {
    left: auto;
    right: 0;
  }
}

#menu .sousMenu li {
  float: none;
  width: 100%;
  border: none;
}

#menu li.couleurCat1 .sousMenu a,
#menu li.couleurCat2 .sousMenu a,
#menu li.couleurCat3 .sousMenu a {
  position: relative;
  display: block;
  color: #231f20;
  padding: 12px 20px;
  border-bottom: 1px solid #cac9c9;
}

#menu li.couleurCat1 .sousMenu a:hover {
  color: #44c8f5;
}
#menu li.couleurCat2 .sousMenu a:hover {
  color: #e5a900;
}
#menu li.couleurCat3 .sousMenu a:hover {
  color: #86a740;
}

#menu .sousMenu .complet {
  border-top: 1px solid #d1d1d1;
}
#menu li .sousMenu a:after {
  position: absolute;
  top: 12px;
  left: 92%;
  font: 14px "guifx";
  content: ">" !important;
  background: none;
}

/* Menu secondaire
--------------------------------------------------------------------------------------- */
#menuSec {
  float: right;
  font: 400 14px/50px "nunitobold", Arial, sans-serif;
}
#menuSec li {
  float: left;
  color: #333;
}
#menuSec a {
  display: inline-block;
  color: #231f20;
  padding: 0 12px;
}
#menuSec a:hover,
#menuSec a:focus,
#menuSec a:active {
  color: #9e9e9e;
}
#menuSec a.actif {
  color: #86a740;
}

#menuSec .connexion {
  color: #231f20;
}
#menuSec .connexion a {
  color: #231f20;
  padding: 0 7px;
}
#menuSec .connexion a:hover,
#menuSec .connexion a:focus,
#menuSec .connexion a:active {
  color: #9e9e9e;
}
#menuSec .connexion.pipe:after {
  content: "";
  border-right: 1px solid #231f20;
  height: 11px;
  display: inline-block;
  vertical-align: -2px;
}
#menuSec .connexion.pipe:after {
  border-color: #231f20;
}

#menuSec .panier {
  background-color: #000;
}
#menuSec .panier a {
  color: #fff;
}
#menuSec .panier span {
  color: #fff;
}
#menuSec .panier a:hover,
#menuSec .panier a:focus,
#menuSec .panier a:active {
  color: #ff9e0d;
}

#menuSec .facebook,
#menuSec .twitter,
#menuMobile .facebook,
#menuMobile .twitter {
  display: inline-block;
  font: normal normal 20px/32px "icons";
  margin-left: 10px;
  padding: 0;
  -webkit-transition: all 0.15s linear 0s;
  transition: all 0.15s linear 0s;
}
#menuMobile .instagram,
#menuMobile .instagram {
  display: inline-block;
}
#menuSec .twitter {
  font-size: 25px;
  vertical-align: -2px;
  margin-left: 0px;
}
#menuSec .instagram:hover {
  -webkit-transition: all 0.15s linear 0s;
  transition: all 0.15s linear 0s;
  opacity: 0.85;
}
#menuSec .instagram {
  margin-left: 15px;
  margin-right: 12px;
  position: relative;
  bottom: -10px;
  height: 29px;
  background-size: 23px;
  background-image: url(../gx/m/instagram-logo.png);
  background-position: top center;
  background-repeat: no-repeat;
}
#menuMobile .instagram {
  margin-left: 15px;
  margin-right: 0px;
  position: relative;
  bottom: -10px;
  height: 29px;
  background-size: 23px;
  background-image: url(../gx/m/instagram-logo_mobile.png);
  background-position: top center;
  background-repeat: no-repeat;
}

#menuSec .facebook:before,
#menuMobile .facebook:before {
  content: "\e807";
}
#menuSec .twitter:before,
#menuMobile .twitter:before {
  content: "\e808";
}

@media only screen and (max-width: 1170px) {
}

@media only screen and (max-width: 959px) {
  #menuSec {
    margin-right: 16px;
  }
  #menuSec a {
    padding: 0 12px;
  }
  #menuSec .twitter {
    margin-left: 5px;
  }
  #menuSec .lienRights {
    display: none;
  }
}

@media only screen and (max-width: 850px) {
  #menuSec a {
    padding: 0 5px;
    font-size: 13px;
  }
  #menuSec a.instagram {
    padding: 0 12px;
  }
}

/* Champ de recherche
--------------------------------------------------------------------------------------- */
#formSearch {
  position: relative;
  clear: right;
  float: right;
  margin: 18px 0 20px 0;
  border: 1px solid #cac9c9;
  border-radius: 38px;
}

#formSearch input {
  width: 781px;
  max-width: 781px;
  font: 17px/38px "latoregular";
  color: #000;
  padding: 0 50px 0 20px;
  border: 0;
  border-radius: 38px;
}

#formSearch button {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 58px;
  height: 36px;
  color: #000;
  background-color: #fff;
  border-radius: 0 38px 38px 0;
}
#formSearch button:hover,
#formSearch button:focus,
#formSearch button:active {
  background-color: #f3f3f3;
}
#formSearch button:before {
  font: normal normal 26px/30px "icons";
  color: #231f20;
  content: "\e805";
}

.enteteMobile a.rech {
  float: right;
  width: 30px;
  height: 60px;
  margin-right: 20px;
  padding-top: 15px;
}
.enteteMobile a.rech:before {
  font: normal normal 30px/30px "icons";
  color: #231f20;
  content: "\e805";
}

.formRecherche {
  position: absolute !important;
  display: inline-block;
  top: 20% !important;
  left: 0 !important;
  min-width: 320px;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 2% 0 8%;
}
.formRecherche.cache {
  display: none !important;
}
.formRecherche input {
  border: 1px solid #dbdbdb;
  outline: none;
  font: 20px "latoregular";
  color: #202020;
  height: 60px;
  width: 80%;
  float: left;
  padding: 0 20px;
  background: #f2f2f2;
}
.formRecherche input::-webkit-input-placeholder {
  font-style: normal;
  color: #202020;
}
.formRecherche input::-moz-placeholder {
  font-style: normal;
  color: #202020;
}
.formRecherche input:-ms-input-placeholder {
  font-style: normal;
  color: #202020;
}
.formRecherche button {
  background: none;
}
.formRecherche button i:before {
  display: inline-block;
  font: normal normal 40px/30px "icons";
  color: #231f20;
  content: "\e805";
  margin: 15px 0 0 20px;
}

a.close-modal:before {
  font: 30px "guifx";
  content: "x";
  color: #333;
}

@media only screen and (max-width: 960px) {
  #formSearch {
    margin-right: 16px;
  }
  #formSearch input {
    width: 530px;
  }
}

/* Panier
--------------------------------------------------------------------------------------- */
#panierEntete {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10001;
  width: 320px;
  padding: 0 20px 14px;
  background-color: #000;
  font: 400 13px/21px "nunitoregular", Arial, sans-serif;
  color: #fff;
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

@media only screen and (max-width: 767px) {
  #panierEntete {
    top: 0;
  }
}

#panierEntete a,
#panierEntete a:hover,
#panierEntete a:focus,
#panierEntete a:active {
  color: #fff;
}

#panierEntete ul {
  list-style: none;
}
#panierEntete li {
  margin-bottom: 14px;
  padding-bottom: 20px;
  border-bottom: 1px solid #333;
}

#panierEntete .nbArticle {
  margin-bottom: 14px;
  border-bottom: 1px solid #333;
  line-height: 36px;
}
#panierEntete .voir {
  float: right;
  line-height: 36px;
  text-decoration: underline;
  color: #fff;
}
#panierEntete .voir:hover,
#panierEntete .voir:focus,
#panierEntete .voir:active {
  color: #2ebedd;
}
#panierEntete .photo {
  float: left;
  width: 60px;
  margin: 5px 10px 0 0;
}

#panierEntete .col1 {
  float: left;
  width: 122px;
  margin-right: 10px;
}
#panierEntete .desc {
  height: 42px;
  overflow: hidden;
}

#panierEntete .col2 {
  float: left;
  width: 70px;
  text-align: right;
}
#panierEntete .remove {
  margin-bottom: 7px;
  padding: 0 0 18px 18px;
  background-color: #000;
  text-align: right;
  font: normal normal 12px/1em "icons";
}
#panierEntete .remove:before {
  content: "\e806";
  color: #86a740;
  -webkit-transition: color 0.15s linear 0s;
  transition: color 0.15s linear 0s;
}
#panierEntete .remove:hover:before,
#panierEntete .remove:focus:before,
#panierEntete .remove:active:before {
  color: #fff;
}

#panierEntete .qte {
}
#panierEntete .total {
  font: 14px "nunitobold";
  white-space: nowrap;
}

#panierEntete .button {
  display: block;
  max-width: 240px;
  line-height: 38px;
  margin: 0 auto;
}
#panierEntete .button:after {
  content: "\e800";
  font: normal normal 15px/15px "icons";
  margin-left: 12px;
  vertical-align: -2px;
  text-transform: none;
}

/*FIX FF*/
@-moz-document url-prefix() {
  #panierEntete .button {
    line-height: 37px;
  }
  #panierEntete .button:after {
    vertical-align: -3px;
  }
}

/*--------------------------------------------------------------------------------------- */
/* Menu mobile */
/*--------------------------------------------------------------------------------------- */

/* Champ de recherche
--------------------------------------------------------------------------------------- */
/*#formMobileSearch{
	position: relative;
	padding:16px 16px 20px 16px;
	border-bottom:1px solid #d1d1d1;
}

#formMobileSearch input{
	width: 100%;
	height:38px;
	padding:0 41px 0 5px;
	border:1px solid #000;
	border-radius:0;
	-webkit-appearance: none;
}

#formMobileSearch button{
	position: absolute;
	top:17px;
	right:17px;
	display:block;
	width: 36px;
	height: 36px;
	color:#000;
	background-color:#fff;
}
#formMobileSearch button:hover, #formMobileSearch button:focus, #formMobileSearch button:active{ background-color:#ccc; }
#formMobileSearch button:before{font:normal normal 22px/30px "icons"; color:#000; content:'\e805';}*/

/*--------------------------------------------------------------------------------------- */
/* Contenu principal */
/*--------------------------------------------------------------------------------------- */
.colPrincipale {
  float: left;
  width: 100%;
  margin-left: -222px;
  padding: 0;
}

.innerPrinc {
  margin-left: 260px;
}

@media only screen and (max-width: 960px) {
  .innerPrinc {
    margin-left: 260px;
  }
}

.colTexte {
  float: left;
  width: 100%;
}

@media only screen and (max-width: 1170px) {
  /*.colPrincipale{ padding-right:20px; }
	.colTexte{ padding-left:20px; }*/
}

@media only screen and (max-width: 767px) {
  .colPrincipale {
    float: none;
    margin-left: 0;
    padding-left: 0;
  }
  .innerPrinc {
    margin-left: 0;
  }

  .colTexte {
    float: none; /*width:100%; padding:26px 20px;*/
  }
}

/* Side Menu
--------------------------------------------------------------------------------------- */
#menuSide {
  position: relative;
  float: left;
  width: 222px;
  font-size: 14px;
  line-height: 24px;
  z-index: 3;
}
#menuSide h6 {
  font: 400 19px/21px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  text-transform: uppercase;
  margin-bottom: 18px;
}
#menuSide h6 a,
#menuSide #menuService h6 a {
  color: #333;
}
#menuSide a {
  display: block;
  color: #333;
}
#menuSide a:hover,
#menuSide a:focus,
#menuSide a:active,
#menuSide h6 a:hover,
#menuSide h6 a:focus,
#menuSide h6 a:active,
#menuSide #menuService h6 a:hover,
#menuSide #menuService a:hover {
  color: #2ebedd;
}

#menuSide .actif a,
#menuSide #menuService .actif a {
  color: #2ebedd;
}

#menuSide .fermer {
  margin-top: 0.3em;
  padding-top: 0.3em;
  border-top: 1px solid #d1d1d1;
}
#menuSide .fermer a:after {
  content: "\e814";
  margin-left: 10px;
  vertical-align: -2px;
  font: normal normal 20px "icons";
}

#menuSide #menuService a {
  color: #666;
}

@media only screen and (max-width: 1170px) {
  /*#menuSide{ padding-left:20px; }*/

  #menuSide .hasCustomSelect,
  #menuSide .customSelect {
    max-width: 220px;
  }
}

@media only screen and (max-width: 767px) {
  #menuSide {
    float: none;
    width: auto;
    margin: 0 0 20px 0;
    padding: 0;
  }
}

/* Sidebar CTAs
--------------------------------------------------------------------------------------- */
#sideCta {
  float: left;
  width: 32.051282%; /*375px*/
  margin-left: 2.923077%;
  padding-top: 70px;
  text-align: right;
}

#sideCta.cta a {
  margin-bottom: 20px;
}

.cta a,
.cta .conteneur div {
  display: block;
  width: 100%;
  max-width: 375px;
  -webkit-transition: opacity 0.15s linear 0s;
  transition: opacity 0.15s linear 0s;
  -webkit-transform: translateZ(0);
}
.cta a:hover {
  opacity: 0.8;
}

@media only screen and (max-width: 1170px) {
  #sideCta {
    padding-right: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #sideCta {
    float: none;
    width: 100%;
    margin: 20px 0 0 0;
    padding: 0 20px;
  }
  .cta a,
  .cta .conteneur div {
    margin: 0 auto 20px !important;
  }
}

/* Fil d'Ariane
---------------------------------------------------------------------------------------
#filAriane{
	padding:10px 0;
	border-bottom: 1px solid #d1d1d1;
	font:12px/14px Arial, Helvetica, sans-serif;
	color:#333;
}

#filAriane li{ display:inline; margin-right:4px; }
#filAriane li:before{
	content:'\e800';
	vertical-align: -1px;
	font:normal normal 11px "icons";
	margin-right:6px;
}
#filAriane li:first-child:before{ display:none; }

#filAriane a{ color:#333; }
#filAriane a:hover, #filAriane a:focus, #filAriane a:active{ color:#c91c1b; }
#filAriane li:last-child{ color:#c91c1b; }
#filAriane li:last-child:before{ color:#333; }

@media only screen and (max-width: 1170px) {
	#filAriane{ padding:10px 20px; }
}

@media only screen and (max-width: 767px) {
	#filAriane{ background-color: #f3f3f3; }
}*/

/* Pagination
--------------------------------------------------------------------------------------- */
.pagination {
  clear: both;
  font: 400 16px/24px "nunitolight", Arial, sans-serif;
  color: #666;
  /*padding-top:20px; border-top:1px solid #d1d1d1;*/
}
.paginationEntete {
  padding-top: 0;
  border-top: 0;
}

.module_pagination {
  float: right;
}
.paginationEntete .module_pagination {
  margin-top: 14px;
}

.module_pagination_libelle {
  margin-right: 8px;
}

.pagination a,
.module_pagination_pagecourante {
  display: inline-block;
  width: 24px;
  text-align: center;
  background-color: #fff;
  font: 15px/22px "nunitoregular";
  color: #666;
  text-decoration: none;
  -webkit-transition: all 0.15s linear 0s;
  transition: all 0.15s linear 0s;
}

.pagination .module_pagination_pagecourante {
  background-color: #86a740;
  color: #fff;
}

.pagination .module_pagination_pagesuivante a,
.pagination .module_pagination_pageprecedente a,
.pagination .module_pagination_pagepremiere a,
.pagination .module_pagination_pagederniere a {
  color: #666;
  background: transparent;
}

.pagination .module_pagination_pagesuivante a:hover,
.pagination .module_pagination_pagesuivante a:focus,
.pagination .module_pagination_pagesuivante a:active,
.pagination .module_pagination_pageprecedente a:hover,
.pagination .module_pagination_pageprecedente a:focus,
.pagination .module_pagination_pageprecedente a:focus,
.pagination .module_pagination_pagepremiere a:hover,
.pagination .module_pagination_pagepremiere a:focus,
.pagination .module_pagination_pagepremiere a:focus,
.pagination .module_pagination_pagederniere a:hover,
.pagination .module_pagination_pagederniere a:focus,
.pagination .module_pagination_pagederniere a:focus,
.pagination a:hover,
.pagination a:focus,
.pagination a:active {
  background-color: #86a740;
  color: #fff;
}

.pagination .icon-left::before,
.pagination .icon-double-left:before,
.pagination .icon-right::before,
.pagination .icon-double-right:before {
  vertical-align: -2px;
}

@media only screen and (min-width: 768px) and (max-width: 850px) {
  .paginationEntete {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .paginationEntete .module_pagination {
    margin-bottom: 1em;
  }
  .module_pagination {
    float: none;
    text-align: center;
  }
}

@media only screen and (max-width: 479px) {
  .module_pagination_libelle {
    display: none;
  }
  .pagination a,
  .module_pagination_pagecourante {
    margin: 0 -2px;
  }
}

/* Banniere Interne
--------------------------------------------------------------------------------------- */
.bandeau {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #2ebedd;
}

.bandeau_ctn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 145px;
}

.titre-bandeau {
  font: 55px/60px "nunitobold";
  color: #fff;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.13);
  margin: 0;
  text-transform: uppercase;
}

@media only screen and (max-width: 600px) {
  .titre-bandeau {
    font: 36px/40px "nunitobold";
  }
}

/* 00_100 : Infolettre
--------------------------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
  #formInfolettre .separateurBouton {
    margin-top: 1em;
  }
  #formInfolettre .separateurBouton .button {
    display: block;
    margin: 20px auto 0;
  }
}

/* 00_200 : Service a la clientele
--------------------------------------------------------------------------------------- */
#serviceClientele .service {
  float: left;
  width: 31%;
  height: 180px;
  margin: 0 3.5% 20px 0;
  padding: 10px 16px 16px;
  border: 1px solid #d1d1d1;
  background-color: #f3f3f3;
  font-size: 14px;
  line-height: 20px;
  -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}

#serviceClientele h2 {
  margin-top: 0;
}
#serviceClientele .service p {
  margin-bottom: 0.5em;
}

.ie8 #serviceClientele .service {
  margin-right: 2.333%;
}
#serviceClientele .service:nth-child(3n) {
  margin-right: 0;
}

#serviceClientele .service h2 {
  font: 400 18px/24px "open_sans_condensedbold", Arial, sans-serif;
}

@media only screen and (max-width: 960px) {
  #serviceClientele .service {
    width: 48%;
    margin-right: 4%;
  }
  #serviceClientele .service:nth-child(3n) {
    margin-right: 4%;
  }
  #serviceClientele .service:nth-child(2n) {
    margin-right: 0;
  }
}

@media only screen and (max-width: 480px) {
  #serviceClientele .service {
    width: 100%;
    height: auto;
    margin-right: 0;
  }
  #serviceClientele .service:nth-child(3n) {
    margin-right: 0;
  }
}

/* 00_210 : FAQ
--------------------------------------------------------------------------------------- */
#faq .listeQuestions {
  /*margin-left:20px;*/
  color: #333;
}
#faq .listeQuestions a {
  color: #333;
}
#faq .listeQuestions a:hover,
#faq .listeQuestions a:focus,
#faq .listeQuestions a:active {
  color: #2ebedd;
}

#faq .faqQuestions a {
  text-decoration: none;
}
#faq .question {
  position: relative;
  padding-bottom: 3em;
}
#faq .question h3 {
  margin-top: 0;
}
#faq .reponse p:last-child {
  margin: 0;
}
#faq .haut {
  position: absolute;
  bottom: 1em;
  right: 0;
  font-size: 13px;
  text-decoration: none;
}
#faq .haut:after {
  content: "\25B2";
  margin-left: 6px;
} /* Flèche vers le haut */

/* 00_250 : Livraison
--------------------------------------------------------------------------------------- */
.tabLivraison {
  margin-bottom: 0.5em;
}
.tabLivraison td,
.tabLivraison th {
  padding: 5px 10px;
  border: 1px solid #d1d1d1;
}

@media only screen and (max-width: 400px) {
  .tabLivraison {
    font-size: 12px;
    line-height: 16px;
  }
}

/* 00_888 : Plan du site
--------------------------------------------------------------------------------------- */
.plan > ul {
  float: left;
  width: 28%;
  margin-right: 5%;
  list-style: none;
}
.plan > ul strong {
  font-family: "nunitobold";
  color: #333;
  font-weight: 400;
}
.plan a:hover {
  color: #2ebedd;
}
.plan ul ul {
  margin-left: 1em;
}

.plan .gap {
  margin-top: 1em;
}

@media only screen and (max-width: 800px) {
  .plan > ul {
    width: 30%;
    margin-right: 3%;
  }
}

@media only screen and (max-width: 767px) {
  .plan {
    margin: 0 20px;
  }
  .plan ul {
    float: none;
    width: 100%;
    margin: 0 0 20px 0;
  }
}

/* 01_100 : Accueil
--------------------------------------------------------------------------------------- */
#banniere {
  display: none;
  max-width: 1920px;
  margin: 0 auto 72px;
  padding-bottom: 34.19%;
}

/* - - - Slick Slider - - - */
.slick-initialized {
  display: block !important;
}
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-loading .slick-list {
  background: white url("../gx/m/ajax-loader.gif") center center no-repeat;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-slider .slick-list,
.slick-track,
.slick-slide,
.slick-slide img {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  zoom: 1;
}
.slick-track:before,
.slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}
.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
.slick-slide img {
  display: block;
  width: 100%;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-bg {
  display: block;
  height: 450px;
  background-position: 50% 0 !important;
  background-size: cover !important;
}

.slick-dots {
  display: inline-table;
  position: relative;
  margin: 50px auto 0 auto;
  list-style: none;
  line-height: 16px;
  z-index: 100;
}
.slick-dots li {
  float: left;
  margin: 0 5px;
  list-style: none;
}
.slick-dots button {
  width: 9px;
  height: 9px;
  text-indent: -9999px;
  padding: 0;
  border-radius: 9px;
  background: #b5b3b3;
  outline: none;
}
.slick-dots .slick-active button {
  background: #86a740;
}

.no-backgroundsize #banniere.large {
  max-width: 1170px;
}
.no-borderradius .slick-dots button {
  width: 9px;
  height: 9px;
}
.no-borderradius .slick-dots button {
  background: url(../gx/m/ie-sprites.png) -14px -1px no-repeat transparent;
}
.no-borderradius
  .nouveautes
  .conteneur.couleurCat1
  .slick-dots
  .slick-active
  button {
  background: url(../gx/m/ie-sprites.png) -1px -1px no-repeat transparent;
}
.no-borderradius
  .nouveautes
  .conteneur.couleurCat2
  .slick-dots
  .slick-active
  button {
  background: url(../gx/m/ie-sprites.png) -27px -1px no-repeat transparent;
}

#banniere #navSlickDots {
  position: absolute;
  bottom: 0;
  width: 100%;
}
#banniere .slick-dots {
  margin-top: 0;
}

.banniere__container {
  position: relative;
}

#banniere .layout {
  display: flex;
  width: 100%;
  max-width: 960px;
  height: 100%;
  margin: 0 auto;
}

#banniere .layout a {
  display: flex;
  width: 100%;
}

#banniere .banniere__text-box {
  align-self: center;
  width: 60%;
}

#banniere .banniere__text-box .banniere__titre {
  font: 55px/60px "nunitobold";
  color: #fff;
  text-transform: none;
  margin: 0 0 20px 0;
}

#banniere .banniere__text-box .btnGen {
  /*margin-top: 27px;*/
}

#banniere .banniere__text-box .btn--gros {
  height: 50px;
  line-height: 50px;
  padding: 0 46px;
}

.banniere__nav-arrow {
  /*position: absolute;
	top: 50%;
	left: 50%;
	display: flex;
	justify-content: space-between;
	width: 100%;
	max-width: 960px;
	transform: translate(-50%, -50%);*/
}

.banniere__nav-arrow .slick-arrow {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 60px;
  color: #fff;
  border-radius: 100%;
  background: #00040b;
  transition: all 0.2s;
}

.banniere__nav-arrow .icon {
  font-size: 24px;
}

.banniere__nav-arrow .prev {
  /*margin-left: -110px;*/
  position: absolute;
  z-index: 999;
  top: 43%;
  left: 10%;
}

.banniere__nav-arrow .next {
  /*margin-right: -110px;*/
  position: absolute;
  z-index: 999;
  top: 43%;
  right: 10%;
}

.banniere__nav-arrow .slick-arrow:hover {
  color: #86a740;
  background: rgba(0, 4, 11, 0.5);
}

@media only screen and (max-width: 1180px) {
  .banniere__nav-arrow .slick-arrow {
    width: 40px;
    height: 40px;
  }

  .banniere__nav-arrow .icon {
    font-size: 18px;
  }

  .banniere__nav-arrow .prev {
    margin-left: 20px;
    left: 0%;
  }

  .banniere__nav-arrow .next {
    margin-right: 20px;
    right: 0%;
  }

  #banniere .banniere__text-box {
    padding-left: 60px;
  }

  #banniere .banniere__text-box .banniere__titre {
    font-size: 35px;
    line-height: 40px;
  }
}

@media only screen and (max-width: 1024px) {
  .slick-bg {
    background-position: 60% 0 !important;
  }
}

@media only screen and (max-width: 960px) {
  #banniere {
    margin-bottom: 20px;
  }

  #banniere .layout {
    padding: 0 20px;
  }

  .banniere__nav-arrow .prev {
    margin-left: 20px;
  }

  .banniere__nav-arrow .next {
    margin-right: 20px;
  }

  #banniere .banniere__text-box {
    width: 55%;
  }
}

@media only screen and (max-width: 767px) {
  #banniere {
    margin-top: 50px;
  }

  .slick-bg {
    height: 300px;
  }

  .slick-dots {
    /*bottom:-30px;*/
    left: 0;
    width: 100%;
    text-align: center;
  }
  .slick-dots li {
    float: none;
    display: inline-block;
    margin: 0 3px;
  }
}

@media only screen and (max-width: 640px) {
  #banniere .layout a {
    /*justify-content: center;*/
  }
  #banniere .banniere__text-box {
    padding-left: 0;
  }

  #banniere .banniere__text-box .banniere__titre {
    font-size: 20px;
    line-height: 25px;
  }

  #banniere .banniere__text-box .btn--gros {
    line-height: 20px;
    height: auto;
    padding: 5px 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .banniere__nav-arrow {
    top: initial;
    bottom: 40px;
    justify-content: center;
    position: absolute;
    left: 50%;
    display: flex;
    justify-content: space-between;
    width: 110px;
    max-width: 960px;
    transform: translate(-50%, -50%);
  }

  .banniere__nav-arrow .slick-arrow {
    width: 30px;
    height: 30px;
    margin: 0 10px;
  }

  .banniere__nav-arrow .icon {
    font-size: 12px;
  }
}

@media only screen and (max-width: 480px) {
  .slick-bg {
    background-position: 63% 0 !important;
  }
}

/* - - - Messages - - - */
.messageAccueil {
  display: block;
  margin-bottom: 30px;
  padding: 14px 20px;
  background-color: #666;
  text-align: center;
  font: 400 18px/24px Arial, Helvetica, sans-serif;
  color: #fff;
  -webkit-transition: all 0.15s linear 0s;
  transition: all 0.15s linear 0s;
}

a.messageAccueil:hover,
a.messageAccueil:focus,
a.messageAccueil:active {
  color: #fff;
  background-color: #333;
}

.messageAccueil p {
  margin: 0;
}

@media only screen and (max-width: 767px) {
  .messageAccueil {
    padding: 10px 16px;
    font: 400 14px/18px "nunitoregular", Arial, sans-serif;
  }
}

/* - - - Nouveautes - - - */
.nouveautes .conteneur {
  max-width: 1180px;
  margin-bottom: 60px;
}

.nouveautes__header {
  max-width: 960px;
  margin: 0 auto;
}

.nouveautes h2 {
  display: inline-block;
  position: relative;
  font: 26px/35px "nunitobold";
  text-transform: uppercase;
  margin-bottom: 40px;
}
/*.nouveautes h1:before {position:absolute; top:7px; left: 0; content: ''; width: 13px; height: 13px; border-radius: 100%;}
.nouveautes .conteneur.couleurCat1 h1:before {background: #2ebedd;}
.nouveautes .conteneur.couleurCat2 h1:before {background: #ffcc3d;}

.no-borderradius .nouveautes .conteneur.couleurCat1 h1:before {margin-top:3px; background:url(../gx/m/ie-sprites.png) -1px -1px transparent no-repeat;}
.no-borderradius .nouveautes .conteneur.couleurCat2 h1:before {margin-top:3px; background:url(../gx/m/ie-sprites.png) -27px -1px transparent no-repeat;}*/

.lien__liste-complete {
  float: right;
  font: 700 13px/17px "Open Sans";
  color: #231f20;
  text-transform: uppercase;
}

.lien__liste-complete:after {
  content: ">";
  font: 14px/40px "guifx";
  margin-left: 8px;
  vertical-align: -1px;
}

.carrousel__image-box {
  position: relative;
  flex: 1 1 auto;
  display: flex;
  max-height: 272px;
  overflow: hidden;
}

.carrousel__image-box .image-box__img {
  align-self: flex-end;
  max-height: 272px;
  transition: all 0.2s;
}

.carrousel__image-box .image-box__img:hover {
  filter: brightness(50%);
}

.image-box__tag-box {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 196px;
  margin: 0 auto;
}

.image-box__tag-box .tagNouveaute.tag--carrousel,
.image-box__tag-box .tagParaitre.tag--carrousel {
  position: relative;
  line-height: 18px;
  margin: 0 5px;
  padding: 2px 6px;
}

.carrousel__info-box {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  max-width: 196px;
  min-height: 95px;
  margin: 0 auto;
  padding: 8px 15px 0;
}

.carrousel__info-box .info-box__heading {
  flex: 1 1 auto;
  text-transform: none;
  margin-bottom: 20px;
}

.carrousel__info-box .info-box__heading--main {
  display: block;
  font: 18px/24px "open_sans_condensedbold";
  color: #231f20;
  transition: all 0.2s;
}

.carrousel__info-box .info-box__heading--sub {
  display: block;
  font: 14px/17px "latoregular";
  color: #666;
  transition: all 0.2s;
}

.info-box__prix-regulier {
  font: 18px/24px "nunitobold";
  color: #231f20;
}

.couleur-texte--cat1,
.couleurCat1 .carrousel__info-box .info-box__heading:hover span {
  color: #2ebedd;
}

.couleur-texte--cat2,
.couleurCat2 .carrousel__info-box .info-box__heading:hover span {
  color: #ffcc3d;
}

.nouveautes .bloc,
#accueilVideoAct .bloc,
#banniere.bloc {
  min-height: 0;
}

/* carrousel */
.responsive {
  display: none;
  text-align: center;
  padding: 0 80px;
}

.responsive.slick-initialized {
  display: block !important;
}

.responsive .slick-track {
  display: flex !important;
}

.responsive .slick-slide {
  display: inline-flex;
  flex-direction: column;
  float: initial;
  height: auto;
}

.responsive .slick-slide.slick-active {
  /*height: 100%;*/
}

.responsive .slick-slide img {
  max-width: 196px;
  margin: 0 auto;
}

/*.responsive .slick-slide:first-child {margin-left: 0;}
.responsive .slick-slide a {position:relative; display:inline-block;}
.responsive .slick-slide img {position:relative; width: auto; max-height: 156px; z-index: 5;}
.responsive .slick-slide span {position: absolute; top:0; left:0; width:100%; height: 100%; background: rgba(0,0,0,0); z-index: 10000;}*/
/* hover
.responsive .slick-slide a:hover {}
.responsive .slick-slide a:hover span {background: rgba(0,0,0,.45);}*/

/* nav */
.responsive .slick-prev,
.responsive .slick-next {
  position: absolute;
  top: calc(50% - 60px);
  width: 60px;
  height: 60px;
  font-size: 24px;
  color: #272e34;
  border-radius: 100%;
  background: #fff;
  transition: all 0.2s;
}

.couleurCat1 .responsive .slick-arrow:hover {
  color: #2ebedd;
}
.couleurCat2 .responsive .slick-arrow:hover {
  color: #ffcc3d;
}
.responsive .slick-prev {
  left: 0;
}
.responsive .slick-next {
  right: 0;
}

.nouveautes .conteneur.couleurCat1 .slick-dots .slick-active button {
  background: #2ebedd;
}
.nouveautes .conteneur.couleurCat2 .slick-dots .slick-active button {
  background: #ffcc3d;
}

.no-rgba .responsive .slick-prev,
.no-rgba .responsive .slick-next {
  background: rgb(255, 255, 255);
}

@media only screen and (max-width: 481px) {
  .nouveautes header h2 {
    display: block;
    margin-bottom: 0;
  }
  .nouveautes header a {
    float: left;
  }
}

/* - - - VIDEO/ACTUALITES ACCUEIL - - - */
.header-colonne {
  position: relative;
}

h3.titre-colonne {
  display: block;
  font: 400 24px "nunitobold";
  color: #86a740;
  line-height: 32px;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.lien-colonne {
  position: absolute;
  right: 0;
  bottom: 3px;
  font: 700 12px/17px "Open Sans";
  color: #231f20;
  text-transform: uppercase;
}
.lien-colonne:after {
  content: ">";
  font: 14px "guifx";
  margin-left: 5px;
  vertical-align: -1px;
}

@media only screen and (max-width: 900px) {
  h3.titre-colonne {
    font-size: 18px;
    line-height: 22px;
  }
}

#accueilVideoInfolettre {
  float: left;
  width: 31.25%; /*300px*/
  max-width: 300px;
  margin-right: 3%; /*30px*/
}
#accueilVideoInfolettre > div {
  position: relative;
  clear: both;
}
#accueilInfolettre {
  display: inline-table;
  max-width: 300px;
  text-align: center;
}
#accueilInfolettre > div {
  padding: 20px 20px 20px 16px;
}
#accueilInfolettre > div > p {
  text-align: left;
}

#accueilVideo figure,
#accueilActualite figure {
  position: relative;
  width: 100%;
}
#accueilVideo figure img,
#accueilActualite figure img {
  position: relative;
  width: 100%;
  height: 173px;
  object-fit: cover;
  z-index: 5;
}

#accueilVideo figure i {
  position: absolute;
  left: 50%;
  top: 50%;
  font-size: 60px;
  z-index: 10;
  margin: -42px 0 0 -30px;
}
#accueilVideo figure:hover i:before {
  color: #333;
}

#accueilVideo .bloc-video:not(:last-child) {
  margin-bottom: 30px;
}

#accueilVideo .titre-video {
  font: 400 19px/26px "open_sans_condensedbold";
  color: #231f20;
  text-align: center;
  margin-top: 7px;
}

#accueilActualite {
  float: left;
  width: 31.25%;
  max-width: 300px;
  margin-right: 3%;
}
#accueilActualite > div {
  display: inline-table;
  width: 100%;
  max-width: 300px;
  height: 403px;
  max-height: 403px;
}
#accueilActualite > div:last-child {
  float: right;
}
#accueilActualite figure {
  height: 173px;
}
#accueilActualite figure div {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 57px;
  height: 57px;
  font: 700 12px/12px "Open Sans";
  color: #333;
  text-transform: uppercase;
  text-align: center;
  padding-top: 10px;
  border-radius: 100%;
  background-color: #fff;
  z-index: 10;
}
#accueilActualite figure div span {
  display: block;
  clear: both;
  font: 30px/25px "nunitobold";
  color: #8aaa40;
}
#accueilActualite > div > h3 {
  font: 400 19px/20px "open_sans_condensedbold";
  color: #231f20;
  text-transform: none;
  margin: 17px 0 0 0;
}
#accueilActualite > div > p {
  font: 400 15px/22px "nunitoregular";
  color: #666;
  padding: 24px 0 0 0;
}
#accueilActualite > div > p a {
  color: inherit;
}

#accueilInstagram {
  float: left;
  width: 31.25%; /*300px*/
  max-width: 300px;
}

.feed-instagram_liste {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}

.feed-instagram_item {
  flex: 0 1 50%;
  max-width: 300px;
}

.instagram_img {
  display: flex;
  width: 100%;
}

@media only screen and (max-width: 768px) {
  #accueilVideoInfolettre {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
  }

  #accueilVideo .bloc-video {
    float: left;
    width: 48.5%;
    margin-bottom: 0;
  }

  #accueilVideo .bloc-video:not(:last-child) {
    margin-right: 3%;
  }

  #accueilActualite,
  #accueilInstagram {
    float: left;
    width: 48.5%;
    max-width: initial;
  }

  #accueilActualite > div {
    max-width: initial;
  }
}

@media only screen and (max-width: 500px) {
  #accueilVideo .bloc-video {
    width: 100%;
    margin: 0 0 30px 0;
  }

  #accueilVideo .bloc-video:not(:last-child) {
    margin-right: 0;
  }

  #accueilActualite,
  #accueilInstagram {
    width: 100%;
  }
}

/* - - - CTAs - - - */
#accueilCta {
  padding-top: 30px;
}
#accueilCta a,
#accueilCta .conteneur div {
  float: left;
  width: 32.051282%; /*375px*/
  margin-left: 1.923077%; /*22px*/
}

#accueilCta a:first-child,
#accueilCta .conteneur div:first-child {
  margin-left: 0;
}

@media only screen and (max-width: 960px) {
  #accueilVideoInfolettre {
    margin-right: 2.5%;
  }
}

@media only screen and (max-width: 640px) {
  /*#accueilVideoInfolettre, #accueilActualite {float:none; width:100%; max-width: 100%; margin-right:0;}
		#accueilVideoInfolettre > div {clear: none;}*/
  /*#accueilVideo, #accueilInfolettre {float: left; width: 48%;}*/
  /*#accueilInfolettre {float: right;}*/
}
@media only screen and (max-width: 500px) {
  /*#accueilVideo, #accueilInfolettre, #accueilActualite > div {width: 100%; max-width: 100%;}
	#accueilActualite {margin-top: 32px;}
	#accueilActualite > div:last-child {float: none; margin-top: 20px;}*/
}

/* 02_100 : Liste de produits
--------------------------------------------------------------------------------------- */
#menuSide .couleurCat1 a:hover,
#menuSide .couleurCat1 a.actif {
  color: #44c8f5;
}
#menuSide .couleurCat2 a:hover,
#menuSide .couleurCat2 a.actif {
  color: #e5a900;
}

#listeProduit h1 {
  margin: -6px 0 0.5em 0;
}

#listeProduit .ctaCollection {
  margin-bottom: 13px;
}
#listeProduit .ctaCollection img {
  width: 100%;
  border: 1px solid #666;
}

/* - - - - - - Filtre - - - - - - */
#filtreProduit h1,
#filtreProduit h4,
#filtreProduit legend {
  font: 19px/19px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  text-transform: uppercase;
  margin-bottom: 15px;
}

/* - - - Bouton mobile - - - */
.btnFiltre {
  width: 100%;
  height: 42px;
  margin-bottom: 16px;
  border: 1px solid #ccc;
  border-radius: 0;
  text-align: center;
  background-color: #fff;
  font: 400 18px/42px "open_sans_condensedbold", Arial, sans-serif;
  text-transform: uppercase;
  color: #333;
}

.btnFiltre:before {
  content: "+";
  display: inline-block;
  width: 14px;
  margin-right: 6px;
  vertical-align: -3px;
  text-align: center;
  font: 400 26px/35px "open_sans_condensedbold", Arial, sans-serif;
  color: #86a740;
}

.btnFiltre.ouvert:before {
  content: "\2013";
  vertical-align: 0;
  margin-top: -3px;
}

/* - - - Categories - - - */
#filtreProduit .filtreCat {
  position: relative;
  margin-bottom: 16px;
}

#filtreProduit #listeCat {
  margin-bottom: 12px;
  list-style: none;
  font: 15px/16px "nunitolight", Arial, sans-serif;
}
#filtreProduit #listeCat ul {
  margin: 0px 0 0 14px;
  list-style: none;
  font-size: 13px;
}

#listeCat a {
  display: inline-block;
  font-family: "nunitoregular";
  color: #666;
  padding: 3px 0;
}

/* - - - Nb Article - - - */
#filtreProduit .nbArticle {
  position: relative;
  margin-bottom: 7px;
  padding: 14px 10px 12px;
  background: url(../gx/02/border-dotted.gif) 0 0 repeat-x #f3f3f3;
  font: 12px/18px "nunitoregular", Arial, sans-serif;
  color: #666;
}
#filtreProduit .nbArticle:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 100%;
  height: 1px;
  background: url(../gx/02/border-dotted.gif) 0 0 repeat-x #f3f3f3;
}

#filtreProduit .nbArticle b {
  font: 15px/18px "nunitoregular", Arial, sans-serif;
  color: #333;
}

#filtreProduit .retirer {
  padding-top: 8px;
  line-height: 16px;
}
#filtreProduit .retirer span {
  color: #333;
  text-decoration: underline;
}

#filtreProduit .retirer:before {
  content: "\e813";
  display: inline;
  margin-right: 2px;
  vertical-align: -2px;
  font: normal normal 19px/19px "icons";
  color: #333;
}

#filtreProduit .retirer.mobile {
  margin-top: 10px;
  padding: 10px 0;
  text-align: center;
}

/* - - - Autres filtres - - - */
#filtreProduit .filtre {
  position: relative;
  margin-bottom: 10px;
  padding: 38px 0 20px;
  border-bottom: 1px solid #d1d1d1;
}

#filtreProduit .filtre:last-of-type {
  border-bottom: 0;
}

/* IE8 a un problème est incapable de séparé le legend et le border */
.ie8 #filtreProduit .filtre {
  border-top: 0;
}

/* Legend dans un fieldset doit etre remis a sa place */
#filtreProduit .filtre legend {
  position: absolute;
  top: 10px;
  left: 0;
}

#filtreProduit .filtre label {
  font-size: 14px;
}
#filtreProduit .filtre label span {
  color: #999;
}

@media only screen and (max-width: 767px) {
  #filtreProduit,
  #listeCat,
  #filtreMarque,
  #filtreCouleur,
  #filtreMisc,
  #filtrePrix,
  #filtreProduit h4,
  #filtreProduit legend {
    display: none;
  }

  #menuSide.sideProduit {
    margin-top: 10px;
  }

  #filtreProduit {
    margin-top: 1em;
  }
  #filtreProduit .filtre,
  #filtreProduit .filtreNoBorder {
    margin-top: 16px;
    padding: 0;
    border: 0;
  }
  #filtreProduit .filtre:first-of-type {
    margin-top: 0;
  }

  #filtreProduit select {
    width: 94% !important;
    max-width: 94% !important;
  }
}

@media only screen and (max-width: 480px) {
  #filtreProduit select {
    width: 94% !important;
    max-width: 94% !important;
  }
  #filtreProduit .customSelect {
    height: 52px !important;
  }
}

#filtreProduit .customSelect {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 52px;
  overflow: hidden;
}
#filtreMarque .customSelect .customSelectInner {
  width: 100% !important;
  padding-right: 20px;
}

/* - - - - - - Tri - - - - - - */
#triProduit {
  float: left;
  /*height:50px;*/
  margin-bottom: 20px;
  padding: 0;
  /*background-color:#f3f3f3;*/
  color: #666;
}

/* C'est un peu serré à 960, donc on laisse un petite chance à IE8 */
.ie8 #triProduit {
  padding: 0 10px;
}

#triProduit .nbItems {
  float: left;
  font: 400 12px/50px "nunitoregular", Arial, sans-serif;
}

#triProduit label {
  display: inline-block;
  margin-right: 10px;
  font: 15px/36px "nunitoregular", Arial, sans-serif;
}

#triProduit #tri,
#triProduit #itemParPage {
  float: left;
  margin-top: 7px;
}
#triProduit #tri {
  margin-left: 0;
}
.ie8 #triProduit #tri {
  margin-left: 12px;
}

#triProduit #itemParPage select {
  width: 80px !important;
}
#triProduit #tri select {
  width: 174px !important;
}
#triProduit #tri .customSelectInner {
  width: 150px !important;
}

@media only screen and (max-width: 960px) {
  #triProduit label {
    display: none;
  }
}

@media only screen and (max-width: 500px) {
  /*#triProduit{ height:85px; }*/
  #triProduit .nbItems {
    float: none;
    line-height: 40px;
  }
  #triProduit #tri {
    float: none;
    margin: 0;
  }
}

/* - - - - - - Items - - - - - - */
.produits {
  list-style: none;
  font: 400 16px/20px "open_sans_condensedbold", Arial, sans-serif;
}
.produits li {
  float: left;
  width: 31.8%;
  max-width: 207px;
  margin: 0 2.2% 18px 0;
  overflow: hidden;
}

.ie8 .produits li {
  margin-right: 1.5%;
}
.ie8 .ie8clear {
  clear: left;
}
.produits li:nth-of-type(3n) {
  margin-right: 0;
}
.produits li:nth-of-type(3n + 1) {
  clear: left;
}

.produits a {
  display: block;
}

.produits .image {
  position: relative;
}

.produits a img {
  width: auto;
  max-width: 100%;
  max-height: 217px;
  border: 1px solid #666;
  margin: 0 auto;
  -webkit-transition: opacity 0.15s linear 0s;
  transition: opacity 0.15s linear 0s;
  -webkit-transform: translateZ(0);
}
.produits a:hover img {
  opacity: 0.8;
}

@media only screen and (max-width: 850px) {
  .produits a img {
    max-height: 155px;
  }
}

.produits .tagPromo,
.produits .tagNouveaute,
.produits .tagParaitre,
#produit .tagPromo,
#produit .tagNouveaute,
#produit .tagParaitre,
.nouveautes .tagNouveaute,
.nouveautes .tagParaitre {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: inline-block;
  padding: 2px 16px;
  text-align: center;
  font: 400 13px/16px "open_sans_condensedbold", Arial, sans-serif;
  color: #fff;
}

.produits .tagPromo,
.produits .tagNouveaute,
.produits .tagParaitre {
  left: 50%;
  width: 90px;
  margin-left: -45px;
}

.produits .tagPromo,
#produit .tagPromo {
  background-color: #ef5307;
}
.produits .tagNouveaute,
#produit .tagNouveaute,
.nouveautes .tagNouveaute {
  background-color: #0075d8;
}
.produits .tagParaitre,
#produit .tagParaitre,
.nouveautes .tagParaitre {
  background-color: #f3033b;
}
.produits .tagPromo.double,
.produits .tagParaitre.double {
  bottom: 26px;
}

.produits .infos {
  position: relative;
  padding-top: 11px;
  text-align: center;
}

.produits .nom {
  /*margin-bottom:6px;*/
  color: #333;
  line-height: 16px;
}
.produits .nom span {
  font: 14px "latobold";
}
.produits .nom:hover,
.produits .nom:focus,
.produits .nom:active {
  color: #2ebedd;
}

.produits .infos .sousTitre {
  font: 14px/20px "nunitobold";
  color: #666;
  margin-top: 3px;
}

.produits .marque {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 400;
  color: #666;
}
.produits .prix {
  margin-top: 1px;
  font: 400 14px/20px "nunitoregular", Arial, sans-serif;
  color: #333;
}
.prixReduit {
  color: #ef5307;
}

.prixSansSolde {
  position: relative;
  font: 400 14px/20px "nunitolight", Arial, sans-serif;
  color: #333;
  text-decoration: none;
  white-space: nowrap;
}
.nowrap {
  white-space: nowrap;
}

.produits .aPartirDe {
  display: inline-block;
  font-size: 15px;
  line-height: 18px;
}

.produits .avis {
  margin-top: 6px;
}
.produits .avis .noteProduitMini {
  display: inline-block;
  vertical-align: -2px;
}
.produits .avis .note {
  display: inline-block;
  margin-left: 6px;
}

/* Le line-through de FF et IE est trop bas, alors on fait un line-through custom */
.prixSansSolde:after {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  display: inline-block;
  width: 100%;
  height: 1px;
  border-bottom: 1px solid #000;
}
.produits .prixSansSolde:after {
  top: 8px;
}

@media only screen and (max-width: 1170px) {
  /* La liste de produit est moins large que la page d'accueil
	#listeProduit .produits li{ width:31%; margin:0 3.5% 20px 0; }
	#listeProduit .produits li:nth-child(4n){ margin-right:3.5%; }
	#listeProduit .produits li:nth-child(4n+1){ clear:none; }
	#listeProduit .produits li:nth-child(3n){ margin-right:0; }
	#listeProduit .produits li:nth-child(3n+1){ clear:left; }*/
}

@media only screen and (max-width: 850px) {
  #listeProduit .produits li {
    width: 31%;
    margin: 0 3.5% 20px 0;
  }
  #listeProduit .produits li:nth-of-type(4n) {
    margin-right: 3.5%;
  }
  #listeProduit .produits li:nth-of-type(4n + 1) {
    clear: none;
  }
  #listeProduit .produits li:nth-of-type(3n) {
    margin-right: 0;
  }
  #listeProduit .produits li:nth-of-type(3n + 1) {
    clear: left;
  }
}

@media only screen and (max-width: 600px) {
  #listeProduit {
    padding-top: 10px;
  }
  #listeProduit .innerPrinc {
    margin-left: 0;
  }

  #listeProduit .produits li {
    width: 46.5%;
    margin: 0 7% 20px 0;
  }

  #listeProduit .produits li:nth-of-type(3n) {
    margin-right: 7%;
  }
  #listeProduit .produits li:nth-of-type(3n + 1) {
    clear: none;
  }
  #listeProduit .produits li:nth-of-type(2n) {
    margin-right: 0;
  }
  #listeProduit .produits li:nth-of-type(2n + 1) {
    clear: left;
  }

  .produits .nom {
    min-height: 38px;
  }
}

@media only screen and (max-width: 400px) {
  #listeProduit {
    padding-top: 10px;
  }
  #listeProduit .innerPrinc {
    margin-left: 0;
  }

  .produits {
    font-size: 16px;
    line-height: 18px;
  }
  .produits .prix {
    font-size: 16px;
    line-height: 20px;
  }
}

/* 02_200 : Marques
--------------------------------------------------------------------------------------- */
#listeCollection h1 {
  padding-bottom: 14px;
  border-bottom: 4px solid #cac9c9;
}
#listeCat.liCollection a {
  /*font-size:14px; padding:5px 0;*/
}

.marqueBtn {
  color: #d1d1d1;
  margin-bottom: 30px;
}

.marqueBtn button {
  display: inline-block;
  background: transparent;
  font: 400 15px/21px "nunitoregular", Arial, sans-serif;
  color: #000;
}

#btnMarqueMosaique {
  margin-right: 12px;
}
#btnMarqueListe {
  margin-left: 12px;
}

.marqueBtn button:hover,
.marqueBtn button:focus,
.marqueBtn button.actif {
  color: #c91c1b;
}

.marqueBtn button:before {
  display: inline-block;
  margin-right: 6px;
  font: normal normal 1em/1em "icons";
}

#btnMarqueMosaique:before {
  content: "\e80f";
  font-size: 18px;
  vertical-align: -1px;
}
#btnMarqueListe:before {
  content: "\e804";
  font-size: 14px;
}

/* - - - Mosaique(pizza) de logo - - - */
#marqueMosaique li {
  float: left;
  width: 24.3%;
  margin: 0 0.933% 50px 0;
}

.ie8 #marqueMosaique li {
  margin: 0 0.7% 50px 0;
}

#marqueMosaique li:nth-child(4n) {
  margin-right: 0;
}
#marqueMosaique li:nth-child(4n + 1) {
  clear: left;
}

#marqueMosaique a {
  display: block;
  /*padding:19px;
	border:1px solid #f3f3f3;*/
  font: 400 19px/20px "open_sans_condensedbold", Arial, sans-serif;
  text-transform: uppercase;
  color: #333;
  -webkit-transition: border 0.15s linear 0s;
  transition: border 0.15s linear 0s;
}

#marqueMosaique a:hover,
#marqueMosaique a:focus,
#marqueMosaique a:active {
  border-color: #c91c1b;
}
#marqueMosaique a img {
  max-width: 222px;
  margin-bottom: 10px;
}

#marqueMosaique .sansLogo {
  position: relative;
}
#marqueMosaique .sansLogo a {
  padding: 0 0 40.5%;
  border: 1px solid #f3f3f3;
}
#marqueMosaique .sansLogo div {
  position: absolute;
  top: 50%; /* Centrer en js avec margin-top negatif */
  text-align: center;
  width: 100%;
  padding: 0 19px;
}

/* - - - Liste - - - */
#marqueListe {
  display: none;
}

#marqueListe .listeAlpha {
  float: left;
  width: 33%;
  padding-right: 20px;
}
#marqueListe .listeAlpha li,
#marqueListe .listeAlpha li li {
  margin: 0;
  list-style: none;
}
#marqueListe .listeAlpha li {
  margin-bottom: 1em;
}
#marqueListe .listeAlpha li li {
  margin-bottom: 0;
}

#marqueListe .listeAlpha > li:first-letter {
  font: 700 18px/26px "PT Serif", "Times New Roman", Times, serif;
  text-transform: uppercase;
  color: #000;
}

@media only screen and (max-width: 900px) {
  #marqueMosaique li {
    width: 32%;
    margin: 0 2% 20px 0;
  }

  #marqueMosaique li:nth-child(2n) {
    margin-right: 2%;
  }
  #marqueMosaique li:nth-child(2n + 1) {
    clear: none;
  }
  #marqueMosaique li:nth-child(3n) {
    margin-right: 0;
  }
  #marqueMosaique li:nth-child(3n + 1) {
    clear: left;
  }
}

@media only screen and (max-width: 767px) {
  #marqueMosaique li {
    width: 48%;
    margin: 0 4% 20px 0;
  }

  #marqueMosaique li:nth-child(3n) {
    margin-right: 4%;
  }
  #marqueMosaique li:nth-child(3n + 1) {
    clear: none;
  }
  #marqueMosaique li:nth-child(2n) {
    margin-right: 0;
  }
  #marqueMosaique li:nth-child(2n + 1) {
    clear: left;
  }
}

@media only screen and (max-width: 600px) {
  #marqueMosaique.listeVideo li {
    width: 100%;
    margin: 0 0 30px 0;
  }
}

@media only screen and (max-width: 479px) {
  #marqueMosaique li {
    width: 100%;
    margin: 0 0 30px 0;
  }
  #marqueMosaique a {
    font-size: 16px;
    line-height: 20px;
  }
}

/* 03_500 : CREATEURS
--------------------------------------------------------------------------------------- */
#menuSide.liCreateur h1 {
  font: 19px/19px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  text-transform: uppercase;
}
#menuSide.liCreateur li {
  list-style: none;
}
#menuSide.liCreateur li a {
  font-size: 15px;
  color: #666;
}

#listeCreateur .innerPrinc > nav > div h2,
#listeCreateur .innerPrinc > div a {
  float: left;
}
#listeCreateur .innerPrinc > nav > div > a {
  position: relative;
  line-height: 37px;
  margin-left: 20px;
}
#listeCreateur .innerPrinc > nav > div > a:after {
  display: inline-block;
  content: "<";
  font: 16px/16px "guifx";
  color: #333;
  margin-left: 5px;
  vertical-align: -1px;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
}
#listeCreateur .listeAlpha {
  float: left;
  width: 50%;
}
#listeCreateur .listeAlpha li span {
  font: 19px "open_sans_condensedbold";
  color: #333;
}
#listeCreateur .listeAlpha li a {
  color: #666;
}

#listeCreateur .listeAlpha ol {
  margin-bottom: 20px;
}

#listeCreateur .listeAlpha small {
  font-size: 12px;
}

@media only screen and (max-width: 500px) {
  #listeCreateur .listeAlpha {
    width: 100%;
  }
}

/* 03_510 : CREATEURS
--------------------------------------------------------------------------------------- */
#createur h2 {
  font-size: 35px;
  line-height: 35px;
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 4px solid #cac9c9;
}
#createurPhoto {
  float: left;
  width: 15.625%;
}
#createurInfo {
  float: right;
  width: 84.375%;
  font-family: "nunitoregular";
  padding-left: 20px;
}
#createurInfo h1 {
  font-size: 19px;
  line-height: 20px;
  text-transform: uppercase;
  margin: 0;
}
#createurInfo .type {
  font-size: 14px;
}

#asideCreateur #similaire {
  display: inline-block;
  width: 100%;
  margin-top: 17px;
  padding-top: 30px;
  border-top: 1px solid #cac9c9;
}

@media only screen and (max-width: 768px) {
  #createurInfo {
    float: left;
    width: 100%;
    padding: 0;
  }
  .produitHeaderMobile .titre {
    margin-bottom: 0;
  }
  #createurPhoto {
    float: left;
    width: 100%;
    max-width: 150px;
  }
}

/* 03_600 : ENSEIGNANTS
--------------------------------------------------------------------------------------- */
#listeDoc {
  display: inline-block;
  width: 100%;
  margin-top: 20px;
}
#listeDoc li {
  float: left;
  width: 23.3%;
  list-style: none;
  margin: 0 2.2% 30px 0;
  text-align: center;
}
#listeDoc li .nom {
  display: block;
  line-height: 16px;
  margin-top: 10px;
}
#listeDoc li .image {
  position: relative;
}
#listeDoc li a img {
  width: auto;
  max-height: 217px;
  border: 1px solid #666;
  margin: 0 auto;
  -webkit-transition: opacity 0.15s linear 0s;
  transition: opacity 0.15s linear 0s;
  -webkit-transform: translateZ(0);
}
#listeDoc li a:hover img {
  opacity: 0.8;
}

#listeDoc li:nth-of-type(4n) {
  margin-right: 0;
}
#listeDoc li:nth-of-type(4n + 1) {
  clear: left;
}

.ie8 #listeDoc li {
  margin: 0 1% 30px 0;
}

@media only screen and (max-width: 768px) {
  #listeDoc li {
    width: 31.3%;
    margin: 0 2.2% 18px 0;
  }
  #listeDoc li:nth-of-type(4n) {
    width: 31.3%;
    margin-right: 2.2%;
  }
  #listeDoc li:nth-of-type(4n + 1) {
    clear: none;
  }
  #listeDoc li:nth-of-type(3n) {
    width: 31.3%;
    margin-right: 0;
  }
  #listeDoc li:nth-of-type(3n + 1) {
    clear: left;
  }

  #listeDoc li a img {
    max-height: 155px;
  }
}

@media only screen and (max-width: 650px) {
  #listeDoc li {
    width: 48%;
    margin: 0 2.2% 18px 0;
  }
  #listeDoc li:nth-of-type(3n) {
    width: 48%;
    margin-right: 2.2%;
  }
  #listeDoc li:nth-of-type(3n + 1) {
    clear: none;
  }
  #listeDoc li:nth-of-type(2n) {
    width: 48%;
    margin-right: 0;
  }
  #listeDoc li:nth-of-type(2n + 1) {
    clear: left;
  }
}

/* 04_100 : Page produit
--------------------------------------------------------------------------------------- */
#produit h2 {
  display: inline-block;
  width: auto;
  margin-bottom: 0;
}
/*#produit */
.wrapHd {
  display: table;
  width: 100%;
  padding-bottom: 10px;
  margin-bottom: 26px;
  border-bottom: 4px solid #cac9c9;
}
/*#produit */
.wrapHd > span {
  display: none;
}

@media only screen and (max-width: 399px) {
  #produit h2 {
    display: inline-block;
    width: 100%;
    float: left;
    margin-bottom: 14px;
  }
  #produit .wrapHd > span {
    display: block;
    float: left;
    width: auto;
    margin-right: 12px;
    padding-top: 4px;
  }
}

/* - - - Photos - - - */
#produitPhotos {
  width: 34%; /*margin-bottom:30px;*/
}
#produitPhotos figure {
  position: relative;
  max-width: 330px;
  border: 1px solid #dddddd;
}
/*#produitPhotos .lienExtrait {float:left; color:#2ebedd; margin-top: 10px;}*/

#produitPhotos .zoom {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 999;
}

#produitPhotos .extrait {
  display: block;
  max-width: 220px;
  margin: 12px auto 0;
  padding: 6px 20px;
  border-radius: 5px;
  border: 1px solid #d1d1d1;
  background-color: #ebebeb;
  text-align: center;
  font: 18px/24px "open_sans_condensedbold";
  color: #333;
  -webkit-transition: background 0.15s linear 0s;
  transition: background 0.15s linear 0s;
}

#produitPhotos .extrait:hover,
#produitPhotos .extrait:focus {
  background-color: #fff;
}

.slider-nav {
  margin-top: 20px;
}

.slider-for .slick-track {
  display: flex;
  /*align-items: center;*/
}

.slider-for .slick-slide img {
  display: block;
  width: auto;
  max-width: 100%;
  margin: auto;
}
.slider-nav .liste-photoTb_item {
  margin: 0 5px;
}

@media only screen and (max-width: 960px) {
}

@media only screen and (max-width: 767px) {
  #produitPhotos {
    width: 34%;
    max-width: 224px;
    padding: 0 20px 0 0;
  }
}

@media only screen and (max-width: 600px) {
  #produitPhotos {
    width: 100%;
    max-width: 330px;
    margin: 0 auto 40px;
    padding: 0;
  }
  #produitPhotos figure {
    float: none;
    margin: 0 auto;
  }
}

/*#galerie, #thumbnails, .addthis_native_toolbox{ max-width:224px; margin:0 auto; }
#galerie{ margin-bottom:12px; border:1px solid #666; }
.zoomImg{ cursor: pointer; }

#thumbnails{ margin-bottom:20px; padding:0 35px; }
#thumbnails .slick-track {padding: 0 10px;}
#produitPhotos .titreTn {font:19px/19px 'open_sans_condensedbold'; color: #333; text-transform: uppercase; margin-bottom: 10px;}*/

/*@media only screen and (max-width: 479px) {
	#galerie{ margin-bottom:16px; }
}

#thumbnails .image{ max-height: 80px; padding:0 5px; }

#thumbnails .thumbPrev, #thumbnails .thumbNext{
	position:absolute;
	top:50%;
	left:0;
	width:30px;
	height:30px;
	margin-top: -15px;
	-webkit-transition: opacity 0.15s linear;
	transition: opacity 0.15s linear;
}
#thumbnails .thumbNext{ left:auto; right:0; }

#thumbnails .thumbPrev:before, #thumbnails .thumbNext:before{
	display:block;
	width:30px;
	height:30px;
	text-align: center;
	font:normal normal 14px/34px "icons";
	color:#333;
}
#thumbnails .thumbPrev:before{ content:'\e801'; }
#thumbnails .thumbNext:before{ content:'\e800'; }

#thumbnails img{
	border:1px solid #666;
	cursor:pointer;
	opacity:1;
	-webkit-transition: opacity 0.15s linear;
	transition: opacity 0.15s linear;
}
#thumbnails img:hover, #thumbnails img:focus{ opacity:0.5; }

#thumbnails .thumbPrev:hover, #thumbnails .thumbPrev:focus, #thumbnails .thumbPrev:active,
#thumbnails .thumbNext:hover, #thumbnails .thumbNext:focus, #thumbnails .thumbNext:active{
	opacity:1;
}*/

/* Icon de zoom */
/*#galerie:before{
	content:'';
	position: absolute;
	top:0;
	right:0;
	z-index: 10;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 50px 50px 0;
	border-color: transparent #d1d1d1 transparent;
	border-color: transparent rgba(204,204,204,0.75) transparent;
}

#galerie:after{
	content:'\e805';
	position: absolute;
	top:6px;
	right:7px;
	z-index: 11;
	font:normal normal 20px/20px "icons";
	color:#000;
}

#galerie.noImage:before, #galerie.noImage:after{ display:none; }*/

/* AddThis */
.addthis_sharing_toolbox {
  float: right;
  height: 32px;
}

@media only screen and (max-width: 399px) {
  .addthis_sharing_toolbox {
    float: left;
  }
}

#at20mc * {
  -webkit-box-sizing: content-box !important;
  -moz-box-sizing: content-box !important;
  box-sizing: content-box !important;
}

/* - - - Infos - - - */
#produitInfos {
  width: 63%;
  margin: 0 0 0 3%;
}

/*@media only screen and (max-width: 1170px) {
	#produitInfos{ padding-right:20px; }
}*/

@media only screen and (max-width: 767px) {
  #produitInfos {
    float: left;
    width: 66%;
    margin-left: 0;
    padding: 0;
  }

  /* AddThis */
  .addthis_sharing_toolbox {
    text-align: center;
  }
}

@media only screen and (max-width: 600px) {
  #produitInfos {
    width: 100%;
  }
}

#produitInfos header {
  margin-bottom: 12px; /*padding-bottom: 16px; border-bottom: 1px solid #d1d1d1;*/
}

#produitInfos .colInfo {
  float: left;
  width: 55%;
  margin: 0 3.7% 0 0;
}
#produitInfos header h4 {
  font: 26px/22px "open_sans_condensedbold";
  text-transform: uppercase;
  margin: 10px 0 0 0;
  padding: 0;
  border: 0;
}
#produitInfos .infoIntervenant {
  font: 15px/20px "nunitobold";
  width: 100%;
  color: #666;
  padding: 15px 0px;
  background-color: #f5f5f5;
}
#produitInfos .infoIntervenant p {
  margin-bottom: 0;
}
#produitInfos .infoIntervenant a {
  color: #2ebedd;
}

@media only screen and (max-width: 479px) {
  #produitInfos .infoIntervenant {
    font-size: 14px;
  }
}

#produitInfos .infoLivre {
  font: 16px/22px "nunitolight";
  color: #666;
  padding: 15px 20px;
}

#produitInfos .colPrix {
  margin-bottom: 40px;
}

#produitInfos .colPrix form {
  margin: 0;
  /*background: #fff;*/
  border-radius: 11px;
  color: #231f20;
}

#produitInfos .colPrix form div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

#produitInfos .colPrix form div > * {
  margin: 5px 0;
}

#produitInfos .colPrix .lienCollection {
  display: block;
  color: #666;
  margin-top: 16px;
}
#produitInfos .colPrix .lienCollection i {
  position: relative;
  display: inline-block;
  width: 25px;
  height: 25px;
  color: #fff;
  text-align: center;
  margin-left: 12px;
  background-color: #3b5998;
  vertical-align: -7px;
}
#produitInfos .colPrix .lienCollection i:before {
  position: absolute;
  top: 5px;
  right: 0;
  font-size: 21px;
}

@media only screen and (max-width: 767px) {
  #produitInfos .colInfo,
  #produitInfos .colPrix {
    width: 100%;
  }
}

.codeProduit {
  text-transform: uppercase;
  font: 12px/14px "nunitoregular", Arial, sans-serif;
}
.desktop .codeProduit {
  float: right;
  padding-top: 18px;
}
.mobile .codeProduit {
  margin-top: 8px;
}

.produitHeaderMobile {
  margin: 0 20px 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #d1d1d1;
}

#produitInfos h1,
.produitHeaderMobile .titre {
  display: inline-block;
  margin-bottom: 0px;
  line-height: 35px;
}

#produit .tagPromo,
#produit .tagNouveaute,
#produit .tagParaitre {
  position: relative;
  margin-left: 20px;
  vertical-align: 4px;
}
#produit .tagPromo.double,
#produit .tagParaitre.double {
  margin-left: 0;
}

@media only screen and (max-width: 767px) {
  .produitHeaderMobile {
    float: left;
    width: 66%;
    margin: 0;
    padding: 0;
    border: none;
  }
  .produitHeaderMobile .titre {
    display: block;
    font: 32px/35px "open_sans_condensedbold";
    color: #333;
    margin-bottom: 14px;
  }
  .produitHeaderMobile .titre span {
    font-size: 26px;
  }
  #produit .tagPromo,
  #produit .tagNouveaute,
  #produit .tagParaitre {
    margin-left: 0;
  }
  .produitHeaderMobile h4 {
    font-family: "nunitoregular";
    line-height: 32px;
    text-transform: uppercase;
  }
}

@media only screen and (max-width: 600px) {
  .produitHeaderMobile {
    width: 100%;
  }
}

#produitInfos .prixDynamique {
  margin-bottom: 30px;
}

#produitInfos .prixSansSolde,
.produitHeaderMobile .prixSansSolde {
  font-size: 20px;
}
#produitInfos .prixSansSolde:after,
#produitInfos .produitHeaderMobile .prixSansSolde:after {
  top: 11px;
}

#produitInfos .prix,
.produitHeaderMobile .prix {
  font: 400 40px/36px "nunitoregular", Arial, sans-serif;
}
.produitHeaderMobile .prix {
  display: block;
  margin-bottom: 10px;
}
.estEnSolde {
  color: #ef5307;
}

#produitInfos .economie,
.produitHeaderMobile .economie {
  display: inline-block;
  margin: 15px 0 0 0;
  padding: 0 15px;
  vertical-align: 6px;
  font: 400 15px/30px "nunitoregular", Arial, sans-serif;
  color: #fff;
  background: #ef5307;
  /*background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y5MDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkODAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top, #f90000 0%, #d80000 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f90000), color-stop(100%,#d80000));
	background: -webkit-linear-gradient(top, #f90000 0%,#d80000 100%);
	background: -o-linear-gradient(top, #f90000 0%,#d80000 100%);
	background: -ms-linear-gradient(top, #f90000 0%,#d80000 100%);
	background: linear-gradient(to bottom, #f90000 0%,#d80000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f90000', endColorstr='#d80000',GradientType=0 );*/
}

.produitHeaderMobile .prixMobile {
  margin-bottom: 1em;
}
.produitHeaderMobile .economie {
  margin: 0;
}

#produitInfos .noteLivraison {
  display: block;
  margin-top: 20px;
  /*font:700 16px/20px Arial, Helvetica, sans-serif;*/
  color: #c91c1b;
}

@media only screen and (max-width: 479px) {
  /*.produitHeaderMobile .titre{ font-size:24px; line-height:30px; }*/
  .produitHeaderMobile .prixSansSolde {
    font-size: 16px;
  }
  .produitHeaderMobile .prix {
    font-size: 30px;
  }

  .codeProduit {
    float: none;
    margin: 0;
  }
}

/* - - - Traits - - - */

#produitInfos h4 {
  margin-top: 20px;
  padding-bottom: 0.5em;
  border-bottom: 1px solid #ccc;
}

.trait {
  list-style: none;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.trait li {
  /*float:left;*/
  width: 100%;
  display: inline-block;
  height: 40px;
  margin: 0 0 10px 0;
  padding: 10px 20px 10px 12px;
  background-color: #231f20;
  flex: 0 1 49%;
}
.trait button {
  position: relative;
  float: left;
  width: 20px;
  height: 20px;
  text-align: center;
  border-radius: 100%;
  margin-right: 14px;
  padding: 0;
  background-color: #fff;
  -webkit-transition: all 0.15s linear 0s;
  transition: all 0.15s linear 0s;
  overflow: visible;
}

.trait button:hover,
.trait button:focus {
  background-color: #f5f5f5;
}
.trait button.selection {
  background-color: #fff;
}
.trait button.selection:before {
  position: absolute;
  left: 0;
  top: 0;
  content: "\2714";
  font: 30px/15px "guifx";
  color: #86a740;
}

.trait button.nonDisponible {
  pointer-events: none;
  border: 1px dashed #959595;
  background-color: #f3f3f3;
  color: #bfbfbf;
}
.trait span.version {
  float: left;
  color: #fff;
  margin-right: 14px;
}
.trait span.versionPrix {
  float: right;
  color: #fff;
}

#produitInfos .noteCharte {
  font: 400 13px/18px "nunitoregular", Arial, sans-serif;
  color: #333;
  text-decoration: underline;
}
#produitInfos .noteCharte:hover,
#produitInfos .noteCharte:focus,
#produitInfos .noteCharte:active {
  color: #000;
}

/* Taille */
.taille {
}

/* Couleur */
.couleur button,
.trait3 button {
  padding: 0;
  background-color: transparent;
  border: 1px solid #d1d1d1;
}
.couleur button:after,
.trait3 button:after,
.taille button:after {
  content: "";
  -webkit-box-sizing: content-box !important;
  -moz-box-sizing: content-box !important;
  box-sizing: content-box !important;
  position: absolute;
  top: -3px;
  left: -3px;
  width: 100%;
  height: 100%;
  padding: 2px;
  border: 1px solid transparent;
  -webkit-transition: border 0.15s linear;
  transition: border 0.15s linear;
}
.ie8 .couleur button,
.ie8 .couleur button:after,
.ie8 .trait3 button,
.ie8 .trait3 button:after {
  border: 0 none;
}
.ie8 .taille button {
  padding-left: 2px;
}

.couleur button:hover,
.couleur button:focus,
.trait3 button:hover,
.trait3 button:focus,
.taille button:hover,
.taille button:focus {
  border-color: #666;
}

.couleur button.selection:after,
.trait3 button.selection:after,
.taille button.selection:after {
  /*border:1px solid #c91c1b;*/
}

.ie8 .couleur button.selection,
.ie8 .trait3 button.selection {
  width: 34px;
  height: 34px;
}

#couleurSelecttionnee {
  font: 400 13px/18px "nunitoregular", Arial, sans-serif;
  color: #000;
}
#couleurSelecttionnee span {
  color: #333;
}

.couleurNonDisponible {
  position: relative;
}
.couleurNonDisponible:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  display: block;
  width: 34px;
  height: 34px;
  border: 1px solid #d1d1d1;
  background: url(../gx/m/sprites.png) -39px -3px no-repeat;
}

/* IE8 a un stacking order pourri, alors il ne peut pas afficher le X.
On fait disparaître la couleur à la place, pour éviter la confusion. */
.ie8 .couleurNonDisponible {
  display: none;
}

/* - - - Form - - - */
#produitInfos form {
  position: relative;
  /*padding:20px;*/
  /*background-color: #f5f5f5;*/
}
#produitInfos form p {
  margin: 0;
}
#produitInfos form .lbISBN {
  color: #666;
  line-height: 22px;
  margin-top: 5px;
}
#produitInfos form .lbISBN span {
  color: #333;
}
#produitInfos form .prixTotal {
  font: 26px/22px "nunitobold";
}

@media only screen and (max-width: 479px) {
  #produitInfos form {
    padding: 15px;
  }
  #produitInfos form .lbISBN {
    font-size: 14px;
    margin-top: 15px;
  }
  #produitInfos form .lbISBN span {
    font-size: 16px;
  }
}

#produitInfos form .qte {
  font: 400 15px/40px "nunitoregular", Arial, sans-serif;
  color: #333;
  margin: 3px 0 0;
}
#produitInfos form select,
#produitInfos form .customSelect {
  width: 64px !important;
  font: 400 16px "nunitolight", Arial, sans-serif;
  color: #666;
}

#produitInfos form .btn1 {
  width: 100%;
  line-height: 37px; /*padding: 0;*/
}
#produitInfos form .btn1:before {
  content: "\e80e";
  margin-right: 10px;
  vertical-align: -1px;
  font: normal normal 17px "icons";
  text-transform: lowercase;
  color: #fff;
}

@media only screen and (max-width: 960px) {
  .trait li {
    flex: 1 1 100%;
  }
  /*#produitInfos form .btn1{line-height: 37px;}*/
}

@media only screen and (max-width: 850px) {
  #produitInfos form .btn1 {
    font-size: 13px;
  }
}

@media only screen and (max-width: 767px) {
  #produitInfos form .btn1 {
    width: auto;
    padding: 0 20px;
  }
}

/*#ajoutWishlist{
	float:left;
	background-color:#f3f3f3;
	line-height:40px;
}

#ajoutWishlist:hover, #ajoutWishlist:focus, #ajoutWishlist:active{
	background-color:#fff;
}

#ajoutWishlist:before{
	content:'\e811';
	margin-right:6px;
	font:normal normal 15px "icons";
}

#ajoutWishlist.souhaitAjoute{
	-webkit-animation: souhaitPulse 2s;
	-moz-animation:    souhaitPulse 2s;
	-o-animation:      souhaitPulse 2s;
	animation:         souhaitPulse 2s;
}

@-webkit-keyframes souhaitPulse {
  0%, 100% { background-color:#f3f3f3; }
  15% { background-color:#30cc30; }
}
@-moz-keyframes souhaitPulse {
  0%, 100% { background-color:#f3f3f3; }
  15% { background-color:#30cc30; }
}
@-o-keyframes souhaitPulse {
  0%, 100% { background-color:#f3f3f3; }
  15% { background-color:#30cc30; }
}
@keyframes souhaitPulse {
  0%, 100% { background-color:#f3f3f3; }
  15% { background-color:#30cc30; }
}*/

#produit .note {
  display: block;
  margin: 0 0 1em 0;
}

@media only screen and (max-width: 1170px) {
  #produitInfos form .qte {
    margin-top: 3px;
  }
  #produitInfos form .button {
    float: right;
    width: 250px;
    margin: 0 0 10px;
  }
  #ajoutWishlist {
    float: right;
    clear: right;
    width: 250px;
    text-align: center;
  }
}

@media only screen and (max-width: 800px) {
  #produitInfos form .button {
    font-size: 13px;
    width: 225px;
  }
  #ajoutWishlist {
    font-size: 12px;
    width: 225px;
  }
}

@media only screen and (max-width: 767px) {
  #produitInfos form .button {
    font-size: 14px;
    width: 250px;
  }
  #ajoutWishlist {
    font-size: 13px;
    width: 250px;
  }
}

@media only screen and (max-width: 479px) {
  #produit .note {
    text-align: left;
  }
}

/* - - - Description - - - */
#produit .spread {
  width: 100%;
  margin: 40px 0 30px;
  padding: 70px 0 0;
  border-top: 4px solid #e6e6e6;
}
#produit .description {
  width: 100%;
  margin: 40px 0 30px;
  padding: 70px 0;
  border-top: 4px solid #e6e6e6;
  border-bottom: 4px solid #e6e6e6;
}
#produit .description h4,
.produitsAssocies #similaire h2 {
  text-transform: uppercase;
  margin: 0 0 14px 0;
  font: 26px/35px "nunitobold";
  color: #86a740;
}
/*#produit .description .texte {float: left; width: 80%; max-width: 740px; padding-right: 7%;}*/

#produit > div {
  display: flex;
  justify-content: space-between;
}

#produit h3 {
  text-transform: uppercase;
  margin: 0 0 20px 0;
  font: 19px/26px "nunitobold";
}

.infoLivre,
.auteur {
  width: 40%;
}
.infoLivre span {
  font: 16px/23px "nunitobold";
  width: 50%;

}

.infoLivre li {
  display: flex;
  align-items: flex-start;
}

.infoLivre li p{
  flex: 1;
  margin-bottom:10px
}

#produit .auteur > div {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

#produit .auteur figure {
  display: inline-block;
  vertical-align: bottom;
  text-align: center;
}
#produit .auteur a {
  display: inline-block;
}
#produit .auteur figure img {
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}

#produit .auteur figure figcaption {
  color: #2ebedd;
  margin: 5px 0 0px 0;
}

#produit .auteur figure figcaption span {
  font: 16px/22px "nunitolight";
  color: #666666;
  display: block;
}

@media only screen and (max-width: 767px) {
  #produit .auteur figure {
    width: 50%;
  }
}

@media only screen and (max-width: 600px) {
  #produit .description {
    padding: 20px 0px;
    margin-bottom: 20px;
  }

  #produit > div {
    flex-direction: column;
  }

  .infoLivre,
  .auteur {
    width: 100%;
    margin: 20px 0px;
  }
}

@media only screen and (max-width: 479px) {
  #produit .auteur figure {
    width: 100%;
  }

  #produitInfos form .qte {
  }
}

/* - - - Produits associées et récement visités - - - */
.produitsAssocies section,
#opinions {
  clear: left;
  padding-top: 20px;
}

/*.produitsAssocies .responsive .slick-slide img {max-height: 144px;}*/
.produitsAssocies .responsive .slick-slide .carrousel__image-box {
  padding: 0 25px;
}

.produitsAssocies .produits li {
  width: 15%;
  margin-right: 2%;
}
.ie8 .produitsAssocies .produits li {
  margin-right: 1.66666%;
}

.produitsAssocies .produits li:nth-child(4n) {
  margin-right: 2%;
}
.produitsAssocies .produits li:nth-child(4n + 1) {
  clear: none;
}
.produitsAssocies .produits li:nth-child(6n) {
  margin-right: 0;
}

@media only screen and (max-width: 850px) {
  .produitsAssocies .produits li,
  .produitsAssocies .produits li:nth-child(4n) {
    width: 31%;
    margin-right: 3.5%;
  }
  .produitsAssocies .produits li:nth-child(3n) {
    margin-right: 0;
  }
  .produitsAssocies .produits li:nth-child(3n + 1) {
    clear: left;
  }
}

@media only screen and (max-width: 600px) {
  .produitsAssocies .produits li {
    width: 46.5%;
    margin: 0 7% 20px 0;
  }
  .produitsAssocies .produits li:nth-child(3n) {
    margin-right: 7%;
  }
  .produitsAssocies .produits li:nth-child(3n + 1) {
    clear: none;
  }
  .produitsAssocies .produits li:nth-child(2n) {
    width: 46.5%;
    margin-right: 0;
  }
  .produitsAssocies .produits li:nth-child(2n + 1) {
    clear: left;
  }
}

/* - - - Notes - - - */
.noteProduit {
  display: inline-block;
  width: 140px;
  height: 22px;
  overflow: hidden;
  margin-top: 12px;
  background: url(../gx/m/note.png) no-repeat;
}

.produitHeaderMobile .noteProduit {
  margin-top: 20px;
}

.noteProduit.note1 {
  background-position: -116px 0;
}
.noteProduit.note15 {
  background-position: -87px -29px;
}
.noteProduit.note2 {
  background-position: -87px 0;
}
.noteProduit.note25 {
  background-position: -58px -29px;
}
.noteProduit.note3 {
  background-position: -58px 0;
}
.noteProduit.note35 {
  background-position: -29px -29px;
}
.noteProduit.note4 {
  background-position: -29px 0;
}
.noteProduit.note45 {
  background-position: 0 -29px;
}
.noteProduit.note5 {
  background-position: 0 0;
}

.noteProduitMini {
  display: inline-block;
  width: 87px;
  height: 13px;
  overflow: hidden;
  background: url(../gx/m/note.png) no-repeat;
}

.noteProduitMini.note1 {
  background-position: -73px -59px;
}
.noteProduitMini.note15 {
  background-position: -55px -77px;
}
.noteProduitMini.note2 {
  background-position: -55px -59px;
}
.noteProduitMini.note25 {
  background-position: -37px -77px;
}
.noteProduitMini.note3 {
  background-position: -37px -59px;
}
.noteProduitMini.note35 {
  background-position: -19px -77px;
}
.noteProduitMini.note4 {
  background-position: -19px -59px;
}
.noteProduitMini.note45 {
  background-position: 0 -77px;
}
.noteProduitMini.note5 {
  background-position: 0 -59px;
}

#produit .nbAvis {
  display: inline-block;
  margin-left: 5px;
  vertical-align: 6px;
}

/* Styles pour appareils haute resolution */
@media (-o-min-device-pixel-ratio: 2/1), (-webkit-min-device-pixel-ratio: 2) {
  .noteProduit,
  .noteProduitMini {
    background: url(../gx/m/note2x.png) no-repeat;
    background-size: 256px 91px;
  }
}

/* - - - Commentaires - - - */
/* - Formulaire - */
#opinions h3 {
  margin-top: 20px;
}

#opinions .form {
  display: none;
  margin-bottom: 20px;
  padding: 20px 0;
  border-top: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
}

#opinions .form.zeroNote {
  margin-bottom: 0;
  border-bottom: none;
}

#opinions .noteProduit {
  vertical-align: -4px;
  margin: 0 5px;
}
#opinions .nbAvis {
  color: #999;
}
#opinions #ouvreAvis {
  margin: 0 0 20px 20px;
}
#opinions #ouvreAvis.zeroNote {
  margin-left: 0;
}

#opinions label {
  width: 120px;
}
.rang.commentaire,
#commentaire {
  height: 126px;
}
#commentaire {
  width: 560px;
}

.rangNote {
  clear: left;
  height: 36px;
  margin-bottom: 20px;
}
.rangNote label {
  float: left;
  width: 120px;
}

#ratingProduit {
  float: left;
  margin: 8px 0 0 20px;
}

#ratingProduit .rating {
  float: left;
  width: 18px;
  height: 13px;
  overflow: hidden;
  background: url(../gx/m/note.png) -91px -59px no-repeat;
  -webkit-transition: none;
  transition: none;
}
#ratingProduit .ratingOn {
  background: url(../gx/m/note.png) 0 -59px no-repeat;
}

/* - Liste de commentaire - */
#opinions .messageSucces {
  margin: 20px auto;
  max-width: 600px;
}

#listeCommentaires {
  list-style: none;
  font: 12px/20px "nunitoregular", Arial, sans-serif;
}
#listeCommentaires li {
  float: left;
  width: 47.5%;
  margin: 0 5% 30px 0;
}
#listeCommentaires li:nth-of-type(odd) {
  clear: left;
}
#listeCommentaires li:nth-of-type(even) {
  margin-right: 0;
}

.no-mediaqueries #listeCommentaires li {
  margin-right: 2.5%;
}

#listeCommentaires h4 {
  margin: 0 0 12px 0;
  font: 700 14px/20px "nunitoregular", Arial, sans-serif;
}
#listeCommentaires .details {
  clear: left;
  font-size: 12px;
  color: #666;
}
#listeCommentaires .nom strong {
  font-size: 13px;
  font-style: italic;
  color: #000;
}

#listeCommentaires .commCourt {
  position: relative;
  max-height: 100px;
  overflow: hidden;
}

#listeCommentaires .commCourt:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  height: 40px;
  width: 100%;
  background: -moz-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%, rgba(255, 255, 255, 0)),
    color-stop(100%, rgba(255, 255, 255, 1))
  );
  background: -webkit-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  background: -o-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  background: -ms-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
}

#listeCommentaires .commSuite {
  display: inline;
  background: none;
  color: #c91c1b;
}

#listeCommentaires .commSuite:after {
  content: "\25BC";
  margin-left: 6px;
}

#opinions .pagination {
  padding: 20px 0;
  text-align: right;
}

@media only screen and (max-width: 1170px) {
  #opinions {
    margin: 0 20px;
  }
}

@media only screen and (max-width: 960px) {
  #opinions .form .rang {
    height: 36px;
    margin-bottom: 20px;
  }
  #opinions .form .rang label {
    float: left;
    width: 120px;
  }
  #opinions .form .rang input {
    float: left;
    width: 300px;
    margin-left: 20px;
  }
}

@media only screen and (max-width: 767px) {
  #opinions .sommaire {
    text-align: center;
  }
  #opinions #ouvreAvis {
    display: block;
    margin: 16px auto 30px;
  }

  #opinions .form .rang {
    height: auto;
    margin-bottom: 10px;
  }
  #opinions .form .rang label,
  #opinions .form .rang input,
  #opinions .form .rang textarea {
    float: none;
    width: 100%;
    margin-left: 0;
  }

  #listeCommentaires li {
    float: none;
    width: 100%;
    margin-right: 0;
  }

  #opinions .form .button {
    display: block;
    width: 150px;
    margin: 0 auto;
  }
}

/* 07_100 : Créer un compte
--------------------------------------------------------------------------------------- */
.souvenir {
  margin-left: 170px;
}

.form .rangMotPasse {
  margin-bottom: 10px;
}
#motPasse {
  margin-right: 12px;
}
.motPasseOublie {
  clear: left;
  display: block;
  font-size: 12px;
  line-height: 38px;
  margin-left: 170px;
}
.motPasseOublie a {
  color: #2ebedd;
}
.motPasseOublie a:hover,
.motPasseOublie a:focus,
.motPasseOublie a:active {
  color: #2ebedd;
}

.form .smallgap {
  margin-bottom: 10px;
}

#avantages .incTinyMce ul {
  margin-bottom: 1em;
}

@media only screen and (max-width: 960px) {
  .form .rangMotPasse {
    margin-bottom: 0;
  }
  .souvenir,
  .motPasseOublie {
    margin-left: 0;
  }
}

/*--------------------------------------------------------------------------------------- */
/* Compte */
/*--------------------------------------------------------------------------------------- */
.formCompte .note {
  margin-bottom: 2em;
}

.form label.long {
  line-height: 18px;
}

.fr #creerCompte .rangee label {
  width: 235px;
}

@media only screen and (max-width: 960px) {
  .formCompte .note {
    margin-bottom: 1em;
  }
  .formCompte label.long {
    padding: 10px 0;
  }
}

@media only screen and (max-width: 767px) {
  .formCompte .boiteCompte {
    padding-left: 20px;
    border-width: 1px 0;
  }
}

/* 09_100 : Mon compte
--------------------------------------------------------------------------------------- */
.messageSuivi {
  text-align: left;
}
.messageSuivi div {
  margin-left: 20px;
}

/* 09_200 : Informations personnelles
--------------------------------------------------------------------------------------- */

/* 09_300 : Mes adresses
--------------------------------------------------------------------------------------- */

/* 09_400 : Historique de commandes
--------------------------------------------------------------------------------------- */
#historique table {
  width: 100%;
  border: 1px solid #d1d1d1;
}

#historique h3 {
  margin: 40px 0 16px;
}
#historique h3:first-child {
  margin-top: 0;
}

#historique thead th {
  background-color: #f3f3f3;
  font-family: "open_sans_condensedbold";
  color: #333;
  line-height: 16px;
  text-transform: uppercase;
}
#historique td,
#historique th {
  padding: 5px 10px;
}
#historique th {
  vertical-align: bottom;
}
#historique tr:nth-child(even) td {
  background-color: #f3f3f3;
}
#historique td {
  font-size: 13px;
}

#historique .confirmation {
  width: 20%;
}
#historique .article {
  white-space: nowrap;
}
#historique th.total {
  text-align: right;
}
#historique .total {
  text-align: right;
  white-space: nowrap;
}
#historique .details {
  text-align: center;
}

#historique .date .court {
  display: none;
}

.statut .annule {
  color: #c00;
}

.transaction {
  padding: 20px 0;
}

.vieilleFacture {
  position: relative;
  max-height: 295px;
  overflow: hidden;
}

.vieilleFacture .vieilleFactureAnim {
  height: 295px;
  overflow: hidden;
}

.vieilleFacture .btnPlus {
  position: absolute;
  bottom: 0;
  z-index: 2;
  width: 100%;
  height: 100px;
  padding-top: 40px;
  font: 400 16px/20px "nunitoregular", Arial, sans-serif;
  color: #333;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 1) 100%
  ); /* FF3.6+ */
  background: -webkit-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 1) 100%
  ); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 1) 100%
  ); /* Opera 11.10+ */
  background: -ms-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 1) 100%
  ); /* IE10+ */
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 50%,
    rgba(255, 255, 255, 1) 100%
  ); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-8 */
}
.vieilleFacture .btnPlus:hover,
.vieilleFacture .btnPlus:focus,
.vieilleFacture .btnPlus:active {
  color: #c91c1b;
}

.ie9only .vieilleFacture .btnPlus {
  filter: none;
}

@media only screen and (max-width: 960px) {
  #historique {
    font-size: 13px;
    line-height: 18px;
  }
  #historique td,
  #historique th {
    padding: 10px 7px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 850px) {
  #historique .date .court {
    display: inline;
  }
  #historique .date .long {
    display: none;
  }
  #historique td,
  #historique th {
    padding: 10px 7px;
  }
}

@media only screen and (max-width: 767px) {
  /* Force table to not be like tables anymore */
  #historique table,
  #historique thead,
  #historique tbody,
  #historique th,
  #historique td,
  #historique tr {
    display: block;
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  #historique thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  #historique tr {
    border-bottom: 5px solid #d1d1d1;
  }

  /* Behave like a "row" */
  #historique td {
    position: relative;
    padding-left: 53%;
    border-bottom: 1px solid #d1d1d1;
    line-height: 18px;
  }

  /* Now behave like a table header */
  #historique td:before {
    content: attr(data-title); /* Label the data */
    position: absolute;
    top: 5px;
    left: 10px;
    width: 48%;
    padding-right: 10px;
    font-weight: bold;
    color: #000;
  }

  /* Border-right */
  #historique td:not(.details):after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 104%;
    background-color: #d1d1d1;
  }

  #historique .date,
  #historique .confirmation {
    width: auto;
  }
  #historique .total {
    text-align: left;
  }
  #historique .details {
    padding: 0;
    font-weight: bold;
  }
  #historique .details a {
    display: block;
    padding: 5px 0;
  }

  /* IE9 doesn't like when you turn a table into a block. Still slightly broken(too large), but acceptable) */
  .ie9 #historique table {
    display: table;
  }
  .ie9 #historique thead {
    display: table-header-group;
  }
  .ie9 #historique tbody {
    display: table-row;
  }
  .ie9 #historique tr {
    display: table-row;
    position: static;
    border: 0;
  }
  .ie9 #historique th {
    display: table-header;
  }
  .ie9 #historique td {
    display: table-cell;
  }

  .ie9 #historique td:before,
  .ie9 #historique td:after {
    display: none;
  }
  .ie9 #historique td {
    position: static;
    min-height: 0;
    padding: 5px;
    border-bottom: 0;
  }
}

@media only screen and (max-width: 479px) {
  #historique .confirmation,
  #historique .confirmation:before {
    height: 48px;
  }
}

/* 09_500 : Liste de souhaits
---------------------------------------------------------------------------------------
#panier.listeSouhaits .prixAjouter{
	float:right;
	text-align: right;
	font:700 20px/34px Arial, Helvetica, sans-serif;
	color:#c91c1b;
}

#panier.listeSouhaits .button{ display: inline-block; margin-top:2px; font:700 12px/30px Arial, Helvetica, sans-serif; }
#panier.listeSouhaits .button:before{
	content:'\e80e';
	margin-right:8px;
	vertical-align: -1px;
	font:normal normal 17px "icons";
	color:#000;
	text-transform: lowercase;
}

.souhaitND{
	display: inline-block;
	padding:0 10px;
	border:1px solid #c00;
	border-radius:5px;
	background-color:#fdd;
	text-align: center;
	font:700 14px/34px Arial, Helvetica, sans-serif;
	color:#c00;
	text-transform: uppercase;
}

#panier.listeSouhaits .note { margin-right:0; }

@media only screen and (max-width: 1050px) {
	#panier.listeSouhaits .quantite{ margin-left:20px; }
}

@media only screen and (max-width: 1000px) {
	#panier.listeSouhaits .prix { margin-top: 10px; }
}


@media only screen and (max-width: 850px) {
	#panier.listeSouhaits .infos{ margin-bottom:10px; }
	#panier.listeSouhaits .quantite, #panier.listeSouhaits .prix{ clear:left; float:none; margin-left:90px; }
}

@media only screen and (max-width: 767px) {
	#panier.listeSouhaits .prixAjouter{
		clear: left;
		float: none;
		margin-left: 90px;
		text-align: left;
	}
}*/

/*--------------------------------------------------------------------------------------- */
/* Panier */
/*--------------------------------------------------------------------------------------- */

/* Conteneurs
--------------------------------------------------------------------------------------- */
/*#headerPanier{ min-height: 100px; }
#headerPanier h1{ margin:0; padding:32px 0; }*/

.colPanier {
  float: left;
  width: 100%;
  margin-right: -300px;
}
.innerPanier {
  margin-right: 300px;
}

.colPanier button {
  margin-top: 20px;
}

/*@media only screen and (max-width: 1170px) {
	#headerPanier{ padding: 0 20px; }
	.colPanier{ padding-left:20px; }
}*/

@media only screen and (max-width: 850px) {
  #headerPanier {
    min-height: 80px;
  }
  .innerPanier {
    margin-right: 270px;
  }
}

@media only screen and (max-width: 767px) {
  #headerPanier {
    padding: 0;
  }
  .colPanier,
  .innerPanier {
    float: none;
    margin: 0;
  }
  .colPanier {
    padding: 0;
    width: 100%;
  }
  .colPanier button {
    display: block;
    margin: 20px auto 0;
  }
  .innerPanier {
    margin-bottom: 18px;
    border-width: 1px 0;
  }
}

/* Sidebar Panier
--------------------------------------------------------------------------------------- */
.sidePanier {
  float: left;
  width: 270px;
  margin-left: 30px;
}

.boiteCompte {
  padding: 20px;
  border: 1px solid #d1d1d1;
}
.boiteCaisse {
  border: 1px solid #d1d1d1;
}
.boiteSection {
  padding: 20px 0;
  border-top: 1px solid #d1d1d1;
}
.separateurBouton {
  border-top: 1px solid #d1d1d1;
}
.separateurBouton .button {
  margin-top: 20px;
}
.boitePadding {
  padding: 16px 20px 20px;
}

.sidePanier h3 {
  /*margin-bottom:20px;*/
  margin: 20px 0;
}

.sidePanier.incTinyMce ul {
  margin: 0;
  line-height: 22px;
}
.sidePanier.incTinyMce li {
  margin: 0 0 1.25em 15px;
}

.sidePanier .button {
  display: block;
  margin-top: 10px;
}

@media only screen and (max-width: 1170px) {
  .sidePanier {
    width: 250px;
  }
}

@media only screen and (max-width: 850px) {
  .sidePanier {
    margin-left: 50px;
  }
}

@media only screen and (max-width: 767px) {
  .sidePanier {
    float: none;
    width: 320px;
    margin: 20px auto 0;
    padding: 0;
  }
  .boiteCompte .buttonSec {
    display: block;
    width: 160px;
    margin: 0 auto;
    text-align: center;
  }
  .en .buttonSec {
    width: 180px;
  }
  .fr #creerCompte .buttonSec {
    width: 200px;
  }
}

@media only screen and (max-width: 479px) {
  .sidePanier {
    width: 100%;
    border-width: 1px 0;
  }
  .sidePanier .button {
    margin: 10px 20px 0;
  }
  .sidePanier .boiteCompte {
    border-width: 1px 0;
  }
  .boitePadding {
    padding: 16px 0;
  }
}

/* - - - Caisse - - - */

#caisse h3 {
  margin: 0 0 14px;
}

#promoCode {
  display: inline-block;
  width: 100px;
  margin-right: 4px;
}
#formPromo label {
  margin-bottom: 3px;
}
.en #formPromo .buttonSec {
  width: auto;
}

#caisse .listeProduit {
  list-style: none;
  background-color: #f3f3f3;
  font: 400 13px/21px "nunitolight", Arial, sans-serif;
  color: #333;
}
#caisse .listeProduit li {
  padding: 12px 16px;
  border-bottom: 1px solid #fff;
}
#caisse .listeProduit .prix {
  float: right;
  font-weight: 400;
}

.boiteTotaux {
  padding: 12px 20px;
}
.totaux {
  width: 100%;
  line-height: 28px;
}
.totaux td,
.totaux th {
  width: 50%;
}
.totaux td {
  text-align: right;
}
.sousTotal th,
.sousTotal td {
  font-weight: 400;
  color: #333;
}

.grandTotal th {
  width: 35%;
  font-size: 18px;
  color: #333;
}
.grandTotal td {
  width: 65%;
  font-size: 20px;
  font-weight: 400;
  color: #333;
}
.grandTotal td span {
  font-size: 15px;
}

#caisse .note {
  margin: 1em 0 0;
  text-align: right;
}

#caisse .button {
  max-width: 220px;
  margin: 18px auto 0;
}

@media only screen and (max-width: 767px) {
  #promoCode {
    width: 150px;
  }
  #caisse .boiteSection,
  #caisse .boiteTotaux {
    padding-left: 0;
    padding-right: 0;
    margin: 0 20px;
  }

  #commDetails {
    display: none;
  }
}

@media only screen and (max-width: 479px) {
  #caisse .boiteCaisse {
    margin-top: 0;
    border-width: 1px 0;
  }
  #caisse .boiteSection:first-child {
    padding-top: 0;
  }
  #caisse .boiteSection,
  #caisse .boiteTotaux {
    margin: 0;
  }
}

/* - - - Transport gratuit - - - */
.transportGratuit {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #ffce93;
  border-radius: 4px;
  text-align: center;
  background-color: #fff4c6;
  font: 400 14px/20px "Open Sans", Arial, Helvetica, sans-serif;
  color: #f7941d;
}
.transportGratuit strong {
  font: 700 20px/28px "Open Sans", Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  color: #f7941d;
}
.transportGratuit .conditions {
  color: #f7941d;
  font-size: 11px;
  text-decoration: underline;
  vertical-align: 9px;
}

.transportGratuit .retour {
  color: #000;
}
.transportGratuit .retour:before {
  content: "\e801";
  margin-right: 6px;
  font: normal normal 14px "icons";
  vertical-align: -1px;
}

/* Etapes en-tete
--------------------------------------------------------------------------------------- */
#etapes {
  width: 100%;
  list-style: none;
  height: 100px;
}

#etapes li {
  float: left;
  width: 25%;
  vertical-align: top;
}

#etapes li:before {
  content: attr(data-etape);
  float: left;
  display: block;
  width: 48px;
  height: 48px;
  margin: 0 10px;
  border-radius: 48px;
  text-align: center;
  background-color: #d1d1d1;
  font: 400 25px/48px "open_sans_condensedbold", Arial, sans-serif;
  color: #fff;
}

.no-borderradius #etapes li:before {
  background: url(../gx/m/ie-sprites.png) -149px -1px no-repeat transparent;
}

#etapes .etapeBg {
  padding: 0 10px 0 68px;
  background-color: #fff;
}

#etapes .nomEtape {
  padding-top: 11px;
  white-space: nowrap;
  font: 400 20px/20px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  text-transform: uppercase;
}

#etapes a {
  display: block;
  margin-top: 2px;
  font: 400 12px/12px "nunitoregular", Arial, sans-serif;
  text-decoration: underline;
}

#etapes .actif:before {
  background-color: #333;
}
#etapes .actif .nomEtape {
  color: #333;
}
.no-borderradius #etapes .actif:before {
  background: url(../gx/m/ie-sprites.png) -99px -1px no-repeat transparent;
}

#etapes .passe:before {
  content: "\e80c";
  font: normal normal 29px/48px "icons";
  background-color: #86a740;
}
#etapes .passe .nomEtape {
  color: #86a740;
}
.no-borderradius #etapes .passe:before {
  background: url(../gx/m/ie-sprites.png) -49px -1px no-repeat transparent;
}

#etapes .panier .etapeBg {
  padding-left: 58px;
}
#etapes .panier:before {
  content: "\e80e";
  font-size: 25px;
  margin-left: 0;
}

#etapes .adresse.actif:before {
  letter-spacing: 3px;
}
#etapes .passe:before {
  letter-spacing: 1px;
}

#etapes .justify {
  width: 100%;
}
#etapes .justify:before {
  display: none;
}

@media only screen and (max-width: 850px) {
  #etapes {
    height: 48px;
    border: 0;
  }
  #etapes li {
    width: auto;
  }
}

@media only screen and (max-width: 767px) {
  #etapes li {
    display: none;
  }
  #etapes .actif {
    display: block;
    margin: 0 auto;
  }
  #etapes .actif:before {
    margin-left: 0;
  }
  #etapes .actif .etapeBg {
    padding-left: 58px;
  }
}

/* 10_100 : Panier
--------------------------------------------------------------------------------------- */
#panier header {
  font: 400 16px/44px "open_sans_condensedbold", Arial, sans-serif;
  color: #333;
  text-transform: uppercase;
  padding: 0 20px;
  background-color: #f3f3f3;
}

#panier ul {
  list-style: none;
}
#panier li {
  padding: 20px;
  border-bottom: 1px solid #d1d1d1;
}

#panier a {
  display: block;
}

#panier .photo {
  display: block;
  float: left;
  width: 62px;
  border: 1px solid #666;
}

#panier .infos {
  float: left;
  max-width: 54%;
  margin-left: 20px;
  margin-top: -7px;
}
#panier .nom {
  /*font-weight:bold;*/
  color: #333;
}
#panier .description {
  margin-bottom: 0.6em;
}
#panier .infoTrait b {
  font-weight: normal;
  color: #000;
}
#panier .infoTrait:before {
  content: "|";
  font-size: 18px;
  margin: 0 4px;
  vertical-align: 2px;
  color: #666;
}
#panier .infoTrait:first-of-type:before {
  display: none;
}
#panier .retirer {
  display: inline-block;
  font-size: 13px;
  text-decoration: underline;
  color: #333;
}
#panier .retirer:hover,
#panier .retirer:focus,
#panier .retirer:active {
  color: #c91c1b;
}

#panier .quantite {
  float: right;
  margin: 15px 0 0 10px;
}
#panier .quantite select,
#panier .quantite .customSelect {
  width: 60px;
  font: 400 16px "nunitolight", Arial, sans-serif;
  color: #666;
}
#panier .prix {
  float: right;
  margin-top: 20px;
  font: 400 23px/22px "nunitoregular", Arial, sans-serif;
  color: #2ebedd;
}
#panier .prix .prixSansSolde {
  font-size: 16px;
}

#panier .vide {
  margin: 0;
  border: 0;
}

#panier .note {
  float: right;
  margin: 18px 300px 0 0;
}

.continuerAchat {
  float: left;
  display: inline-block;
  margin-top: 12px;
  color: #333;
}
.continuerAchat:hover,
.continuerAchat:focus,
.continuerAchat:active {
  color: #2ebedd;
}
.continuerAchat:before {
  content: "\e801";
  display: inline-block;
  margin-right: 6px;
  vertical-align: -1px;
  font: normal normal 1em/1em "icons";
}

@media only screen and (max-width: 1170px) {
  #confirmation .continuerAchat {
    margin-left: 20px;
  }
}

@media only screen and (max-width: 1000px) {
  #panier .infoTrait {
    display: block;
  }
  #panier .infoTrait:before {
    content: "";
    display: none;
    margin: 0;
    vertical-align: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1000px) {
  #panier .quantite {
    margin-top: 0;
  }
  #panier .prix {
    clear: right;
  }
  #panier .prix span {
    display: block;
  }
  #panier .prix .prixSansSolde {
    float: right;
  }
}

@media only screen and (max-width: 767px) {
  #panier li {
    padding: 20px 0;
  }
  #panier .infos {
    margin-bottom: 20px;
  }
  #panier .quantite,
  #panier .prix {
    clear: left;
    float: none;
    margin-left: 90px;
  }
  #panier .prix {
    margin-top: 10px;
  }

  #panier .note {
    float: none;
    margin: 18px 0 0 20px;
  }
  .continuerAchat {
    margin: 20px 0 0 0;
  }
}

@media only screen and (min-width: 440px) and (max-width: 640px) {
  #panier .infos {
    max-width: 100%;
  }
}

/* 10_200 : Identification
--------------------------------------------------------------------------------------- */
#identification label h3 {
  line-height: 26px;
  margin-left: 23px;
}
#identification .petitH3 {
  display: block;
}
#identification input[type="radio"] {
  float: left;
  margin-top: 6px;
}

.identInvite,
.identCompte {
  padding-left: 26px;
}
.identInvite .rang {
  margin-bottom: 0;
}

#formCompte .souvenir {
  margin-left: 197px;
}

@media only screen and (max-width: 767px) {
  #identification .boitePadding,
  #identification .boiteSection {
    padding: 20px 0;
    margin: 0;
  }
  #formCompte .souvenir {
    margin-left: 27px;
  }
}

@media only screen and (max-width: 360px) {
  .identInvite,
  .identCompte {
    padding-left: 0;
  }
}

/* 10_300 : Adresse
--------------------------------------------------------------------------------------- */
.titreEtape {
  margin: 0;
  padding: 20px 0;
  font: 400 22px/22px "open_sans_condensedbold", Arial, sans-serif;
  text-transform: none;
}

#adresse .boiteSection {
  margin-bottom: 16px;
  padding-bottom: 0;
}
.modifier {
  font-size: 12px;
  text-decoration: underline;
}

/* 10_400 : Livraison
--------------------------------------------------------------------------------------- */
.resumeAdresse {
  float: left;
  width: 45%;
  margin-right: 5%;
}
#paiement .resumeAdresse {
  width: 30%;
  margin-right: 3%;
}
.pleineLargeur .resumeAdresse {
  width: 25%;
}

.resumeAdresse button,
#btnCommande {
  display: block;
  height: 30px;
  margin: 6px 0;
  background-color: transparent;
  font: 400 15px/30px "nunitoregular", Arial, sans-serif;
  color: #000;
}

#btnCommande {
  font-size: 22px;
}

.resumeAdresse button:before,
#btnCommande:before {
  content: "+";
  display: inline-block;
  width: 14px;
  margin-right: 6px;
  vertical-align: 0;
  text-align: center;
  font: 400 26px/42px "nunitoregular", Arial, sans-serif;
  color: #86a740;
}

.resumeAdresse button.ouvert:before,
#btnCommande.ouvert:before {
  content: "\2013";
  vertical-align: 0;
  margin-top: -3px;
}

#livraison .radiocheck {
  margin-bottom: 4px;
}
#livraison .buttonSec {
  margin-top: 12px;
}

.optionsLivr {
  float: left;
  width: 60%;
  margin-bottom: 16px;
}
.optionsLivr label span {
  white-space: nowrap;
}

.infosLivr {
  float: left;
  width: 40%;
  padding-left: 20px;
  font-size: 13px;
  line-height: 18px;
}
.infosLivr a {
  text-decoration: underline;
}

/*select.serviceLivraison, span.serviceLivraison{width:450px;max-width:450px;}*/

@media only screen and (max-width: 1000px) {
  .optionsLivr,
  .infosLivr {
    float: none;
    width: 100%;
  }
  .infosLivr {
    padding-left: 0;
  }
}

@media only screen and (max-width: 900px) {
  #paiement .resumeAdresse {
    width: 45%;
    margin-left: 32px;
    margin: 0 5% 16px 0;
  }
  #paiement .resumeAdresseFacturation {
    clear: left;
  }
}

@media only screen and (max-width: 767px) {
  .resumeAdresse,
  #paiement .resumeAdresse {
    float: none;
    width: 100%;
  }
  #resumeFacture,
  #resumeLivraison,
  #resumeMethode {
    display: none;
    margin-left: 20px;
  }
}

@media only screen and (max-width: 479px) {
  #livraison .radiocheck input {
    float: left;
    margin: 6px 12px 20px 0;
  }
}

/* 10_500 : Paiement
--------------------------------------------------------------------------------------- */
#resumeMethode span {
  white-space: nowrap;
}

.infosPaiment h4 {
  float: left;
}
.infosPaiment .cartes {
  float: right;
}
.infosPaiment .cartes img {
  display: inline-block;
  margin-right: 6px;
}
.infosPaiment p:last-child {
  margin-bottom: 0;
}

.modePaiment {
  position: relative;
}
.modePaiment:before {
  content: "";
  position: absolute;
  top: 20px;
  right: 20px;
  display: block;
  width: 21px;
  height: 29px;
  background: url(../gx/m/sprites.png) -1px -1px no-repeat;
}

.modePaiment h4 {
  margin-right: 90px;
}

#CCCVD {
  width: 110px;
}
.infoCVD {
  margin-left: 16px;
  line-height: 36px;
  text-decoration: underline;
}

@media only screen and (max-width: 479px) {
  .infosPaiment h4 {
    float: none;
  }
  .infosPaiment .cartes {
    float: none;
    margin-bottom: 1em;
  }
  .infoCVD {
    display: block;
    margin: 0;
  }
}

/* 10_600 : Confirmation
--------------------------------------------------------------------------------------- */
#confirmation #headerPanier h1 {
  float: left;
}
#confirmation strong {
  font-weight: normal;
  font-family: "nunitobold";
}

.colPanier.pleineLargeur {
  float: none;
  clear: left;
}
.colPanier.pleineLargeur:last-of-type {
  margin-bottom: 0;
}
.colPanier.pleineLargeur .innerPanier {
  margin-right: 0;
}

.btnImprimer {
  float: right;
  display: inline-block;
  margin: 6px 0 0 0;
  vertical-align: -2px;
  color: #333;
}
.btnImprimer:hover,
.btnImprimer:focus,
.btnImprimer:active {
  color: #2ebedd;
}

.btnImprimer:before {
  content: "\e80d";
  font: normal normal 20px/30px "icons";
  margin-right: 10px;
}

#headerPanier .btnImprimer {
  margin-top: 38px;
}

.detailFacturation h4 {
  margin-bottom: 0.5em;
}
.detailFacturation th {
  min-width: 120px;
  font-family: "nunitobold";
  padding-right: 20px;
}

.commandeDetail {
  max-width: 700px;
}

.commandeDetail .totalFacture {
  float: right;
  max-width: 300px;
  width: 100%;
  margin: 10px 11px 0 0;
}

.commandeDetail .grandTotal {
  margin: 10px 0;
  border-top: 1px solid #d1d1d1;
}
.commandeDetail .grandTotal th,
.commandeDetail .grandTotal td {
  padding-top: 10px;
}
.commandeDetail .note {
  text-align: right;
}

/* Créer un compte */
.btnCreerCompteFacture {
  width: 100%;
  margin: 20px 0;
  background-color: #ff9e0d;
  text-align: left;
  font: 400 italic 24px/60px "nunitoregular", Arial, sans-serif;
  color: #000;
}

.btnCreerCompteFacture .icon {
  float: left;
  padding: 0 16px;
  background-color: #000;
}

.btnCreerCompteFacture .icon:before {
  content: "\e810";
  font: normal normal 30px/60px "icons";
  color: #fff;
}

.btnCreerCompteFacture .texte {
  padding: 0 20px 0 80px;
}

.btnCreerCompteFacture .texte:before {
  content: "\e803";
  float: right;
  margin-top: 8px;
  font: normal normal 16px/52px "icons";
  color: #000;
}

#creerCompteFacture {
  display: none;
  margin: 10px 0 20px;
}

@media only screen and (max-width: 1170px) {
  .colPanier.pleineLargeur .innerPanier {
    margin-right: 20px;
  }
  .btnImprimer {
    margin-right: 20px;
  }
  .paddingBtnCompte {
    margin: 0 20px;
  }
}

@media only screen and (max-width: 900px) {
  #confirmation .resumeAdresse {
    float: left;
    width: 30%;
    margin-right: 3%;
  }
}

@media only screen and (max-width: 767px) {
  #confirmation #headerPanier h1 {
    float: none;
    padding-bottom: 0;
  }
  #confirmation .innerPanier {
    margin-right: 0;
  }
  #headerPanier .btnImprimer {
    float: none;
    margin: 0 0 20px 0;
  }

  .detailFacturation {
    line-height: 20px;
  }
  .detailFacturation th {
    padding: 10px 20px 10px 0;
  }
  .detailFacturation td {
    padding: 10px 0;
  }
  .commandeDetail .totalFacture {
    margin-right: 0;
  }

  #confirmation .resumeAdresse {
    float: none;
    width: 100%;
    margin: 0px 0px 16px;
  }

  .btnCreerCompteFacture {
    font-size: 16px;
    line-height: 18px;
  }
  .btnCreerCompteFacture .texte {
    padding: 12px 20px 12px 80px;
  }
  .btnCreerCompteFacture .texte:before {
    margin-top: 0;
    line-height: 48px;
  }
}

/* 13_100 : ACTUALITES
--------------------------------------------------------------------------------------- */
#listeNouvelle {
  list-style: none;
}
#listeNouvelle li {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #cac9c9;
}
#listeNouvelle figure {
  position: relative;
  float: left;
  border: 1px solid #333;
}
#listeNouvelle figure div.dateMobile {
  display: none;
}

#listeNouvelle time {
  font-size: 11px;
  color: #666;
}
#listeNouvelle li h2 {
  margin-bottom: 0;
}
#listeNouvelle .nouvTexte {
  margin-left: 290px;
  padding-left: 30px;
}
#listeNouvelle .suite {
  font-size: 14px;
  text-decoration: none;
}
#listeNouvelle .suite:after {
  font: 14px "guifx";
  content: ">";
  margin-left: 3px;
  vertical-align: -1px;
}

@media only screen and (max-width: 600px) {
  #listeNouvelle time {
    display: none;
  }
  #listeNouvelle figure {
    float: none;
    width: 100%;
    max-width: 290px;
    margin: 0 auto 14px auto;
  }
  #listeNouvelle figure img {
    width: 100%;
    margin: 0 auto;
  }
  #listeNouvelle .nouvTexte {
    margin: 0;
    padding: 0;
  }

  #listeNouvelle figure div.dateMobile {
    display: block;
    position: absolute;
    top: 5px;
    left: 7px;
    width: 56px;
    height: 56px;
    font: 12px/12px "nunitoregular";
    color: #333;
    text-transform: uppercase;
    text-align: center;
    padding-top: 10px;
    border-radius: 100%;
    background-color: #fff;
    z-index: 10;
  }
  #listeNouvelle figure div.dateMobile span {
    display: block;
    clear: both;
    font: 30px/25px "nunitobold";
    color: #8aaa40;
  }
}

/* 13_110 : Nouvelle details
--------------------------------------------------------------------------------------- */
#detailNouvelle figure img {
  margin: 1em 0;
}
#detailNouvelle #partage {
  margin: 2em 0;
}
#detailNouvelle #partage,
#detailNouvelle .addthis_sharing_toolbox {
  float: none;
  text-align: left;
}

/* 14_100 : VIDEOS
--------------------------------------------------------------------------------------- */
#marqueMosaique.listeVideo li {
  margin-right: 0.33%;
}
.listeVideo li a {
  position: relative;
  margin-top: 10px;
}
.listeVideo li a i {
  position: absolute;
  left: 50%;
  top: 50%;
  font-size: 40px;
  line-height: 40px;
  margin: -20px 0 0 -20px;
  z-index: 10;
}
.listeVideo li a:hover i:before {
  color: #333;
}

/* 15_100 : CONCOURS
--------------------------------------------------------------------------------------- */
#concours figure {
  max-width: 222px;
}

#concoursForm {
  margin-top: 30px;
}
#formConcours {
  max-width: 750px;
}

#dialog-reglement {
  position: relative;
  max-width: 800px;
  text-align: left;
  margin: 40px auto;
  padding: 30px 20px;
  background: #fff;
}

#concours .form .colFull.alignC {
  margin-bottom: 0;
}

/* 16_100 : T�L�CHARGMENTS
--------------------------------------------------------------------------------------- */
/******
 * vert: #99c355;
 * orange: #e5873c;
 * jaune pale : #f9dd8a;
 */
#bodyTelechargment {
  background: #f5f5f5 url(../gx/m/fondTelechargement.jpg) repeat;
  font-family: "Christed";
}
.divTitreTelecharge {
  width: 90%;
  margin: 0 auto;
}
.titreMelou {
  font-family: "Christed";
  color: #99c355;
  text-align: center;
  font-size: 315px;
  margin-top: 16%;
  transform: rotate(-8deg);
}
.sousTitreTelecharge {
  background-image: url(../gx/16/font_telechargement.png);
  height: 75px;
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
  float: right;
  border-top: 5px solid #f9dd8a;
  border-bottom: 5px solid #f9dd8a;
  border-left: 10px solid #f9dd8a;
  margin-top: -115px;
}
.sousTitreTelecharge p {
  text-align: right;
  font-size: 40px;
  font-family: "Hero";
  color: #000;
  text-transform: uppercase;
  line-height: 1.7;
  white-space: nowrap;
  padding-right: 35px;
  padding-left: 20px;
}
.borderEntete {
  border-top: 20px solid #e5873c;
  margin-bottom: 30px;
}
.contenuTelechargement {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  position: relative;
  width: 100%;
  min-width: 300px;
  max-width: 960px;
  margin: 0 auto;
  border-bottom: 6px solid #e5873c;
  padding-top: 40px;
}
.imageMelou {
  width: 310px;
  border-radius: 8px;
  border: 5px solid #948d76;
}
.contenuTelechargement p {
  font-family: "AmaticSC";
  font-size: 30px;
  color: #000;
  margin: 10px;
  line-height: 1;
  white-space: nowrap;
}
.colonneDroit form {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contenuTelechargement input {
  border-radius: 60px;
  border: 1px solid black;
  height: 40px;
  width: 260px;
  font-family: "AmaticSC";
  font-size: 35px;
  text-align: center;
  white-space: nowrap;
}
.divBtonTelechargement button {
  margin-top: 50px;
  background-color: #e5873c;
  border-radius: 58px;
  border: 1px solid #000;
  padding-left: 15px;
  white-space: nowrap;
  width: 260px;
  position: relative;
}
.iconTelechargement::before {
  content: "";
  background-image: url(../gx/16/telechargementSymbole.png);
  width: 40px;
  height: 40px;
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  margin-top: 8px;
  right: 200px;
}
.boutonTelechargement p {
  margin-left: 40px;
}
.titreChanson {
  color: #e5873c;
  font-size: 30px;
  font-family: "CuteBeSpecial";
  text-align: left;
  margin-top: 20px;
}
.preFooter {
  background-image: url(../gx/16/fond_bas_page.png);
  height: 200px;
  border-top: 10px solid #f9dd8a;
  margin-top: 25px;
}
.textePreFooter {
  margin-top: 30px;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}
.ie11 .textePreFooter {
  justify-content: space-around;
}
.visiteMelou,
.lienMelou {
  font-family: "CuteBeSpecial";
  font-size: 60px;
  color: #fff;
  line-height: 1;
  text-align: center;
  text-transform: unset;
  white-space: nowrap;
}
.aMelou {
  color: #fff;
}
.lienMelou {
  font-size: 120px;
  width: 500px;
  position: relative;
}
.lienMelou:before {
  content: "";
  background-image: url(../gx/16/vector_gauche.png);
  width: 100px;
  height: 100px;
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  left: -10px;
}
.lienMelou:after {
  content: "";
  background-image: url(../gx/16/vector_droit.png);
  width: 100px;
  height: 100px;
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
}
.groupeLienMelou {
  display: flex;
  flex-direction: row;
  width: 40%;
}
.imageVectorGauche,
.imageVectorDroit {
  width: 10%;
  height: 64%;
}
#telechargeSucces {
  background-color: #dff2bf;
  border-color: #004d07;
  margin-top: 10px;
}
.divInfolettreMilou {
  margin-top: 70px;
}
.lienInfolettreMilou p {
  background-color: #e5873c;
  text-align: center;
  margin: 0 auto;
  padding: 15px;
  font-size: 30px;
  border-radius: 58px;
  font-family: "AmaticSC";
  font-size: 30px;
  border: 1px solid #000;
  width: 260px;
  white-space: nowrap;
  color: #000;
}
@media screen and (max-width: 1024px) {
  .contenuTelechargement {
    width: 80%;
  }
  .groupeLienMelou {
    width: 45%;
  }
  .lienMelou {
    font-size: 100px;
  }
  .lienMelou:before {
    left: 28px;
    width: 80px;
    height: 80px;
  }
  .lienMelou:after {
    width: 80px;
    height: 80px;
  }
  .imageVectorGauche,
  .imageVectorDroit {
    height: 53%;
  }
}
@media screen and (max-width: 960px) {
  #bodyTelechargment main {
    padding: 0px 0px 0px 0px;
  }
  .titreMelou {
    font-size: 250px;
  }
  .sousTitreTelecharge {
    margin-top: -65px;
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 860px) {
  .lienMelou {
    font-size: 90px;
  }
  .imageVectorGauche,
  .imageVectorDroit {
    height: 47%;
  }
  .preFooter {
    height: 360px;
  }
  .textePreFooter {
    flex-direction: column;
  }
  .colonneDroit form {
    margin-bottom: 50px;
  }
  .groupeLienMelou {
    justify-content: center;
  }
  .avantMelou {
    margin: 0 auto;
  }
  .lienMelou:before {
    left: 50px;
  }
}
@media screen and (max-width: 769px) {
  .titreMelou {
    margin-top: 20%;
  }
  .sousTitreTelecharge p {
    font-size: 30px;
    line-height: 2.2;
  }
  .titreChanson {
    font-size: 40px;
  }
}
@media screen and (max-width: 660px) {
  .titreMelou {
    font-size: 200px;
  }
  .sousTitreTelecharge {
    margin-top: -40px;
    margin-bottom: 25px;
  }
  .sousTitreTelecharge p {
    text-align: center;
  }
  .contenuTelechargement {
    flex-direction: column;
  }
  .colonneGauche {
    margin: 0 auto;
  }
  .colonneDroit {
    margin: 0 auto;
  }
  .contenuTelechargement p {
    text-align: center;
  }
  .contenuTelechargement input {
    display: flex;
    margin: 0 auto;
  }
  .infolettreTelecharg {
    margin-bottom: 40px;
  }
  .lienMelou {
    width: 300px;
  }
  .lienMelou:before {
    left: -47px;
  }
}
@media screen and (max-width: 550px) {
  .titreMelou {
    font-size: 150px;
  }
  .sousTitreTelecharge {
    float: unset;
  }
  .sousTitreTelecharge p {
    font-size: 25px;
    line-height: 2.5;
  }
  .titreChanson {
    font-size: 30px;
  }
}
@media screen and (max-width: 425px) {
  .titreMelou {
    margin-top: 25%;
  }
  .divTitreTelecharge {
    margin: unset;
  }
  .sousTitreTelecharge {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-left: 0px solid #f9dd8a;
  }
  .sousTitreTelecharge p {
    padding-left: 3px;
    font-size: 20px;
    line-height: 3.2;
    width: 95%;
    margin: 0 auto;
  }
  .contenuTelechargement p {
    font-size: 30px;
  }
  .preFooter {
    height: 300px;
  }
  .lienMelou {
    font-size: 60px;
    width: 290px;
  }
  .lienMelou:before {
    left: 10px;
    width: 100%;
    height: 100%;
  }
  .lienMelou:after {
    width: 14%;
    height: 100%;
  }
}
@media screen and (max-width: 320px) {
  .titreMelou {
    margin-top: 35%;
  }
  .lienMelou:before {
    left: 10px;
  }
  .sousTitreTelecharge p {
    width: 100%;
  }
}
.contenuTelechargement .erreurTelechargement {
  white-space: normal;
  text-align: center;
}
.erreurTelechargement {
  background-color: #fdd;
  border-color: #c00;
}
/*--------------------------------------------------------------------------------------- */
/* Pied de page */
/*--------------------------------------------------------------------------------------- */
#piedPage {
  display: inline-block;
  width: 100%;
  color: #fff;
  margin-top: 120px;
  padding: 0 0 50px 0;
  background-color: #fff;
}

.logoFt {
  margin-bottom: 27px;
  border-bottom: 1px solid #e1e1e1;
}
.logoFt .slick-slide a,
.logoFt .slick-slide a:hover {
  border: none;
  margin: 0;
  padding: 0;
}
.logoFt .slick-slide img {
  width: 100%;
  border: none;
}
.logoFt .slick-prev,
.logoFt .slick-next,
.logoFt .slick-prev:hover,
.logoFt .slick-next:hover {
  top: 0;
  height: 54px;
  font-size: 15px;
  margin: 0;
  background: none;
}

#piedPage h6 {
  font: 15px/15px "latobold", Arial, sans-serif;
  color: #86a740;
  text-transform: uppercase;
  margin-bottom: 6px;
}
#piedPage h6 a {
  color: #86a740;
}
#piedPage h6 a:hover,
#piedPage h6 a:focus,
#piedPage h6 a:active {
  color: #6d8e27;
  text-decoration: none;
}

#menuPied {
  width: 68.75%;
  font: 400 14px/22px "nunitoregular", Arial, sans-serif;
  padding-top: 50px;
}
#menuPied ul {
  float: left;
  width: 22.3%;
  background-color: transparent;
}
#menuPied .services {
  width: 33%;
}

#menuPied a {
  color: #666;
}
#menuPied a:hover,
#menuPied a:focus,
#menuPied a:active,
#menuPied a.actif {
  text-decoration: underline;
}

#piedPage .ftCta {
  float: left;
  width: 31.25%;
}
.ftCta .ctaGen {
  display: inline-block;
  width: 100%;
  max-width: 300px;
  height: 90px;
  border: 1px solid #e1e1e1;
  border-radius: 4px;
}
.ftCta .ctaGen:hover {
  border-color: #86a740;
}
.ftCta .ctaGen span {
  display: block;
  text-align: center;
  font: 16px/16px "open_sans_condensedbold";
  color: #333332;
  margin-left: 140px;
  padding-top: 20px;
}
.ftCta .ctaGen span strong {
  font-size: 26px;
  color: #86a740;
  font-weight: normal;
  line-height: 26px;
}

.ftCta #cta1 {
  margin-bottom: 9px;
  background: url(../gx/01/sprite-cta.jpg) 0 0 no-repeat;
}
.ftCta #cta2 {
  background: url(../gx/01/sprite-cta.jpg) 0 -101px no-repeat;
}
.ftCta #cta2 span {
  padding-top: 23px;
}

#piedPageTelecharg {
  color: #fff;
  padding: 27px 0 50px 0;
  background-color: #fff;
}
.copyrights {
  clear: left;
  display: block;
  padding-top: 30px;
  font: 400 11px/15px "nunitoregular", Arial, sans-serif;
  color: #666;
}
.copyrights a {
  color: #666;
}
.copyrights a:hover,
.copyrights a:focus,
.copyrights a:active {
  text-decoration: underline;
}

@media only screen and (max-width: 1210px) {
  #piedPage .conteneur {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 960px) {
  #menuPied {
    width: 100%;
  }
  #menuPied .services {
    width: 31%;
  }
  #menuPied > ul {
    width: 23%;
  }

  #piedPage {
    margin-top: 60px;
  }
  #piedPage .ftCta {
    float: left;
    width: 100%;
    margin-top: 27px;
    text-align: center;
  }
  #piedPage .ftCta #cta1 {
    margin-right: 20px;
  }
}

@media only screen and (max-width: 665px) {
  #piedPage .ftCta a {
    float: left;
    width: 48%;
    text-align: left;
  }
  #piedPage .ftCta #cta2 {
    float: right;
  }
}

@media only screen and (max-width: 600px) {
  #piedPage {
    margin-top: 60px;
  }
  #piedPage .ftCta {
    text-align: center;
  }
  #piedPage .ftCta a,
  #piedPage .ftCta #cta2 {
    float: none;
    width: 100%;
  }
  #piedPage .ftCta #cta1 {
    margin-right: 0;
    margin-bottom: 9px;
  }
}

.bandeau-infolettre {
  position: fixed;
  left: 0;
  bottom: 0;
  display: flex;
  width: 100%;
  min-height: 80px;
  padding: 15px 0;
  background: #86a740;
}

.bandeau-infolettre__wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media only screen and (max-width: 960px) {
  .bandeau-infolettre__wrapper {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 600px) {
  .bandeau-infolettre__wrapper {
    flex-direction: column;
    text-align: center;
  }
}

.bandeau-infolettre__titre {
  flex: 1 1 400px;
  display: flex;
  font: 400 24px/24px "nunitobold";
  color: #fff;
  text-transform: uppercase;
}

@media only screen and (max-width: 768px) {
  .bandeau-infolettre__titre {
    font-size: 18px;
    line-height: 18px;
  }

  .bandeau-infolettre__titre .icon::before {
    font-size: 34px;
  }
}

@media only screen and (max-width: 600px) {
  .bandeau-infolettre__titre {
    flex: 1 1 auto;
    align-items: center;
    margin-bottom: 15px;
  }
}

@media only screen and (max-width: 375px) {
  .bandeau-infolettre__titre {
    font-size: 14px;
    line-height: 14px;
  }

  .bandeau-infolettre__titre .icon::before {
    font-size: 28px;
  }
}

.bandeau-infolettre__titre .icon {
  margin-right: 15px;
}

.bandeau-infolettre__content {
  flex: 0 1 auto;
  display: flex;
  align-items: center;
}

@media only screen and (max-width: 600px) {
  .bandeau-infolettre__content {
    flex-direction: column;
  }
}

.bandeau-infolettre__paragraphe {
  font: 400 15px/18px "nunitoregular";
  color: #231f20;
  margin: 0;
}

.bandeau-infolettre__content .btn2 {
  margin-left: 30px;
}

@media only screen and (max-width: 768px) {
  .bandeau-infolettre__paragraphe {
    font-size: 13px;
    line-height: 16px;
  }

  .bandeau-infolettre__content .btn2 {
    margin-left: 10px;
  }
}

@media only screen and (max-width: 600px) {
  .bandeau-infolettre__content .btn2 {
    margin: 15px 0 0 0;
  }
}

.bandeau-infolettre__fermer {
  position: relative;
  flex: 0 0 55px;
  height: 100%;
}

.bandeau-infolettre__fermer .btn-fermer {
  position: absolute;
  right: 0;
  top: -30px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  background: #fff;
  border: 2px solid #86a740;
  border-radius: 100%;
}

.bandeau-infolettre__fermer .btn-fermer .icon {
  font-size: 11px;
  color: #231f20;
  transition: color 0.2s;
}

.bandeau-infolettre__fermer .btn-fermer:hover .icon {
  color: #86a740;
}

@media only screen and (max-width: 600px) {
  .bandeau-infolettre__fermer {
    order: -1;
    flex: 1 0 auto;
    width: 100%;
    height: auto;
  }
}

.footer-space {
  margin-bottom: 80px !important;
}

@media only screen and (max-width: 600px) {
  .footer-space {
    margin-bottom: 145px !important;
  }
}