/* CSS Document */
body {
	font-family: "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	margin: 0;
	padding: 0;
	background-image: url(../img/bg.jpg);
	background-repeat: repeat-x;
	background-color: #264F8B;
	color: #666666;
	background-attachment:fixed;
	position: relative;
}

img {
	border:none;
}

/*----------------------- Structure de la page -----------------------------*/

#conteneur {
	position: absolute;
	width: 770px;
	left: 50%;
	margin: 15px 0 10px -385px;
	background-image: url(../img/fond.gif);
	background-repeat: repeat-y;
	color: #666666;
}

#header {
	margin: 0 0 0 5px;
	width: 760px;
	height: 142px;
	background: #DCDCDC url(../img/entete.jpg) no-repeat;
	color: #666666;
}


#centre {
	/*background-color:#F2F2F2;*/
	margin-left: 221px;
	margin-right: 5px;
	border-left: 1px solid #FFFFFF;
	height: 580px;
}

html>body #centre{
	height : auto;
	min-height:580px;
	
}

#search {
	position: absolute;
	bottom: 38px;
	left: 5px;
	height: 70px;
	width: 216px;
	background: #C7C7C7 url(../img/search.gif) no-repeat;
	/*margin-top: -150px;*/
	/*margin-right: -540px; */
}

.nodisp { display: none; }

#gauche {
	position: absolute;
	left:14px;
	width: 202px;
	color: #666666;
	/*padding-top : 10px;*/
	/*border: 1px solid lime;*/
}

#sousMenu {
	position: absolute;
	left:5px;
	width: 215px;
	padding-top : 10px;
	/*border: 1px solid lime;*/
}


#pied {
	color: #666666;
	height: 34px;
	background-color: #E6E6E6;
	margin-left:5px;
	width:760px;
	border-bottom: 4px solid #FFF;
}


/*p {margin: 0 10px 10px 10px;}*/


/*-------------------MENU---------------------*/
#pied p {
	padding-top: 5px;
	text-align:center;
	font-size:90%;
}

#pied dfn {
	margin-right: 25px;
	font-size:90%;
}

#pied img {
	vertical-align: middle;
}


div#menu{
    background: transparent url(../img/menu_bg.gif) no-repeat;
    padding: 0;
    margin: 0 0 0 5px;
    width: 760px;
    height: 50px;
    position: relative;
}

div#menu ul{
	margin: 0 ;
	padding: 0 ;
	list-style-type: none ;
	position: relative;
}

div#menu li
{
	margin: 0 0 5px 0 ;
	padding: 0 ;
}

div#menu li a
{
	display: block ; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
	height: 34px;
}

   
li#menu_projet{ position: absolute; left: 0; }
li#menu_groupes{ position: absolute; left: 124px; }
li#menu_evenements{ position: absolute; left: 258px; }
li#menu_contacts{ position: absolute; left: 354px; }
li#menu_liens{ position: absolute; left: 432px; }
li#menu_membres{ position: absolute; left: 628px; }

#menu_projet a, #menu_groupes a, #menu_evenements a, #menu_contacts a, #menu_liens a, #menu_membres a { background: transparent url(../img/menu.gif) no-repeat; }
            
#menu_projet a { width: 124px; background-position: 0 0; }
#menu_groupes a { width: 134px; background-position: -124px 0; }
#menu_evenements a { width: 96px; background-position: -258px 0; }
#menu_contacts a { width: 78px; background-position: -354px 0; }
#menu_liens a { width: 96px; background-position: -432px 0; }
#menu_membres a { width: 132px; background-position: -628px 0; }

#menu_projet a:hover, body#menu_projeton li#menu_projet a{ background-position: 0 -34px; }
#menu_groupes a:hover, body#menu_groupeson li#menu_groupes a { background-position: -124px -34px; }
#menu_evenements a:hover, body#menu_evenementson li#menu_evenements a { background-position: -258px -34px; }
#menu_contacts a:hover, body#menu_contactson li#menu_contacts a { background-position: -354px -34px; }
#menu_liens a:hover, body#menu_lienson li#menu_liens a { background-position: -432px -34px; }
#menu_membres a:hover, body#menu_membreson li#menu_membres a { background-position: -628px -34px; }

/*-------------------------- Mis en forme -----------------------------*/

div#contenu{
	width: 514px;
	margin: 0px 10px 10px 10px; 
	/*padding-top : 10px;
	/*background-color: #FFFFFF;*/
	/*min-height: 700px;*/
	/*padding: 10px 10px 20px 10px;*/
	/*padding-bottom: 20px;*/
	/*border: 1px solid LIME;*/
}

div#contenu p {
	font-size: 90%;
	/*display: block;*/
}

div#contenu ul {
	font-size: 80%; /*display: block;*/
	list-style-type: square;
}

