/* =====================================================
   style_commun.css — Fabrice Escher
   Règles partagées par toutes les pages du site
   Encodage : UTF-8
===================================================== */


/* --- Base --- */

body {
   font-family: "Book Antiqua", "Palatino Linotype", Palatino, Georgia, serif;
   background-color: #e0d6c0;
   color: #334155;
   width: 930px;
   margin: auto;
   margin-top: 10px;
   margin-bottom: 20px;
}

/* --- Structure --- */

#header {
   width: 930px;
   height: 148px;
}

#corps {
   width: 930px;
   padding-left: 15px;
}

#corps img {
   box-shadow: 3px 3px 3px #334155;
}

/* --- Typographie commune --- */

h1 {
   padding-top: 15px;
   font-family: Papyrus, "Tempus Sans ITC", Georgia, serif;
   font-size: 180%;
   color: #334155;
   width: 870px;
   border-bottom: 2px solid #334155;
}

h2 {
   padding-top: 5px;
   font-family: Papyrus, "Tempus Sans ITC", Georgia, serif;
   font-size: 150%;
   border-bottom: 2px solid #334155;
   width: 870px;
}

h3 {
   font-family: Papyrus, "Tempus Sans ITC", Georgia, serif;
   color: #334155;
   margin-bottom: 35px;
}

h4 {
   font-family: Papyrus, "Tempus Sans ITC", Georgia, serif;
   color: #334155;
}

p {
   width: 870px;
   text-align: justify;
}

/* --- Liens --- */

a {
   text-decoration: none;
   color: #334155;
   font-weight: bold;
}

a:hover {
   text-decoration: underline;
}

/* --- Listes --- */

ul {
   list-style-type: square;
}

li strong {
   margin-left: 10px;
}

/* --- Bouton de réservation (commun à toutes les fiches massage) --- */

.rdv {
   margin-top: 10px;
   margin-bottom: 10px;
}

.rdv th a {
   font-family: Papyrus, "Tempus Sans ITC", Georgia, serif;
   font-size: 105%;
   border: 3px solid #334155;
   border-radius: 25px;
   box-shadow: 2px 2px 2px #334155;
   width: 350px;
   text-align: center;
   margin-bottom: 20px;
   margin-top: 20px;
   line-height: 45px;
   display: block;
   background: #c0b6b7;
   color: #334155;
   text-decoration: none;
}

.rdv th a h3 {
   margin: 0;
   padding: 0;
   line-height: inherit;
}

.rdv th a:hover {
   background: #e0d6c0;
   text-decoration: none;
}

/* --- Photos de massage (disposition commune) --- */

.photo_massage {
   float: right;
   margin-right: 85px;
   margin-top: 10px;
   margin-left: 30px;
}

.photos_technique {
   float: right;
   margin-right: 52px;
}

/* --- Descriptif --- */

.descriptif {
   text-align: justify;
   margin-bottom: 25px;
}

.descriptif th {
   width: 200px;
   text-align: left;
}

.descriptif td {
   width: 100px;
}

/* --- Séparateur --- */

.souligne {
   width: 870px;
   border-bottom: 2px solid #334155;
   margin-top: 25px;
   margin-bottom: 25px;
}

/* --- Footer --- */

#footer {
   font-size: 90%;
   width: 775px;
   margin-left: 25px;
   margin-top: 60px;
   margin-bottom: 25px;
   border: 1px solid #334155;
   border-radius: 8px;
   padding: 15px 20px;
   text-align: center;
}

#footer p {
   text-align: left;
   width: auto;
   margin: 0;
   border: none;
   box-shadow: none;
   padding: 0;
}

#footer a {
   display: inline;
   font-weight: normal;
}

#footer a:hover {
   text-decoration: underline;
   color: #334155;
   display: inline;
   background: none;
}

/* --- Menu déroulant --- */

#menu_deroulant,
#menu_deroulant ul {
   padding: 0;
   margin: 0;
   list-style: none;
   line-height: 30px;
   text-align: center;
}

#menu_deroulant {
   font-family: "Tempus Sans ITC", Georgia, serif;
   font-size: 109%;
   position: relative;
   right: 15px;
   z-index: 1;
}

#menu_deroulant a {
   display: block;
   padding: 0;
   background: #475569;
   color: #e0d6c0;
   text-decoration: none;
   width: 231px;
   font-weight: normal;
}

#menu_deroulant li {
   float: left;
   border-right: 1px solid transparent;
}

#menu_deroulant li ul {
   position: absolute;
   width: 154px;
   left: -999em;
}

#menu_deroulant li ul li {
   border-top: 1px solid transparent;
   border-bottom: 2px solid #475569;
}

#menu_deroulant a:hover {
   color: #475569;
   background: #e0d6c0;
   font-weight: bold;
}

#menu_deroulant li:hover ul ul,
#menu_deroulant li.sfhover ul ul {
   left: -999em;
}

#menu_deroulant li:hover ul,
#menu_deroulant li li:hover ul,
#menu_deroulant li.sfhover ul,
#menu_deroulant li li.sfhover ul {
   left: auto;
   min-height: 0;
}