/****************************
 ** GENERAL
 ****************************/
body {
	background-color: black;
	color: whitesmoke;
	font-family: verdana;
	padding: 5px;
	margin: 0;
}
a {
	color: skyblue;
	text-decoration: underline;  /* MTS: était à none -> underline pour liens soulignés */
	
}
a:hover {
	color: white;
	
}



/****************************
 ** TITRE PAGE
 ****************************/
body h1 { /* titre principal */
	font-size: 60px;
	font-weight: normal;
	padding: 0;
	margin: 0;
	border: none;
}
body h1 a {
	color: whitesmoke;
	font-size: 60px;
}
body h1 a:hover {
	color: khaki;
	font-size: 60px;
}

/****************************
 ** CONTENU general
 ****************************/

div#layout, img.arriere-plan, div#contenu
{
	width: 1000px; /* etait a 1024*/
	height: 2000px; /* etait a 730 */
	font-size: 30px; /* ajout MTS */
}

div#layout {
	position: relative;
}
img.arriere-plan {
	opacity: 0.7;
	filter:Alpha(opacity=70); /* MTS: pour IE */
	position: absolute;
}
img#contact, img#blog {
	opacity: 1;
}


/****************************
 ** CONTENU pour pages Albums
 ****************************/
 
div#imageCD {
	width: 900px;
	height: 900px;
	margin-top: 10px;
	margin-left: 20px; 
	font-size: 13px;
	font-style: none;
	text-align: left;
	padding: 5px 35px 35px 5px; /*padding bottom et right augmentés pour IE (troncature player believe sinon */
	color: lightyellow;
	background-color: transparent;
	opacity: 1;
	filter:Alpha(opacity=100);
	border: none;
	position: absolute;
}	
 
 
div#players {
	width: 1000px; /* etait a 400 */
	height: 500px;
	margin-top: 700px;
	margin-left: 0px; /* etait a 500 */
	font-size: 30px;
	font-style: none;
	text-align: left;
	padding: 5px 5px 5px 5px; /*padding bottom non nul pour IE (troncature texte sinon */
	color: lightyellow;
	background-color: transparent;
	opacity: 1;
	filter:Alpha(opacity=100);
	border: none;
	position: absolute;
}	



div#texteCD{
	width: 1000px;
	height: 420px;
	margin-top: 1320px; /* pour les albums sans player believe */
	margin-left: 0px; 
	font-size: 30px;
	font-style: none;
	text-align: left;
	padding: 5px 5px 0 5px; /*bottom est nul */
	color: lightyellow;
	background-color: darkslategrey;
	opacity: 0.8;
	filter:Alpha(opacity: 80);
	border: groove 5px white;
	position: absolute;
}	
div#texteCD2{
	width: 900px;
	height: 500px;
	margin-top: 1400px; /*adaptée au nouveau player believe */
	margin-left: 10px; 
	font-size: 23px;
	font-style: none;
	text-align: left;
	padding: 5px 5px 0 5px; /*bottom est nul */
	color: lightyellow;
	background-color: darkslategrey;
	opacity: 0.8;
	filter:Alpha(opacity: 80);
	border: groove 5px white;
	position: absolute;
	
}	
div#texteCD3{
	width: 800px;
	height: 750px;
	margin-top: 400px; 
	margin-left: 50px; 
	font-size: 30px;
	font-style: none;
	text-align: left;
	padding: 5px 5px 0 5px; /*bottom est nul */
	color: lightyellow;
	background-color: darkslategrey;
	opacity: 0.8;
	filter:Alpha(opacity: 80);
	border: groove 5px white;
	position: absolute;
	
}	



div#cadrejardin {	/* encadre le diaporama */
	width: 700px;
	height: 490px;
	margin-top: 0px;
	margin-left: 250px; /*700*/
	font-size: 15px; /*20*/
	font-style: italic;
	padding: 1px 1px 1px 1px;
	color: lightyellow;
	background-color: darkslategrey; /* transparent*/
	opacity: 1;
	filter:Alpha(opacity=100);
	border: groove 5px white;
}

