/* CSS Document */
.actu{
	display: inline-block;
	position: relative;
	width: 50%;
	max-width: 500px;
	height: 750px;
}

#variationsModal .modal-dialog{
	width: 700px;
	max-width: 700px;
}

#variationsModal table td{
	vertical-align: middle;
}

.modal{
	z-index: 10000;
}

ul{
	margin-bottom:0px;
}

/* CSS Document */

.degrade_blanc {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+1,ffffff+29,ffffff+77,ffffff+100&0+8,1+25,1+83,0+100 */
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 1%, rgba(255,255,255,0) 8%, rgba(255,255,255,1) 25%, rgba(255,255,255,1) 29%, rgba(255,255,255,1) 77%, rgba(255,255,255,1) 83%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 1%,rgba(255,255,255,0) 8%,rgba(255,255,255,1) 25%,rgba(255,255,255,1) 29%,rgba(255,255,255,1) 77%,rgba(255,255,255,1) 83%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,0) 1%,rgba(255,255,255,0) 8%,rgba(255,255,255,1) 25%,rgba(255,255,255,1) 29%,rgba(255,255,255,1) 77%,rgba(255,255,255,1) 83%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */

}

.lien {
	font-size: 12px;
	font-weight: 400;
	text-decoration: none;
	color: #0078F7 !important;
	font-family: 'Saira', sans-serif;
}

.lien:hover {
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	color: #0368D3 !important;
	font-family: 'Saira', sans-serif;
}

.titre_import  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 22px;
	font-weight: 200;
	line-height: 40px;
	text-align: left;
	color: #131313;
	letter-spacing: 0px;
	text-decoration: none;
	white-space:nowrap;
}


.tab_pro {
	width: 100%;
	font-family: 'Saira', sans-serif;
	font-size: 12px;
	font-weight: 300;
	text-decoration: none;
	color: #000;
	font-family: 'Saira', sans-serif;
}

.entete_pro {
	background-color: rgba(0,97,170,0.8);
	color: #fff !important;
	font-family: 'Saira', sans-serif;
	font-size: 15px;
	font-weight: 300;
	text-decoration: none;
	color: #000;
	font-family: 'Saira', sans-serif;
}



.formulaire {
	width: 400px;
	font-size: 15px;
	font-weight: 300;
	text-decoration: none;
	color: #0061aa !important;
	font-family: 'Saira', sans-serif;
	padding: 2px 10px 2px 12px;
	border-radius: 5px;
	border: 1px solid rgba(0,97,170,0.5)
}

.formulaire02 {
	width: 400px;
	font-size: 12px;
	font-weight: 300;
	text-decoration: none;
	color: #000 !important;
	font-family: 'Saira', sans-serif;
	padding: 2px 10px 2px 12px;
	border-radius: 5px;
	border: 1px solid rgba(0,97,170,0.5)
}

.vignette {
	position: absolute;
	width:90px;
	height: 90px;
}



.vignette_photo_produit {
	position: absolute;
	width: 206px;
	height: 126px;
}

.suppr_produit {
	display: block;
	position: relative;
	width: 19px;
	height: 19px;
	z-index: 50;
	left: 185px;
	top:2px;
}

.suppr-image{
	display: block;
	position: relative;
	width: 19px;
	height: 19px;
	z-index: 50;
	left: 70px;
}


.suppr {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 9px;
	font-weight: 300;
	text-align: center;
	color: #fff !important;
	letter-spacing: 0px;
	background-color: #00abff;
	border-radius: 10px;
	text-decoration: none;
	border: 0px;
	cursor: pointer;
}

.supprimer {
	font-family: 'Saira', sans-serif;
	font-size: 10px;
	font-weight: 400;
	text-align: left;
	color: #00abff;
	text-decoration: none;
}

.bouton_bleu {
	font-family: 'Saira', sans-serif;
	font-size: 10px;
	font-weight: 400;
	text-align: left;
	color: #00abff;
	text-decoration: none;
	padding: 2px 10px 2px 10px;
}


.center-div {
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 300px;
	top: 250px;
	text-align: center;
}
	

.bouton {
	font-size: 10px;
	font-weight: 300;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #fff !important;
	font-family: 'Saira', sans-serif;
	padding: 5px 12px 5px 15px;
	background-color: #008ddb;
	border-radius: 10px;
	border: 0px;
	margin-top: 10px;
	cursor: pointer;
}



