/* CSS Document */

:root {
  --border-color: #a3a3a3;
  --button-color: #000;
  --body-font: "Roboto", arial, helvetica;
  --body-color: #242424;
  --body-bg-color: #ffffff;
  --bg-light-color: #f8f8f8;
  --bg-dark-color: #000;
  --main-color:  #a48145;
  --main-color2: #a3a3a3; /*gris leger*/
  --txt-color: #242424;
    
}

* {
  outline: none;
  box-sizing: border-box;
}


html {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
/*   scroll-behavior: smooth;*/
}

body {
  font-family: var(--body-font);
  background-color: var(--body-bg-color);
  color: var(--body-color);
  font-size: 15px;
  font-weight:400;
  margin:0;
  padding:0;
  /*border-left:50px #fff solid;
  border-right:50px #fff solid;*/
}

img {
  max-width: 100%;
}

.tLeft {text-align:left}
.tCenter {text-align:center}

a, a:visited {text-decoration:none;cursor:pointer;color:inherit}
a.linkSmallOr {font-size:12px ; color:var(--main-color)}

::-moz-selection {
  color:#fff;
  background-color: var(--main-color);
}

::selection {
  color:#fff;
  background-color: var(--main-color);
}



/* FONTS */

@font-face {
    font-family: 'bauer_bodoniblack';
    src: url('bauer_bodoni_black-webfont.woff2') format('woff2'),
         url('bauer_bodoni_black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'bauer_bodonibold';
    src: url('bauer_bodoni_bold-webfont.woff2') format('woff2'),
         url('bauer_bodoni_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'bauer_bodoniregular';
    src: url('bauer_bodoni_regular-webfont.woff2') format('woff2'),
         url('bauer_bodoni_regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




h1, .bodoni {font-family:"bauer_bodonibold"}
h2 {color:#000000; font-size:32px; line-height:32px; letter-spacing:-1px; text-align:center ; margin:25px 0 15px 0 } 
.subTitle {font-size:16px; letter-spacing:0.5px; text-align:center; margin:0 auto 15px auto; width:500px; max-width:94%}

h3.underline {padding-bottom:10px; border-bottom:1px solid #000; text-align:left; font-weight:400;
display:inline-block; text-transform:uppercase; letter-spacing:0.5px; font-size:14px; }

.tLeft {text-align:left}
.tCenter {text-align:center}
.tRight {text-align: right}


.container, .containerLarge { display:block; margin:0 auto; position:relative; width:1280px; padding:20px; max-width:100%}
.containerLarge { width:1480px; padding:20px;}

.bloc100, .bloc33, .bloc66, .bloc50, .bloc25 { display:inline-block; vertical-align:top;     position: relative;}
.bloc100{ width: 100%;   padding:30px}
.bloc33{ width: 33%;   padding:30px}
.bloc66{ width: 66%;   padding:30px}
.bloc50{ width: 50%;  padding:30px}
.bloc25{ width: 25%;  padding:30px}


hr.norm {display:block; margin:20px auto; border:0; border-bottom:1px solid #000; width:300px; max-width:70%; opacity:0.7}

/*FORMD SWITCH*/

input.switch[type=checkbox]{
	height: 0;
	width: 0;
	visibility: hidden;
}

label.switch {
	cursor: pointer;
	text-indent: -9999px;
	width: 32px;
	height: 28;
	background: grey;
	display: block;
	border-radius: 100px;
	position: relative;
}

label.switch:after {
	content: '';
	position: absolute;
	top: 2px;
	left: 3px;
	width: 14px;
	height: 14px;
	background: #fff;
	border-radius: 90px;
	transition: 0.3s;
}

input.switch:checked + label {
	background: #0C0;
}


input.switch.selec:checked + label {
	background: #a48145;
}


input.switch.soldes:checked + label {
	background: #dd3333;
}



input.switch.anniv:checked + label {
	background: #e73331;
}


input.switch:checked + label:after {
	left: calc(100% - 3px);
	transform: translateX(-100%);
}

label.switch:active:after {
	width: 130px;
}




/*BOUTONS*/

.boutonBigDark, .boutonBigDark:visited {border:0; display:inline-block; margin:20px 0; padding:20px; text-align:center;
background:#000; color:#fff; font-size:13px; font-weight:bold; letter-spacing:1px; border:2px solid var(--main-colored);
box-sizing: border-box;    -moz-box-sizing: border-box;    -webkit-box-sizing: border-box;transition: 0.3s; cursor:pointer}
.boutonBigDark:hover, .boutonBigDark:active {background:var(--main-color); }
.boutonBigDark i {font-size:16px; display:inline-block; margin-right:5px}


.smallLink, .smallLinkColor, .smallLink:visited {display:block; clear:both; margin:10px 0 5px 4px ;font-size:11px; color:#999}
.smallLink i, .smallLinkColor i {display:inline-block; font-size:10px; margin-right:4px; }
.smallLink:hover {color:#242424}
.smallLinkColor  {display: inline-block;color:#242424; background:#f1f1f1; padding:6px 8px; border-radius:10px }
.smallLinkColor:hover { background:#242424; color:#fff}

/*PROD - ICON LIST*/
.iconList {float:right; vertical-align:middle; margin:-15px 10px 0 0}
.iconList span , .prod_details .iconList span{ display:inline-block; position:relative; cursor:default;width:38px; height:38px; line-height:38px; border-radius:100%; text-align:center; display:inline-block; margin:0 10px 0 0; 
color:#fff; background:#646464; font-size:13px; font-weight:500; letter-spacing:-1px;     vertical-align: middle;}
.iconList span.energ {background:#0C0; font-size:15px;}
.iconList span.or { background:#a48145}
.iconList span.energ.noteA{background:#009136}
.iconList span.energ.noteB{background:#55ab26}
.iconList span.energ.noteC{background:#c8d200}
.iconList span.energ.noteD{background:#feed01}
.iconList span.energ.noteE{background:#fbba00}
.iconList span.energ.noteF{background:#eb6909}
.iconList span.energ.noteG{background:#e3001b}

.iconList span.light  { border-radius:0; width:auto; height:auto; padding:4px; line-height:11px; border-radius:5px  }
.iconList span.light a {font-weight:400; font-size:10px;  text-transform:uppercase; letter-spacing:0; }

.iconList span i { font-size:15px; line-height:38px}
.iconList span.watt {background:#b35b3f; line-height:26px; padding-top:2px  }
.iconList span small {    position: absolute;   bottom: auto; font-size: 8.5px; letter-spacing: 0; width: 38px;
   left: 0; top: 13px; height: 10px; z-index: 100; color: #fff; font-weight: 300;}
   
 .iconList span.watt.grey {background:#646464;}
 .iconList span.watt.blue, .iconList span.blue {background:#09F;}
 .iconList span.watt.lagoon, .iconList span.lagoon {background:#06b39b;}


.prod_details .iconList { display:block; text-align:left; margin:-14px -10px 0 0}
.prod_details .iconList  span { scale: 0.72 0.72; margin:0 0 0 -9px}
.large .prod_details .iconList  span { scale: 0.82 0.82; margin:0 0 0 0px}


/*BANNNIERES*/

#banner { display:block; min-height:400px; width:100%; margin:0 auto; padding:20px;background:var(--bg-light-color); position:relative;
 lign-self: center; background-image:url(../medias/sliders/bg1.jpg); background-position:center center; background-size:cover}

#banner h1 {font-size:55px ; letter-spacing:-2px; color:#fff}
#banner .banImg { position:absolute; right:60px; top:40px;}
#banner .banContent {margin:150px auto; width:1280px}
#banner .banContent span.smallTitle {color:#fff; border-bottom:2px solid #fff; padding-bottom:5px; font-size:24px}
#banner .count{font-weight:bold; width:90px; text-align:center; display:inline-block}

#banner2 {display: flex;width:100%;  margin:0 auto; height:600px; position:relative;
background-image:url(../medias/sliders/bg1.jpg); background-position:center center; background-size:cover;
justify-content: left;  align-items: center; }
  
#banner2 h1 {font-size:50px ; letter-spacing:-1px; color:#fff}
#banner2 .banImg { position:absolute; right:5px; top:-80px;}
#banner2 .container { padding:0 50px;}
#banner2 .container span.smallTitle {color:#fff; border-bottom:2px solid #fff; padding-bottom:5px; font-size:24px}
#banner2 .count{font-weight:bold; width:90px; text-align:center; display:inline-block}




/*founiseerus*/

.logo-marque {display:block; height:120px; width:300px; background-position:center center; background-size:cover}
p.light {font-size:14px; line-height:24px; color:#404040;}
p.infos {font-size:12px; line-height:18px;}
hr.light {border:0; border-bottom:1px solid #dedede; margin:0 0 20px 0; }

ul.contacts-intitule {margin:15px 0 25px 0; padding:0}
ul.contacts-intitule li { list-style:none; display:inline-block; margin-right:25px;
padding-bottom:10px; border-bottom:1px solid #dedede; color:#999; text-align:left; font-weight:400;
display:inline-block; text-transform:uppercase; letter-spacing:0.5px; font-size:14px;}
ul.contacts-intitule li.ui-tabs-active {border-bottom:1px solid #000; color:#000}

.clean {width:100%}
.clean, .clean tr, .clean tr td { border-collapse:collapse}
.clean tr td{ border:1px solid #dedede; padding:12px; font-weight:500; font-size:13px;}
.clean tr td.first{ font-weight:300; width:180px}

.clean tr td.smallPad{ border:1px solid #dedede; padding:2px;;}


.boutonBigDark, .boutonBigDark:visited {border:0; display:inline-block; margin:20px 0; padding:20px; text-align:center;cursor:pointer;
background:#000; color:#fff; font-size:13px; font-weight:bold; letter-spacing:1px; border:1px solid #000;
box-sizing: border-box;    -moz-box-sizing: border-box;    -webkit-box-sizing: border-box;transition: 0.3s;}
.boutonBigDark:hover, .boutonBigDark:active {background:var(--main-color);border:1px solid var(--main-color); }
.boutonBigDark i {font-size:16px; display:inline-block; margin-right:5px}


.boutonBigDarkInv, .boutonBigDarkInv:visited {border:0; display:inline-block; margin:20px 0; padding:20px; text-align:center;cursor:pointer;
background:#fff; color:#000; font-size:13px; font-weight:bold; letter-spacing:1px; border:1px solid #000;
box-sizing: border-box;    -moz-box-sizing: border-box;    -webkit-box-sizing: border-box;transition: 0.3s;}
.boutonBigDarkInv:hover, .boutonBigDarkInv:active {background:var(--main-color); }
.boutonBigDarkInv i {font-size:16px; display:inline-block; margin-right:5px}


.boutonMediumDark, .boutonMediumDark:visited {border:0; display:inline-block; margin:20px 0; padding:12px 10px; text-align:center; cursor:pointer;
background:#000; color:#fff; font-size:12px; font-weight:500; letter-spacing:1px; border:2px solid var(--main-colored);
box-sizing: border-box;    -moz-box-sizing: border-box;    -webkit-box-sizing: border-box;transition: 0.3s;}
.boutonMediumDark:hover, .boutonMediumDark:active {background:var(--main-color); }
.boutonMediumDark i {font-size:16px; display:inline-block; margin-right:5px}

.boutonMediumDarkInv, .boutonMediumDarkInv:visited {border:0; display:inline-block; margin:20px 0; padding:12px 10px; text-align:center; cursor:pointer;
background:#fff; color:#000; font-size:12px; font-weight:500; letter-spacing:1px; border:1px solid #000;
box-sizing: border-box;    -moz-box-sizing: border-box;    -webkit-box-sizing: border-box;transition: 0.3s;}
.boutonMediumDarkInv:hover, .boutonMediumDarkInv:active {background:#000; color:#fff }
.boutonMediumDarkInv i {font-size:16px; display:inline-block; margin-right:5px}




/*FOURNUMALIRES*/


.formContainer {}
.formContainer div { display:block; margin:0 0 15px 0; }
.formContainer div.half  { display: inline-block; width:50%; margin:0 0 15px 0; }

.formContainer label  {display: inline-block; margin:0 0 6px 0;width: 30%; vertical-align:middle; font-size:14px;  }
.formContainer label.textarea  { vertical-align:top }
 .formContainer input:not([type="submit"]) {display: block; margin:0 ;width:100%; }


.formContainer input:not([type="submit"]):not([type="radio"]):not([type="checkbox"]), .formContainer select {padding:10px; border-radius:3px; border:0px solid var(--txt-color); }


  .formContainer  select {  -moz-appearance: none; 	-webkit-appearance: none; 	appearance: none;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='black'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat;
   background-size: 12px;  background-position: calc(100% - 10px) 14px;  background-repeat: no-repeat;  background-color: #fff;  width:65%}	


.formContainer label small {font-size:11px; opacity:0.7; display:block}
.formContainer input.errorForm {border:1px solid #F00 !important;}
.formContainer input[type="radio"]{padding:10px 0; width:5px}

#tabs-1, #tabs-2, #tabs-3, #tabs-4 {}

.formContainer div.checkbox input, .formContainer div.radio input { display: inline-block; width:20px; margin-right:5px  }
.formContainer div.checkbox label , .formContainer div.radio label.labelList {display: inline-block;  width: calc(100% - 40px); cursor:pointer ;margin:0 0 5px 0}

.formContainer  .checkbox_item {display:inline-block; width:30%; margin:0 5px 0 0}
.formContainer  .checkbox_item  label { width:65%}

.formContainer div.checkbox_item input {vertical-align:top; width:30px; display:inline-block }
.formContainer div.radio input {vertical-align:top; margin-top: 1px;}

.formContainer textarea {
    display: block;  margin: 0 0 6px 0;  height: 100px; border-radius:3px; border:0px solid var(--txt-color); width:100%;
	font-family:var(--body-font);
}


ul.contacts-intitule {margin:15px 0 25px 0; padding:0}
ul.contacts-intitule li { list-style:none; display:inline-block; margin-right:40px;
padding-bottom:10px; border-bottom:1px solid #dedede; color:#999; text-align:left; font-weight:500;
display:inline-block; text-transform:uppercase; letter-spacing:0.5px; font-size:14px;}
ul.contacts-intitule li.ui-tabs-active {border-bottom:1px solid #000; color:#000}


.tag {display:inline-block; padding:8px; font-size:13px; line-height:13px; letter-spacing:1px; text-align:center; margin:0 auto 20px auto;
background:#000; color:#fff; text-transform:uppercase}

.tag.smalltag { padding:6px; font-size:11px; line-height:11px; }


/*ICO-UP*/
.icoUp {position:fixed; width:64px; height:64px; z-index:500; right:20px; bottom:20px; opacity:0.8; cursor:pointer; display:none ; 
font-size:21px; color:#eeeeee; z-index:200 ; background: #323232;}
.icoUp:hover { webkit-transform: scale(1.2); transform: scale(1.2);opacity:1}



/*global effetcts*/
a, header *, .btClean, .bigBut {
-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease
}
.grow { transition: scale 0.2s;}
.grow:hover { scale: 0.96 0.96; }  


body .left2center {text-align:left}


.addToCart, .btClean {display:inline-block; margin:20px 0 0 0; font-size:14px; font-weight:500; line-height:16px; letter-spacing:0.5px; text-align:center; border:1px solid #242424; text-transform:uppercase; padding:12px 15px 12px 15px;}
.addToCart  i , .btClean  i { font-size:17px;   display:inline-block; margin:0 8px 0 0}

.btClean.smallBt {display:inline-block; background: none; margin:10px 0 0 0; font-size:12px; font-weight:500; line-height:14px; letter-spacing:0.5px; text-align:center; border:1px solid #242424; text-transform:uppercase; padding:8px 10px 8px 10px;}
.btClean.smallBt  i { font-size:14px;   display:inline-block; margin:0 6px 0 0}

.btClean.btCleanInv {background:#242424; color:#fff}
.btClean.btCleanInv:hover {background:#ffffff; color:#242424}
button {cursor:pointer}

.addToCart:hover, .btClean:hover {background:#242424; color:#fff}
.grow { transition: scale 0.2s;}
.grow:hover { scale: 0.97 0.97; } 



.picTagSelec { position:absolute; right:0; top:0; font-size:13px; font-weight:400; letter-spacing:0.5px; padding:6px; }
.picTagSelec {background:#a48145; color:#fff}
/*responsive*/
.picTagPromo { position:absolute; left:0; top:20px; font-size:10px; font-weight:400; letter-spacing:1px; padding:4px 6px; background:#0C0; color:#fff}

.picTagAnniv { position:absolute; left:0; top:0; font-size:14px; font-weight:400; letter-spacing:0.5px; padding:5px 6px; background:#dd3333; color:#fff }
.picTagNoel { position:absolute; left:0; top:0; font-size:14px; font-weight:400; letter-spacing:0.5px; padding:5px 6px; background:#dd3333; color:#fff }
.picTagSoldes{ position:absolute; left:0; top:0; font-size:14px;line-height:10px; font-weight:400; letter-spacing:0.5px; padding:5px 6px; background:#dd3333; color:#fff }
.picTagSoldes span {font-size:10px; letter-spacing:0.5px; line-height:10px; display:inline-block; margin: 0 0 0 4px;   vertical-align: middle;}


.jc-bs3-container  {width: fit-content; max-width:90%; margin:auto}
.jconfirm .jconfirm-box{padding:30px 30px 20px 30px}
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content {overflow: visible;} 
.actIco i { font-size:13px; margin:0 2px}
.actIco i:hover { color:var(--button-color)}
.lineSuppr * { text-decoration:line-through !important}
table.dataTable thead th.no-export div.DataTables_sort_wrapper span:after, table.dataTable thead th.no-export div.DataTables_sort_wrapper span:before {display:none}
.jconfirm .jconfirm-box div.jconfirm-title-c {line-height:28px}

.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons {
    float: none !important; text-align: center;
}
.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default {margin-left:10px; margin-right:10px}







@media (max-width: 910px) {
.hideMobile {display:none !important}
.bloc-40, .bloc-60, .bloc-50 , .bloc-33 , .bloc-67, .bloc-50
body .left2center {text-align:center}
h2, h3 {text-align:center}

.bloc100, .bloc33, .bloc66, .bloc50  {display:block; width:auto !important; padding-bottom:0 !important}
.bloc33 {display:block; width:auto !important}
.bloc66 {display:block; width:auto !important}
.bloc50 {display:block; width:auto !important}


.toCenter {margin:20px auto !important}
.toTextCenter {text-align:center !important}
div.topContainer {display: flex;  flex-direction:column  ;}
#topBan {max-height: 260px;
    min-height: 260px;
    margin-bottom: 0;}
.topContainer {min-height:300px}

div.topContainer, div.blocsContainer {display: flex;  flex-direction:column ;}
.blocsContainer .bloc-33 {width:100%}

.borderRight {border-right:0px solid #f2f3f2; margin-right:0;} 
body .inner {display:block; padding:20px !important; }
.content {border-radius:0; margin:auto}

.logo {width:220px; margin:20px auto}

nav, .hide {display:none !important}
.present * {text-align:center !important}
.present .main-button  { margin:15px auto}
.logos img {display: inline-block; margin:10px ; height:70px}
/*ul li {    padding: 0 0 10px 0;}
ul li i {display:none !important}*/
.flexContCol {display:block;  flex-direction:unset !important}

.blocTitre  {margin-top:0 !important}
.logoFooter {float:right; margin-top:60px; width:120px; margin-right:10px}

body .inner.innerForm {padding-top:0 !important}
}


@media (max-width: 680px) {
.bloc-40, .bloc-60, .bloc-50 , .bloc-33 , .bloc-67, .blog-50, .blog-33 , .bloc-50{display:block; width:auto !important; margin-right:0}
.ban {display:none}
.banMobile {display:block !important;}


}