p
{
   text-align: justify;
   color: white;
   font-size: 0.9em;
   font-style:normal;
   font-family: "century gothic", arial, "times new roman", serif;
   text-indent: 30px;
   width: 80%;
   height: 70%;
   font-variant: normal;
   padding-top: 2px;
   margin: auto;
   margin-top: 20px;
}
h3
{
   text-align: center;
   text-decoration:none;
   font-style: normal;
   font-size: 1.1em;
   font-family: "lucida handwriting", arial, "times new roman", serif;
   width:100%;
   color: black;
   margin-top:5px;
   margin-bottom:40px;
   }
body
{
   background-color: rgb(248,181,88);
   width: 760px;
   text-align:center;
   letter-spacing:0.03em;
   line-height:110%;
   margin: auto; 
   margin-top: 10px;
   margin-bottom:10px; 
   background-image:url("logo.jpg");
   background-repeat:no-repeat;
   background-position: 30px 50px;
   background-attachment:fixed;   
}

.highlight
{
background-color:rgb(0,162,0);
border-right-width:200px;
border-left-width:200px;
line-height:100%;
}

span.istruzioni
{
background-color:blue;
text-align: center;
}

h1
{
   text-align: center;
   font-style: normal;
   font-weight: bold;
   color:white;
   font-size: 2.8em;
   font-family: "lucida handwriting", arial, "times new roman", serif;
   width:100%;
   margin-top:80px;
   
 } 

.dessous
{
clear:both;
}

p:first-line
{font-variant:normal;
}

.statua
{
 position:relative; 
 text-align:center;
 font-size:0.2em;
 width:	200px;
 height:270px; 
 margin-right:2px;
 margin-left:10px;
 margin-bottom:40px;
 margin-top:40px;
 vertical-align:top;
}

.targa
{
 position:relative; 
 text-align:center;
 font-size:0.2em;
 width:515px;
 height:270px;
 margin-right:10px;
 margin-left:8px;
 margin-bottom:40px;
 margin-top:40px;
 vertical-align:top;
}

.notredame
{
  text-align: center;
  font-size: 2.0em;
  display:block;
  width: 220px;
  height:140px;   
  margin-top: 2px; 
  margin-bottom: 5px;
  margin-left: 10px;
  vertical-align:top;
  float: right;
}

.porto
{
  text-align: center;
  font-size: 3.5em;
  display:block;
  width: 330px;
  height:250px;   
  margin-top: 10px; 
  margin-bottom: 6px;
  margin-left: 20px;
  vertical-align:top;
  float: right;
}

.africa2
{text-align: center;
  font-size: 3.5em;
  display:block;
  width: 340px;
  height:250px;   
  margin-top: 20px; 
  margin-bottom: 20px;
  margin-right: 20px;
  float: left;
  vertical-align:top;

}
.africa1
{text-align: center;
  font-size: 3.5em;
  display:block;
  width: 340px;
  height:250px;   
  margin-top: 10px; 
  margin-bottom: 10px;
  margin-left: 10px;
  float: right;
  vertical-align:top;
}
.fiori
{text-align: center;
  font-size: 3.5em;
  display:block;
  width: 250px;
  height:180px;   
  margin-top: 5px; 
  margin-bottom: 1px;
  margin-left: 10px;
  float: right;
  vertical-align:top;
}
.giardino
{
  text-align: center;
  font-size: 4.3em;
  display:block;
  width: 280px;
  height:200px;   
  margin-top: 3px; 
  margin-bottom: 2px;
  margin-left: 2px;
  margin-right:8px;
  float: left;
  vertical-align:top;
 
}

