/*
*****************************************************************************
***
*** FEUILLE DE STYLE
*** site : http://amicale.fsb.free.fr
*** Concerne : GENERAL
*** Ver. : 1.0
*** Date : 14/01/2007
***
*****************************************************************************
*/

/*  ***************************************
    * ELEMENTS COMMUNS A TOUTES LES PAGES *
	 ***************************************
*/

/* ------------------------------------------------------------------------- */
/*  body : conteneur principal de la page */
body {
	margin: 0;
	padding: 0;
	text-align: center;
	background-color: #FFFFF0;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
}
/* ------------------------------------------------------------------------- */
/* Titre des pages */
h1 {
	color: #6898EE;
	font-size: 16px;
	text-align: right;
	margin: 5px 5px 5px 5px;
}
/* Balise : A Mise en forme des liens au repos */
a {
	text-decoration: none;
	color: navy;
}
/* Balise : A Mise en forme des liens survolés */
a:hover {
	color: Red;
}
/* ------------------------------------------------------------------------- */
/* Balise : P Mise en forme des paragraphes */
p {
	margin: 0 0 1em 0;
}
/* ------------------------------------------------------------------------- */
/* balise : Fieldset */
fieldset {
	border-width: 1px 3px 3px 1px;
	border-color: Black ButtonShadow ButtonShadow Black;
	padding: 0 1em 1em 1em;
}
/* ------------------------------------------------------------------------- */
/* Balise : Legend (Concerne Fieldset) */
fieldset legend {
	padding: 0;
	color: navy;
	font-style: italic;
	font-weight: bolder;
	font-size: 1.8em;
}
/* ------------------------------------------------------------------------- */
/* Balise : img */
img {
	border: none;
	
}
/* ------------------------------------------------------------------------- */
/* Classe : Rouge Défini la couleur rouge */
.rouge {
	color: red;
}
/* ------------------------------------------------------------------------- */
/* Classe : Navy Défini la couleur Bleu Marine */
.navy {
	color: Navy;
}
.centrer {
	text-align: center;
}
/* ------------------------------------------------------------------------- */
/* Global : Partie centrale de la page contenant le menu et le corps de page */
#global {
	margin: 10px auto;
	padding: 0;
	width: 790px; /* Compatible avec affichage 1024x768px minimum */
	text-align: left; /* Pour annuler la mise en page de body */
	background: #EAEAE9 url(./image/accueil/fond_personnages2.png) right top repeat;
	border-width: 1px 3px 3px 1px;
	border-color: #CECECE #4A4A4A #4A4A4A #CECECE;
	border-style: solid;
}
/* ------------------------------------------------------------------------- */
/* Entete : Bloc d'entete qui se retrouve sur chaque page */
#entete {
	float: left;
	margin: 0;
	padding: 0;
	width: 790px; /* Compatible avec affichage 1024x768px minimum */
	height: 140px;
	/*background: #EEE url(./image/accueil/logomini9.gif) no-repeat scroll 10px 10px;*/
	background: #EEE url(./image/accueil/logo.gif) no-repeat scroll 10px 10px;
	text-align: right;
	font-family: "Comic Sans MS", fantasy, sans-serif;
}
	#entete h1 { /* format des titres de catégorie H1 situés dans l'en-tête */
		font-family: "Times New Roman", Times, serif;
		font-size: 3em;
		color: #06C;
		padding-right: 10px;
	}
	
	#entete h2 { /* format des titres de catégorie H2 situés dans l'en-tête */
		font-size: 1.3em;
		color: #000080;
		margin: 0;
		padding-right: 10px;
	}
	
	#entete h3 { /* format des titres de catégorie H3 situés dans l'en-tête */
		font-size: 1.2em;
		color: #06C;
		margin: 0;
		padding-right: 15px;
	}

	#entete img { /* format des images situées dans l'en-tête */
		float: right;
		border: 0;
		padding-right: 15px;
	}
/* ------------------------------------------------------------------------- */
/* BlocMenu : Colonne gauche contenant le menu */
#blocmenu {
	float: left;
	width: 150px;
	background-color: #70708F;/*#EAEAE9;*/
	color: navy;
	padding: 0;
	margin-top: -20px;
}

	#blocmenu p { /* Format des paragraphes situés dans BlocMenu */
		margin: 0 1em 1em 1em;
	}
	
	#blocmenu ul { /* Menu principal : mise en forme du type de liste */
		margin: 0;
		background-color: #E4E4E4;
		list-style-type: none;
		padding: 0;
		position: relative;
		top: 0;
		left:0;
	}
		#blocmenu li { /* Menu principal : mise en forme des éléments de liste */
			margin: 2px 0;
			padding: 0;
		}
			#blocmenu li a { /* Menu principal : mise en forme des boutons au repos */
				display: block;
				width: 139px;
				padding-left: 10px;
				line-height: 25px;
				/*padding-left: 1em;*/
				border-width: 1px 2px 2px 1px;
				border-color: #CECECE #4E4E4A #4E4E4A #CECECE;
				border-style: solid;
				background-color: #E4E4E4;
				color: navy;
				text-decoration: none;
				font-weight: bold;
			}

			#blocmenu li a:hover { /* Menu principal : mise en forme des boutons survolés */
				background-color: #70708F;
				border-width: 2px 1px 1px 2px;
				border-color: #4E4E4A #CECECE #CECECE #4E4E4A;
				color: White;
			}
