* {
	margin: 0;
	padding: 0px;
	font-family: arial, sans-serif;
	margin-top: 0px;
	margin-bottom: 0%;
}
/* PAGE CONTENU PRINCIPAL*/
.main {
    font-size: 0.8em;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	padding: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    color: #000000;
    text-align: center;
    text-decoration: none;
}

/* pour aligner les boutons facebook */
#center_fb {
text-align:center;
}
/*LES LIENS*/
a{
	color: #CF6;
	text-decoration: underline;
	font-weight: bold;
} 

a:hover, a:focus,a:active{
	text-decoration:none;
		
}
	
      /* premier exemple */
	.nav {
	padding: 0;
	margin: 1.2em 0;
	text-decoration: none;
		
    }
	.nav li {
		display: inline;
		list-style: none; /* nécessaire pour IE7 */ 
	}
	.nav a {
	display: inline-block;
	margin: 0 0;
	text-decoration: none;
    }
	#ex2 .nav {
	border: 1px solid #333;
	border-top-color: #729D0F;
	background-color: #729D0F;
	background: -moz-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
	background: -webkit-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
	background: -ms-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
	background: -o-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
	background: linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
	text-align: left;
	height: 36px;
	-webkit-box-shadow: 0 1px 3px #999;
	-moz-box-shadow: 0 1px 3px #999;
	box-shadow: 0 1px 3px #999;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
    }
	#ex2 .nav a {
	height: 36px;
	margin:0;
	padding: 0 35px;
	line-height: 36px;
	border-left: 1px solid #555;
	border-right: 1px solid #888;
	text-decoration: none;
	color: #000;

	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 1em;
    }
	#ex2 .nav :first-child a {
		border-left: 0;
    }
    #ex2 .nav :last-child a {
		border-right: 0;
    }
	#ex2 .nav a:hover,
	#ex2 .nav a:focus {
		background-color: #729D0F; /*COULEUR DU SURVOL*/
		background: -moz-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
		background: -webkit-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
		background: -ms-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
		background: -o-linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
		background: linear-gradient(bottom , #729D0F 0pt, #FFC 50%, #FFC 51%, #729D0F 100%) repeat scroll 0 0 transparent;
    }
/* IMAGE DE FOND :----------------------------------------------------------------------------------------- */ 
body {
    background-image: url();
    background-repeat : no-repeat;
    background-size: contain;
    background-attachment: fixed;
    font-size: 1em;
    top: auto;
    bottom: auto;
    right: auto;
    left: auto;
    background-position: 5% 5%;
    width: auto;
}
/* LE CADRE DE BANDEAU :----------------------------------------------------------------------------------------- */ 
.header1 {
	height: 190px;
	padding-bottom: 20px;
	margin-left: 1.5%;
	margin-right: 1.5%;
}
/* LE BANDEAU FIXE ----------------------- */ 
#bandeaufixe {
	position: relative;
	width: 950px;
	height: 190px;
	padding: 10px;
	margin: 0 auto 2em;
	border: 1px solid #ddd;
	background: #FFF;
	/* CSS3 effects */  
    background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	border-radius: 2px 2px 2px 2px;
	box-shadow: 0 0 3px rgba(0,0,0, 0.2);
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	/* pour obtenir l'effet ombré ces trois balise*/	
	box-shadow: 3px 3px 6px #666;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow : 3px 3px 6px #666;
}  

/* gestion des dimensions et débordement du conteneur */  
#bandeaufixe .container {  
    position:relative;  
      height: 190px; 
    overflow: hidden;  
}  

/* styles de nos légendes */  
#bandeaufixe figcaption {  
    position:absolute;  
    left:0; right:0; bottom: 12px;  
    padding: 5px;  
    margin:0;  
    border-top: 1px solid rgb(225,225,225);  
    text-align:center; 
	font-size: 2em; 
    letter-spacing: 0.1em;  
    word-spacing: 0.1em;  
    font-family: Georgia, Times, serif;  
    background: #fff;  
    background: rgba(255,255,255,0.7);  
    color: #555;  
    text-shadow: -1px -1px 0 rgba(255,255,255,0.3);  
}  

