/*-------------------------------------------------------------------------------------------------
 Corps du document
-------------------------------------------------------------------------------------------------*/
body {  background-color: rgb(138,30,39);
	font-family: sans-serif;
	color: white;
}

/* Liens par défaut */
a { text-decoration: none;
    color: white;
}
a:hover, a:visited, a:link, a:active { text-decoration: none;}
a:hover { color: rgb(181,183,179);}


/*-------------------------------------------------------------------------------------------------
 Conteneur de logo et de ... contenu ! 
 -------------------------------------------------------------------------------------------------*/
/* Première définition pour Internet Explorer avec prise en compte de "son" calcul de marges */
#contenu { background-color:rgb(226,45,58);
	   position: absolute;
	   top: 0px;
	   left: 0px;
	   width: 604px;
	   padding-top: 390px;
	   padding-left: 30px;
	   padding-right: 30px;
	   padding-bottom: 2em;
	   border-right-color: white;
	   border-right-style: solid;
	   border-right-width: 8px;
	   z-index: 1;
}
/* Défnition pour les navigateurs qui respectent le standard css du w3c (ie ne connait pas le sélecteur > ) */
html > body #contenu { width: 536px;}

	/* Logo */
	#logo { position: absolute;
		top: 0px;
		left: 0px;
		width: 604px;
		height: 384px;
		background-image: url("./Logo.jpg");
	}

/* Plan de la page en cours */
#contenu #plan ul { text-align: center;}
#contenu #plan ul li { display: inline;
		       list-style-type: none;
		       padding-right: 0.5em;
		       padding-left: 0.5em;
		       margin: 0px;
		       font-size: 90%;
}

#contenu #plan ul li a:hover { border-bottom: white solid 2px; color: white;}

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

/* Texte de contenu */
#contenu p:first-letter { font-size: 2em;
			  float: left;
			  margin-right: 0.2em;
}
#contenu p { text-align: justify;}
#contenu h1 { text-align: center;
	      font-size: xx-large;
	      font-variant: small-caps;
	      margin-top: 3em;
	      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: rgb(181,183,179);}
#contenu span.inter2 { color: yellow;}
#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
 -------------------------------------------------------------------------------------------------*/
/* Défintions pour internet explorer... */
#menu { position: absolute;
	left: 615px;
	top: 200px;
}

	#menu div { border-color: white;
		    border-style: solid;
		    border-width: 1px;
		    background-color: rgb(226,45,58);
		    margin: 0.5em;
		    padding: 1em;
		    padding-right: 50px;
	}

	#historique, #interviews, #style, #bonus { background-position: top right; background-repeat: no-repeat;}
	#historique { background-image: url("histo.jpg");}
	#interviews { background-image: url("inter.jpg");}
	#style { background-image: url("style.jpg");}
	#bonus { background-image: url("bonus.jpg");}

		#menu h1 { display: none;}
		#menu li { list-style-type: circle; margin-left: -20px;}

		#polynesianpop h1, #liens h1 { display: block; font-size: medium;}

/* Pour les autres */
html>body #menu { position: fixed;
		  left: 590px;
		  top: 260px;
		  width: 12em;
		  z-index: 2;
}

html>body #historique, #interviews, #style, #bonus { background-image: none;}

html>body #menu div { display: block;
		      background-image: url("BordHaut.jpg");
		      background-position: top right;
		      background-repeat: no-repeat;
		      margin: 0px;
		      padding: 0px;
		      border-style: none;
}

	html>body #menu div h1 { display: block;
				 background-image: url("BordBas.jpg");
				 background-position: bottom right;
				 background-repeat: no-repeat;
				 margin: 0px;
				 padding: 0px;
				 padding-bottom: 12px;
				 padding-top: 12px;
				 font-size: medium;
				 text-align: right;
				 font-variant: small-caps;
	}

		html>body #menu span { border-color: white;
				       border-right-style: solid;
				       border-right-width: 7px;
				       display: block;
				       margin: 0px;
				       padding-right: 1em;
		}

		
	html>body #menu div ul { border-right: rgb(138,30,39) solid 18px;
				 padding-right: 1em;
				 padding-bottom: 1em;
				 padding-top: 0px;
				 margin: 0px;
				 display: none;
				 background-image: url("BordBasListe.jpg");
				 background-position: bottom right;
				 background-repeat: no-repeat;
	}

		html>body #menu div ul li { border-top: white dotted 1px;
					    font-style: italic;
					    font-size: 12px !important;}

/* Effets du menu */
		html>body #historique:hover ul, #interviews:hover ul, #style:hover ul, #bonus:hover ul { display: block;}
			html>body #menu div ul li:hover { list-style-type: disc;}