/* Généralités */
body {margin: 0 10.80%; padding: 0; background: url(images/ligne.gif) repeat-y fixed top;}

h1 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #5c7b52; font-size: 0.75em; font-weight: normal;}

h2 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #5c7b52; font-size: 0.75em; font-weight: normal; text-align:right;}

h3 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #5c7b52; font-size: 0.75em; font-weight: bold;}

h4 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #5c7b52; font-size: 0.90em; text-transform: uppercase; letter-spacing: 0.10em;}

h5 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #5c7b52; font-size: 0.90em; font-weight: bold; text-align: center;}

h6 {font-family: Verdana, Arial, Helvetica, sans-serif; color: #5c7b52; font-size: 0.75em; font-weight: normal; text-align: center;}


/* Positionnement contenu */
#contenu {position: relative; height: 100%; width: 48em; top: 12em; background: url(images/fond.gif) bottom no-repeat fixed; margin-left: auto; margin-right: auto; }
html>body #contenu {top: 9.2em; height: 100%; overflow: hidden; margin-top: 0.20em;}

/* Positionnement photo centrale */
#image {position: absolute; top: 2.10em; width: 50em; height: 100%; margin-left: auto; margin-right: auto; }
html>body #image{width: 782px;}

/* Positionnement header */
#header {position: absolute; top: 0em; z-index: 1;}

/* Liens 1 */
.liens a {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; border-bottom: #5c7b52 1px dotted; text-decoration: none;}
.liens a:hover {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; border-bottom: #5c7b52 0px; text-decoration: none;}

/* Liens 2 */
.liens2 a {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; border-bottom: none; text-decoration: none;}
.liens2 a:hover {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; border-bottom: 1px dotted; text-decoration: none;}

/** Instruction vue par tous les navigateurs récents **/
.header {position: relative; top: -3.40em; left: 50em; width: 15em; color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.80em; text-decoration: none; z-index: 2;}
.header a {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.80em; border-bottom: #5c7b52 1px dotted; text-decoration: none; z-index: 2;}
.header a:hover {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.80em; border-bottom: #5c7b52 0px ; text-decoration: none; z-index: 2;}
 
/** Instruction vue seulement par IE **/
* html .header {position: relative; top: -4.20em; left: 50em; color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.80em; text-decoration: none; z-index: 2;}
* html .header a {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.80em; border-bottom: #5c7b52 1px dotted; text-decoration: none; z-index: 2;}
* html .header a:hover {color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.80em; border-bottom: #5c7b52 0px ; text-decoration: none; z-index: 2;}

/* menu */
dl, dt, dd, ul, li {margin: 0; padding: 0; list-style-type: none;}

#menu {position: relative; top: 9em; left: 28em; background-color: #efefef; width: 14.20em; height: 6.70em; z-index:1; /* pour IE6 uniquement */ -margin-left: 10.30%;}
html>body #menu {top: 9.05em;}

#menu dt {cursor: pointer; background: #efefef; height: 1.60em; line-height: 1.60em; margin: 2px 0; border: 0.10em solid white; text-align: center; font-size: 0.70em; color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold;}

#menu dd {position: absolute; z-index: 8; left: 12.50em; margin-top: -3em; width: 12em; background: #efefef; border: 0.10em solid white;}

#menu ul {padding: 2px;}
#menu li {text-align: center; font-size: 0.70em; color: #5c7b52; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; height: 1.60em; line-height: 1.60em;}
#menu li a, #menu dt a {color: #5c7b52; text-decoration: none; display: block;}

#menu li a:hover {text-decoration: underline;}


/* Positionnement photo Arthur et Duke */
.liengalerie {text-align: center;}

/* Positionnement new page index */
#nouveau {position: absolute; top: 5em;}

/* Image map voeux 2011 */
#imap {display:block; width:420px; height:303px; background:url(images/voeux_2011.jpg); position:relative;}

#imap dd {position:absolute; padding:0; margin:0;}
#imap #pic1 {left:50px; top:62px; z-index:20;}
#imap #pic2 {left:50px; top:210px; z-index:20;}
#imap #pic3 {left:192px; top:78px; z-index:20;}
#imap #pic4 {left:170px; top:210px; z-index:20;}
#imap #pic5 {left:310px; top:210px; z-index:20;}
#imap #pic6 {left:310px; top:42px; z-index:20;}

#imap a#will, #imap a#zappi, #imap a#fritz, #imap a#nounoulola, #imap a#dune, #imap a#pongo {display:block; width:85px; height:85px; text-decoration:none; z-index:20;}

#imap a span, #imap a:visited span {display:none;}

#imap a#will:hover, #imap a#zappi:hover, #imap a#fritz:hover, #imap a#nounoulola:hover, #imap a#dune:hover, #imap a#pongo:hover {background-position:0 0;}

#imap a:hover span {position:absolute;  width:400px; display:block; font-family:arial; font-size:12px; background:#fff; color:#000; border:1px solid #000; padding:5px;}
* html #imap a:hover span {width:400px; w\idth:388px;}
#imap a#will:hover span {left:-50px; top:250px;}
#imap a#zappi:hover span {left:-50px; top:110px;}
#imap a#fritz:hover span {left:-195px; top:250px;}
#imap a#nounoulola:hover span {left:-170px; top:110px;}
#imap a#dune:hover span {left:-315px; top:110px;}
#imap a#pongo:hover span {left:-315px; top:270px;}

#imap a span:first-line {font-weight:bold; font-style:italic;}