html {font-size: 100%;}

body {
  text-align: center;
  font-family: "Trebuchet MS", Tahoma, Verdana, sans serif;
  font-size: 1em;
  color: #efefef;
  letter-spacing: 0.1em;
  line-height: 1.25;
  margin: 2em 0;
  padding: 0;
  background: url(logos/back.gif) repeat fixed left top; }

.oldbrowser {
  display: none;}

.centre{
  text-align: center;
  padding: 3px 0;}
  
a:link, a:visited {
  color: #efefef;
  text-decoration: none;}

a:hover {
  color: #FF7200;
  text-decoration: none;}
  
a img {border: 0;}

/* Titres */
h1, h2, h3{
font-family: "Segoe print", Verdana, Helvetica, sans-serif ;
}

h1{
  font-size: 1.7em ; 
  color: #9f9f9f;
  margin: 1px 3px 1px 3px;
  letter-spacing: 0.3em;
  padding: 4px 0 0 0;
  }
  
h2{
  font-size: 1.5em ; 
  color: #efefef;
  margin: 1px 0 0 10px;
  padding:5px 0 0 6px;
  letter-spacing: 0.1em;
 } 
  
h3{
  font-size: 1em ; 
  color: #efefef;
  margin: 1px 0 0 20px;
  padding:5px 0 0 6px;
  letter-spacing: 0.1em;
  } 
  
h4{
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 0.7em;
  color: #eAeAeA;
  word-spacing: 0.2em; 
  margin: 0;
  padding: 2px 0;}
  
h5{
  font-size: 1.3em ; 
  color: #efefef;
  margin: 30px 0 10px 0;
  padding: 30px 0 5px 0;
  letter-spacing: 0.2em;
  } 


/************* positions des calques **************/

#pied{ 
  background-color: #1f1f1f ;
  text-align: center;
  width: 98%;
  margin: 0 auto;
  padding: 4px 0px 4px 0px; 
  border-top: 1px solid #373737; 
  clear: both;}
  
#pied a:link{
  color: #87CEEB;}
  
#pied a:hover{
  color: #FF7200;}
   
#contenu {  
  padding: 25px 5px 0 10px;  
  margin-left: 0px;
  background-color: #333;}
  
#contenu a:link{
  color: #87CEEB;}
  
#contenu a:hover{
  color: #FF7200;}
  
#liste1 li {
  list-style-type: none;
  margin: 0.5em 0;
  text-indent: 1em}
  
#listeliens li {
  list-style-type: none;
  margin: 1.5em 0 1.5em 0;
  text-indent: 1em}
  
  
  
