/* Separators
-------------------------------------------------------------- */

.horizontalSeparator {
	display: block;

	width: 197px;
	height: 10px;
	background-color: #fcfcfc;

	*overflow: hidden; /* BUG IE 6 */
}

	.horizontalSeparatorWshadow {
		display: block;
		width: 1px;
		height: 8px;

		*overflow: hidden; /* BUG IE 6 */
	}

	.horizontalSeparatorPage {
		display: block;
		width: 197px;
		height: 10px;
		background-color: #fcfcfc;

		*overflow: hidden; /* BUG IE 6 */
	}

.verticalSeparator {
	display: block;
	width: 10px;
	height: 1px;
	float: left;

	*overflow: hidden; /* BUG IE 6 */
}

/* Coordonnées
---------------------------------------------------------------- */

#coordonnees {
	display: block;
	width: 176px;
	height: 165px;

	padding: 10px 10px 0px 10px;
	background: url('images/customer/bg_coordonnees.jpg') 0px 0px no-repeat;
	text-decoration: none;
}

	#coordonnees:hover {
		background: url('images/customer/bg_coordonnees.jpg') bottom no-repeat;
	}

	#coordonnees:hover .bg {
		background-color: #0070bc;
	}

	#coordonnees .bg {
		display: block;
		padding: 7px 8px;
		background-color: #24a17e;
		color: white;
		text-decoration: none;
	}

	#coordonnees h2 {
		margin: 0px 0px 0px 0px;
		font-size: 16px;
		padding: 0;
		color: #333333;
	}



/* Adresse
---------------------------------------------------------------- */

#adresse {
	display: block;
	width: 195px;
	margin-left: 1px;

	color: #676767;
	background: url('images/customer/bg_adresse.jpg') bottom repeat-x;
}

	#adresse .title {
		color: #484848;
		display: inline;
		font-weight: bold;
	}

	#adresse .texte {
		padding: 10px;
	}

	#adresse .separator {
		display: block;
		width: 195px;
		height: 10px;

		background: url('images/customer/bg_adresse_separator.jpg') 0px 0px no-repeat;
	}	

	#adresse .separator2 {
		display: block;
		width: 195px;
		height: 10px;

		background: url('images/customer/bg_adresse_separator2.jpg') 0px 0px no-repeat;
	}	

/* Onglets colonne de gauche
---------------------------------------------------------------- */

#ongletServices {
	display: block;
	width: 196px;
	height: 122px;
	background: url('images/customer/bg_ongletServices.jpg') 0px 0px no-repeat;
}

	#ongletServices:hover {
		background-position: bottom;
	}


#ongletContact {
	display: block;
	width: 196px;
	height: 122px;
	background: url('images/customer/bg_ongletContact.jpg') 0px 0px no-repeat;
}

	#ongletContact:hover {
		background-position: bottom;
	}


/* Encart de bienvenue
---------------------------------------------------------------- */

#bienvenue {
	display: block;
	width: 350px;
	height: 163px;
	background: url('images/customer/bg_bienvenue.jpg') 0px 0px no-repeat;

	padding: 12px 16px 0px 16px;
	line-height: 14px;

	color: #e6f5ff;
}

	#bienvenue_btn {
		display: block;
		width: 50px;
		height: 20px;
		padding: 6px 0px 0px 8px;

		background: url('images/customer/bg_bienvenue_btn.jpg') 0px 0px no-repeat;

		position: relative;
		left: 302px;
		top: 130px;

		margin-bottom: -26px;
		color: #ededed;
		text-transform: uppercase;
		font-size: 11px;
	}

		#bienvenue_btn:hover {
			background-position: bottom;
			text-decoration: none;
		}


#bienvenue h1{
	display: block;
	margin: 0px 0px 12px 0px;
	padding: 0;

	font-size: 15px;
	font-weight: bold;
	color: white;

	text-transform: uppercase;
	letter-spacing: -1px;
}

#bienvenue hr {
	height: 2px;
	margin: 10px 0px;
	border-bottom: 1px solid #64b4eb;
	background-color: #217cba;

	color: #217cba;
}

/* pub home
---------------------------------------------------------------- */

#pubHome {
	display: block;
	width: 186px;
	height: 254px;
	float: left;
}

#pubHome:hover {
	filter : alpha(opacity=70);
    -moz-opacity : 0.7;
    opacity : 0.7; 
}

	#pubHome ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

/*----------------------------------*/

#sliderHome,
#sliderWide {
	height: 175px;
	overflow: hidden;
}

#sliderHome ul, #sliderHome li,
#sliderWide ul, #sliderWide li,
#sliderServices ul, #sliderServices li {
	margin: 0;
	padding: 0;
	list-style: none;
}

