/*@font-face {	font-family:"Open Sans";
				src:url("./fonts/OpenSans-Regular.eot?") format("eot"),
				url("./fonts/OpenSans-Regular.woff") format("woff"),
				url("./fonts/OpenSans-Regular.ttf") format("truetype"),
				url("./fonts/OpenSans-Regular.svg#OpenSans") format("svg");
				font-weight:normal;
				font-style:normal;
			}*/

body {
	/*font-family: "Lato";*/
}

@font-face {
	font-family: "FiraSans";
	src: url("../fonts/FiraSans-Regular.ttf");
}

@font-face {
	font-family: "Nunito";
	src: url("../fonts/Nunito-Regular.ttf");
	font-weight:400;
}
@font-face {
	font-family: "Tabitha";
	src: url("../fonts/tabitha.woff");
	font-weight:400;
}

@font-face {
	font-family: "Nunito";
	src: url("../fonts/Nunito-Bold.ttf");
	font-weight:800;
}


#contenuModalAjout {
	grid-auto-flow:column;
}

.boxsizing {box-sizing: border-box;}

.cataloggrid {box-sizing: border-box; display:grid; grid-template-columns:1fr 1fr 1fr; grid-gap:20px; margin-bottom:20px;}
.cat2grid {box-sizing: border-box; display:grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap:20px; margin-bottom:20px;}