.vert {
	font-size: 10px;
	font-weight: 800;
	text-decoration: none;
	text-transform: uppercase;
	color: rgba(42,255,0,1.00);
	font-family: 'Saira', sans-serif;
}

.titre {
	font-size: 10px;
	font-weight: 600;
	text-decoration: none;
	text-transform: uppercase;
	color: rgba(80,113,135,1.00);
	font-family: 'Saira', sans-serif;
}

.titre:hover {
	font-size: 10px;
	font-weight: 600;
	text-decoration: none;
	text-transform: uppercase;
	color: #0086d4;
	font-family: 'Saira', sans-serif;
}

.rouge {
	font-size: 10px;
	font-weight: 800;
	text-decoration: none;
	text-transform: uppercase;
	color: rgba(255,0,0,1.00);
	font-family: 'Saira', sans-serif;
}

.bouton:hover {
	background-color: #fff;
	color: #008ddb !important;
	cursor: pointer;
	font-weight: 600;
}

.form {
	border: 0px;
	color: #008ddb !important;
	font-family: 'Saira', sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	margin-top: 10px;
}

.leur_bleu {
	-webkit-box-shadow: 0px 0px 2px -2px #0F4CA5; 
	box-shadow: 0px 0px 2px -2px #0F4CA5;
}

#deconnexion {
	position: fixed;
	top: 0;
	right: 50px;
	width: 149px;
	height: 30px;
	background-color: #008ddb;
	border-radius: 0px 0px 10px 10px;
}

#deconnexion:hover {
	position: fixed;
	top: 0;
	right: 50px;
	width: 149px;
	height: 30px;
	background-color: #006dcb;
	border-radius: 0px 0px 10px 10px;
}

#deconnexion2 {
	position: fixed;
	top: 27px;
	right: 50px;
	width: 149px;
	height: 30px;
	background-color: #008ddb;
	border-radius: 0px 0px 10px 10px;
	z-index: 600;
}

#deconnexion2:hover {
	position: fixed;
	top: 27px;
	right: 50px;
	width: 149px;
	height: 30px;
	background-color: #006dcb;
	border-radius: 0px 0px 10px 10px;
	z-index: 600;
}

#logo_footer {
	position: fixed;
	bottom: 30px;
	right: 35px;
	width: 203px;
	height: 37px;
}

#logo_client {
	position: relative;
	width: 400px;
	margin: 0 auto;
	height: auto;
	top: 200px;
}

#sommaire {
	position: relative;
	width: 500px;
	top: 300px;
	margin: 0 auto;
	height: auto;
}

.degrade {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,297eff+52,297eff+69,ffffff+94,ffffff+100&0.2+0,0+52,0+69,0+69,0.2+94,0.5+100 */
	background: -moz-linear-gradient(top,  rgba(255,255,255,0.2) 0%, rgba(41,126,255,0) 52%, rgba(41,126,255,0) 69%, rgba(255,255,255,0.2) 94%, rgba(255,255,255,0.5) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0.2) 0%,rgba(41,126,255,0) 52%,rgba(41,126,255,0) 69%,rgba(255,255,255,0.2) 94%,rgba(255,255,255,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,0.2) 0%,rgba(41,126,255,0) 52%,rgba(41,126,255,0) 69%,rgba(255,255,255,0.2) 94%,rgba(255,255,255,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33ffffff', endColorstr='#80ffffff',GradientType=0 ); /* IE6-9 */
	border-radius: 0px 0px 10px 10px;
}

.point_menu_sommaire {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 10px;
	font-weight: 500;
	line-height: 20px;
	text-align: left;
	margin-top: 10px;
	color: #7bcdff !important;
	padding: 10px 10px 10px 10px;
	letter-spacing: 2px;
}

.acceder_bleu {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 2px;
	background-color: #00abff;
	border-radius: 10px;
	padding: 5px 18px 5px 24px;
	text-decoration: none;
}

.acceder_bleu:hover {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 2px;
	background-color: #008fff;
	border-radius: 10px;
	padding: 5px 18px 5px 24px;
	cursor: pointer;
	text-decoration: none;
}


.acceder_vert {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 2px;
	background-color: #39b54a;
	border-radius: 10px;
	padding: 5px 18px 5px 24px;
	cursor: pointer;
	text-decoration: none;
}

.acceder_vert:hover {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 2px;
	background-color: #239a2f;
	border-radius: 10px;
	padding: 5px 18px 5px 24px;
	cursor: pointer;
	text-decoration: none;
}

.titre_sommaire_blanc {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 18px;
	line-height: 18px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 2px;
	padding-left: 10px;
}

.titre_sommaire_blanc02 {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 18px;
	font-weight: 500;
	text-align: center;
	color: #73cfff !important;
	letter-spacing: 1px;
	padding-left: 10px;
	white-space:nowrap;
}

.titre_sommaire_blanc03 {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 24px;
	line-height: 18px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 2px;
	padding-left: 10px;
}

.titre_sommaire_blanc04 {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 30px;
	line-height: 18px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 2px;
	padding-left: 10px;
}


#retour {
	display: block;
	position: absolute;
	width: 50px;
	height: auto;
	left: 50px;
	top: 80px;
}

