@charset "utf-8";
/* CSS Document */

/*
largeur site 860px
Hauteur bandeau 180px
Largeur logo 180px
Hauteur Titre rubrique 25px
Contenu
	-gauche largeur 150px
	- droite largeur 750px
Pied hauteur de ligne 34px
*/

body {
	text-align: center;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	background: url(../images/degrad_fond.gif) repeat-x top left ;
}

a {
	color: #000;
}

#global {
	width: 960px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	text-align: left;
}

#bandeau {
	background-image: url(../fetesescales/images/bandeau_fetesescales.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	height: 156px;
}
/* texte ville de vénissieux pour lien retour accueil sur le bandeau

On donne la propriété block à la balise lien afin de donner une hauteur et une largeur à la zone de clic.

la propriété text-indent à -5000px chasse le texte du lien en dehors de la zone visible tout en permettant d'avoir du texte pour le référencement et les interpréteurs.

*/
#bandeau a {
	display: block;
	height: 156px;
	width: 960px;
	text-indent: -5000px;
	margin: 0;
	padding: 0;
}

/* zone de titre avec tjs un titre différent */
#titre_rubrique {
	background-color: #ff6633;
	text-align: center;
	line-height:20px;
	width:900px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

#titre_rubrique #video {
	position:absolute; 
	top:160px;
	margin-left:764px;
	background-image:url(../images/icon_video.gif);
	background-repeat:no-repeat;
	width:39px;
	height:24px;
}
#titre_rubrique #video a {
	display: block;
	margin: 0px;
	padding: 0px;
	text-indent: -5000px;
	width:39px;
	height:24px;}
	
#titre_rubrique #brochure {
	position:absolute; 
	top:160px;
	margin-left:814px;
	background-image:url(../images/icon_brochure.gif);
	background-repeat:no-repeat;
	width:39x;
	height:24px;
}
#titre_rubrique #brochure a {
	display: block;
	margin: 0px;
	padding: 0px;
	text-indent: -5000px;
	width:39px;
	height:24px;
}
#titre_rubrique #contact {
	position:absolute; 
	top:160px;
	margin-left:860px;
	background-image:url(../images/icon_mail.gif);
	background-repeat:no-repeat;
	width:39px;
	height:24px;
}
#titre_rubrique #contact a {
	display: block;
	margin: 0px;
	padding: 0px;
	text-indent: -5000px;
	width:39px;
	height:24px;
}
/* On utilise la balise H1 pour avoir un titre correct  */
#titre_rubrique h1 {
	margin: 0px;
	padding: 5px;
	font-size: 14px;
	font-weight: bold;
	color: #FFF;
	text-transform: none;
}

/* zone de contenu situé à gauche qui contient le menu 
Pour chasser la zone de contenu droite on lui a mis (à la gauche!)un float left et une largeur de 150px 
L'image de background est en fait dans le contenu gauche et droite pour palier à une différence de longueur entre les deux éléments 
*/
#contenu {
	width:900px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background:url(../images/degrad_contenu.gif) repeat-Y right;
	background-color:#FFF;
}


#contenu #gauche {
	float: left;
	width: 150px;
	background-image: url(../images/degrad_menu.gif);
	background-repeat: repeat-y;
	background-position: left;
}

#gauche hr
{
	width:125px;
	height: 1px;
	color: #FFF;
	background-color:#FFF;
	border:none;
}

/* Zone de contenu de droite qui contient le texte.
Il a un padding left de 150px pour décaler à droite le contenu texte de la zone
L'image de background est en fait dans le contenu gauche et droite pour palier à une différence de longueur entre les deux éléments 
*/

#contenu #fil {
	margin:0;
	padding: 10px;
	margin-left:150px;
	padding-top: 15px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:10px;
	color:#C42009;
	text-align:right;
	line-height:25px;
}

#contenu #fil p {
	margin: -10px 0;
	padding:0;
}

#contenu #fil a {
	color:#C42009;
	text-decoration:none;
}

#contenu #fil a:hover {
	color:#000000;
	text-decoration:none;
}

#contenu #droite {
	padding : 5px 0 10px 155px;
	background-image: url(../images/degrad_menu.gif);
	background-repeat: repeat-y;
	background-position: left;
	font-family: Verdana, Geneva, sans-serif;
}

/* pour que le paragraphe et donc le texte ne soit pas coller au menu */

#contenu #droite p {
	margin: 0 10px;
	padding: 0 10px 3px 0;
}

#pied {
	width:900px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	clear: both;
	background : url(../images/fond_pied.jpg) no-repeat center center;
	line-height: 34px;
	color: #cc6600;
	text-align: center;
	font-size: 11px;
}

#pied a {
	color: #cc6600;
}

.mailto {
	font-size: 11px;
	color: #620000;
}
.maj_article {
	font-size: 9px;
	color:#666;
}
.info_pdf {
	font-size: 10px;
}

#diaporama a {
	color: #999;
}