#sliderHome li { width: 382px; height: 175px; }
#sliderWide li { width: 566px; height: 175px; }
#sliderServices li { width: 186px; height: 58px; }

#sliderServicesContainer {
	width: 186px;
	height: 254px;
	float: left;
	background: url('images/customer/bg_ongletServicesDeroulant.jpg') 0 0 no-repeat;
	overflow: hidden;
}

	#sliderServices {
		width: 186px;
	}
	
	#sliderServices ul {
	}

	#sliderServices h1 {
		display: block;
		width: 161px;
		height: 26px;
		margin: 0px;
		padding: 12px 0px 0px 25px;
		background: url('images/customer/bg_ongletServicesDeroulant_h1.jpg') 0 0 no-repeat;
		
		position: relative;
		z-index: 10;

		color: #676767;
		font-size: 14px;
		font-weight: bold;
		font-family: Helvetica, Arial, sans-serif;
		text-transform: uppercase;
	}

	#sliderServices h2 {
		margin: 0px;
		padding: 0px;

		font-size: 11px;
		text-transform: uppercase;
		color: #19a67c;
		font-weight: bold;
		letter-spacing: 0;
	}

	#sliderServices a {
		display: block;
		width: 164px;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #c3c3c3;

		margin: 0 1px;
		padding: 11px 10px;

		color: #767676;
		line-height: 14px;
	}

	#sliderServices a:hover {
		background: url('images/customer/bg_ongletServicesDeroulant_a_hover.jpg') 0 0 no-repeat;

		color: #fff;
		text-decoration: none;
	}

	#sliderServices a:hover h2 { color: #fff; }

	/*#sliderServices .separator {
		display: block;
		width: 186px;
		height: 1px;

		background-color: #c3c3c3;
		border-bottom: 1px solid white;
	}

	/*#sliderVerticalprev,
	#sliderVerticalnext {
		display: block;
		width: 24px;
		height: 22px;

		z-index: 15;
	}

	#sliderVerticalprev a,
	#sliderVerticalnext a {
		display: block;
		width: 24px;
		height: 22px;

		font-size: 0px;
		color: transparent;
	}

	#sliderVerticalprev {
		position: absolute;
		padding: 0;
		margin-top: -50px;
		margin-left: 125px;
		background: url('images/customer/bg_ongletServicesDeroulant_prev.jpg') 0px 0px no-repeat;
	}

	#sliderVerticalnext {
		position: absolute;
		padding: 0;
		margin-top: -50px;
		margin-left: 155px;
		background: url('images/customer/bg_ongletServicesDeroulant_next.jpg') 0px 0px no-repeat;
	}

	#sliderVerticalprev:hover {
		background: url('images/customer/bg_ongletServicesDeroulant_prev.jpg') bottom no-repeat;
	}

	#sliderVerticalnext:hover {
		background: url('images/customer/bg_ongletServicesDeroulant_next.jpg') bottom no-repeat;
	}	

/* Produits
---------------------------------------------------------------- */

#categories_produits {}

	#categories_produits .produit {
		display: block;
		width: 182px;
		height: 249px;

		float: left;
		background: url('images/produits/bg_vignette_produit_grande.jpg') 0px 0px no-repeat;	
	}

		#categories_produits .produit .vignette {
			display: block;
			width: 135px;
			height: 61px;

			margin-top: 55px;
			margin-left: 23px;
		}

			#categories_produits .produit:hover .vignette{
				background-position: bottom;
			}

		#categories_produits .produit .materiaux_de_construction {
			background: url('images/produits/bg_vignette_produit_materiaux_de_construction.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .beton {
			background: url('images/produits/bg_vignette_produit_beton.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .materiaux_de_toiture {
			background: url('images/produits/bg_vignette_produit_materiaux_de_toiture.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .piscine_et_spas {
			background: url('images/produits/bg_vignette_produit_piscine_et_spas.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .carrelages {
			background: url('images/produits/bg_vignette_produit_carrelages.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .menuiserie {
			background: url('images/produits/bg_vignette_produit_menuiserie.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .outillages_et_materiels {
			background: url('images/produits/bg_vignette_produit_outillages_et_materiels.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .securite_et_protection {
			background: url('images/produits/bg_vignette_produit_securite_et_protection.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .amenagement_des_abords {
			background: url('images/produits/bg_vignette_produit_amenagement_des_abords.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .materiaux_recycles {
			background: url('images/produits/bg_vignette_produit_materiaux_recycles.jpg') 0px 0px no-repeat;
		}

		#categories_produits .produit .divers {
			background: url('images/produits/bg_vignette_produit_divers.jpg') 0px 0px no-repeat;
		}
	
		#categories_produits .produit .titre {
			display: block;
			width: 163px;
			height: 30px;

			margin-top: 65px;
			margin-left: 10px;

			font-size: 14px;
			font-weight: bold;
			color: #323232;
			font-family: Helvetica, sans-serif;
			letter-spacing: -1px;
			text-align: center;
			line-height: 15px;
		}
	
	#categories_produits .produit .one-line {
		padding-top: 8px;
		height: 22px;
	}

	#categories_produits .produit .two-lines {}

	#categories_produits .produit .descriptif {
			display: block;
			width: 163px;
			height: 35px;

			margin: 5px 0px 0px 10px;

			font-size: 9px;
			color: #1ba77e;
			font-family: Helvetica, sans-serif;
			text-align: center;
			line-height: 12px;
		}

	#categories_produits .produit:hover, 
	#categories_produits .produit:active,
	#categories_produits .produit:focus {
		width: 178px;
		height: 245px;

		text-decoration: none;
		border: 2px solid #0e68ac;

		background: url('images/produits/bg_vignette_produit_grande.jpg') -2px -2px no-repeat;
	}

	#categories_produits .produit:hover .vignette, 
	#categories_produits .produit:active .vignette,
	#categories_produits .produit:focus .vignette {
			display: block;
			width: 135px;
			height: 61px;

			margin-top: 53px;
			margin-left: 21px;
	}

	#categories_produits .produit:hover .titre, 
	#categories_produits .produit:active .titre, 
	#categories_produits .produit:focus .titre {
		color: #0e68ac;
		margin-left: 8px;
	}

	#categories_produits .produit:hover .descriptif, 
	#categories_produits .produit:active .descriptif,
	#categories_produits .produit:focus .descriptif {
		color: #0e68ac;
		margin-left: 8px;
	}

	#categories_produits .separator {
		display: block;
		width: 10px;
		height: 1px;
		float: left;
	}