/* ------------------------------------------------------------------------- */
/* Contenu : Partie droite de la page où se trouve le contenu */
#contenu {
	border-width: 2px 1px 1px 2px;
	border-style: solid;
	border-color: ButtonShadow Black Black ButtonShadow;
	margin-left: 150px; /* Décalage de 150px pour laisser la place du menu */
	
	background-color: #FFF;
	padding: 1em 2em;
}

	#contenu p { /* Contenu : Mise en forme des paragraphes */
		margin: 0 0 0 1em;
		text-align: justify;
	}
	
	#contenu img.photos { /* Contenu : Mise en forme des images de classe Photos */
		float: left;
		border-width: 1px 4px 4px 1px;
		border-style: solid;
		border-color: Black ButtonShadow ButtonShadow Black;
		
	}
/* SEPARATEUR : un rectangle vide qui prend toute la largeur de la page pour éviter 
les problèmes de décalages dûs aux différentes longueurs possibles des affiches */
.separateur {
	
	clear: both;
	width: 100%;
	height: 1px;
	margin: 0;
}
/* ------------------------------------------------------------------------- */
/* Pied : Pied de Page */
#pied {
	clear: both;
	background-color: #EAEAE9;
	margin: 0;
	text-align: center;
	font-size: 0.7em;
	font-weight: bolder;
}
/* ------------------------------------------------------------------------- */
/* Cadre de connexion */
.login {
	float: right;
	margin: 0 0 0 140px;
	padding: 0;
	width: 640px;
	height: 20px;
	text-align: left;
	background: #70708F;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight: bolder;
	color: white;
}
.form_login {
  display: inline;
  padding: 0;
  margin: 0;
  text-align: left;
  padding: 15px;
}
.form_login input{
	height: 11px;
	margin: 0 5px;
	vertical-align: middle;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight: bolder;
}
.login fieldset {
	padding: 0;
	margin: 1px;
	border: none;
}
/* ------------------------------------------------------------------------- */
/* Balise : Legend (Concerne Fieldset) */
.login legend {
	padding: 0;
	margin: 0;
	color: red;
	font-style: italic;
	font-weight: bolder;
	font-size: 8px;
}
/* ------------------------------------------------------------------------- */
/* 
/*  ***************************************
    * ELEMENTS DE LA PAGE D'ACCUEIL       *
	 ***************************************
*/

/* ------------------------------------------------------------------------- */

/* AFFICHE */

/* Fond de l'affiche */
.affiche {
	float: left;
	position: relative;
	margin: 20px 20px 5px 20px;
	width: 250px;
	height: 350px;
	background-color: #FFFF80;
	background-position: center center;
	background-repeat: no-repeat;
	border-left: 1px solid #DCDCDC;
	border-top: 1px solid #DCDCDC;
	border-right: 3px solid ButtonShadow;
	border-bottom: 3px solid ButtonShadow;
	color: Blue;
}
	/*.date {	/* Cadre contenant la date de l'évènement */
	/*	position: inherit;
		float: left;
		margin: 10px;
		border: 1px solid navy;
		width: 40%;
		/*background-color: #AAABFE;*/
	/*	background-color: #F5DEB3;
		color: blue;
		font-size: 0.9em;
		font-weight: bold;
		text-align: center;
	}*/
	.titre { /* Cadre contenant le titre de l'évènement */
		float: left;	
		width: 50%;
		font-size: 1em;
		text-align: center;
		margin-top: 10px;
	}
	.lieu { /* Cadre contenant l'adresse de l'évènement */
		clear: both;
		position: relative;
		width: 80%;
		text-align: left;
		padding: 10px 15px;
	}
	.texte { /* Cadre contenant le descriptif de l'évènement */
		/*clear: both;*/
		margin: 0 auto;
		width: 80%;
		padding: 30px 15px;
		text-align: left;		
	}
	.affiche_image { /* Mise en forme des images de l'affiche de la classe affihe_image */
		float: left;
		margin-right: 15px;
		border: 0;
	}
	.pied_affiche {
		margin-bottom: 15px;
		padding-top: 15px;
		border-top: 1px solid blue;
		text-align: center;
	}
/* ------------------------------------------------------------------------- */
/* BREVES */
.breve { 
	/* Cadre des breves */
	float: left;
	width: 250px;
	margin: 10px;
	background-color: #FFF;
	color: #006;
	font-size: 0.9em;
	text-align: left;
}
.taille_titre {
	font-size: 1.1em;
	font-weight: bold;
}
/* ------------------------------------------------------------------------- */
/* 
/*  ***************************************
    * ELEMENTS DE STYLE GALETTE           *
	 ***************************************
*/
.galette_titre {
	font-size: 15px;
	text-align: center;
	font-weight: bold;
	border-style: solid;
	border-width: 1px;
	background-color: #FBFBFB;
	border-color: #BBBBBB;
	margin-top: 10px;
	margin-bottom: 20px;
	color: #000000;
	width: 100%;
}
#galette_errorbox {
	color: #FF0000;
	border-color: #FFDDDD;
	border-width: 2px;
	border-style: solid;
}
		
