body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
	background-color: #635e54;
}

a:link, a:visited, a:active {
	color:#06f;
	text-decoration:none;
	font-style:normal;
}

a:hover {
	color:#f30;
}

.clearFloat {
	clear:both;
}

.asterisque {
	color:#FF0000;
}

/*##############################################################################
########################## Interface générale ##################################
##############################################################################*/
#fondSite {
	background:url(../images/fond_site.png) repeat-x top;
}

#interface {
	width:1000px;
	margin:auto;
	background:#FFFFFF;
}


/*##############################################################################
################################# Banniere #####################################
##############################################################################*/
#banniere {
	background:url(../images/banniere.png) no-repeat;
	height:152px;
}


/*##############################################################################
################################### Menu #######################################
##############################################################################*/
#menu {
	float:left;
	width:230px;
	height:293px;
	background:url(../images/bordLeftDegradeBleu.png) no-repeat top left;
	padding:3px 3px 0 10px;
}

	a.menuItem {
		display:block;
		height:35px;
		background:url(../images/menuFond-off.png) repeat-x;
		line-height:35px;
		padding-left:25px;
		color:#FFFFFF;
		font-size:14px;
		font-weight:bold;
		margin-bottom:1px;
	}

	a.menuItem:hover {
		background:url(../images/menuFond-on.png) repeat-x;
		font-size:18px;
	}
	
	#menuTel {
		height:39px;
		background:url(../images/menuFondTel.png) repeat-x;
		border:1px solid #bb2d00;
		padding-left:25px;
		line-height:39px;
		color:#FFFFFF;
		font-size:18px;
		font-weight:bold;
	}
	
	.menuPuce {
		margin-right:10px;
		vertical-align:middle;
	}
	
	
/*##############################################################################
################################### Flash ######################################
##############################################################################*/
#flash {
	float:left;
	width:747px;
	height:293px;
	background:url(../images/bordRightDegradeBleu.png) no-repeat top right;
	padding:3px 10px 0 0;
}


/*##############################################################################
################################### Bords ######################################
##############################################################################*/
#bordLeft {
	background:url(../images/bordLeft.png) repeat-y top left;
}

#bordRight {
	background:url(../images/bordRight.png) repeat-y top right;
}

#bordLeftDegradeGris {
	background:url(../images/bordLeftDegradeGris.png) no-repeat top left;
}

#bordRightDegradeGris {
	background:url(../images/bordRightDegradeGris.png) no-repeat top right;
}


/*##############################################################################
################################ Fil d'ariane ##################################
##############################################################################*/
#filAriane {
	padding:10px 30px;
	color:#666;
}

	#filAriane a {
		color:#666;
	}
	
	#filAriane a:hover {
		color:#999;
	}
	
	
/*##############################################################################
################################# Content ######################################
##############################################################################*/
#content {
	float:left;
	width:739px;
	padding:0 20px 0 30px;
}

	.titrePage {
		height:31px;
		margin-bottom:20px;
	}
	
		.titrePageLeft {
			float:left;
			width:620px;
			height:31px;
			overflow:hidden;
			background:url(../images/titreLeft.png) repeat-x;
		}
		
			.titrePageContent {
				background:url(../images/titreFond.png) repeat-x;
				line-height:31px;
				color:#FFFFFF;
				font-size:16px;
				font-weight:bold;
				padding-left:20px;
			}
			
				.titrePuce {
					vertical-align:middle;
					padding-right:20px;
				}
				
		.titrePageRight {
			float:left;
			width:116px;
			height:31px;
			background:url(../images/titreRight.png) no-repeat;
		}
		
	.titreParagraphe {
		background:url(../images/pixelGris.png) repeat-x center left;
		margin-bottom:15px;
	}
		
		.titreParagrapheContent {
			background:#fff;
			padding-right:10px;
			color:#07c;
			font-size:14px;
			font-weight:bold;
		}
		
	.texteParagraphe {
		margin-bottom:20px;
	}

		.photo_gauche{
			float:left;
			margin:0 10px 10px 0;
		}
		
		.photo_droite{
			float:right;
			margin:0 0 10px 10px;
		}
		
		.photo_bas{
			margin:10px 0;
			text-align:center;
		}
		
		.legende {
			text-align:center;
			color:#999999;
			font-style:italic;
		}
	
	.paveActu {
		margin-bottom:30px;
	}
		
		.paveActuContent {
			background:#eee url(../images/actuFond.png) repeat-x top left;
			border:1px solid #999;
			padding:20px;
		}
		
			.paveActuImg {
				float:left;
				margin:0 20px 10px 0;
				border:1px solid #fff;
				padding:5px;
			}
			
			.paveActuTitre {
				color:#07c;
				font-size:14px;
				font-weight:bold;
				margin-bottom:10px;
			}
		
		a.paveActuBtn {
			display:block;
			float:right;
			height:17px;
			font-weight:bold;
			cursor:pointer;
		}
		
			.paveActuBtnLeft {
				display:block;
				float:left;
				width:6px;
				height:17px;
				background:url(../images/actuBtnLeft.png) no-repeat;
			}
	
			.paveActuBtnCenter {
				display:block;
				float:left;
				height:16px;
				line-height:16px;
				padding:0 10px;
				background:#ccc;
				border-bottom:1px solid #999;
			}
			
			.paveActuBtnRight {
				display:block;
				float:left;
				width:6px;
				height:17px;
				background:url(../images/actuBtnRight.png) no-repeat;
			}
	
