* { margin: 0; padding: 0; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after,
q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

a { color: #85B7FC; }
a:active { outline: none; }
a:focus { -moz-outline-style: none; }
  a img { border: 0;}

.petit {font-size: .8em; text-align: right; font-style: italic; }
.flottant-droite { float: right; padding-right: 10px; }

/***** Global Settings *****/
html { border:0; margin:0; padding:0; background: url("images/degrade.jpg") #86C7FD left top repeat-x; font-size: 100%;}
body { font:.95em/1.4 "Comic Sans MS", Arial, Helvetica, sans-serif; color: black; margin: 0; padding: 0; background: url("images/fond-accueil.jpg") left top repeat-y; }
span { display: none; }
#general { background: url("images/gribouillis-home.jpg") left top no-repeat; }
#page { width: 880px; }

/* HEADER */
#header { width: 880px; height: 260px; padding: 1px 0 0 0; float: left; }
	#header a { width: 300px; height: 175px; display: block; margin: 29px 0 0 60px; }
	#header a:hover { background: url("images/titre-hover.png") left top no-repeat;	}
	#header input.recherche { width: 180px; height: 14px; font-size: .8em; background: transparent; color: black; margin: 0 0 0 300px; border: none; vertical-align: top; }

/* NAV-GAUCHE */
#nav-gauche { width: 150px; height: 500px; float: left; display: inline; }
	#nav-gauche a { height: 65px; width: 80px; display: block; margin: 137px 0 0 30px; }
	#nav-gauche a:hover { background: url("images/rss-home.png") center no-repeat; }


/* CORPS DE LA PAGE */
#contenu { width: 400px; float: left; display: inline; text-align: justify; }
	#contenu h3 { text-align: left; padding: 0 0 0 50px; color: #86bbfd; }
	#contenu p { padding: 0 3px 0 10px; text-indent: 15px; }
	#contenu .date { font-size: .8em; text-align: right; font-style: italic; margin: 5px 0 30px 0; }
	#contenu img { display: block; margin: 3px auto; width: 200px; padding: 0px 10px; }
	#contenu div { margin-bottom: 45px; }
		#contenu div h2 { font-size: 1.2em; margin: 0 0 0 15px; border-bottom: 2px black solid; color: #85B7FC; }
			#contenu div h2 a { text-decoration: none; color: #85B7FC; }

	#chapeau { height: 50px; width: 400px; }


/* NAV-DROITE */
#nav-droite { float: right; width: 260px; margin: 23px 40px 0 0; display: inline; }
	#nav-droite #personnages { display: block; height: 130px; margin: 19px 75px 0 8px; }
	#nav-droite #personnages:hover { background: url("images/personnage-hover.png") left top no-repeat; }
#nav-droite ul { padding: 120px 20px 0 20px; }
	#nav-droite ul li a { display: block; height: 50px; }
	#nav-droite ul li #tous:hover { background: url("images/tout-home.png") center no-repeat;}
	#nav-droite ul li #couple:hover { background: url("images/couple-home.png") center no-repeat;}
	#nav-droite ul li #famille:hover { background: url("images/famille-home.png") center no-repeat;}
	#nav-droite ul li #divers:hover { background: url("images/divers-home.png") center no-repeat;}

#liens { clear: both; height: 50px; }

#pied_de_page { clear: both; background: url("images/pied-accueil.jpg") left bottom no-repeat; height: 420px; position: relative; top: 0; left: 0;}
	#pied_de_page #pm { position: absolute; top: 0px; left: 580px; height: 100px; width: 200px; }
	#pied_de_page #pm:hover { background: url("images/home-pm.png") center no-repeat;}
	#pied_de_page #contact { position: absolute; top: 180px; left: 470px; height: 190px; width: 220px;}
	#pied_de_page #contact:hover { background: url("images/home-contact.png") center no-repeat;}

#exterieur { font-size: .9em; text-align: center; color: black; }