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

body 
{
background:#000000;
margin:0;
padding:0;
font-size:11px;
font-family:Arial;
z-index:-1;
color:#FFF
}

/*PARTIE COMMUNE AUX PAGES*/
/* identifiant de page global*/
#all
{
}

/* PARTIE HAUTE DE PAGE*/
/* Le header contient la barre de navigation */
#header 
{
}

#navlinks
{
	background-color:#666666;
	border-bottom:1px #FFFFFF solid;
	border-top:1px #FFFFFF solid;
	margin:15px 0 15px 0;
	padding:0 0 0 5px;
	text-align:right;
	text-decoration:none;
}

#navlinks li{
display:inline;
text-decoration:none;
margin-right:4em;
}
/* au cas où on souhaite de rapprocher le dernier élément de la navigation plus proche de la fenêtre, il suffit d'activer ce sélecteur */
/*#navlinks li.last{
display:inline;
text-decoration:none;
margin-right:2em;
}*/

/* PARTIE PRINCIPALE DE PAGE*/
/* page de contenu des deux colonnes (en flottant de façon à ce que le footer soit bien sous la plus basse des deux colonnes) */

#main
{
	margin-bottom:30px;
}

#newstheme
{
	border:1px #FFFFFF solid;
	padding:5px;
	text-align:justify;
	overflow:auto;
	height:6em;
}

#footer 
{
	width:100%;
	margin:auto;
	text-align:center;
	font-size:9px;
	color:#FFFFFF;
}

/* LES STYLES UTILISES */

/* Style de la barre de navigation (éléments racines en couleur, le reste en blanc)*/
.Style1 
{
	color:#FFF;
}

.Style2 
{
	color:#CC6;
	font-weight:bold;
}
/* Style du titre du thème sur page de droite*/
.Style3
{
	color:#9CC;
	font-size:13px;
	font-weight:bold;
	margin:0;
	padding:5px
}
/* Style du titre du thème*/
.Style4
{
	color:#9CC;
	font-size:15px;
	font-weight:bold;
	text-align:center;
	margin-top:20px;
	margin-bottom:30px;
	padding:5px;
	border:1px #FFFFFF solid;
	font:"Trebuchet MS", Arial, Helvetica, sans-serif;
	width:100%;
}

.Style5 
{
	color:#84B75E;
	font-weight:bold;
}

.Style6 
{
	color:#84B75E;
	font-size:18px;
	font-weight:bold;
	text-align:center;
	margin-top:20px;
	margin-bottom:30px;
	padding:5px;
	border:1px #FFFFFF solid;
	font:"Trebuchet MS", Arial, Helvetica, sans-serif;
	width:100%;
}

.Style7 
{
	color:#3FF;
	font-weight:bold;
}
/* Types de texte dans la page*/
.texte1
{
	margin:0;
	padding:5px;
}

.texte2
{
	margin:0;
	padding:5px;
	font-style:italic;
}

.texte3
{
	margin:0;
	padding:5px;
}

.texte4
{
	margin:0;
	padding:5px;
	font-style:italic;
	text-align:center;
}

.texte5
{
	margin:0;
	padding:2px;
	font-weight:bold;
	background-color:#666;
	font-size:11px;
}

.texte6
{
	margin:0;
	padding:5px;
	text-align:justify;
}

/* Style des lignes d'introductions des cadres d'infos (news, explications de section...) */
.titre
{
	margin:0;
	padding:5px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight:bold;
}
/*-------------------PARTIES SPECIFIQUES--------------------*/

/*-----------------PARTIE SPECIFIQUE A L'ACCUEIL*/
#content table 
{
	width:100%;
	margin:auto;
}

#content img 
{
	border:10px solid #FFFFFF;
}
/*problématique:tant que la taille imposée à la cellule centrale est inférieure à la taille de l'image, c'est l'image qui impose sa taille et la cellule fait donc juste la taille de l'image par obligation -> la cellule est alors centrée puisque les 2 colonnes de côté sont de même taille.*/
td#middlecell 
{
	width:590px;
}

/*-----------------PARTIE SPECIFIQUE A L'ACCUEIL*/
td#middlecell3 
{
	width:550px;
}	

/*-----------------PARTIE SPECIFIQUE AU SOMMAIRE*/
#introduction
{
}

