html
{ height: 100%;}

*
{ margin: 0;
  padding: 0;}

body
{ font: normal 85% Arial, Helvetica, sans-serif;
  background: url(../images/Fond.jpg);
}

p
{ padding: 0 0 5px 0;
  text-align:center;
  font-style: 
  line-height: 1.7em;
  color: #000000;
  text-shadow: 0px 0px 0px #000000;
  font-size: 60% ;
 font-weight:normal;
}

img
{ border: 0;}

h1
{ font: normal 175% Book Antiqua;
  color: #000;
  text-shadow: 0px 1px 0px #FFF;
  letter-spacing: -1px;
  margin: 0px 0 0 285px;
  height:155px;
}

h2
{ font: italic 50% Georgia;
  color: #000000;
  text-align:center;
  text-shadow: 0px 1px 0px #000000;
  letter-spacing: -1px;
  margin: 0 0 10px 10px;}

a
{ color: inherit;
  text-shadow: 0px 0px 0px #FFF;
  font-weight: bold;
  background: transparent;
  outline: none;
  text-decoration: underline;}

a:hover
{ text-decoration: none;}

ul
{ margin: 2px 0 22px 30px;
  line-height: 1.7em;
  font-style: normal;
  font-size: 100%;}

ol
{ margin: 8px 0 22px 20px;}

ol li
{ margin: 0 0 11px 0;}

#main, #header, #MenuBarre, #site_content, #Pied, #Page
{ margin-left: auto; 
  margin-right: auto;}

#main
{ background: transparent;}

#MenuBarre
{ width: 980px;
  height: 835px;
  background: url(../images/PorteFontenay.jpg) ;
  background: -moz-linear-gradient(url(../images/PorteFontenay.jpg));
  background: -o-linear-gradient(url(../images/PorteFontenay.jpg));
  background: -webkit-linear-gradient(url(../images/PorteFontenay.jpg));
  border-radius: 0px 0px 15px 15px;
  -moz-border-radius: 0px 0px 15px 15px;
  -webkit-border: 0px 0px 15px 15px;} 
  
#Bienvenue
{ width: 980px;
  float: center;
  height: 50px;
  padding: 0 10px 0 5px;
  margin: 10px auto;
  background: transparent;}  
   
#Bienvenue h1 a
{ font: normal 150% Book Antiqua;
  letter-spacing: -3px;
  color: #FF6600;
  text-decoration: none;
  text-shadow: 1px 1px #000;
  float: center;}

ul#Bienvenue h1:hover a 
{ color: #000000;
  text-decoration:none;}

#MenuContenu
{ float: left;
  margin: 30px 0 0 90px;
  width: 980px;
  font: bold 100% Book Antiqua;
}
  
ul#menu
{ margin:0;
  float: left;
  font: bold 100% Book Antiqua;
}

ul#menu li
{ padding: 0 0 0 0;
  list-style: none;
  display: inline;
  }

ul#menu li a
{ float: left;
  font: bold 100% Book Antiqua;
  text-align: center;
  color: #FFF;
  text-decoration: none;
  height: 24px;
  text-shadow: 1px 1px #000;
  padding: 20px 15px 5px 15px;
  border:1px solid transparent;

  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

ul#menu li.current a { 
  font: bold 100% Book Antiqua;
  color: #FFFF66;
  text-shadow: 0px 0px 0px #000;
  border:1px solid transparent;
}

ul#menu li.current:hover a { 
  background: #1d1d1d url(../images/TrudaineRose.jpg) no-repeat;
  font: bold 100% Book Antiqua;
  color: #000000;
  text-decoration:none;
  border:1px solid black;
  float: left;

  border-radius: 4px 4px 4px 4px;
  -moz-border-radius: 4px 4px 4px 4px;
  -webkit-border: 4px 4px 4px 4px;
}

ul#menu li:hover a { 
  background: #1d1d1d url(../images/TrudaineForet.jpg) no-repeat;
  font: bold 100% Book Antiqua;
  color: #FFFF66;
  text-shadow: 0px 0px 0px #FFF;
  text-decoration:none;
  border:1px solid black;
  float: left;

  border-radius: 4px 4px 4px 4px;
  -moz-border-radius: 4px 4px 4px 4px;
  -webkit-border: 4px 4px 4px 4px;

  -webkit-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  transform: translateY(-5px);
}

ul#menu li:hover ul {
    position:asbolute;
    display:block;
    float: left;
}
ul#menu ul {
    position:absolute;
    width:120px;
    left: 37%;
    top:220px;
    border-top:1px solid transparent;
    display:none;
}
ul#menu li:hover ul li {
width: 100%;
    background:transparent;
    color: #FFFF66;
    border:1px solid transparent;
    z-index: 2;
}
ul#menu li:hover ul li a {
    color:transparent;
    font-size:12px;
    text-transform:none;
}
ul#menu li:hover ul li a:hover {
    color: #FFFF66;
}

#Gauche, #Centre, #Droite {
  padding:1px 0; /* pour la fusion des marges*/
}

#Page
{ display:table;
  margin:auto;
  float: center;
  font: bold 160% Book Antiqua;
  position: relative;
  left: 0%;
  margin: 220px 0 0 0;
  width:980px;
}

#Gauche {
  display:table-cell;
  width:240px;
  text-align: left;
  background: transparent;
  text-indent: 0;
}
#Centre {
  display:table-cell;
  position: absolute;
  width:400px;
  margin-left: 270px;
  text-align: center;
  text-indent:0px;
  background: transparent;
}
#Droite {
  display:table-cell;
  width:240px;
  text-align: right;
  background: transparent;
  padding-right: 0;
}

.left {
  float: left;
  margin-left: 20px;
}

.right {
  float: right;
  margin-right: 20px;
}
#Gauche
#Droite
{
}

.Conteneur_Gauche
{ float: left;
  width: 150px;
  padding: 0;
  background: transparent url(../images/Parchemin.png) no-repeat;
}

.Conteneur_Centre
{ float: center;
  width: 460px;
  padding: 0;
  background: transparent;
  transition: all 6s;
}

.Conteneur_Centre:hover {
  font-size:24px;
  text-decoration:underline;
  color:#CC0000;
  -webkit-transition: color .6s ease-in;
  -moz-transition: color .6s ease-in;
  -o-transition: color .6s ease-in;
  transition: color .6s ease-in;
}

.Conteneur_Droite
{ float: right;
  width: 150px;
  padding : 0;
  background: transparent url(../images/Parchemin.png) no-repeat;
}

.Barre
{ float: left;
  width: 145px;
  margin-bottom: 10px;}

.ContenuG
{ font: italic 100% Georgia;
  width: 142px;
  padding:20px 5px 0px 5px;
  margin:auto;
}

.ContenuD
{ font: bold 100% Georgia;
  width: 142px;
  padding:20px 5px 0px 5px;
  margin:auto;
}

.Barre h2
{ padding: 0 0 0 0px;
  font: italic bold 80% Georgia;
  float: right;
  width: 140px;
  height: 20px;
  color: #41020A;
  text-shadow: 0px 0px 0px #000000;
}  

#Pied
{ width: 960px;
  height: 20px;
  padding-top: 20px;
  text-align: center; 
  background: transparent;
  color: black;
  text-shadow: 0px 0px 0px black;}

#Pied a, #Pied a:hover
{ color: #000066;
  text-shadow: 0px 0px 0px black;
  text-decoration: none;
  padding-bottom: 20px;}

#Pied a:hover
{ text-decoration: underline;}