#retour2 {
	display: block;
	position: fixed;
	width: 50px;
	height: auto;
	left: 20px;
	top: 50px;
	z-index: 5000;
}

#sommaire02 {
	position: relative;
	width: 100%;
	top: 430px;
	margin: 0 auto;
	height: auto;
}

.back_left_search {
	background-color: #fff;
	border-radius: 6px 0px 0px 6px;
	padding-top: 5px;
	border-right-color: #fff;
}

.back_left_search.fond_search{
	border-left: #DDDDDD solid 1px;
}

.back_right_search {
	background-color: #fff;
	border-radius: 0px 6px 6px 0px;
	padding-top: 5px;
	border-left-color: #fff;
	padding-left: 10px;
}

.back_right_search.fond_search{
	border-right: #DDDDDD solid 1px;
}


.fond_search {
	border-top: #DDDDDD solid 1px;
	border-bottom: #DDDDDD solid 1px;
}

.form_search {
	border: 0px;
	color: #008ddb !important;
	font-family: 'Saira', sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-align: left;
}

.form_search02 {
	border: 0px;
	color: #008ddb !important;
	font-family: 'Saira', sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
}

#bout_menu {
	display: inline-block;
	position: relative;
	width: 125px;
	height: 23px;
	margin: 0 auto;
	margin-right: 20px;
}

#bout_menu_vert {
	display: inline-block;
	position: relative;
	width: 185px;
	height: 23px;
	margin: 0 auto;
		text-decoration: none;
}

.bout_menu {
	display: block;
	width: 125px;
	height: 23px;
	margin: 0 auto;
	margin-right: 20px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#709fb7+0,507187+100 */
	background: rgb(112,159,183); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(112,159,183,1) 0%, rgba(80,113,135,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(112,159,183,1) 0%,rgba(80,113,135,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(112,159,183,1) 0%,rgba(80,113,135,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#709fb7', endColorstr='#507187',GradientType=0 ); /* IE6-9 */

	font-family: 'Saira', sans-serif;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	font-size: 9px;	font-weight: 500;padding-top: 10px;
	border-radius: 8px;
	letter-spacing: 1px;
	text-decoration: none;
}

.bout_menu02 {
	display: block;
	width: 150px;
	height: 23px;
	margin: 0 auto;
	background-color: #39b54a;

	font-family: 'Saira', sans-serif;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	font-size: 12px;	
	font-weight: 500;
	padding: 8px 5px 5px 7px;
	border-radius: 8px;
	letter-spacing: 1px;
	text-decoration: none;
}


.bout_menu02:hover {
	display: block;
	width: 150px;
	height: 23px;
	margin: 0 auto;
	background-color: #39b54a;

	font-family: 'Saira', sans-serif;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	font-size: 12px;	
	font-weight: 500;
	padding: 8px 5px 5px 7px;
	border-radius: 8px;
	letter-spacing: 1px;
	text-decoration: none;
}


#ajout {
	display: inline-block;
	position: relative;
	width: 25px;
	height: 25px;
	margin: 0 auto;
	top: 10px;
}

#ajout2 {
	display: inline-block;
	position: relative;
	width: 25px;
	height: 25px;
	margin: 0 auto;
	top: 0px;
}

.famille {
		margin-right: 20px;
}

#user {
	position: fixed;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	min-width: 1100px;
	height: 27;
	background-color: #fff;
	z-index:500;
}
.user {
	font-family: 'Saira', sans-serif;
	text-align: center;
	text-transform: uppercase;
	color: rgba(77,77,77,0.5);
	font-size: 11px;
	font-weight: 400;
	padding-left: 30px;
	letter-spacing: 1px;
}