div#logojardin{	/* encadre le logo - margin left est définie par une class */
	width: 150px;
	height: 100px;
	margin-top: 10px;
	padding: 0 0 0 0;
	background-color: darkslategrey; 
	opacity: 1;
	filter:Alpha(opacity=100);
	border: 2;
	position: absolute;
}
#logojardin.position1{margin-left: 50px}
#logojardin.position2{margin-left: 250px}
#logojardin.position3{margin-left: 450px}
#logojardin.position4{margin-left: 650px}
#logojardin.position5{margin-left: 850px}

div#logojardin img { position: relative; } /* permet le redimentionnement au passage de la souris, pour IE */


/****************************
 ** CONTENU page liens (tableau)
 ****************************/


td
{
text-align: center;
width: 200px;
}



div#contenu {
	color: lightyellow;
	position: absolute;
	z-index: 2;
	overflow: auto;
}
div#contenu h1 { /* titre du contenu */
	font-size: 20px;
	font-weight: bold;
	border: none;
	padding: 0;
	margin: 20px 5px 10px 5px;
}
div#contenu h2 {
	font-size: 15px;
	font-weight: bold;
	border: none;
	padding: 0;
	margin: 10px 5px 10px 5px;
}
div#contenu p, div#contenu ul {
	margin: 0 5px 5px 5px;
}

#contenu.jardin {color: ivory;} /*black*/


/****************************
 ** PIED DE PAGE
 ****************************/
div#footer {
	width: 1200px;
	text-align: center;
	font-size: 12px;
}

/****************************
 ** MENU (horizontal, en haut)
 ****************************/
ul.menu1 { /* menu principal */
	font-size: 20px;
	list-style-type: none;
	padding: 0px;
	margin: 5px 0 0 0; /* margin top non nulle */
}
ul.menu1 li { /* menu principal - entrée */
	position: relative;
	margin: 0px;
	padding: 0px 10px 0px 0px; /* padding right a 10 */
	display: inline;
}
ul.menu1 a { /* menu principal - lien */
	text-decoration: none;
	color: whitesmoke;
	white-space: nowrap;
}
ul.menu2, ul.menu3 { /* menu secondaire + tertiaire */
	list-style-type: none;
	margin: 0;
	padding: 2px 3px;
	position: absolute;
	top: 24px;
	left: 0px;
	display: none;
	text-align: left;
	border-top: dashed 1px khaki;
	border-bottom: dashed 1px khaki;
	background-color: black;
	opacity: 0.7;
    filter: alpha(opacity=70);
	z-index: 10; /* grosse valeur pour être au-dessus de tout */
}
ul.menu3 { /* menu tertiaire */
	top: -3px;
}
ul.menu2 li, ul.menu2 a { /* menu secondaire - entré */
	display: block;
	padding: 0;
}
ul#demarche { /* personnalisation menu Démarche pour menu niveau 3 */
	width: 200px;
}
ul#demarche ul.menu3 { /* personnalisation menu niveau 3 du menu Démarche */
	left: 160px;
}
ul.menu1 li:hover a, ul.menu1 li:hover ul.menu2 a:hover{ /* menu principal + secondaire - survol lien */
	color: khaki;
}
ul.menu1 li:hover ul.menu2 a { /* menu secondaire - lien */
	color: whitesmoke;
}
ul.menu1 li:hover ul.menu2, ul.menu1 li:hover ul.menu2 li:hover ul.menu3 { /* affichage menu secondaire et tertiaire sur survol entrée principale */
	display: block;
}
ul.menu1 a.logo img, ul.menu1 a.lang img { /* menu principal - images logo et langue */
	width: 30px; /* MTS: applique sur les pages secondaires */
	
	vertical-align: middle;
	border: none;
}