/* FIN DU BANDEAU FIXE*/
/* LE SLIDE ----------------------------------------------------------------------------------------------------- */ 
#slideshow {
	position: relative;
	width: 950px;
	height: 190px;
	padding: 10px;
	margin: 0 auto 2em;
	border: 1px solid #ddd;
	background: #FFF;
	/* CSS3 effects */  
    background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	border-radius: 2px 2px 2px 2px;
	box-shadow: 0 0 3px rgba(0,0,0, 0.2);
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	/* pour obtenir l'effet ombré ces trois balise*/	
	box-shadow: 3px 3px 6px #666;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow : 3px 3px 6px #666;
}  
#slideshow:before,  
#slideshow:after {  
    position: absolute;  
    bottom:16px;  
    z-index: -10;  
    width: 50%;  
    height: 20px;  
    content: " ";  
    background: rgba(0,0,0,0.1);  
    border-radius: 50%;  
    box-shadow: 0 0 3px rgba(0,0,0, 0.4), 0 20px 10px rgba(0,0,0, 0.7);  
}  
#slideshow:before {  
    left:0;  
    transform: rotate(-4deg);  
}  
#slideshow:after {  
    right:0;  
    transform: rotate(4deg);  
}  
/* gestion des dimensions et débordement du conteneur */  
#slideshow .container {  
    position:relative;  
      height: 190px; 
    overflow: hidden;  
}  
 /* 
   le conteneur des slides 
   en largeur il fait 100% x le nombre de slides 
*/  
#slideshow .slider {  
    position: absolute;  
    left:0; top:0;  
    width: 400%;  
  height: 190px;
}  
/* annulation des marges sur figure */  
#slideshow figure {  
    position:relative;  
    display:inline-block;  
    padding:0; margin:0;  
}  
/* petit effet de vignette sur les images */  
#slideshow figure:after {  
    position: absolute;  
    display:block;  
    content: " ";  
    top:0; left:0;  
    width: 100%; height: 100%;  
    box-shadow: 0 0 65px rgba(0,0,0, 0.5) inset;  
}  
/* styles de nos légendes */  
#slideshow figcaption {  
    position:absolute;  
    left:0; right:0; bottom: 12px;  
    padding: 5px;  
    margin:0;  
    border-top: 1px solid rgb(225,225,225);  
    text-align:center; 
	font-size: 2em; 
    letter-spacing: 0.1em;  
    word-spacing: 0.1em;  
    font-family: Georgia, Times, serif;  
    background: #fff;  
    background: rgba(255,255,255,0.7);  
    color: #555;  
    text-shadow: -1px -1px 0 rgba(255,255,255,0.3);  
}  
/* fonction d'animation, n'oubliez pas de prefixer ! */  
@keyframes slider {  
    0%, 20%, 100%   { left: 0 }  
    25%, 45%        { left: -100% }  
    50%, 70%        { left: -200% }  
    75%, 95%        { left: -300% }  
}  
@-webkit-keyframes slider {  
    0%, 20%, 100%   { left: 0 }  
    25%, 45%        { left: -100% }  
    50%, 70%        { left: -200% }  
    75%, 95%        { left: -300% }  
} 
@-moz-keyframes slider {  
    0%, 20%, 100%   { left: 0 }  
    25%, 45%        { left: -100% }  
    50%, 70%        { left: -200% }  
    75%, 95%        { left: -300% }  
} 
@-o-keyframes slider {  
    0%, 20%, 100%   { left: 0 }  
    25%, 45%        { left: -100% }  
    50%, 70%        { left: -200% }  
    75%, 95%        { left: -300% }  
}
/* complétez le sélecteur : */  
#slideshow .slider {  
    /* ... avec la propriété animation */  
    animation: slider 32s infinite; 
	-moz-animation: slider 32s infinite; 
	-webkit-animation: slider 32s infinite;
	-o-animation: slider 32s infinite;
}  
/* FIN DU SLIDE*/

/* affiche les photos en vignettes, pour imaj modification */
.vignette {
	width:100px;
	 
/* affiche les photos en vignettes, pour les actualites */
}
.vignetteactu img{
    padding:0px;
	width:60px;
	height:60px;
	
	}
	
.vignetteactu {
   text-align:left;
	
	}	
/* affiche les photos en vignettes, pour les rubriques */
.vignetterubrique {
		 width: 100%;
		 }
