/* --- GÉNÉRAL --- */
html, body {
 font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 margin: 0;
 padding: 0;
 height: 100%;
 background: #B28C00 url(images/bgbody3.gif) center top repeat-y;
}
html {font-size: 100%;}
body {font-size: 12px;}

body a {color:#999}
body a:hover {color:#666}

/* --- BLOC CONTENEUR GLOBAL --- */
div#main {
 position: relative; /* permet au bloc de servir de référent pour ses descendants positionnés en absolu */
 width: 900px;
 margin: 0 auto;
 min-height: 100%;
 background: #FCFACA ;
}

#flags {
 z-index:5;
 left:0;
 top:200px;
 margin-left:410px;
 top:465px;
 margin-left:800px;
 position:absolute;
 width:90px;
}

#menu {
 z-index:4;
 font-size:1px;line-height:0;
 top:214px;
 left:0;
 margin-left:545px;
 position:absolute;
 width:330px;
 overflow:hidden;
}

#menu ul li, #menu li {margin-top:0px}

#tournesol {
 overflow:hidden;
 z-index:2;
 left:0;
 position:absolute;
 top:0px;
 margin-left:462px;
 width:438px;
 height:636px;
 background: url(images/tournesol.png) top left no-repeat! important;
 background: url(no-image);
}

#photo-menu-over {
 overflow:hidden;
 z-index:3;
 left:0;
 position:absolute;
 top:0px;
 margin-left:699px;
 width:201px;
 height:329px;
}

#cache-tournesol {
 overflow:hidden;
 z-index:3;
 left:0;
 position:absolute;
 top:0px;
 margin-left:699px;
 width:201px;
 height:329px;
 background: url(images/cache-tournesol.png) top left no-repeat! important;
 background: url(no-image);
}

#tour1 {
 border:1px solid transparent;
 left:40px;
 margin-top:10px;
 position:absolute;
 background: url(images/tour1.png)!important;
 background: url(no-image);
}

#tour2 {
 border:1px solid transparent;
 left:40px;
 margin-top:10px;
 position:absolute;
 background: url(images/tour2.png)!important;
 background: url(no-image);
}

#tour3 {
 border:1px solid transparent;
 left:40px;
 margin-top:10px;
 position:absolute;
 background: url(images/tour3.png)!important;
 background: url(no-image);
}

#tour4 {
 border:1px solid transparent;
 left:40px;
 margin-top:10px;
 position:absolute;
 background: url(images/tour4.png)!important;
 background: url(no-image);
}

#tour5 {
 border:1px solid transparent;
 left:40px;
 margin-top:10px;
 position:absolute;
 background: url(images/tour5.png)!important;
 background: url(no-image);
}

#textecentral {
 background: transparent url(images/trait2.gif) top left no-repeat;
 color:#5A1B2D; 
 margin: 10px 0 0 0px;
 padding: 6px 0 0 40px;
 top:0;
 width:400px;
 font-weight:bold;
 line-height:16px;
 min-height: 183px;height:auto!important;height:183px;
}
.tours {color:#5A1B2D;line-height:16px;}
#textecentral h1, .tours h1 {margin-bottom:6px; line-height:normal;color:#803F17;font-size:18px; font-weight:bold;}
#textecentral h2, .tours h2 {margin-bottom:6px; line-height:normal;color:#803F17;font-size:16px; font-weight:normal;}
#textecentral h3, .tours h3 {line-height:12px;color:#803F17;font-size:12px; font-weight:bold;}
#textecentral p, .tours p {margin-bottom:6px; font-weight:normal;}
#textecentral img, .tours img {margin:0 8px 4px 0; float:left;}

#textecentral h2 a, .tours h2 a {text-decoration:none;}
#textecentral h2 a:hover, .tours h2 a:hover {color:#803F17;}

#contactform {width:400px;font-weight: normal;}

#contactform p{
 width: 380px;
 margin: 0;
 padding: 1px 0;
 padding-left: 120px; /*width of left column containing the label elements*/
 height: 1%;
}
#contactform input, #contactform textarea, #contactform select {
 color:#3D3957;
 font-size:12px;
 /*background:#F1F2EE;*/
 background:white;
 border:solid 1px #979797;
 border:dashed 1px #979797;
 font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 line-height:12px;
 margin:0 4px 0 0;
 padding:0;
}
#contactform select {width:auto;}
#contactform label{
 float: left;
 margin-left: -120px; /*width of left column*/
 width: 100px; /*width of labels. Should be smaller than left column to create some right margin*/
}
#contactform input.radio {border:0;background:transparent}