div#contenu h1, div#gauche h1, body.lecteur_video h1 {
	font-weight: bold;
	color: #A52A2A;
	font-size: 110%;
	margin: 0 0 14px 0;
	padding: 10px 0 0 0;
}

body.lecteur_video h1 {
	margin: 7px 4px 12px 8px ;
}

div#contenu h2, div#gauche h2, body.lecteur_video h2 {
	color: #264F8B;
	margin: 0;
	font-size: 90%;
	background : url(../img/fleche.gif) no-repeat left;
	padding-left: 1em;
}

body.lecteur_video h2 {
	margin: 18px 4px 12px 8px ;
}

div#contenu h3, div#gauche h3 {
	color: #666666;
	margin :0;
	padding : 0;
	font-size: 90%;
}

div#contenu h4, div#gauche h4 {
	margin: 5px 0 5px 0;
	color: #666666;
	font-size: 80%;
}

.hr {
	display:block;
	height: 1px;
	margin: 10px 0 10px 0;
	padding: 0;
	border-top: 1px solid #c7c7c7;
}

div#contenu ul {
	list-style-type: none;
	padding: 0;
	margin-left: 20px;
	font-size: 90%;
}

div#contenu li {
	background: url(../img/puce.gif) no-repeat 0 .4em;
	padding-left: 2em;
	margin-bottom : 8px;
}

div#contenu ul {
	list-style-type: none;
	padding: 0;
	margin-left: 20px;
	font-size: 90%;
}

div#chapitre{
	/*_width: 480px;
	width: 470px;*/
	margin: 0px 10px 10px 0; 
	padding: 10px 0 10px 0; 
	background-color: #E6E6E6;
	font-size: 90%;
	border: 1px dotted #666666;
	color: #666666;
	width: 480px;
  	voice-family: "\"}\"";
  	voice-family:inherit;
	width: 470px;
}

html>body div#chapitre {
  width: 470px;
}

div#chapitre li {
	background : none;
	padding-left: 0.5em;
}

div#chapitre a{
	color: #666666;
}

div#chapitre a:hover{
	color : #264F8B;
}

div#chapitre a:active{
	color : #264F8B;
}

/*----------------------- Vignette en page d'accueil ---------------------*/


.thumbnail_gauche
{
		float: left;
		width: 224px;
		border-right: 1px solid #c7c7c7;
		margin: 0px 0 10px 12px;
		padding: 5px;
		/*font-size: 90%;*/
}

.thumbnail_droit
{
		float: left;
		width: 224px;
		margin: 0px 0 10px 12px;
		padding: 5px;
	
}


.clearboth { clear: both; line-height: 0px; height: 0px; margin: 0px; padding:0px ;}

/****************************************************************************************
										Styles pour le formulaire d'inscription
*****************************************************************************************/

.formulaire { line-height: 1em }

.session_erreur { 
	background-color: #666666 ; /* couleur gris foncé */
	color: #FFF ; /* couleur du texte : blanc */
	font-weight: bold ; /* graisse police */
}

.champ {
	background-color: #E6E6E6 ; /* couleur gris clair  */
	border: none ;
	color: #666666 ; /* couleur du texte : gris foncé */
	font-weight: normal ; /* graisse police */
}

.champ_erreur {
	background-color: #666666 ; /* couleur gris foncé */
	border: none ;
	color: #FFF ; /* couleur du texte : blanc */
	font-weight: bold ; /* graisse police */
}

#form_erreur {
	font-style: italic ; /* style police */
	font-weight: bold ; /* graisse police */
}

#zone_saisie {
	width: 460px ;
	height: 100px ;
	background-color: #E6E6E6 ; /* couleur gris clair  */
	border: none ;
	margin: 0.5em 25px 10px 0 ;
}

/*---------------------- Formulaires -------------------*/

form#contact-form {
	width: 200px;
	padding: 0;
	margin: 28px 2px 4px 4px;
	display: block;
}

form#contact-form fieldset {
	border: 0;
	padding: 0;
	margin: 0;
}

form#contact-form label {
	margin: 0;
	font-weight: bold;
	font-size: 90%;
	margin-right: 5px;
}

form#contact-form select, form#contact-form textarea {
	width: 80px;
	height: 18px;
	margin: 0;
	padding: 0;
	text-align: left;
	background: url(../img/p.png) repeat-x bottom;
	border: 1px solid #CCC;
	display: block;
}

form#contact-form input, form#contact-form input:focus {
	width: 110px;
	height: 18px;
	margin: 0;
	padding: 0;
	text-align: left;
	background: url(../img/p.png) repeat-x bottom;
	border: 1px solid #CCC;
}

form#contact-form input:focus {
	background: url(../img/p_focus.png) repeat-x bottom;
	color: #FFF;
}