/*##############################################################################
############################ Colonne de droite #################################
##############################################################################*/
#colRight {
	float:left;
	padding:0px 30px 0 20px;
	width:160px;
	border-left:1px solid #ccc;
}


/*##############################################################################
############################### Menu du bas ####################################
##############################################################################*/
#menuBas {
	text-align:center;
	padding:10px;
}


/*##############################################################################
############################### Pied de page ###################################
##############################################################################*/
#footer {
	margin:0 10px 1px 10px;
	background:#069;
	line-height:35px;
	text-align:center;
	color:#FFFFFF;
	font-weight:bold;
}

	#footer a {
		color:#FFF;
	}
	
	#footer a:hover {
		color:#999;
	}


/*##############################################################################
################################# Signature ####################################
##############################################################################*/
#signatureBordLeft {
	background:#635e54 url(../images/bordLeftBottom.png) no-repeat top left;
	padding-left:10px;
}

#signatureBordRight {
	background:#635e54 url(../images/bordRightBottom.png) no-repeat top right;
	padding-right:10px;
}

#signature {
	background:#635e54 url(../images/bordBottom.png) repeat-x top;
	padding-top:5px;
	text-align:right;
}

	#signature a {
		color:#FFF;
	}

	#signature a:hover {
		color:#999;
	}

/*##############################################################################
############################ Page des actualités ###############################
##############################################################################*/
.actualite {
	margin-bottom:10px;
	padding-bottom:10px;
	border-bottom:1px solid #CCC;
}

	.actualiteImg {
		float:left;
		margin:0 20px 10px 0;
		border:1px solid #fff;
		padding:5px;
	}
	
	.actualiteTitre {
		color:#07c;
		font-size:14px;
		font-weight:bold;
		margin-bottom:10px;
	}


/*##############################################################################
############################ Page des partenaires ##############################
##############################################################################*/
.partenaire {
	margin-bottom:10px;
	padding-bottom:10px;
	border-bottom:1px solid #CCC;
}

	.partenaireLibelle {
		color:#07c;
		font-size:14px;
		font-weight:bold;
		margin-bottom:10px;
	}
	
	a.partenaireLien {
	
	}


/*##############################################################################
########################### Page des réalisations ##############################
##############################################################################*/
a.realisation_item {
	display:block;
	float:left;
	margin:0 25px 25px 0;
	width:164px;
	height:226px;
	cursor:pointer;
	border:1px solid #CCC;
}

a.realisation_item:hover {
	border:1px solid #f2bf12;
}

	.realisation_img {
		display:block;
		height:150px;
		line-height:150px;
		padding:5px;
		text-align:center;
		border-bottom:1px solid #ccc;
	}
	
		.realisation_image {
			vertical-align:middle;
		}
	
	.realisation_nbPhoto {
		display:block;
		background:#CCC;
		text-align:center;
		height:15px;
		line-height:15px;
	}
	
	.realisation_titre {
		display:block;
		height:40px;
		padding:5px;
		text-align:center;
		overflow:hidden;
	}


/*##############################################################################
############################# Page des terrains ################################
##############################################################################*/
a.terrain_item {
	display:block;
	float:left;
	margin:0 25px 25px 0;
	width:164px;
	height:226px;
	cursor:pointer;
	border:1px solid #CCC;
}

a.terrain_item:hover {
	border:1px solid #f2bf12;
}

	.terrain_img {
		display:block;
		height:150px;
		line-height:150px;
		padding:5px;
		text-align:center;
		border-bottom:1px solid #ccc;
	}
	
		.terrain_image {
			vertical-align:middle;
		}
	
	.terrain_nbPhoto {
		display:block;
		background:#CCC;
		text-align:center;
		height:15px;
		line-height:15px;
	}
	
	.terrain_titre {
		display:block;
		height:40px;
		padding:5px;
		text-align:center;
		overflow:hidden;
	}
	
	
