body, html {
	background-color: #fff; /* Fond en blanc */
    margin: 0 auto; /* On mets la marge à 0 et on la laisse se gérer automatiquement */
    padding: 0; /* On mets le padding à 0 */
    width: 80%; /* On place la largeur en pourcentage */
    height: 80%; /* On place la hauteur en pourcentage */
    font-family: "Helvetica", sans-serif; /* Changement de la police */
	color: #555; /* Couleur de la police en gris */
	text-align: justify; /* Texte justifié */
	/*background: url("img/favicon.jpg");*/
}

a {
	text-decoration: none; /* On retire la décoration de tous les liens */
}

h1 {
	margin-top: 2px;
	margin-bottom: 10px;
	text-align: center; 
	color: navy; /* On mets le titre en orange */
}

h3 {
	margin-top: 50px;
	margin-bottom: 10px;
	font-size : 16px;
	padding-top: 8px;
	border-top: 1px black solid; /* Bordure pour faire un trais de séparation */
}

h4 {
	font-style: italic;
	font-family: "Helvetica", sans-serif;
	font-size: 16px;	
  	margin: 0 auto; /* On mets la marge à 0 et on la laisse se gérer automatiquement */
    padding: 40px; /* On mets le padding à 0 */
    width: 100%; /* On place la largeur en pourcentage */
    height: 100%; /* On place la hauteur en pourcentage */
}

img {
	margin-top: 5px;
	margin-bottom: 5px;
}

footer {
	padding-top : 20px ;
	border-top: 2px black solid;
	cursor: help; /* On change de curseur */
}


nav {
	width: 230px; /* On définit la taille */
	top: 10px; /* On mets le cadre nav à 10 pixels du haut */
	right: 10px; /* On le mets aussi à 10 pixels de la droite */
	position: fixed; /* On le laisse fixe */
	background: #333; /* On mets la couleur du fond en gris */
	opacity: 0.75; /* On gère la transparence */
	cursor: pointer; /* On change le curseur */
}

nav a, nav li {
	color: #FFF; /* On mets les liens et les listes de nav en blanc */
	padding: 2px;
    margin-left: 5px;
    margin-right: auto;
}

#img-petite {
	margin-left: auto;
    margin-right: auto;
    display: block;
    width: 65%; /* On mets les images à 100% pour qu'elle redimentionnent automatiquement */
}

.img-grande {
	margin-left: auto;
    margin-right: auto;
    display: block;
    width: 90%; /* On mets les images à 100% pour qu'elle redimentionnent automatiquement */
}

#petitprince {
	width: 75%; /* On mets l'image du nav à 75% de son cadre */
	padding-bottom: 5px;
}

.video {
	margin: auto;
	display: block;
	text-align: center; 
}

#chanson {
	margin: auto;
	display: block;
	text-align: center; 
}

#page {
    margin: 50px auto; /* On gère la taille de la page et des marges */
    padding: 20px;
    width: 80%;
    -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75); /* Gestion des ombres */
    -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
}