form#contact-form button, form#contact-form .button, #configuration_video input#modifier, #envoyer {
	color: #FFF; 
	border: 1px solid #FFF; 
	background: #264f8b; 
	background-image: url(../img/bg_bouton.gif);
	background-repeat: no-repeat;
	margin:0;
	padding: 0;
	font-weight: bold;
	font-size: 90%;
}

#envoyer {
	background-repeat: repeat-x ;
}

/*----------------MENU NAVIGATION DANS L'EN-TETE DE lA PAGE---------------------------*/ 
#navigation {
	float: left;
	width: 400px; 
	margin: 12px 0 0 0;
	padding: 0;
	font-size: 90%;
}

#navigation ul{
	margin: 0;
	padding: 0;
}

#navigation ul li {
	margin-left: 10px;
	padding: 0;
	list-style: none;
	display: inline;
}

#navigation li.home {
	background: url(../img/ico_home.gif) no-repeat 0 .2em;
	padding-left: 1.5em;
	margin-bottom : 8px;
}   

#navigation li.plan {
	background: url(../img/ico_sitemap.gif) no-repeat 0 .2em;
	padding-left: 1.5em;
	margin-bottom : 8px;
}   

#navigation li.contact {
	background: url(../img/ico_mail.gif) no-repeat 0 0.2em;
	padding-left: 1.5em;
	margin-bottom : 8px;
}  

#navigation a {
	color: #A52A2A;
	text-decoration: none;
}	
	
#navigation a:hover {
	color: #A52A2A;
	text-decoration: underline;
}

#navigation .actif {
	color: #666666;
	text-decoration: none;
}

/*------------------- Actualités ---------------------------*/
div#gauche p.news {
	font-size: 90%;
	margin-top:10px;
}

div#gauche .date {
	font-size: 90%;
	color: #333;
	margin:0;
}

div#gauche .plus {
	font-size: 90%;
	margin: 10px 0 20px 0;
	padding-bottom: 20px; 
	/*border-bottom: 1px dashed #0373AC;*/
}

/*------------------- Liens ---------------------------*/

a {
	color: #264F8B;
}

a:visited {
	color: #999999;
}

a:hover {
	color: #A52A2A;
}


/*------------------------ Sous-Menu --------------------*/

#navcontainer
{
	width: 215px;
	margin: 0;
	padding: 0;
	font-size: 90%;
	text-align: left;
	/*text-transform: lowercase;*/
}

ul#navlist
{
	text-align: left;
	list-style: none;
	padding: 0;
	margin: 0;
	width: 215px;
}

ul#navlist li
{
	display: block;
	margin: 0;
	padding: 0;
}

ul#navlist li a
{
	display: block;
	/*_width: 215px;
	width: 205px;*/
	padding: 5px 0 5px 10px;
	border-top: 1px solid #e6e6e6;
	border-bottom: 1px solid #ccc;
	color: #777;
	text-decoration: none;
	background: #e2e2e2;
	width: 215px;
  	voice-family: "\"}\"";
  	voice-family:inherit;
	width: 205px;
}

html>body ul#navlist li a {
  width: 205px;
}


#navcontainer>ul#navlist li a { width: auto; }

ul#navlist li#active a
{
	background: #f2f2f2;
	color: #264F8B;
}

ul#navlist li a:hover, ul#navlist li#active a:hover
{
	color: /*#A52A2A*/#777;
	background: transparent;
	border-top: 1px solid #aaab9c;
	border-bottom: 1px solid #fff;
	/*border-color: #aaab9c #e6e6e6 #fff #FFF;*/
}


/************* #chemin *************/

#path {
	font-size: 90%;
	padding: 0px 0px 15px 0px;	
	color : #A9A9A9;
	width: 80%;
	float:left;
}

#path a{
	color : #A9A9A9;
}

#path a:hover{
	color : #264F8B;
}

#print {
	width: 10%;
	float:left;
}

/*************** bas de page *************/

#retour {
	position: absolute;
	bottom: 38px;
	left:655px;
	height: 20px;
	width: 110px;
	background: #C7C7C7 url(../img/retour.gif) no-repeat;
	/*margin-top: -150px;*/
	/*margin-right: -540px; */
}

#retour a, #retour a:visited,  #retour a:active {
	color: #FFF;
	margin: 0;
	padding: 0;
	font-size: 90%;
	padding-left: 34px;
	text-decoration:none;
}

#retour a:hover {
	text-decoration:underline;
}

/*----------------------Formulaires----------------------------*/

form#formulaire {
	padding: 0;
	margin: 10px 10px 15px 0;
	display: block;
}


form#formulaire h3{
	color: #A52A2A; 
	font-size: 90%;
}

form#formulaire label {
	margin: 20px 0 5px 0;
	font-size: 100%;
	display: block;
	font-weight: bold;
}

