#main { /* élément ayant pour identifiant "main" */
	background-image: url(../writings/main.jpg); /* image d'arrière-plan du cadre principal */
	background-position: center; /* l'image d'arrière-plan est centrée */
	background-repeat: no-repeat; /* suppression de la répétition de l'image d'arrière-plan */
	height: 617px; /* on définit la hauteur à 617 pixels, car l'image fait 633 pixels de hauteur et que cet élément défini dans "common.css" a une marge intérieure (padding) de 8 pixels: on enlève donc les 8 pixels du haut, et les 8 pixels du bas, soit 16 pixels */
	/* Autre possibilité: */
	/*padding: 0;*/ /* on définit les marges intérieures à zéro */
	/*width: 740px;*/ /* largeur de "#main" */
	/*height: 633px;*/
	/* */
	position: relative; /* mode de positionnement relatif, nécessaire (par défaut, c'est "position: static;") pour positionner les éléments suivants dans "main" en absolu */
}

#the_book {
	left: 108px; /* position à partir de la gauche */
	top: 411px; /* position à partir du haut */
	width: 216px;
	height: 60px;
	/*border: 3px dotted red;*/ /* Si l'on supprime ce commentaire, on a une bordure en pointillés: c'est pour vérifier le bon positionnement de la zone définie. */
	position: absolute;
}
#the_book:hover { /* ici, on définit ce qu'il se passe lorsque le pointeur souris survole l'élément */
	border: 3px solid #914ba0; /* bordure de 3 pixels pleine ayant le code couleur #914ba0 */
}

#her_writings {
	left: 388px;
	top: 412px;
	width: 216px;
	height: 60px;
	/*border: 3px dotted red;*/
	position: absolute;
}
#her_writings:hover {
	border: 3px solid #914ba0;
}

#songbook {
	left: 219px;
	top: 480px;
	width: 295px;
	height: 60px; /*border: 3px dotted red;*/
	position: absolute;
}
#songbook:hover {
	border: 3px solid #914ba0;
}


#footer {
	background-image: url(../writings/header.jpg);
	background-position: 0 -30px; /* position de l'image d'arrière-plan: 0 pixel en partant de la gauche, -30 pixels en partant du haut, ce qui revient à monter l'image d'arrière-plan de 30 pixels */
}