/* Services
---------------------------------------------------------------- */

#categories_services {}

	#categories_services .service {
		display: block;
		width: 182px;
		height: 249px;

		float: left;
		background: url('images/services/bg_vignette_service_grande.jpg') 0px 0px no-repeat;	
	}

		#categories_services .service .vignette {
			display: block;
			width: 135px;
			height: 61px;

			margin-top: 55px;
			margin-left: 23px;
		}

			#categories_services .service:hover .vignette{
				background-position: top;
			}

		#categories_services .service .containers_et_grappins {
			background: url('images/services/bg_vignette_service_containers_et_grappins.jpg') bottom no-repeat;
		}

		#categories_services .service .terrassements_et_demolitions {
			background: url('images/services/bg_vignette_service_terrassements_et_demolitions.jpg') bottom no-repeat;
		}

		#categories_services .service .location_de_materiels {
			background: url('images/services/bg_vignette_service_location_de_materiels.jpg') bottom no-repeat;
		}

		#categories_services .service .transports {
			background: url('images/services/bg_vignette_service_transports.jpg') bottom no-repeat;
		}

		#categories_services .service .centre_de_tri_et_concassage {
			background: url('images/services/bg_vignette_service_centre_de_tri_et_concassage.jpg') bottom no-repeat;
		}

		#categories_services .service .titre {
			display: block;
			width: 163px;
			height: 30px;

			margin-top: 65px;
			margin-left: 10px;

			font-size: 14px;
			font-weight: bold;
			color: #323232;
			font-family: Helvetica, sans-serif;
			letter-spacing: -1px;
			text-align: center;
			line-height: 15px;
		}
	
	#categories_services .service .one-line {
		padding-top: 8px;
		height: 22px;
	}

	#categories_services .service .two-lines {}

	#categories_services .service .descriptif {
			display: block;
			width: 163px;
			height: 35px;

			margin-left: 10px;
		
			font-size: 9px;
			color: #0e68ac;
			font-family: Helvetica, sans-serif;
			text-align: center;
			line-height: 12px;
		}

	#categories_services .service:hover, 
	#categories_services .service:active,
	#categories_services .service:focus {
		width: 178px;
		height: 245px;

		text-decoration: none;
		border: 2px solid #1ba77e;

		background: url('images/services/bg_vignette_service_grande.jpg') -2px -2px no-repeat;
	}

	#categories_services .service:hover .vignette, 
	#categories_services .service:active .vignette,
	#categories_services .service:focus .vignette {
			display: block;
			width: 135px;
			height: 61px;

			margin-top: 53px;
			margin-left: 21px;
	}

	#categories_services .service:hover .titre, 
	#categories_services .service:active .titre, 
	#categories_services .service:focus .titre {
		color: #1ba77e;
		margin-left: 8px;
	}

	#categories_services .service:hover .descriptif, 
	#categories_services .service:active .descriptif,
	#categories_services .service:focus .descriptif {
		color: #1ba77e;
		margin-left: 8px;
	}

	#categories_services .separator {
		display: block;
		width: 10px;
		height: 1px;
		float: left;
	}