/*##############################################################################
############################ Page des programmes ###############################
##############################################################################*/
.programme{
	border:1px dashed #999999;
	padding:10px;
	margin-bottom:20px;
	/*float:left;*/
}

	h3.programme_titre{
		margin:0 0 10px 0;
		color:#F60;
		background:url(../images/folder_home_24.png) no-repeat left -2px;
		height:24px;
		line-height:24px;
		padding-left:35px;
		font-size:14px;
	}

	a.programme_lien {
		float:right;
		border:1px solid #999999;
		line-height:22px;
		height:22px;
		padding:0 10px 0 25px;
		font-weight:bold;
		background:url(../images/puceVerte.gif) no-repeat 5px center;
	}
	
	a.programme_lien:hover{
		background:#ccc url(../images/puceVerte.gif) no-repeat 5px center;
	}

	.programme_illustration {
		float:left;
		border:1px solid #999;
		padding:3px;
		margin:0 15px 0 0;
	}
	
.documentTab {
	border:1px solid #FF6600;
	width:100%;
}

	.documentTab th {
		line-height:20px;
		border-bottom:1px solid #f60;
	}

	.documentTabTr0 {
		background:#ddd;
		line-height:20px;
		border-top:1px solid #999;
	}
	
	.documentTabTr1 {
		background:#eee;
		line-height:20px;
		border-top:1px solid #999;
	}
	
	.documentTabTr0:hover, .documentTabTr1:hover {
		background:#FFFFCC;
	}
	
	a.documentLien {
		display:block;
		padding-left:5px;
	}
	
	.documentLegende {
		font-style:italic;
		color:#999;
		font-size:11px;
	}

/*##############################################################################
############################### Page contact ###################################
##############################################################################*/
.contact_map {
	float:left;
	margin-right:20px;
}

.contact_fieldset {
	padding:10px 50px 20px 50px;
	border:1px solid #FF6600;	
	margin:auto;
	width:500px;
}

.contact_legend {
	color:#FF6600;
	font-weight:bold;
	padding:0px 10px;
	margin-left:-30px;
}

.contact_form label {
	display:inline;
	float:left;
	font-weight:bold;
	width:90px;
}

.contact_form input, textarea{
	background-color:#DDDDDD;
	border:1px solid #999999;
	width:400px;
}

input.contact_form_submit {
	display:block;
	margin:20px 100px;
	width:500px;
	color:#FF6600;
	font-weight:bold;
}

input.contact_form_submit:hover {
	background-color:#CCCCCC;
}

.contact_confirm {
	color:#FF6600;
	text-align:center;
	padding:10px;
}

.contact_form_msg {
	font-size:11px;
	color:#666666;
	font-style:italic;
	margin-left:100px;
}

/*##############################################################################
################### Popup d'affichage du détail d'un produit ###################
##############################################################################*/
#pop_article {
    position:fixed !important;
    top:50% !important;

    /* Style spécial IE (qui ne comprend pas les lignes où !important est indiqué) */
    position:absolute;
    top:expression(documentElement.scrollTop + 300 + "px");

    left:50%;
    background:#ffffff;
    width:600px;
    height:600px;
    margin:-300px 0px 0px -300px;
    z-index: 500;
    color:#000000;
    display:none;
    border: 4px solid #ff6600;
    text-align:left;
}

#pop_masque {
    position:absolute;
    display:none;
    z-index:100;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    min-height:100%;
    background-color:#000;
    filter:alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6;
}

#pop_wait {
    width:48px;
    height:48px;
    margin:276px auto 0px auto;
}

#pop_titre {
    color:#009900;
    font-weight:bold;
    font-size:18px;
    padding:5px;
    background:#CCCCCC;
    border-bottom:1px solid #FF6600;
    height:20px;
}

#pop_fermer {
    float:right;
}

#pop_body {
    padding:10px;
    height:549px;
    width:580px;
    overflow-y:scroll;
    overflow-x:hidden;
}

#cadre_img_grande {
	height:430px;
	line-height:430px;
	text-align:center;
}

	#img_grande {
		vertical-align:middle;
	}
	
#liste_img_petite {
	height:97px;
	width:542px;
	overflow-x:scroll;
	overflow-y:hidden;
	border:1px solid #ddd;
	padding:10px;
	white-space: nowrap;
}

	.img_petite {
		vertical-align:middle;
		margin-right:10px;
	}
	
	
/*##############################################################################
################## Encart des coordonnées sur les pages du site#################
##############################################################################*/
.encartCoordonnees {
	background:#eee url(../images/infoMan.png) no-repeat 10px 10px;
	border:2px dashed #CC3300;
	padding:10px 10px 10px 100px;
	margin:15px 0;
}

	.encartCoordonneesTitre {
		color:#07c;
		font-size:14px;
		font-weight:bold;
		margin-bottom:10px;
	}