#galette_errorbox h1 {
	background-color: #FFDDDD;
	text-align: center;
	font-size: 10px;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 0px;
}

#galette_errorbox ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	border: none;
}
#warningbox {
	color: #000000;
	border-color: #FFE8CC;
	border-width: 2px;
	border-style: solid;
}
		
#warningbox h1 {
	background-color: #FFE8CC;
	text-align: center;
	font-size: 10px;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 0px;
}

#warningbox ul {
	list-style-type: none;
	margin: 2px;
	padding: 0px;
	border: none;
}
.galette {
	margin: 30px 0 150px 0;
}
.galette input  {
	font-size: 10px;
}

.galette_texte {
	font-size: 10px;
	margin: 20px 0 30px 0;
}
/* ------------------------------------------------------------------------- */
/* 
/*  ***********************************************
    * ELEMENTS DE STYLE AFFICHES PAGE D'ACCUEIL   *
	 ***********************************************
*/
.cadre {
	float: left;
	position: relative;
	width: 250px;
	height: 350px;
	overflow-y: hidden;
	border-right: 3px solid buttonshadow ;
	border-left: #dcdcdc 1px solid;
	border-top: #dcdcdc 1px solid; 
	border-bottom: 3px solid buttonshadow ;
	margin: 20px 20px 5px;
	color: blue;
	background-position: center center;
	background-repeat: no-repeat;
}
.jaune {
	background-color: #ffff80;
}
.rose {
	background-color: #FFE4E1;
}
.bleu {
	background-color: #E0FFFF;
}
.vert {
	background-color: #BDFF93;
}
.rouge {
	background-color: #F70000;
}
			
.fond_tr {
	filter: alpha(opacity=30);
	opacity: 0.3; 
	-moz-opacity: 0.3;
	width: 100%;
	background-position: center center;
	background-repeat: no-repeat; 
}
.img_logo {
	float: left; 
	position: relative;
	filter: alpha(opacity=100);
	opacity: 1; 
	-moz-opacity: 1;
	margin: 10px;
	border: none;
	height: 54px;
	width: 88px;
}
/*.date {
	float: right;
	position: relative;	
	margin: 10px;
	width: 100px;
	border: navy 1px solid;
	line-height: 10px;
	font-weight: bold;
	font-size: 0.9em;
	color: blue;
	text-align: center;
}*/
.date {	/* Cadre contenant la date de l'évènement */
		position: inherit;
		float: left;
		margin: 10px;
		border: 1px solid navy;
		width: 40%;
		background-color: #AAABFE;
		color: blue;
		font-size: 0.9em;
		font-weight: bold;
		text-align: center;
	}
.separateur {
	clear: both;
}
.titre {
	clear: both;
	position: relative;	
	margin: 5px auto;
	width: 225px;
	font-weight: bold;
	font-size: 1.3em;
	text-align: center;
}
.lieu {
	clear: both;	
	filter: alpha(opacity=100);	
	opacity: 1; 
	-moz-opacity: 1;
	margin: 5px auto;
	padding: 10px 0 10px 0;
	position:relative;
	font-weight: bold;
	font-size: 1.1em;
	text-align: center;
}
.presentation {	
	position: relative;	
	padding: 10px 0;
	margin: 5px auto;
	width: 225px;
	text-align: left;
}
.comment {
	position: relative;
	margin: 0 auto;	
	padding: 30px 0;
	width: 225px;
	font-size: 0.8em;
	font-style: italic;
	text-align: left;
}
a.pied {
	display: block;
	width: 100%;
	height: 20px;
	border-top: 1px solid blue;
	margin-bottom: 10px;
	text-align:center;
}

/* ******************************************
   * STYLES PAGE REPORTAGES                 *
	******************************************
*/
.edito{
	margin : 1px 25px 15px 10px;
	font-size : 0.9em;
	color: #006;
	text-align: justify;
}
.edito p {
	text-indent: 15px;	
	margin: 10px;
}

.titre_edito{
	font-size: 1.3em;
	font-weight: bold;
	font-style: italic;
	color: navy;
	padding: 0 35px;
}
.image_edito{
	float: left;
	margin: 5px 3px 5px 7px;
	border: none;
}
.image_edito_droite{
	float: right;
	margin: 3px 5px 1px 3px;
	border: none;
}

.image_groupe{
	float: left;
	margin: 7px;
	border: none;
}
a.lien {
	text-decoration: none;
	float: left;
	margin: 0 10px;
	font-size: 0.8em;
	color: #B2CAE2;
}
a:hover.lien{
text-decoration: none;
color: #06C;
font-style: italic;
}

a.lien_photo {
	text-decoration: none;
	float: right;
	margin: 0 10px;
	font-size: 0.8em;
	color: #B2CAE2	
}
a:hover.lien_photo{
text-decoration: none;
color: #06C;
font-style: italic;
}