.bordertopcolor {border-top:1px solid #00AAF0;}

.newtile {  transition : border 100ms ease-out;border:1px solid #CACACA; box-sizing: border-box; padding-top:20px;}
.newtile:hover {border-color:#00AAF0; border-width:1px; border-transition : border 200ms ease-out;}

.explaincell {background-color:#fefefe; padding:5px; border-radius:5px; margin-bottom:10px;}

.flex { display: flex }

.flex-column  { flex-direction: column }
.flex-wrap    { flex-wrap: wrap }

.flex-center   { align-items: center }
.flex-baseline { align-items: baseline }
.flex-stretch  { align-items: stretch }
.flex-start    { align-items: flex-start }
.flex-end      { align-items: flex-end }

.flex-justify  { justify-content: space-between }

.flex-auto {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}
.flex-grow { flex: 1 0 auto }
.flex-none { flex: none }

.flex-first { order: -1 }
.flex-last  { order: 99999 }


.lboxtitle {background-color:#00AAF0;}
.gold {color: #FFDF00;}
.garantie {color : #00BC2E;}
.bigtel {font-size:2.5em}
.bold {font-weight:bold}
.sans {font-family: 'Open Sans',sans-serif;}
.lscf {color: #00aaf0;}
.hotline_picture {
	background-image:url('../images/hotline.png');
	background-repeat:no-repeat;
	background-position:100px 0px;
	}

.inlinefullblockmobile {display:inline-block;} 

.red {
	color:red;
}	

.barre {
	text-decoration:line-through;
}

.bgred {
	background-color:red;
}
	
.bgredlight {
	background-color:#FF6F6F;
}	
.green, .vert {
	color:#00BC2E;
}	

.nohelp {
	margin-left:auto;
	background: none;
}

.unsaved {background-color:#FFC857; background-repeat:no-repeat;}


.blackborder {
	border:1px solid #333;
}

.lightgreen {
	color:#43D667;
}	

.lightgrey {
	color:#9C9C9C;
}	

.userbar {
	background-color: #FFDF69;
	border: 1px #CEA200 solid;
	color : #6D5500;
	box-sizing: border-box;
}

.orange {
	color:#FFA500;
}	

.paddedcomp {
	padding-bottom:3px;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 80%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}



/* The Close Button */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: #00AAF0;
  color: white;
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  padding: 2px 16px;
  background-color: #00AAF0;
  color: white;
}

.height_10 {height:10px;}
.h16 {height:16px;}
.height_20 {height:20px;}
.h20 {height:20px;}
.height_30 {height:30px;}
.h30 {height:30px;}
.height_40 {height:40px;}
.height_50 {height:50px;}
.height_80 {height:80px;}
.height_90 {height:90px;}
.height_100 {height:100px;}
.height_120 {height:120px;}
.height_140 {height:140px;}
.height_160 {height:160px;}
.height_180 {height:180px;}
.height_200 {height:200px;}

.bg_lscf {background-color:#00aaf0}
.bg_white {background-color:#fff}
.bg_black {background-color:#333}
.bg_grey {background-color:#EEE}
.bg_info {background-color:#FFFA6E}

.top_border_grey {border-top:#ccc 1px solid;}
.bottom_border_grey {border-bottom:#ccc 1px solid;}

.recherche {width:150px;}

.padded {padding:5px;}
.paddedl {padding-left:5px;}
.paddedr {padding-right:5px;}
.paddedb {padding-bottom:5px;}
.paddedr_2 {padding-right:2px;}
.paddedr_8 {padding-right:8px;}
.paddedr_15 {padding-right:15px;}
.padded_10 {padding:10px;}

.margeb_20 {margin-bottom: 20px}

.margedb {margin-bottom:5px;}

h1 {font-size:2em;color:#00AAF0;}
h1.border_bottom {text-shadow:1px 1px #FFF, -1px -1px #FFF;}
h2 {font-size:1.7em;color:#00AAF0;}
h3 {font-size:1.1em;color:#00AAF0;}
h4 {font-size:1em;color:#00AAF0;}
h5 {font-size:1em;color:#00AAF0; text-align:left}
h6 {font-size:0.8em;color:#fff;}
h2.news {text-shadow:2px 2px #00aaf0;padding-top:5px; padding-bottom:5px; padding-left:20px; padding-right:40px; margin-top:20px; color:#fff; background: linear-gradient(to right, #00aaf0 0%,#00aaf0 66%,#00aaf0 100%);}
h3.cat3 {margin-top:20px;}

h5.cat4 {font-weight:bold; color:#fff; background: linear-gradient(to right, #00aaf0 0%,#00aaf0 100%); padding-left:20px;margin-top:0px;}

li.normal {list-style: square url("../images/li.png");}
ul {padding:0;margin-left:15px}
li.nolist {list-style: none}

li.marged{margin-top:7px;}

.pc100 {width:100%}

input {border: 1px solid #8BA0AA;}

.misc {font-size:8pt; color: #aeaeae}
.misc2 {font-size:8pt; color: #7D7D7D}

.white {
	/*text-shadow: 1px 1px 1px #000000;*/
	color: #fff;

	}

.reseau {border-bottom: 1px solid #8BA0AA;}

.degrade_lscf {
	background: #00AAF0;
	/*background: -moz-linear-gradient(top, #00aaf0, #00CDFF);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00aaf0), to(#00CDFF));*/

	/*-moz-box-shadow:inset 0px 0px 1px #edf9ff;
	-webkit-box-shadow:inset 0px 0px 1px #edf9ff;
	box-shadow:inset 0px 0px 1px #edf9ff;*/
	/*border: 1px solid #8BA0AA;*/

}
.degrade_lscf_inv {
	background: #00AAF0;
	/*background: -moz-linear-gradient(top, #00CDFF, #00AAF0);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#00CDFF), to(#00AAF0));

	-moz-box-shadow:inset 0px 0px 1px #edf9ff;
	-webkit-box-shadow:inset 0px 0px 1px #edf9ff;
	box-shadow:inset 0px 0px 1px #edf9ff;
	border: 1px solid #8BA0AA;*/

}

.nohover:hover {
	color:inherit;
}

.valign {
	vertical-align:middle;
}

.petit {
	font-size: 0.9em;
}

.wis_back {
	background-image:url("../images/wis_back.jpg");
	background-position:top right;
	background-repeat:no-repeat;
}

.vi_back {
	background-image:url("../images/vi_tub.jpg");
	background-position:top right;
	background-repeat:no-repeat;
}

.ca_back {
	background-image:url("../images/ca_back.jpg");
	background-position:top right;
	background-repeat:no-repeat;
}

.in_back {
	background-image:url("../images/in_back.jpg");
	background-position:top right;
	background-repeat:no-repeat;
}

.border_right {
	border-right:1px solid #8BA0AA;
}

.border_bottom {
	border-bottom:1px solid #00AAF0;
}

.border_bottom_light {
	border-bottom:1px solid #DCDCDC;
}

.border_bottom_lscf {
	border-bottom:1px solid #00aaf0;
}
.border_left {
	border-left:1px solid #8BA0AA;
}
.border_black {
	border:1px solid #000;
}
.border_light {
	border:1px solid #BBB;
}

.border_white {
	border:1px solid #fff;
}

.border_lightblue {
	border:1px solid #B3F0FF;
}

.border_lscf {
	border:1px solid #00aaf0;
}

.stock, .stockbig{
	background-color:#00aaf0;
	border: 1px solid #005F76;
	color : #fff;
	padding: 2px 4px 2px 4px;
	font-weight:bold;
}

.stockbig {
	font-size:1.5em;
}

/*a {color:#006C87}*/
a {color:#00708A}

/*a {color:#FF7F00}*/
a:hover, a:active {color:#00aaf0;}

.white_shadow {	text-shadow: 1px 1px 1px #ffffff;}

.small_ok {font-size:12px;border:1px solid #333;}

.yellow {color:#FFFF00;}

.w160 {width:160px;}
.w150 {width:150px;}
.w100 {width:100px;}

p.blabla {text-indent:3em;}
.paddedl3em {padding-left:3em;}
.paddedl6em {padding-left:6em;}
.paddedr3em {padding-right:3em;}
.paddedr6em {padding-right:6em;}

.important {color: red;}

table.produit {
	color:#333;
	font-size:0.8em;
}

.pc25 {
	width:25%;
}
.pc40 {
	width:40%;
}

.pc50 {
	width:50%;
}
.pc60 {
	width:60%;
}

.pc75 {
	width:75%;
}

.pc90 {
	width:90%;
}

.news li {
	list-style: none;
	/*font-family: 'Open Sans',droid sans,sans-serif;*/
	margin-bottom: 2px;
	/*font-size:0.8em;*/
}

.italique {font-style:italic;}

.zmax {z-index: 10;}
.zmin {z-index: 0;}

/*ul {font-family:sans-serif;}
ol {font-family:sans-serif;}
li {font-family:sans-serif;}*/

.nb {background-image:none;}
.field {border:1px solid #00AAF0; height:18px;padding-left:18px;}
.ta {border:1px solid #00AAF0; padding-left:18px; font-family:sans-serif;font-size:9pt} /* textarea du formulaire */
.ta2 {border:1px solid #00AAF0; font-family:sans-serif;font-size:9pt} /* textarea du formulaire */
.valid {background-color:#D3FFB1; height:18px; border:1px dashed #00DB02;padding-left:18px;background-image:url('../images/True.gif');background-repeat:no-repeat;}
.notvalid {background-color:#FFC0C9;  height:18px;border:1px dashed #FF0000;padding-left:18px;background-image:url('../images/False.gif');background-repeat:no-repeat;}

.prix_tableau {
	font-size:14pt;
	padding-left:20px;
	text-align:right;
	color:#E30000;

}

.barre {
    text-decoration: line-through;
        }

.ref_tableau {
	font-size:14pt;
	font-weight:bold;
}

.bg_lscf_light{
		background-color:#DFF9FF;
	}
	
sup {
    font-size: 0.7em;
    font-weight: bold;
    vertical-align: 0.4em;
}

.ht {
	font-size: 0.7em;
	font-weight:normal;
	color:#aaa;
}

.w96 {width:96px;}
.w128 {width:128px;}
.h96 {height:96px;}
.h40 {height:40px;}
.h50 {height:50px;}

.textarea {font-family:'Open Sans',droid,sans-serif;color:#333;}

.lobster {font-family:'Open Sans',droid,sans-serif}

#breadcrumbs {
    font-size:11px;
    color:#111;
    list-style:none;
    padding:0; margin:0;
    background:url("../images/breadcrumb-bg.png") repeat-x center;
    border:1px solid #CCC;
    overflow:hidden;
}
#breadcrumbs li {
    float:left;
    background:url("../images/breadcrumb-right.png") no-repeat right center;
    padding:0 20px 0 10px;
    height:28px; line-height:28px;
}
#breadcrumbs a {
    text-decoration:none;
    color:#7F7F7F;
}
#breadcrumbs a:hover {
    color:#CC6600;
}

#breadcrumbs a.actif {
    color:#00AAF0;
    font-weight:bold
}

.border{
border: 1px red solid;
}

.catch {
	border: 1px #00AAF0 solid;
}

.greyborder {
	border: 1px #999 solid;
}

.grey {
	color: #888;
}

.bigtext {
	font-size:2em;
}
.hugetext {
	font-size:3em;
}

.bigmediumtext {
	font-size:1.8em;
}

.mediumtext {
	font-size:1.5em;
}

.normaltext {
	font-size:1em;
}

.text_shadow {
	text-shadow : 1px 1px 2px #999;
}

.min250 {
	min-height:250px;
}

.nodisplay {
	display:none;
}

.display {
	display:block;
}

.displayrow {
	display:table-row;
}

.tarif {
	font-size:3em;
	/*font-weight:bold;*/
	color:#E30000;
	background-color:#fff;
}

.tarif_associe {
	
	/*font-weight:bold;*/
	color:#E30000;
	background-color:#fff;
}


.tntback {
	background-image:url("../images/tnt_delivery.jpg");
	background-position:top right;
	background-repeat:no-repeat;
}

.cartonback {
	background-image:url("../images/carton.jpg");
	background-position:top right;
	background-repeat:no-repeat;
}

.titreslide {
	font-weight:bold;
	color:#00AAF0;
}

.smallline {
	line-height:14px;
}

.imgmenu, .imnu {
	padding-left:1px;
	display:block;
	float:left;
	width:32px;
	height:32px;
	margin-right:4px;
	text-align:center;
	vertical-align:middle;
	background-size:contain !important;
}

.txtmenu {
	background-position-x: 0 !important;
	background-size: 32px contain !important;
	height: 32px;
	margin-left:0px;
	text-align:left;
	text-shadow:none;
	line-height:32px;
	display:table-cell;
	vertical-align:middle;
	font-size:12px;
}

.txtmenu div {
	display:block;
	line-height:12px;;
/*
	margin-left:38px;
*/
}

.tblmenu {
	width:100%;
	border-collapse:collapse;
}

.tblmenu > tr {
	height:32px;
}

.limenu {
	line-height:32px;
	cursor:pointer;
	border:1px solid #fff;
	 transition: border-color .3s ease;  
}

.limenu:hover{
	transition: border-color .08s ease;  
	border:1px solid #00AAF0;
}

td.imgmenu {
	height:32px;
	width:32px;
}

#jetmenu > li {
	/*letter-spacing:initial;*/
	letter-spacing:normal;
}

ul.jetmenu {
	display:grid;
	grid-auto-flow: column;
	align-items: center;
	justify-items: center;
}

.drop-shadow.bottom {
  box-shadow: 0 4px 2px -2px rgba(0,0,0,0.4);
}

.onlymobile {display:none}

.chatborder {border: 1px solid #00AAD4;}
.chatstyle {font-weight:bold; cursor:pointer; padding:5px; border-radius:0 0 0 0 ; line-height:24px; background-color:#fff; width:240px; height:48px; position: fixed; bottom:-1px; right:5px; box-shadow: 0px 0px 5px #aaa; }
.chatcontent {box-shadow:0px -2px  10px #777;z-index:1000000; overflow:auto; max-height:340px; background:#FFF; position: fixed; bottom:50px; right:5px; border-top:1px solid #00AAD4; border-bottom:1px solid #00AAD4;border-left:1px solid #00AAD4;border-right:1px solid #00AAD4;width:320px; padding:5px; min-height:340px; }
.chatmessage {float:left; margin-bottom:5px; background-color:rgb(215, 234, 248); color:#000; ;padding:5px; border-radius:5px; }
.chatresponse {float:right;text-align:left; background-color:#F3F3F3; color:#333;}
.chatimage {border-radius:10px; box-shadow:0px 0px 5px #ddd; background-color:#fff; border:1px solid #00AAF0; width:80px; position:absolute; left:-10px; top:-15px}
.chathead {border-radius:10px 10px 0px 0px; padding:5px; color:#fff; z-index:1000000000; background-color:#00AAF0; width:320px; position:fixed; bottom:400px; right:5px; border:1px solid #00aad4; font-weight:bold; box-shadow: 0 4px 2px -2px #fff; }

.chatinput {background-color:rgb(215,234,248); text-align:center; border-radius:0 0 0 0; padding:5px; color:#fff; z-index:1000000000; width:320px; position:fixed; height:39px;  bottom:0px; right:5px; border:1px solid #00aad4; font-weight:bold;}
#chatTextarea {height:33px;}
.chatinfo{width:100%;text-align:center;font-weight:bold;background-color:#E9E9E9;color:#737373; border-radius:5px; margin-bottom:5px;}


.px480 {width:480px;}
.px350 {width:350px;}
.px200 {width:200px;}

.chatbox {display:none;}
.delay100 {animation-delay:100ms;}
.delay200 {animation-delay:200ms;}
.delay300 {animation-delay:300ms;}
.delay400 {animation-delay:400ms;}
.delay500 {animation-delay:500ms;}
.delay1000 {animation-delay:1000ms;}
.delay1500 {animation-delay:1500ms;}
.delay2000 {animation-delay:2000ms;}
.delay2500 {animation-delay:2500ms;}
.delay3000 {animation-delay:3000ms;}
.delay3500 {animation-delay:3400ms;}
.delay4000 {animation-delay:4000ms;}
.delay4500 {animation-delay:4500ms;}
.delay5000 {animation-delay:5000ms;}

.inlineblock {display: inline-block}

label {cursor:pointer;}

.pointer {cursor: pointer;}

[required] {
   border: 2px dotted orange !important;
}

:required {
   border-radius: 2px dotted orange !important;
}

.hoverlight:hover {background-color:#eee;}
.pill {box-shadow: 3px 3px 3px #ccc; text-align:center; margin-left:10px; display:inline-block; width:120px; border-radius: 5px; background-color:#eee; color:white; font-weight:bold;}

.badge {
	display: inline-block;
	padding: 0.3em;
	min-width: 2.1em;
	font-size: 0.6rem;
	text-align: center;
	border-radius: 50%;
	background: #2199e8;
	color: #fefefe;
}

.cat2card {
	transition: box-shadow .3s;
}

.cat2card:hover {
	transition: box-shadow .3s;
	animation: wow 1s ease-in-out alternate infinite;
}

@keyframes wow {
	from {
		box-shadow: 0px 0px 10px #CCC;
	}
	
	to {
		box-shadow: 10px 10px 10px #CCC;
	}
	
}

/*index9.php*/

#search_result {
  display: none;
  z-index: 100000000;
  background-color: #fff;
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  position: absolute;
  top:40px;
  left:0;
  width:100%;
  border-right: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #fff;		
  box-sizing:border-box;
  box-shadow: 0 0 5px #ccc;
}

#search_result ul {position: relative; margin:0;}

#search_result li {
	box-sizing:border-box;
	list-style-type: none;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:0;
	border-top:1px solid #eee;
	cursor: pointer;
	display:grid;
	grid-auto-flow:column;
	grid-template-columns: 48px auto 80px 60px 80px;
	grid-gap:0;
	width:100%;
	/*height:40px;*/
}

#search_result li:first-of-type {
	border-top:1px solid #fff;
}

#search_result	li:hover{
	background-color:#DAEAF0;
}


#search_result	li.active{
	background-color:#DAEAF0;
}

.search_result_li.active{
	background-color:#DAEAF0;
}

.search_result_image {margin-left:0px; margin-right:10px; text-align:center; display:block;  vertical-align: middle;}
.search_result_text {display:block; font-size:14px; line-height:14px;}
.search_result_tarif {font-weight:bold; font-size:10px; text-align:right; color: #FF3333; display:block}		  


#spinner {
animation: spin 1s ease-in-out infinite;
}


#spinnerbre {
animation: breathing 2s ease-in-out infinite;
opacity:.5;
}

@keyframes spin {
from {
	transform:rotate(0deg);
}
to {
	transform:rotate(360deg);
}
}		 


@keyframes breathing {
0% {
transform: scale(0.3);
}

25% {
transform: scale(1);
}

60% {
transform: scale(1.1);
}

100% {
transform: scale(0.3);
}
}