/* affiche le logo et le titre du bandeau */
h1 {
	font-size: 2.7em;
	font-weight: normal;
	/* [disabled]padding-left: 1em; */
	color:#FFF;
	text-align:center;
	line-height: 1em;
   }
h2 {
  font-size: 1.8em;
  font-weight: normal;
  color:#F00;
}
h3 {
	font-size: 1.2em;
	font-weight: normal;
	text-decoration: underline;  
}
/* format du titre des Edito*/
h4 {
	width: auto;
	font-size: 1.4em;
	background-color:#729D0F;
	margin-top: 5px;
	margin-left: 5px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow: 3px 3px 6px #666;
	box-shadow: 3px 3px 6px #666;
	color: #FFF;
	}

/*FORMAT DES TITRES DES MENUS*/
h10 {
	font-size: 1em;
	font-weight: normal;
	font-style:italic;
	font-weight:bold;
	}
p, li {
	font-size: 1em;
}

h1, h2{
	margin: 0.5em 0;
	margin-right: 0;
	margin-bottom: 0.5em;
	margin-left: 0;
}

/* LAREUR DES BOITES DANS LA BOITE DE GAUCHE */
.nav {
  list-style: none;
	padding: 4px;
}
.TextBold10 {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
}

/* LA BARRE DE MENU */
.barremenu {
	
	margin-left: 1.5%;
	margin-right: 1.5%;
	
	
}


/* LE BAS DE PAGE */
.footer {
	font-size: 0.8em;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"
	background-color: none;
	padding: 1px 10px;
	margin-left: 1.5%;
	margin-right: 1.5%;
	margin-top: 1em;
	padding-top: 1em;
	padding-bottom: 1em;
	color: #000000;
	text-align: center;
	text-decoration: none;
}

/* LE CONTENEUR ARRONDI AVEC EFFET OMBRE*/
.wrapper {
	width: 94%;
	text-align: left;
	
	min-width: 62em;
	background-color: rgba(204,204,204,0.6);/* transparence du fond, psp pour trouver les codes couleurs rvb*/
	margin-top: 0.5%;
	margin-bottom: 1%;
	padding-top: 1.5%;
	padding-bottom: 1.5%;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	/* pour obtenir l'effet ombré ces trois balise*/	
	box-shadow: 3px 3px 6px #666;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow : 3px 3px 6px #666;
	margin-right: auto;
	margin-left: auto;
	}

/* CONTENU total du milieu */
.content {
	overflow: hidden;
}

ul a:hover,
ul a:focus {
	color: #000;
}
.content .primary a{
	color:#FFFFFF;
	
}


/* BOITE DE DROITE AVEC LES RUBRIQUES*/
.content .primary {
	font-size: 1em;
	width: 71%;
	float: right;
	background-color: #FFF;
	padding-right: 2.18%;
	float: right;
	margin-top: 0.5em;
	margin-bottom: 1.5em;
	margin-right: 1.5%;
	padding-top: 1em;
	padding-bottom: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	/* pour obtenir l'effet ombré ces trois balise*/	
	box-shadow: 3px 3px 6px #666;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow : 3px 3px 6px #666;
	width: 75%;

}
/* BOITE DE GAUCHE ARRONDIE AVEC UNE OMBRE SANS IMAGE*/
.content .secondary {
	font-size: 0.8em;
	width: 200px;
	float: left;
	background-color: #729D0F;
	color: #000;
	margin-top: 0.5em;
	margin-left: 1.5%;
	margin-bottom: 1.5em;
	padding-top: 0em;
	padding-bottom: 1em;












	padding-left: 20px
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	/* pour obtenir l'effet ombré ces trois balise*/	
	box-shadow: 3px 3px 6px #666;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow : 3px 3px 6px #666;
	text-align: center;
    } 
	
	/* couleur des liens dans les actus*/
.content .secondary a{
	color:#000;
	text-decoration:underline;
}
.content .secondary a:hover, focus,active{
	color:#FFF;
	text-decoration:none;
	background-color:#729D0F;

		
}


/*LE TABLEAU----------------------------------------------------*/
table {
	border-collapse: collapse;
	width: 95%;
	border: 0px solid #666;
}