form#formulaire input {
	margin: 0;
	padding: 0;
	text-align: left;
	background-color : #fcfcfc;
	border: 1px solid #CCC;
	white-space: pre;
	display: block;
}

form#formulaire button, form#formulaire .button {
	border: 1px solid #FFF;
	margin: 30px 0 10px 0;
	padding: 0;
	background: #264F8B;
	width : 65px;
	font-size: 90%;
	text-align: center;
	color: #FFF;
	height: 24px;
	background-image: url(../img/bg_bouton.gif);
	background-position: left;
	background-repeat: repeat;
}

.maj {
	margin-top: 40px;
	font-size : 70%;
	font-style:italic;
	color : #A9A9A9;
}

.signature {
	margin-top: 5px;
	text-align: right;
	font-size : 70%;
	font-style:italic;
	color : #A9A9A9;
}

.logos {
	margin-top: 5px ;
	text-align: right ;
}

/*---------------------- Lecteur vidéo ----------------------------*/

body.lecteur_video {
	background-image: none;
	background-color: #C7C7C7;
}

#description_video {
	float: left ;
	margin: 0px; 
	padding:0px ;
	width: 35% ;
	height: 394px ;
	background-color: #E6E6E6;
}

#ecran_video {
	float: right ;
	margin: 0px; 
	padding:0px ;
	width: 65% ; /* 640 px * 65% = 416 px*/
	height: 394px ;
	background: #EEE url(../img/fond-lecteur.jpg) top left no-repeat ;
}

#configuration_video {
	margin: 0px; 
	padding:0px ;
	width: 100% ;
	height: 50px ;
	background-color: #C7C7C7;
}

body.lecteur_video p {
	margin-left: 8px ;
	margin-right: 4px ;
}

.wmp {
	margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/
	width: 320px ;
	height: 285px ; /* 240 px + 45 px (hauteur de 45 px pour la barre de contrôle) */
}

.rp-image {
	margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/
	width: 320px ;
	height: 240px ; 
}

* html .rp-image-ie { /* lu par IE seulement */
	margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/
	width: 320px ;
	height: 240px ; 
}

.rp-controles {
	margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/
	width: 320px ;
	height: 32px ; 
}

* html .rp-controles-ie { /* lu par IE seulement (hack pour pallier le pb d'alignement vertical rencontré avec les conteneur de type : block) */
	margin-top: 5px ; /* défini une marge en haut */
	margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/
	width: 320px ;
	height: 32px ; 
}

.qt {
	margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/
	width: 320px ;
	height: 256px ; /* 240 px + 16 px (hauteur de 30 px pour la barre de contrôle) */
}

* html .qt-ie { /* lu par IE seulement */
	margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/
	width: 320px ;
	height: 256px ; /* 240 px + 16 px (hauteur de 30 px pour la barre de contrôle) */
}

#ecran_video h1 { margin-left: 48px ; /* (416 px - 320 px) / 2 = 48 px*/ }
#ecran_video h2 { text-align: center ; background-image: none ; }

#configuration_video dl, #configuration_video dt, #configuration_video dd {
	margin: 0;
	padding: 0;
}

#configuration_video dt {
	float: left;
	margin-top: 2px ;
	width: 20%;
	color: #264F8B;
	font-size: 90%;
	font-weight:bold ;
	text-indent: 8px ;
}

#configuration_video dd {
	float: left;
	width: 80%;
}

#configuration_video ul {
	margin: 0;
	padding: 0 ;
	font-size: 90%;
}

#configuration_video ul li {
	margin: 0 ;
	padding-right: 8px ;
	list-style: none;
	display: inline;
}

#configuration_video p {
	color: #A52A2A;
	font-weight:bold ;
	font-size: 100%;
	margin-top: -0.2em;
	margin-bottom: -1px ;
}

#configuration_video input#modifier {
	margin-top: 40px;
}

#a_gauche {
	width: 85%;
	float:left ;
}

#a_droite {
	width: 15%;
	float:right ;
}ut#modifier {
	margin-top: 40px;
}

#a_gauche {
	width: 85%;
	float:left ;
}

#a_droite {
	width: 15%;
	float:right ;
}

.liendocument {

        background: url(../img/ico_document1.gif) no-repeat 0 .2em;
        padding-left: 1.5em;
        color:#A62C2C;
        /*margin-bottom : 8px;*/
}

a.liendocument {

        background: url(../img/ico_document1.gif) no-repeat 0 .2em;
        padding-left: 1.5em;
        text-decoration:none;
        color:#A62C2C;
        /*margin-bottom : 8px;*/
}

a.liendocument:hover {

        background: url(../img/ico_document1.gif) no-repeat 0 .2em;
        padding-left: 1.5em;
        text-decoration:underline;
        color:#A62C2C;

        /*margin-bottom : 8px;*/
}