.africa3
{text-align: center;
  font-size: 3.5em;
  display:block;
  width: 200px;
  height:230px;   
  margin-top: 3px; 
  margin-bottom: 3px;
  margin-right: 20px;
  float: left;
  vertical-align:top;
}
.africa4
{ position:absolute;
  left:200px;
  top: 10px;
  right: 200px;  
  font-size: 2.5em;
  display:block;
  width: 180px;
  height:200px;   
  margin-top: 5px; 
  margin-bottom: 10px;
  margin-left: 10px;
  float: right;
  vertical-align:top;
}
.ingresso
{text-align: center;
  font-size: 2.1em;
  display:block;
  width: 80px;
  height:140px;   
  margin-top: 2px; 
  margin-bottom: 5px;
  margin-right: 8px;
  float: left;
  vertical-align:top;
}
.budda
{text-align: center;
  font-size: 5.8em;
  display:block;
  width: 195px;   
  margin-top: 5px; 
  margin-bottom: 5px;
  margin-left: 20px;
  float: right;
  vertical-align:top;
}
.gazon
{text-align: center;
  font-size: 5.8em;
  display:block;
  width: 650px;
  height:90px;   
  margin-top: 10px; 
  margin-bottom: 1px;
  margin-left: 2px;
  
}
.mandarin
{text-align: center;
  font-size: 4.8em;
  display:block;
  width: 90px;
  height:200px;
  margin-top: 5px;
  margin-left: 10px;
  
}

.asia1
{text-align: center;
  font-size: 5.8em;
  display:block;
  width: 240px;
  height:300px;   
  margin-top: 1px; 
  margin-bottom: 5px;
  margin-right: 8px;
  float: left;
  
}
.asia2
{ font-size: 2.5em;
  width: 300px;
  height:240px;   
  margin-right: 36px;
  margin-left:0px;
  margin-bottom: 5px;
  float: left;
}
.asia3
{ font-size: 2.5em;
  width: 230px;
  height:280px;   
  margin-bottom: 5px;

}
.oriol
{text-align: center;
  font-size: 5.3em;
  display:block;
  width: 200px;
  height:280px;   
  margin-top: 5px; 
  margin-bottom: 5px;
  margin-right: 10px;
  float: left;
  vertical-align:top;
}
.tram
{text-align: center;
  font-size: 5.0em;
  display:block;
  width: 320px;
  height:280px;   
  margin-top: 20px; 
  margin-bottom: 10px;
  margin-right: 10px;
  float: left;
  vertical-align:top;
}
.plan1
{
  text-align: center;
  display:block;
  width: 500px;
  height:600px;   
  margin-top: 5px; 
  margin-bottom: 10px;
  margin-left: 6px;
  vertical-align:top;
  float:right;  
}
.plan2
{
  text-align: center;
  display:block;
  width: 500px;
  height:600px;   
  margin-top: 5px; 
  margin-bottom: 10px;
  margin-left: 6px;
  vertical-align:top;
  float:right;  
}
.terrazza
{
  display:block;
  position:absolute;
  top: 80px;
  left:320px;
  width: 340px;
  height:260px;      
}
.asia4
{
  display:block;
  width: 340px;
  top: 80px;
  left:680px;
  height:260px;   
  position:absolute;
}
.tramonto
{
  display:block;
  width: 300px;
  height:260px;   
  margin-top: 20px; 
  margin-bottom: 10px;
  margin-left: 20px;
  vertical-align:top;
  float:right;  
}
.velo
{
  display:block;
  width: 300px;
  height:260px;   
  margin-top: 20px; 
  margin-bottom: 10px;
  margin-left: 20px;
  vertical-align:top;
  float:right;  
}

.corniche
{
  display:block;
  width: 300px;
  height:240px;   
  margin-top: 10px; 
  margin-bottom: 10px;
  margin-right: 10px;
  float:left;  
}

span.petitjardin
{
   background-color:rgb(0,162,0);
   font-family: "lucida handwriting", arial, "times new roman", serif;
   line-height:100%;
}
.spiaggia
{
  display:block;
  text-align: center;
  font-size: 3.1em;
  width: 200px;
  height:240px;   
  margin-top: 5px; 
  margin-bottom: 5px;
  margin-right:10px;
  vertical-align:top;
  float:left;
 } 