.user_active {
	font-family: 'Saira', sans-serif;
	text-align: center;
	text-transform: uppercase;
	color: rgba(77,77,77,1);
	font-size: 11px;
	font-weight: 400;
	padding-left: 30px;
	letter-spacing: 1px;
}

#bandeau_search {
	display: block;
	position: fixed;
	top: 27px;
	width: 100%;
	height: 65px;
	background: url(../images/bandeau_search.jpg) center center no-repeat;
	background-size: cover;
	min-width: 1100px;
	z-index: 500;
}

.text_total {
	font-family: 'Saira', sans-serif;
	text-align: left;
	text-transform: uppercase;
	color: rgba(255,255,255,1);
	font-size: 11px;
	font-weight: 400;
	padding-right: 20px;
	letter-spacing: 0px;
	white-space:nowrap;
}

#bandeau_gamme {
	display: block;
	position: fixed;
	top: 92px;
	width: 100%;
	height: 37px;
	background-color: #507187;
	min-width: 1100px;
	z-index: 10000;
}

.gamme {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 11px!important;
	font-weight: 300!important;
	text-align: left;
	color: rgba(255,255,255,0.6)!important;
	letter-spacing: 24px;
}
.historique {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 9px;	font-weight: 500;text-align: right;
	color: #999999;
	letter-spacing: 3px;
	padding-left: 30px;
}

.page {
	font-family: 'barlow', sans-serif;
	text-transform: uppercase;
	font-size: 9px;
	font-weight: 500;
	text-align: left;
	color: #fff;
	letter-spacing: 3px;
}

.pages {
	width: 160px;
	height: 17px;
	background-color: #161616;
	border-radius: 2px;
}

.num_pages {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 600;
	text-align: left;
	color: #fff;
	letter-spacing: 1px;
}

.ajout_violet {
	width: auto;
	height: 17px;
	background-color: #754ba0;
	border-radius: 2px;
}

.ajout_violet:hover {
	width: auto;
	height: 17px;
	background-color: #6a22c6;
	border-radius: 2px;
	cursor: pointer;
}

.ajout_rose {
	width: auto;
	height: 17px;
	background-color: #de1482;
	border-radius: 2px;
}

.ajout_rose:hover {
	width: auto;
	height: 17px;
	background-color: #f9199f;
	border-radius: 2px;
	cursor: pointer;
}

.ajout_rouge {
	width: auto;
	height: 17px;
	background-color: #ed1c24;
	border-radius: 2px;
}

.ajout_rouge:hover {
	width: auto;
	height: 17px;
	background-color: #ff3948;
	border-radius: 2px;
	cursor: pointer;
}

.ajout_bleu {
	width: auto;
	height: 17px;
	background-color: #0071bc;
	border-radius: 2px;
}

.ajout_bleu:hover {
	width: auto;
	height: 17px;
	background-color: #0071bc;
	border-radius: 2px;
	cursor: pointer;
}

.ajout_cian {
	width: auto;
	height: 17px;
	background-color: #15afe1;
	border-radius: 2px;
}

.ajout_cian:hover {
	width: auto;
	height: 17px;
	background-color: #15afe1;
	border-radius: 2px;
	cursor: pointer;
}

.ajout_vert {
	width: auto;
	height: 17px;
	background-color: #d6d625;
	border-radius: 2px;
}

.ajout_vert:hover {
	width: auto;
	height: 17px;
	background-color: #d6d625;
	border-radius: 2px;
	cursor: pointer;
}

.ajout_orange {
	width: auto;
	height: 17px;
	background-color: #f15a24;
	border-radius: 2px;
}

.ajout_orange:hover {
	width: auto;
	height: 17px;
	background-color: #f15a24;
	border-radius: 2px;
	cursor: pointer;
}

.text_ajout {
	font-family: 'barlow', sans-serif;
	font-size: 11px;
	font-weight: 600;
	text-align: left;
	color: #fff;
	letter-spacing: 3px;
	padding-left: 22px;
	padding-right: 20px;
	white-space:nowrap;
}

.import_export {
	font-family: 'barlow', sans-serif;
	font-size: 11px;
	font-weight: 400;
	text-align: center;
	color: #ccc;
	letter-spacing: 1px;
	white-space:nowrap;
	text-decoration: none;
}