caption {
  font-size: 1.4em;
	font-weight: bold;
	margin: 1em 0;
}

col {
  border-right: 1px solid #ccc;
}

col#albumCol {
  border: none;
}

thead {
  background: #ccc url(images/bar.gif) repeat-x left center;
	border-top: 1px solid #a5a5a5;
	border-bottom: 1px solid #a5a5a5;
}

th {
  font-weight: normal;
	text-align: left;
	 font-size: 1.4em;
}

#numero {
  text-indent: -1000em;
}

th, td {
  padding: 0.1em 1em;
 
}

.odd {
  background-color:#edf5ff;
   font-size: 1.4em;
}
.odd2 {
  background-color:#fff;
   font-size: 1.4em;  
}
.odd3 {
   background-color:#edf5ff;
   font-size: 1em; 
}
.odd4 {
  background-color:#fff;
   font-size: 1em; 
}

/* pour que la cellule de tableau devienne bleu au passage de la souris
tr:hover {
  background-color:#3d80df;
	color: #fff;
}
*/
thead tr:hover {
  background-color: transparent;
	color: inherit;
}
.odd {  background-color:#edf5ff; 
}
#numero {  text-indent: -1000em;
}
col#albumCol {  border: none;
}

/*FORMULAIRE*/
form {
	font-size: 1em;
	width: 100%;
}
/*FORMULAIRE DU CONTACT*/	
#lecontact{
color:black;
margin:0 auto;
padding:0;
width:80%; /***Largeur du formulaire***/
}
/* fieldset interieur de la colonne de gauche */
/* --------------------------------------------- */
fieldset {
	margin: 1em 0;
	padding: 0.5em;
	border : 1px solid #ccc;
	background-color:#FFC;/*  couleur à l'intérieur de la boite de gauche*/
}

legend {
	font-weight: bold;
	color: #FFF;
	margin: 0 1em;
	text-align: center;
}
legend .required {
	font-size: 0.75em;
	color:#760000;
}

form div {
	padding: 0.4em 0;
}

/* style for  labels */
label {
	display: block;
}
/* style for required labels */
label .required {
	font-size: 0.75em;
	color:#760000;
}
input {
	width: 70%;
}
/*pour mettre la case à cocher à gauche*/
.gauche {
	text-align: left;
	  width: 50px;
	 
 }

textarea {
	width: 90%;
	height: 10em;
}

input.radio, input.submit {
  width: auto;
}

/* style form elements on focus */
input[type="text"]:focus, textarea:focus {
	background: #ffc;
}
/*le bouton du moteur de recherche*/
/*-----------------------------------*/
.button{
	color:#fff;
	background-color: #729D0F;
	text-decoration:none;
	font-size:0.7em;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	vertical-align:middle;
	float:right;
	padding-top: 2px;
	padding-right: 6px;
	padding-bottom: 2px;
	padding-left: 6px;
}
.buttonCenter {
	color: #fff;
	background-color: #729D0F;
	text-decoration: none;
	font-size: 0.7em;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	vertical-align: middle;
	float: none;
	padding-top: 2px;
	padding-right: 6px;
	padding-bottom: 2px;
	padding-left: 6px;
}

.button:hover{text-decoration:underline }
/*le séparateur dans les actus*/
.hrstyle1{
	text-align:center;
	height:1px;
	background-color: #000;
}
#info {
visibility:hidden;
}
/*BOITE ARRONDIE ET OMBREE POUR LE TITRE DES RUBRIQUES*/
.boxrubrique {
	width: auto;
	background-color: #729D0F;
	color: #fff;
	margin-top: 10px;
	margin-left: 1.5%;
	font-size: 20px;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 10px;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
	-webkit-box-shadow: 3px 3px 6px #666;
	-moz-box-shadow: 3px 3px 6px #666;
	box-shadow: 3px 3px 6px #666;
	padding-left: 10px;
}
/* TOUTES LES IMAGES ONT UNE OMBRE */
img {
	background: #FFFFFF;
	padding:0px;
	border:0px;
}
.img-size {
    overflow: visible;
    position: relative;
    visibility: visible;
    z-index: auto;
    height: auto;
    width: auto;
    left: auto;
    top: auto;
    right: auto;
    bottom: auto;
}