#tableau 
{
	padding:40px;
}

#tableau td 
{
	padding:2px 17px 2px 17px;
}
	
/*-----------------PARTIE SPECIFIQUE AUX NEWS*/

#titrenews1, #titrenews2 
{
	margin:0;
	padding:0em;
	border:1px #FFFFFF solid;
	text-align:center;
	font:"Trebuchet MS", Arial, Helvetica, sans-serif;
	height:30px;
	width:100%;
}

/* PAGE DE GAUCHE*/
/* dimension indiquée de façon à faire tenir la photo visualisée dans un cadre de 500 sur 500, et on rajoute une marge de 5px (portant la marge gauche à 10px au total)*/
#pagegauche2 
{
	float:left;
	margin-left:10px;
	width:45%;
}

/* PAGE DE DROITE*/
#pagedroite2 
{
	float:right;
	margin-right:10px;
	margin-left:40px;
	width:45%;
}

/*-----------------PARTIE SPECIFIQUE PAGE CONTACT*/

#contact td 
{
	font-weight: bold; 
	text-align: right;
}

#contact td.liste
{
	text-align: left;
}

#contact th 
{
	font-size: 2em; 
	color: red; 
	padding: 0; 
	border-bottom: 1px solid red;
}

#espace
{
	height:20px;
}

/*-----------------PARTIE SPECIFIQUE AUX THEMES*/

#titretheme
{
	margin:0;
	padding:0,5em;
	text-align:center;
	font:"Trebuchet MS", Arial, Helvetica, sans-serif;
	height:30px;
	width:100%;
}

/*-----------------PARTIE SPECIFIQUE AUX SECTIONS (AFFICHAGE PHOTO)*/

/* PAGE DE GAUCHE*/
/* dimension indiquée de façon à faire tenir la photo visualisée dans un cadre de 500 sur 500, et on rajoute une marge de 5px (portant la marge gauche à 10px au total)*/
#pagegauche1 
{
	position:absolute;
	z-index:1;
	float:left;
	margin-left:5px;
	width:500px;
}

/* petit texte sur le thème/sous-thème, la largeur est mise pour aligner la droite du cadre sur la droite du cadre photo (500px - 2x5px (le padding) -2x1px pour la bordure). L'overflow auto permet de faire apparaitre un ascenseur sur la droite pour défilement avec une hauteur fixée et donc commune à toutes les pages*/
#texttheme
{
	width:100%;
	border:1px #FFFFFF solid;
	padding:5px;
	width:488px;
	text-align:justify;
	overflow:auto;
	height:6em;
}

/* cadre de la photo de 500 sur 500px avec bordure. problématique : comment avoir une image centrée sachant que son format varie (la photo peut être portrait ou paysage et empêche donc le positionnement relatif et absolu)*/
#laphoto 
{
	border:1px #FFFFFF solid;
	height:500px;
	text-align:center;
	margin-top:0;
	margin-right:auto;
	margin-bottom:15px;
	margin-left:auto;
}

#laphoto table 
{
	width:100%;
	margin:auto;
}

/* l'image est insérée dans des balises <p>, et ainsi asiimilée à du texte ce qui permet de l'aligner au centre (autrement umpossible de l'aligner au centre)*/
td#middlecell 
{
	width:300px;
	text-align:center;
	}
/* PAGE DE DROITE*/
#pagedroite1 
{
	position:absolute;
	z-index:2;
	left:530px;
	width:50%;
}

#titresection 
{
	margin:0;
	padding:0em;
	border:1px #FFFFFF solid;
	text-align:center;
	font:"Trebuchet MS", Arial, Helvetica, sans-serif;
	height:30px;
	width:100%;
}

#tableau1 
{
	height:480px;
	margin-bottom:5px;
	display: block;
	overflow:auto;
}
	
#tableau1 table{		
	display: block;
	overflow:auto;
	width: 100%;
}

#tableau1 td {
	border:1px #FFFFFF solid;
	padding:2px 2px 2px 2px;
	width:60px;
	height:60px;
}

#footerimg {
	position:absolute;
	z-index:3;
	left: 20em;
	top: 680px;
	padding-top:2.5em;
	padding-bottom:3em;
}