.slash {
	font-family: 'barlow', sans-serif;
	font-size: 11px;
	font-weight: 400;
	text-align: center;
	color: #ccc;
	letter-spacing: 1px;
	white-space:nowrap;
	text-decoration: none;
}

.import_export:hover {
	font-family: 'barlow', sans-serif;
	font-size: 11px;
	font-weight: 600;
	text-align: center;
	color: #0086d4;
	letter-spacing: 1px;
	white-space:nowrap;
	text-decoration: none;
}

.import_export_vert {
	font-family: 'barlow', sans-serif;
	font-size: 11px;
	font-weight: 400;
	text-align: center;
	color: #fff;
	letter-spacing: 1px;
	white-space:nowrap;
	text-decoration: none;
}

.import_export_vert:hover {
	font-family: 'barlow', sans-serif;
	font-size: 11px;
	font-weight: 600;
	text-align: center;
	color: #39b54a;
	letter-spacing: 1px;
	white-space:nowrap;
	text-decoration: none;
}

.text_ajout_vert {
	font-family: 'barlow', sans-serif;
	font-size: 11px;
	font-weight: 600;
	text-align: left;
	color: #082603;
	letter-spacing: 3px;
	padding-left: 22px;
	padding-right: 20px;
	white-space:nowrap;
}

#sous_menu {
	display: block;
	position: fixed;
	top: 129px;
	left: 0px;
	height: 500px;
	width: 330px;
	z-index: 5000;
}

#media_produit {
	display: block;
	position: absolute;
	top: 179px;
	left: 0px;
	height: 500px;
	width: 330px;
	z-index: 200;
	background-color: aqua;
}

.liste_gamme  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.titre_gamme_grand  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 24px;
	font-weight: 300;
	text-align: left;
	color: #131313;
	letter-spacing: 0px;
	text-decoration: none;
	white-space:nowrap;
}


.liste_gamme_sechemains  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.liste_gamme_sechemains:hover, .active_sechemains {
	text-decoration: none;
	color: #754ba0;	font-weight: 500;}

.liste_gamme_mains  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.liste_gamme_mains:hover, .active_mains {
	text-decoration: none;
	color: #de1482;	font-weight: 500;}

.liste_gamme_sanitaires  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 35px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.liste_gamme_sanitaires:hover, .active_sanitaires {
	text-decoration: none;
	color: #ed1c24;	font-weight: 500;}

.liste_gamme_collectif  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.liste_gamme_collectif:hover, .active_collectif {
	text-decoration: none;
	color: #0071bc;	font-weight: 500;}


.liste_fourgon  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.liste_fourgon:hover, .active_fourgon {
	text-decoration: none;
	color: #73cfff;	font-weight: 500;}

.liste_gamme_dechets  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.liste_gamme_dechets:hover, .active_dechets {
	text-decoration: none;
	color: #d6d625;	font-weight: 500;}

.liste_gamme_hotellerie  {
	font-family: 'saira', sans-serif;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #4d4d4d;
	letter-spacing: 0px;
	text-decoration: none;
}

.liste_gamme_hotellerie:hover, .active_hotellerie {
	text-decoration: none;
	color: #f15a24;	font-weight: 500;}



#container_produits {
	position: relative;
	top: 130px;
	width: 100%;
}

#container_information_produit {
	position: relative;
	top: 179px;
	width: 100%;
	height: 500px;
}

.product-card {
	display: inline-block;
	position: relative;
	width: 260;
	height: auto;
}

#telechargement {
	display: inline-block;
	position: relative;
	width: 250px;
	height: auto;
}

#actu {
	display: inline-block;
	position: relative;
	width: 50%;
	max-width: 500px;
	height: auto;
}

#background_produit {
	position: absolute;
	width: 160px;
	height: 180px;
	z-index: 100;
	background-image:url(../images/fond_produit.png);
}

#background_produit:hover {
	background-image:url(../images/fond_produit-sechemains.png);
	cursor: pointer;
}

#background_produit:hover .titre_produit{
	color: #fff !important;
}

#background_produit_mains {
	position: absolute;
	width: 160px;
	height: 180px;
	z-index: 100;
	background-image:url(../images/fond_produit.png);
}

#background_produit_mains:hover {
	background-image:url(../images/fond_produit-mains.png);
	cursor: pointer;
}

#background_produit_mains:hover .titre_produit{
	color: #fff !important;
}