#contactform #submitbtn {
 margin-top:12px;
 color:#5A1B2D; 
 border:0;
 width:106px;
 height:23px;
 text-align:center;
 font-size:12px;
 padding:1px;
 background:transparent url(images/button.gif) no-repeat left center;
}

/* Ne pas oublier les styles suivants, à appliquer au premier élément et au dernier élément (hors pied de page) du bloc conteneur */
div#main #premier-element {
 margin-top: 0; /* évite tout risque de fusion des marges */
}

div#main #dernier-element {
 margin-bottom: 0; /* évite tout risque de fusion des marges */
 padding-bottom: 216px; /* ATTENTION : cet espace doit permettre de placer le pied de page ! */
}

/* --- PIED DE PAGE --- */
div#footer {
 position: absolute;
 bottom: 0; left: 0;
 width: 100%; /* pour que le bloc prenne toute la largeur du bloc de référence Note : le bloc de référence est le plus proche ancêtre positionné en relatif ou en absolu */
 height:183px;
 background: transparent url(images/footer.gif) no-repeat top center;
}

div#footer2 {
 position: absolute;
 bottom: 0; left: 0;
 width: 100%; /* pour que le bloc prenne toute la largeur du bloc de référence Note : le bloc de référence est le plus proche ancêtre positionné en relatif ou en absolu */
 height:88px;
 background: transparent url(images/footer2.gif) no-repeat top center;
}

div#footercache {
 z-index:1;
 position: absolute;
 bottom: 0; left: 0;
 width: 100%; /* pour que le bloc prenne toute la largeur du bloc de référence Note : le bloc de référence est le plus proche ancêtre positionné en relatif ou en absolu */
 height:183px;
 background: transparent url(images/footer.gif) no-repeat top center;
}

a.lienmail {
 background:transparent url(images/mail.gif) no-repeat scroll left center;
 line-height:12px;
 padding:3px 0 3px 20px;
}

.puce-tournesol {
 background:transparent url(images/puce-tournesol.gif) no-repeat scroll left center;
 line-height:16px;
 padding-left:20px;
}

.etoile {
 background:transparent url(images/etoile.gif) no-repeat center left;
 line-height:14px;
 padding:2px 0 2px 16px;
 clear:left;
}

div#dernier-element { visibility: hidden;}

/* ----------------------------------------- Gallery Styles ----------------------------------------- */
#motioncontainer {
 padding:0;
 bottom:0;
 margin:0;
 width: 900px; /* Set to gallery width, in px or percentage */
 height: 183px; /* Set to gallery height */
 background:transparent;
}

#motioncontainer img {
 margin:0 2px 0 0;
 border: 0px solid #cccccc; /* Set image border color */
}

#motioncontainer a:hover img {
 border: 0px solid navy; /* Set image border hover color */
}

#statusdiv {
 background-color: transparent;
 border: 0px solid gray;
 padding: 0px;
 position: absolute; /* Stop Editing Gallery Styles */
 left: -450px;
 visibility: hidden;
}

#motioncontainer a:hover {
 color: transparent; /* Dummy definition to overcome IE bug */
}
/* ----------------------------------------- End Gallery Styles ----------------------------------------- */