#en_tete
{
   width: 	760px;
   height: 10px;

   margin-bottom: 30px;
   margin-top: 10px;
   margin-right:50px;
   margin-left:50px;
}

.menu
{
   width: 760px;
   background-position: center;
   bottom:5px;
   top:80px;
   text-align:center;   
   
}


.element_menu h2 /* Tous les titres de menus */
{    
   color: black;
   font-family: "century gothic", "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
   margin-bottom: 5px;
   margin-top: 5px;
   margin-left:350px;
   margin-right:350px;
   width:8%;
   font-style: normal;
   font-weight:bold;
   font-size: 0.7em;
   border: 3px outset rgb(84,177,75);
   padding-right:8px;
   padding-left:8px;
   background-color: rgb(253,255,125);
   
   
}

.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
   list-style-image: url("images/puce.png"); /* On change l'apparence des puces */
   padding: 2px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 2px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
   padding-right: 200px;
   margin: 8px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
   margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}

.element_menu a /* Tous les liens se trouvant dans un menu */
{
   color: black;
   text-decoration:none;
 
}

.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: rgb(84,177,75);
   color: black;
}

#corps
{
   margin-left: 20px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 5px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   padding: 10px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   width:760px;
   color: #B3B3B3;
   background-color: #626262; /* Une couleur de fond pour le corps */
   background-image: url("images/motif.png");
   background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */   
   border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

table
{
   border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
   width:100%;
   margin:auto;
  
}
th
{
   
   font-family: "century gothic", "Arial Black", "Times New Roman", Times, serif;
   font-size:0.9em;
   font-style:normal;
   font-variant: normal;
   padding-top: 2px;
   padding-bottom: 2px;
   color:black;
}

td
{
   
   font-family: "century gothic", "Arial Black", "Times New Roman", Times, serif;
   font-size:0.9em;
   font-style:normal;
   font-variant: normal;
   padding-top: 2px;
   padding-bottom: 2px;
   color:black;
}

.debut/* Distance des boutons de la marge gauche */
{ 
   margin-left:310px;
}

.stilecamera  /* Tous les titres de menus */
{    
   color: black;
   font-family: "century gothic", "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
   margin-left:20px;
   width:50px;
   font-style: normal;
   font-weight:bold;
   font-size: 0.7em;
   border: 3px outset rgb(84,177,75);
   padding-right:9px;
   padding-left:9px;
   background-color: rgb(253,255,125);
   float:left;
}

.stilecamera ul /* Toutes les listes à puces se trouvant dans un menu */
{
   
   padding: 2px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 2px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
   padding-right: 200px;
   margin: 8px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
   margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}
.stilecamera a /* Tous les liens se trouvant dans un menu */
{
   color: black;
   text-decoration:none;
}
.stilecamera a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: rgb(84,177,75);
   color: black;
}
.mappa h2 /* Tous les titres de menus */
{    
   color: black;
   font-family: "century gothic", "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
   margin-bottom: 3px;
   margin-top: 3px;
   margin-left:350px;
   margin-right:150px;
   width:8%;
   font-style: normal;
   font-weight:bold;
   font-size: 0.7em;
   border: 3px outset rgb(84,177,75);
   padding-right:9px;
   padding-left:9px;
   background-color: rgb(253,255,125);  
}

.mappa ul /* Toutes les listes à puces se trouvant dans un menu */
{
   
   padding: 2px; /* Tous les côtés ont une marge intérieure de 0 pixels */
   padding-left: 2px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
   padding-right: 200px;
   margin: 8px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
   margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}
.mappa a /* Tous les liens se trouvant dans un menu */
{
   color: black;
   text-decoration:none;
}
.mappa a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: rgb(84,177,75);
   color: black;
}