/*-------------------------------------------------------------------------------------------------
 Corps du document
-------------------------------------------------------------------------------------------------*/
body { background-color: rgb(255,190,0);
       background-image: url("./fond.gif");
       background-position: center bottom;
       background-repeat: no-repeat;
       background-attachment: fixed;
       font-family: fantasy, sans-serif;
       color: rgb(57,50,116);
       margin: 0px;
       padding: 0px;
       padding-bottom: 5em;
}

/* Liens par défaut */
a, a:hover, a:visited, a:link, a:active { text-decoration: none;}
a { color: rgb(96,92,181);}
a:hover { color: rgb(57,50,116);}

/*-------------------------------------------------------------------------------------------------
 Conteneur de logo et de ... contenu ! 
-------------------------------------------------------------------------------------------------*/
#contenu { position: relative;
	   top: 0px;
	   left: 0px;
	   right: 0px;
	   padding-right: 5em;
	   padding-left: 5em;
	   z-index: 1;
	   padding-top: 250px;
}
html>body #contenu { padding-top: 200px;}

        /* pour ie qui applatit le logo sinon */
        #logo { width: 394px;}

	#logo { position: absolute;
		margin-left: 10%;
		top: 0px;
		height: 113px;
		background-image: url("./titre.gif");
		background-position: top center;
		background-repeat: no-repeat;
		z-index: 2;
	}
	/* centrage pour les autres navigateurs */
	html>body #logo { margin-left: 0%;
			  width: auto;
                          left: 0px;
		          right: 0px;
		          border-bottom: 2px solid rgb(255,229,0);
                          height: 186px;
        }


/* Plan de la page en cours */
#contenu #plan ul { margin-top: 4em;}
html>body #contenu #plan ul { margin-top: 1em;}

#contenu #plan ul { text-align: center;
		    margin-bottom: 5em;
}
#contenu #plan ul li { display: inline;
		       list-style-type: none;
		       padding-right: 0.5em;
		       padding-left: 0.5em;
		       margin: 0px;
		       font-size: 90%;
}

#contenu img { margin: 0.5em;}
#contenu img.impaire { float: left;}
#contenu img.paire { float: right;}

/* Texte de contenu */
#contenu p { text-indent: 1em;}

#contenu h1 { text-align: center;
	      font-size: xx-large;
	      margin-bottom: 1em;
}

#contenu h3 { margin-top: 4em; font-style: italic;}
 
/* Partie interviews */
#contenu span.inter1, #contenu span.inter2 { float: left; margin-right: 1em;}
#contenu span.inter1 { color: green;}
#contenu span.inter2 { color: red;}
#contenu span.inter1:after, #contenu span.inter2:after { content: " : "; margin-right: 1em;}

#contenu span.texte { display: block;}
#contenu span.texte:before { content: open-quote;}
#contenu span.texte:after { content: close-quote;}
 
/*-------------------------------------------------------------------------------------------------
 Bloc de menu
-------------------------------------------------------------------------------------------------*/
#menu { position: absolute;
        top: 130px;
        height: 56px;
        width: 790px;
        text-align: left;
	margin-left: 5%;
}

html>body #menu { top: 130px;
	left: 50%;
	height: 56px;
	margin-left: -390px;
	z-index: 3;
}

	#menu div h1 a, #menu div h1 a:hover, #menu div h1 a:visited, #menu div h1 a:active { color: rgb(255,190,0); display: block;}

	#menu div { float: left;
		    width: 130px;
		    text-align: center;
	}

		#menu div h1 { height: 47px;
			       background-image: url("bouton.gif");
			       background-position: top left;
			       text-align: center;
			       overflow: hidden;
			       margin: 0px;
		}
		html>body #menu div h1 { height: 56px;}
		
			#menu div h1 span { font-size: medium;
					    color: rgb(255,190,0);
					    display: block;
					    margin-top: 15px;
					    margin-left: 10px;
					    margin-right: 10px;
			}

		#menu ul { padding-top: 0.2em;
			   padding-bottom: 0.2em;
			   margin: 0px;
			   display: block;
			   z-index:4;
                           background-image: url("bgul.gif");
			   background-position: top left;
			   background-repeat: repeat-y;
                           text-align: left;
		}
		html>body #menu ul { display: none;
		                     position: absolute;
			             left: 0px;
			             right: 0px;
				     background-image: none;
			             background-color: rgb(255,229,0);
				     text-align: center;
				     border-right: solid 1px rgb(255,229,0);
				     border-left: solid 1px rgb(255,229,0);
				     border-bottom: solid 1px rgb(255,229,0);
                }

                        #menu ul li a, #menu ul li a:hover {color: rgb(255,190,0);}
                        html>body #menu ul li a {color: rgb(96,92,181);}
                        html>body #menu ul li a:hover {color: rgb(57,50,116);}
                        #menu ul li { list-style-type: none;
                                      margin-left: 10px;
				      margin-right: 10px;
                                      overflow: hidden;
                                      border-top: dotted 1px rgb(255,190,0);
                        }
			html>body #menu ul li { margin-left: 0px;
				      margin-right: 0px;
			              border-top: none;
			              overflow: visible;
				      display: inline;
				      border-right: solid 2px rgb(255,190,0);
				      padding-left: 0.5em;
				      padding-right: 0.5em;
			}

/* Animation de menu */
#menu div:hover h1 { background-position: 0px 56px;}
#menu div:hover ul { display: block;}