html,body {margin:0;padding:0;-webkit-text-size-adjust:none; -webkit-font-smoothing: antialiased;}
body {font-family:Lato,Arial;font-size:15px;color:#444;}
.s {margin:auto;width:1400px;}
.smax {margin:20px auto;width:1440px; font-size:0;}
img {vertical-align:middle;}
.left {float:left;}
.right {float:right;text-align:right;}
.center {text-align:center;}
.tleft {text-align:left;}
.tright {text-align:right;}
.clear {clear:both;}
.yes {display:none;}
form {display:inline;}
hr{height:1px;color:#ddd;border:0;background:#ddd;margin-bottom:5px;}
#top {position:absolute; width:100%; height:0; top:0;}
#entete{position:relative; width:100%; height:100px; font-size:0;}
.fixlogo {transform:scale(0.6); transition:0.3s;}
#cslogo {position:relative; z-index:99; transition:0.3s;}
#mlogo {position:absolute; top:5px;}
.e {float:left; width:175px;}
.menu {text-align:right; display:inline-block; vertical-align:top; width:calc(100% - 175px);} 
#nav {margin-top:20px;}
.recherche{display:inline-block; vertical-align:middle; font-family:Lato,Arial; border:0; background:#f9f9f9; color:#444; font-size:15px; padding:6px; width:200px; margin-right:5px;}
.ok {display:inline-block; vertical-align:middle; border:0; font-family:Lato,Arial; background:#ee124f; color:#fff;font-size:15px; cursor:pointer; padding:5px 8px; transition:0.2s;}
.ok:hover {background:#444;}
#moncompte, #monpanier {display:inline-block; vertical-align:middle; background:#eee; padding:10px 20px; font-size:17px; color:#444; margin-left:20px; text-align:center;}
#moncompte span, #monpanier span {font-size:15px;}
#minipanier {position:fixed; right:20px; bottom:20px; z-index:99; background:#5dba00; color:#fff; padding:10px; width:120px; text-align:center; transition:0.2s;}
#minipanier a:link, #minipanier a:visited {color:#fff;}
#minipanier span {font-size:21px; display:block; margin-bottom:10px; line-height:21px;}
#menur, #loupe, #mrecherche, #panierv {display:none;}
#menu {position:relative; width:100%; font-size:0; background:#b30739; z-index:98;}
.fixmenu {position:fixed !important; top:0;}
.i {display:inline-block; vertical-align:middle; font-size:17px; line-height:20px; font-family:Lato; font-weight:700;}
.i a {padding:15px; transition:0.2s; display:block;}
.i a:link, .i a:visited, .on a:link, .on a:visited {color:#fff;}
.i .nsi a {color:#444;}
.i a:hover, .on, .item:hover a, .nsi a:hover {color:#fff; background:#ee124f;}
.i:hover {background:#ee124f;}
.smenu {position:absolute; left:0; margin-top:0px; width:100%; padding:20px 0; color:#fff; background:rgba(0,0,0,0.5); font-size:0; z-index:97; display:none; overflow:hidden;}
.col {display:inline-block; vertical-align:top; width:calc(12.5% - 10px); margin-right:10px;}
.ni {font-size:15px; background:#999; line-height:17px;}
.nsi {font-size:13px; margin-top:4px; background:#fff; line-height:13px;}
.ni a, .nsi a {padding:10px;}
.mobile {background:#555 !important; display:none !important;}
.bkpanier {background:#5dba00 !important;}
.bkpanier a {color:#fff !important;}
#main {position:relative; width:100%; margin-bottom:20px;}
.fixmain{margin-top:40px;}
#intro {position:relative; width:100%; max-height:600px; overflow:hidden;}
#intro img {width:100%;}
.swiper-container{margin:0 auto; max-height:600px;position:relative;overflow:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;z-index:50;}
.swiper-wrapper{position:relative;width:100%; height:100%; -webkit-transition-property:-webkit-transform, left, top;-webkit-transition-duration:0s;-webkit-transform:translate3d(0px,0,0);-webkit-transition-timing-function:ease;-moz-transition-property:-moz-transform, left, top;-moz-transition-duration:0s;-moz-transform:translate3d(0px,0,0);-moz-transition-timing-function:ease;-o-transition-property:-o-transform, left, top;-o-transition-duration:0s;-o-transform:translate3d(0px,0,0);-o-transition-timing-function:ease;-o-transform:translate(0px,0px);-ms-transition-property:-ms-transform, left, top;-ms-transition-duration:0s;-ms-transform:translate3d(0px,0,0);-ms-transition-timing-function:ease;transition-property:transform, left, top;transition-duration:0s;transform:translate3d(0px,0,0);transition-timing-function:ease;}
.swiper-free-mode > .swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto;}
.swiper-wp8-horizontal{-ms-touch-action:pan-y;}
.swiper-wp8-vertical{-ms-touch-action:pan-x;}
.swiper-slide{float:left;text-align:left; position:relative;}
.pagination{position:absolute; text-align:center; bottom:10px; width:100%;z-index:97;}
.swiper-pagination-switch{display:inline-block;width:15px;height:12px;border:1px solid #fff;margin:0 4px;cursor:pointer;}
.swiper-active-switch{background:#ffffff;border:1px solid #ffffff;}
.dtext {position:absolute; z-index:98; width:100%; text-align:right; max-width:1400px; margin-left:calc(50% - 700px); top:150px; color:#fff;}
.l1 {font-size:60px;font-family:truenoregular,Arial; font-weight:bold;}
.l2 {font-size:35px;font-family:truenolight,Arial; letter-spacing:5px; margin-top:10px;}
#ariane {position:relative; width:100%; padding:15px 0; background:#777; color:#fff; text-align:center;}
#ariane a {color:#fff;}
h1 {font-size:21px; margin:0; font-weight:normal;}
.tri {float:right;text-align:right;}
.tritext {border:0; background:#fff; font-family:Lato,Arial; font-size:13px; padding:5px; color:#444; margin-top:-3px;}
.art {display:inline-block; vertical-align:top; position:relative; width:calc(20% - 44px); border:2px solid #f5f5f5; margin:20px; background:#f5f5f5; transition:0.3s; overflow:hidden;}
.art .img {display:block; padding:10px;}
.art img {width:100%;}
.artm {display:block;padding:10px;overflow:hidden;transition:0.2s;}
.art h2 {font-weight:bold; font-size:17px; display:block; margin:5px 0;}
.art h3 {font-weight:normal; font-size:15px; height:40px; display:block; margin:0 0 5px 0; overflow:hidden;}
.art:hover .artm {background:#ee124f; color:#fff;}
.art:hover .prix {color:#fff;}
.art:hover {border:2px solid #ee124f;}
.art .euro {font-size:17px;}
.pastille {position:absolute;width:50px;height:50px;margin-left:calc(100% - 55px); margin-top:5px; background:#ea3802; font-size:19px; font-weight:bold;color:#fff; border-radius:50%; line-height:50px; text-align:center; z-index:90;}
.prix, .info {color:#5dba00; font-family:truenoregular,Arial; font-size:26px; display:inline-block; font-weight:bold;}
.info {color:#ddd;}
.add {position:absolute; right:10px; bottom:10px;}
.addpan {background:url('/ima/panier.png') no-repeat; width:30px; height:30px; color: inherit; border: none; padding: 0;font: inherit;cursor: pointer;outline: inherit; filter: invert(0.5); -webkit-filter: invert(0.5); -o-filter: invert(0.5); -ms-filter: invert(0.5);}
.art:hover .addpan {filter: invert(0); -webkit-filter: invert(0); -o-filter: invert(0); -ms-filter: invert(0);}
#fiche, #blanc {position:relative; width:1400px; margin:40px auto;}
#fiche {font-size:0;}
#gauche {display:inline-block; vertical-align:top; width:460px; padding:20px; font-size:0; position:relative; margin-right:40px; text-align:center; background:#f9f9f9;}
#vue img {max-width:calc(100% - 20px);}
#gauche img {border:2px solid #f9f9f9; transition:0.2s; cursor:pointer;}
#gauche img:hover{border:2px solid #ee124f;}
.thumb{display:inline-block;margin:5px 5px 5px 0;cursor:pointer;}
.thumb img {width:105px;}
.kw {font-size:13px; border:0; background:#bbb; padding:2px 4px; color:#fff; margin:0 2px 2px 0; display:inline-block;}
#droite {display:inline-block; vertical-align:top; width:calc(100% - 540px); font-size:15px;}
#droite h2 {font-size:40px; margin:0; font-weight:normal;}
.bigprix {color:#5dba00; font-weight:Bold; font-size:36px;}
.t {border:0; width:100%; border-collapse:collapse;}
.t td {padding:8px; font-size:15px; background:#f9f9f9;}
.t td:first-child {min-width:200px;}
.t .thead {background:#ddd; font-weight:bold; min-height:20px; color:#0b0a0a; font-size:21px; padding:10px 8px;}
.half {width:690px;}
.third {width:466px;}
.t .cent {min-width:100px !important; width:100px; text-align:left;}
.cent img {width:100px}
#bas {width:100%;}
#menubas {position:relative; width:100%; background:#b30739; text-align:center; font-size:15px; padding:15px 0; color:#ddd;}
#footer {position:relative;width:100%;padding:20px 0;color:#fff; background:#000;}
#menubas a, #footer a {color:#fff;}
a {outline:none; transition:0.2s;}
a:link, a:visited {color:#444;text-decoration:none;}
a:hover{color:#000;text-decoration:none;}
a.b:link{color:#fff;text-decoration:none;}
a.b:visited{color:#fff;text-decoration:none;}
a.b:hover{color:#fff;text-decoration:none;}
.text, .select, .textarea {border:1px solid #ddd; background:#fff; font-family:Lato,Arial; font-size:15px; padding:5px; color:#0b0a0a; width:260px;}
.r {border:1px solid #e40006; box-shadow:0px 0px 4px 2px #e40006;}
.bouton, .mbouton, .bouton2, .mbouton2 {display:inline-block; font-family:Lato,Arial; font-size:21px; font-weight:bold; color:#fff; border:0; background:#5dba00; padding:8px 16px; cursor:pointer; transition:0.2s; outline:none;}
.mbouton, .mbouton2 {font-size:15px; line-height:15px;}
.bouton:hover, .mbouton:hover{background:#4e9c00;}
.bouton a, .mbouton a, .bouton2 a, .mbouton2 a {color:#fff;}
.bouton2, .mbouton2 {background:#e40006;}
.bouton, .mbouton, .bouton2, .mbouton2, .text, .textarea, .ok {-webkit-appearance:none;}
.erreur {display:inline-block;background:#e40006;color:#fff;padding:5px 10px;}
.erreur a {color:#ffff;}
.terreur {color:#e40006; font-weight:bold;}
.msg{display:inline-block;background:#f5cc00;color:#fff;padding:5px;}
.msgv{display:inline-block;background:#4e9c00;color:#fff;padding:5px;}
.highslide{outline:none;text-decoration:none;}
.highslide-caption{display:none;font-size:17px;color:#fff;margin-top:5px;}
.highslide-dimming{background:#000;}
@media screen and (min-width:800px) and (max-width:1480px)
  {
  .s, #fiche, #blanc {margin:auto;width:calc(100% - 40px); padding:0 20px;}
  #fiche, #blanc {margin:40px auto;}
  .smax {width:calc(100% - 20px); padding:0 10px;}
  .half {width:calc(50% - 10px);}
  .dtitre {font-size:40px;}
  .dtext {margin-left:0; top:30%; max-width:calc(100% - 20px);}
  .i {width: calc(16.67% - 30px);}
  .i, .ni, .nsi {overflow-x:hidden;}
  }
@media screen and (min-width:1200px) and (max-width:1480px)
  {
  .art {width:calc(20% - 24px); margin:10px;}
  }
@media screen and (min-width:930px) and (max-width:1199px)
  {
  .art {width:calc(25% - 24px); margin:10px;}
  }
@media screen and (min-width:800px) and (max-width:929px)
  {
  .art {width:calc(33.33% - 24px); margin:10px;}
  }
@media screen and (max-width:799px)
  {
  #nav, .pagination, #mpan, .dtext, #mlogo {display:none;}
  .s, #fiche, #blanc {margin:auto;width:calc(100% - 40px); padding:0 20px;}
  #fiche, #blanc {margin:20px auto;}
  .smax {width:calc(100% - 20px); padding:0 10px; margin:10px auto;}
  .art {width:calc(50% - 24px); margin:10px;}
  .art h3 {height:80px;}
  #entete {position:fixed; z-index:98; top:0; background:rgba(255,255,255,0.8);}
  #cslogo {height:100px;}
  #menur {display:block; position:fixed; z-index:99; top:35px; right:20px;}
  #menu {display:none; position:absolute; text-align:center; z-index:99; width:100%; background:#fff; top:100px;}
  .e {width:0;}
  .i, .mobile {display:block !important; margin:0 0 2px 0; background:#b30739; text-align:center;}
  .i a, .mobile a {display:block; padding:15px;}
  .smenu {display:none; position:relative; background:none; padding:0 0 20px 0;}
  .col {width:100%; margin:0;}
  .ni, .nsi {margin:0 0 2px 0;}
  .ni {background:#555;}
  #main {margin-top:100px;}
  #ariane .right {display:none;}
  .fixmain{margin-top:0;}
  #main img, iframe {max-width:100%;}
  #loupe {display:block; position:fixed; z-index:99; top:35px; right:70px; width:30px; height:30px; background:url('/ima/loupe.png');}
  #mrecherche {position:absolute; text-align:center; z-index:99; width:100%; background:#000; top:100px; padding:20px 0;}
  #panierv {display:block; position:fixed; z-index:99; top:35px; right:120px; width:30px; height:30px; background:url('/ima/panierv.png');}
  #gauche {width:calc(100% - 40px); margin:0;}
  .thumb {margin:10px 0 0 0;}
  .thumb img {width:auto;}
  #droite {display:block; width:auto; margin-top:20px;}
  #blanc h2 {font-size:30px; line-height:30px;}
  .half, .third {width:100%;}
  .t {margin-bottom:20px;}
  .left, .right {float:none;}
  td {display:block; text-align:center; max-width:100%;}
  .t .cent {display:block;width:auto; text-align:center;}
  #vue {max-width:100%; margin:0; float:none;}
  .yes {display:inline-block;}
  .no {display:none;}
  #menubas {padding:10px;width:calc(100% - 20px);}
  .dtitre {font-size:20px;}
  .bouton, .bouton2 {font-size:16px !important; margin:5px 0;}
  .text {width:240px;}
  #bas img {margin:5px;}
  #bas td {text-align:center !important;}
  }
@media screen and (max-width:350px)
  {
  .art {width:calc(100% - 24px); margin:10px;}
  }