.menu2 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url(logos/button1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;}
.menu2 li {float:left;}
.menu2 li a {display:block; float:left; height:35px; line-height:35px; color:#fff; text-decoration:none; font-size:1em; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; text-align:center; padding:0 0 0 7px; cursor:pointer;}
.menu2 li a b {float:left; display:block; padding:0 12px 0 6px;}
.menu2 li.current a {color:#fff; background:url(logos/button3.gif);}
.menu2 li.current a b {background:url(logos/button3.gif) no-repeat right top;}
.menu2 li a:hover {color:#fff; background:#000 url(logos/button4.gif);}
.menu2 li a:hover b {background:url(logos/button4.gif) no-repeat right top;}
.menu2 li.current a:hover {color:#fff; background:#000 url(logos/button3.gif); cursor:default;}
.menu2 li.current a:hover b {background:url(logos/button3.gif) no-repeat right top;}



/* Carte cliquable d'ouessant */

.ouest {padding:0; margin:10px 0px; position:relative; z-index:100;}

/* deplacer le texte hors de l ecran */
.ouest b {text-indent:-1399px; display:block; width:10px; height:10px; background:#ff8c00; position:absolute; line-height:8px;}

/* rendre images invisibles */
.ouest b em {visibility:hidden; position:absolute;}

/* position des carres */
.ouest b.oue {top:-64px; left:407px;}
.ouest b.cro {top:-48px; left:373px;}
.ouest b.yus {top:-36px; left:344px;}
.ouest b.cre {top:-45px; left:369px;}
.ouest b.kel {top:-39px; left:395px;}
.ouest b.per {top:-41px; left:374px;}
.ouest b.jum {top:-47px; left:321px;}
.ouest b.lam {top:-49px; left:305px;}
.ouest b.mout {top:-47px; left:396px;}
.ouest b.arl {top:-35px; left:329px;}

/* ramener le texte de la fleche lors de hover */
.ouest b:hover {background:#1f1f1f; text-indent:0; height:1.2em; font-size:0.9em; color:#ddd; line-height:0.9em; padding:2px 10px; width:90px;}

/* hack pour IE5.x */
* html .ouest b:hover {border:0; cursor:pointer; width:110px; height:1.5em; w\idth:90px; he\ight:1.2em;}

/* rendre text description invisible et affichage cadre*/
.ouest b:hover em {visibility:visible; margin-left:5px; background:#ddd; border:3px solid #1f1f1f; width:200px; color:#000; padding:20px; font-style:normal; top:-135px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; letter-spacing:1px; line-height:1.3em;}

/* hack pour IE5.x */
* html .ouest b:hover em {width:200px; w\idth:150px;}

/* cadre image */
.ouest b:hover em img {border:1px solid #fff; display:block; margin-bottom:10px;}

/* style du span vide(pas semantiquement correct) dans un point de fleche*/
.ouest b:hover em span {display:block; width:0; height:0; overflow:hidden; border:15px solid #ddd; border-width:15px 0 15px 15px; border-left-color:#1F1F1F; position:absolute; left:0; top:128px;}

/* hack pour IE5.x */
* html .ouest b:hover em span {width:30px; height:30px; w\idth:0; he\ight:0;}
/* Fin de carte cliquable d'ouessant */



#menu { 
  margin: 0px;  
  background-color: #1F1F1F} 
  
  
#titre { 
  text-align: center;
  background-color: #1f1f1f ;
  margin: 0;
  padding: 8px 0 8px 0;
  -moz-border-radius: 10px 10px 0 0; 
        -webkit-border-radius: 10px 10px 0 0; 
        border-radius: 10px 10px 0 0;         
        -webkit-border-top-left-radius: 10px; /* pour Chrome */ 
        -webkit-border-top-right-radius: 10px; /* pour Chrome */ }

#page {  
  text-align: left;
  width: 90%;
  min-width: 800px;
  max-width: 1100px; 
  margin: 10px auto;  
  background: url(logos/gauche.gif) repeat-y ;
  border: 3px solid #8F8F8F;  
  padding: 0;
  -moz-border-radius: 10px 10px 10px 10px; 
        -webkit-border-radius: 10px 10px 10px 10px; 
        border-radius: 10px 10px 10px 10px;         
        -webkit-border-top-left-radius: 10px; /* pour Chrome */ 
        -webkit-border-top-right-radius: 10px; /* pour Chrome */ 
		-webkit-border-bottom-left-radius: 10px; /* pour Chrome */ 
        -webkit-border-bottom-right-radius: 10px; /* pour Chrome */ }  
		
#imagelivre {
padding: 10px;
margin: 10px; 
float: left; }
	
#pagerever {  
  width: 90%;
  min-width: 800px;
  max-width: 1100px; 
  margin: 10px auto;  
  background: #1E1E1E ;
  border: 3px solid #8F8F8F;  
  padding: 0;
  -moz-border-radius: 10px 10px 10px 10px; 
        -webkit-border-radius: 10px 10px 10px 10px; 
        border-radius: 10px 10px 10px 10px;         
        -webkit-border-top-left-radius: 10px; /* pour Chrome */ 
        -webkit-border-top-right-radius: 10px; /* pour Chrome */ 
		-webkit-border-bottom-left-radius: 10px; /* pour Chrome */ 
        -webkit-border-bottom-right-radius: 10px; /* pour Chrome */ } 

/********************* fin **********************/