#background_produit_sanitaires {
	position: absolute;
	width: 160px;
	height: 180px;
	z-index: 100;
	background-image:url(../images/fond_produit.png);
}

#background_produit_sanitaires:hover {
	background-image:url(../images/fond_produit-sanitaires.png);
	cursor: pointer;
}

#background_produit_sanitaires:hover .titre_produit{
	color: #fff !important;
}

#background_produit_collectif {
	position: absolute;
	width: 160px;
	height: 180px;
	z-index: 100;
	background-image:url(../images/fond_produit.png);
}

#background_produit_collectif:hover {
	background-image:url(../images/fond_produit-collectif.png);
	cursor: pointer;
}

#background_produit_collectif:hover .titre_produit{
	color: #fff !important;
}

#background_produit_fourgon {
	position: absolute;
	width: 240px;
	height: 180px;
	z-index: 100;
	background-image: url(../images/fond_produit.png);
}

#background_produit_fourgon:hover {
	background-image:url(../images/fond_produit_fourgon.png);
	cursor: pointer;
}

#background_produit_fourgon:hover .titre_produit{
	color: #fff !important;
}

#background_produit_dechets {
	position: absolute;
	width: 160px;
	height: 180px;
	z-index: 100;
	background-image:url(../images/fond_produit.png);
}

#background_produit_dechets:hover {
	background-image:url(../images/fond_produit-dechets.png);
	cursor: pointer;
}

#background_produit_dechets:hover .titre_produit{
	color: #387f0a !important;
}

#background_produit_hotellerie {
	position: absolute;
	width: 160px;
	height: 180px;
	z-index: 100;
	background-image:url(../images/fond_produit.png);
}

#background_produit_hotellerie:hover {
	background-image:url(../images/fond_produit-hotellerie.png);
	cursor: pointer;
}

#background_produit_hotellerie:hover .titre_produit{
	color: #fff !important;
}



.titre_produit {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
	text-align: left;
	color: #4d4d4d;
	text-decoration: none;
}

.titre_produit:hover {
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
	text-align: left;
	color: #fff;
	text-decoration: none;
}

.photo_produit_sechemains {
	border: 3px solid;
	border-color: #754ba0;
}

.photo_produit_mains {
	border: 3px solid;
	border-color: #de1482;
}

.photo_produit_sanitaires {
	border: 3px solid;
	border-color: #ed1c24;
}

.photo_produit_collectif {
	border: 3px solid;
	border-color: #0071bc;
}

.photo_produit_fourgon {
	border: 3px solid;
	border-color: #73cfed;
}

.photo_produit_dechets {
	border: 3px solid;
	border-color: #d6d625;
}

.photo_produit_hotellerie {
	border: 3px solid;
	border-color: #f15a24;
}


/* checkbox */

		.control {
			font-family: saira;
			display: block;
			position: relative;
			padding-left: 30px;
			margin-bottom: 5px;
			padding-top: 3px;
			cursor: pointer;
			font-size: 12px;
		}
			.control input {
				position: absolute;
				z-index: -1;
				opacity: 0;
			}
		.control_indicator {
			position: absolute;
			top: 2px;
			left: 0;
			height: 20px;
			width: 20px;
			background: #e6e6e6;
			border: 0px solid #4d4d4d;
			border-radius: 4px;
		}
		.control:hover input ~ .control_indicator,
		.control input:focus ~ .control_indicator {
			background: #cccccc;
		}
		
		.control input:checked ~ .control_indicator {
			background: #98e223;
		}
		.control:hover input:not([disabled]):checked ~ .control_indicator,
		.control input:checked:focus ~ .control_indicator {
			background: #0e6647d;
		}
		.control input:disabled ~ .control_indicator {
			background: #e6e6e6;
			opacity: 0.6;
			pointer-events: none;
		}
		.control_indicator:after {
			box-sizing: unset;
			content: '';
			position: absolute;
			display: none;
		}
		.control input:checked ~ .control_indicator:after {
			display: block;
		}
		.control-checkbox .control_indicator:after {
			left: 8px;
			top: 4px;
			width: 3px;
			height: 8px;
			border: solid #ffffff;
			border-width: 0 2px 2px 0;
			transform: rotate(45deg);
		}
		.control-checkbox input:disabled ~ .control_indicator:after {
			border-color: #7b7b7b;
		}
		.control-checkbox .control_indicator::before {
			content: '';
			display: block;
			position: absolute;
			left: 0;
			top: 0;
			width: 4.5rem;
			height: 4.5rem;
			margin-left: -1.3rem;
			margin-top: -1.3rem;
			background: #2aa1c0;
			border-radius: 3rem;
			opacity: 0.6;
			z-index: 99999;
			transform: scale(0);
		}
		@keyframes s-ripple {
			0% {
				transform: scale(0);
			}
			20% {
				transform: scale(1);
			}
			100% {
				opacity: 0;
				transform: scale(1);
			}
		}
		@keyframes s-ripple-dup {
		   0% {
			   transform: scale(0);
			}
		   30% {
				transform: scale(1);
			}
			60% {
				transform: scale(1);
			}
			100% {
				opacity: 0;
				transform: scale(1);
			}
		}
		.control-checkbox input + .control_indicator::before {
			animation: s-ripple 250ms ease-out;
		}
		.control-checkbox input:checked + .control_indicator::before {
			animation-name: s-ripple-dup;
		}


/* fin checkbox */

.titre_telechargement {
	font-family: 'barlow', sans-serif;
	font-size: 20px;
	font-weight: 500;
	text-align: left;
	color: #0071bc;
	letter-spacing: 0px;
	text-decoration: none;
}


#produit {
	position: fixed;
	width: 100%;
	height: auto;
	min-height: 50px;
	top: 129px;
	background-color: rgba(255,255,255,0.85);
	z-index: 100;
	-webkit-box-shadow: 0px 0px 22px 1px rgba(0,0,0,0.6); 
	box-shadow: 0px 0px 22px 1px rgba(0,0,0,0.6);
}

.padding {
	padding: 15px;
}

.padding_left {
	padding-left: 15px;
	padding-right: 15px;
}

.degrade_violet {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#492d61+0,754ba0+100 */
	background: rgb(73,45,97); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(73,45,97,1) 0%, rgba(117,75,160,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(73,45,97,1) 0%,rgba(117,75,160,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(73,45,97,1) 0%,rgba(117,75,160,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#492d61', endColorstr='#754ba0',GradientType=0 ); /* IE6-9 */
	padding: 20px;
	height: auto;
}

.degrade_rose {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#820d62+0,de1482+100 */
	background: rgb(130,13,98); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(130,13,98,1) 0%, rgba(222,20,130,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(130,13,98,1) 0%,rgba(222,20,130,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(130,13,98,1) 0%,rgba(222,20,130,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#820d62', endColorstr='#de1482',GradientType=0 ); /* IE6-9 */
	padding: 20px;
	height: auto;
}

.degrade_bleu {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#004582+1,0071bc+100 */
	background: rgb(0,69,130); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,69,130,1) 1%, rgba(0,113,188,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,69,130,1) 1%,rgba(0,113,188,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,69,130,1) 1%,rgba(0,113,188,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004582', endColorstr='#0071bc',GradientType=0 ); /* IE6-9 */
	padding: 20px;
	height: auto;
}

.degrade_cian {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#507187+0,7e93a6+100 */
	background: rgb(80,113,135); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(80,113,135,1) 0%, rgba(126,147,166,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(80,113,135,1) 0%,rgba(126,147,166,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(80,113,135,1) 0%,rgba(126,147,166,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#507187', endColorstr='#7e93a6',GradientType=0 ); /* IE6-9 */

	padding: 20px;
	height: auto;
}

.degrade_rouge {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#a81416+1,ed1c24+100 */
	background: rgb(168,20,22); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(168,20,22,1) 1%, rgba(237,28,36,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(168,20,22,1) 1%,rgba(237,28,36,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(168,20,22,1) 1%,rgba(237,28,36,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a81416', endColorstr='#ed1c24',GradientType=0 ); /* IE6-9 */
	padding: 20px;
	height: auto;
}

.degrade_orange {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bc411c+2,f15a24+100 */
	background: rgb(188,65,28); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(188,65,28,1) 2%, rgba(241,90,36,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(188,65,28,1) 2%,rgba(241,90,36,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(188,65,28,1) 2%,rgba(241,90,36,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bc411c', endColorstr='#f15a24',GradientType=0 ); /* IE6-9 */
	padding: 20px;
	height: auto;
}

.degrade_vert {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9bb721+0,d6d625+100 */
	background: rgb(155,183,33); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(155,183,33,1) 0%, rgba(214,214,37,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(155,183,33,1) 0%,rgba(214,214,37,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(155,183,33,1) 0%,rgba(214,214,37,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9bb721', endColorstr='#d6d625',GradientType=0 ); /* IE6-9 */
	padding: 20px;
	height: auto;
}

.attribut {
	font-family: 'barlow', sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-align: left;
	color: #333333;
	text-decoration: none;
}

.titre_attribut {
	font-family: 'saira', sans-serif;
	font-size: 10px;
	font-weight: 600;
	text-align: left;
	letter-spacing: 3px;
	color: #1d1d1b;
	text-decoration: none;
	text-transform: uppercase;
}

.titre_designation {
	font-family: 'saira', sans-serif;
	font-size: 10px;
	font-weight: 600;
	text-align: left;
	letter-spacing: 3px;
	color: rgba(29,29,27,0.6);
	text-decoration: none;
	text-transform: uppercase;
}

.designation {
	font-family: 'barlow', sans-serif;
	font-size: 14px;
	font-weight: 300;
	text-align: left;
	color: #606060;
	text-decoration: none;
}

.designation_bold {
	font-family: 'barlow', sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-align: left;
	color: #606060;
	text-decoration: none;
}

.nom_produit_violet {
	font-family: 'barlow', sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
	color: #754ba0;
	text-decoration: none;
}

.nom_produit_rose {
	font-family: 'barlow', sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
	color: #f9199f;
	text-decoration: none;
}

.nom_produit_rouge {
	font-family: 'barlow', sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
	color: #ed1c24;
	text-decoration: none;
}

.nom_produit_orange {
	font-family: 'barlow', sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
	color: #f15a24;
	text-decoration: none;
}

.nom_produit_bleu {
	font-family: 'barlow', sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
	color: #0071bc;
	text-decoration: none;
}

.nom_produit_cian {
	font-family: 'barlow', sans-serif;
	font-size: 20px;
	font-weight: 400;
	text-align: left;
	color: #15afe1;
	text-decoration: none;
}

.nom_produit_vert {
	font-family: 'barlow', sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
	color: #979706;
	text-decoration: none;
}

.bouton_valider {
	font-size: 12px;
	font-weight: 400;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #fff !important;
	font-family: 'Saira', sans-serif;
	padding: 2px 12px 2px 15px;
	background-color: rgba(0,97,170,1.00);
	border-radius: 10px;
	border: 0px;
	margin-top: 10px;
	cursor: pointer;
}

.valider {
	background-color: #008ddb;
	border-radius: 10px;
	
	font-family: 'saira', sans-serif;
	font-size: 10px;
	font-weight: 400;
	text-align: center;
	color: #fff;
	text-decoration: none;
	letter-spacing: 3px;
	padding: 5px 10px 5px 14px;
}

.background_violet {
	background-color: rgba(117,75,160,0.2);
}

.background_rose {
	background-color: rgba(222,20,130,0.2);
}

.background_rouge {
	background-color: rgba(237,28,36,0.2);
}

.background_orange {
	background-color: rgba(241,90,36,0.2);
}

.background_bleu {
	background-color: rgba(0,113,188,0.2);
}

.background_cian {
	background-color: rgba(80,113,135,0.1);
}

.background_vert {
	background-color: rgba(214,214,37,0.2);
}





.background_produit {
	background-color: white;
	border-radius: 10px;
}

.background_produit_vignette {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0.5+0,0+100 */
	background: -moz-linear-gradient(top,  rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0.2) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,0.2) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
	border-radius: 10px;
}

.fond_bouton_supp_fiche {
	background-color: #f7931e;
	border-radius: 10px;
	
	font-family: 'Saira', sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	line-height: 18px;
	font-weight: 500;
	text-align: center;
	color: #fff !important;
	letter-spacing: 1px;
	cursor: pointer;
}

.legende_blanc {
	font-family: 'saira', sans-serif;
	font-size: 11px;
	font-weight: 400;
	text-align: center;
	color: #fff;
	text-decoration: none;
	letter-spacing: 1px;
}

.legende_blanc a{
	color: #fff;
}

.legende_vert {
	font-family: 'saira', sans-serif;
	font-size: 11px;
	font-weight: 400;
	text-align: center;
	color: #0C1B01;
	text-decoration: none;
	letter-spacing: 1px;
}

.titre_gamme {
	font-family: 'saira', sans-serif;
	font-size: 12px;
	font-weight: 500;
	text-align: left;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 2px;
}