/* CSS Document */

body{
margin:0; padding:0;
text-align:center;
height:100%; width:100%;
font:12px Arial, Helvetica, sans-serif;
background:#314319;
}

/* Page */
#page{
text-align:left;
margin: 0 auto;
width:743px; height:100%;
background:url(../media/interface/page_fond.jpg);
}

.container{
float:left;
background:url(../media/interface/container_hack.jpg);
}
#center{
width:100%;
}
a{
color:#8CA524;
text-decoration:none;
font-weight:normal;
}   
a:hover{
color:#8CA524;
text-decoration:underline;
}
h2.actu{
color:#467F3A;
font-size:1.6em;
font-weight:bold;
}

.h1-eau{
color:#628bb8;
font-size:1.6em;
font-weight:bold;
}

h2{
color:#8CA524;
font-size:1.4em;
font-weight:bold;
}
h3{
color:#8CA524;
margin: 0.2em 0;
font-size:1.2em;
}
img{
border:0;
}
.clear{
clear:both;
}
ul, ol {
list-style: none;
margin: 0; padding: 0;
}

img {
border: none;
margin: 0; padding: 0;
}

/* Tunnel */
#tunnel{
margin:0; padding:0;
background: url(../media/interface/tunnel_fond.jpg) top left repeat-x;
text-align:center;
height:100%
}
#tunnel_flash {
height:100%;
width:100%;
}
#tunnel_flash img{
margin-top:120px;
}

#tunnel_html {
/*width:702px;
height:473px;
height:100%;*/
height:auto;
width:100%;
/*background:url(../media/interface/tunnel.jpg) center no-repeat;*/
}
#tunnel_html .visu {
width:702px;
height:473px;
margin:0 auto;
padding:250px 0 0 0;
background:url(../media/interface/tunnel.jpg) center no-repeat;
}
#tunnel_html .visu a#entrer{
float:left;
width:190px;
height:45px;
margin:50px 0 0 260px;
}
#tunnel_html .menu {
width:702px;
height:20px;
background:#fff;
margin:-130px auto 0 auto;
padding:20px 0 0 0;
color:#8CA524;
}

/* Header */
#page #header{
width:100%; 
height:202px;
}
#page #header #header_html{
float:left;
width:742px;
height:202px;
background:url(../media/interface/header-html.jpg) top left no-repeat;
}
#page #header #header_html #logo{
float:left;
margin:25px 0 0 20px;
width:285px;
height:120px;
background:none;
}
#page #header #header_html #galerie{
float:left;
margin:40px 0 0 4px;
width:170px;
height:110px;
background:none;
}
#page #header #header_html h1{
clear:both;
display:block;
padding:12px 0 0 200px;
margin-top:0;
color:#fff;
font-family:"Tahoma", Arial, Helvetica, sans-serif;
font-weight:normal;
font-size:24px;
}

/* Navigation */
#page #navigation{
float:left; 
width:165px;
height:427px;
background: url(../media/interface/navigation_fond.gif) top left repeat-y;
}
#page #navigation #navigation-flash{
float:left; 
width:165px;
height:427px;
}
#page #navigation #navigation-html{
float:left; 
width:165px;
height:427px;
background:url(../media/interface/navigation-html.jpg) top left no-repeat;
}
#page #navigation #navigation-html span {
position:absolute;
left:-5000px;
}
#page #navigation #navigation-html ul {
margin-top:5px;
}
#page #navigation #navigation-html ul li{
clear:both;
}
#page #navigation #navigation-html a.item{
float:left;
width:165px;
clear:both;
height:40px;
/*background:#ff0000;
opacity:0.5;*/
}
#page #navigation #navigation-html a#actweb{
float:left;
margin:100px 0 0 0;
width:80px;
height:35px;
}

/* Content */
#page #main{
float:left; 
width:578px;
}
#page .coordonnees_eau{
background:url(../media/interface/coordonnees_eau.jpg) bottom right no-repeat;
}
#page .coordonnees_paysage{
background:url(../media/interface/coordonnees.jpg) bottom right no-repeat;
}
#page #main #illustration{
margin:0; padding:0;
height:179px;
}

#page #main .photo{
width:100%; text-align:center;
}
#page #main #content{
margin:0; padding:20px;
padding-bottom:0px;
float:left;  width:343px;
text-align:justify;
background:#FFF url(../media/interface/content_fond.jpg) top left no-repeat;
border: 1px solid #CCC;
border-style:none solid none none;
}

/* Subnav */
#page #main #subnav{
vertical-align: bottom;
float:left; margin-top:10px ;
width:194px; height:100%;
}

#page #main #subnav #actualites{
padding:0 10px;
}

/** Galerie **/
#main_galerie{
float:left;
width:538px; 
background:#FFF url(../media/interface/galerie_fond.jpg) top left no-repeat;
padding:20px;
}
 
 
/* Footer*/
#footer{
text-align:left;
font-size:10px;
float:left;
clear:both;
padding-top:20px;
padding-bottom:0px;
width:340px;
color:#999999;
}

#footer a {
color:#999999;
}

hr{
display:block;
height:1px;
border:0;
border-top:1px solid gray;
width:80%}  



/*********** flashupdate  *****************/

#flashupdate {
text-align:center;
width:583px;
margin:0; padding:0;
margin-left:160px;
}
#flashupdate p{
clear:both; float:left;
text-align:left;
padding:10px;
width:350px;
}
#flashupdate #coordonnees{
float:right;
width:195px; height:150px;
}
/***** CONTACT *****/

table.contact {   
  width: 100%;
  margin: 0 ;
}

table.contact td.titre {
  padding: 15px 0 20px 0;
  font-size: 1.20em;
  color: #8CA524;
  font-weight: bold;
}
table.contact td.designation {
  width: 150px;
  padding: 7px 0 6px 10px;
  font-weight: bold;
  vertical-align: top;
}
/* label */
table.contact tr.error td.designation {
  width: 150px;
  padding: 7px 0 6px 10px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: top;
}
table.contact td.field {
  vertical-align: top;
  padding: 3px 0;
}
table.contact td.field input, select {
  width: 220px;
  padding: 2px 0 1px 2px;
  border: 1px solid #666;
  background:#FFF url(../media/interface/css-field-text.gif) top left repeat-x;
  font-size: 12px;
  color: #5D5D5D;
}
table.contact td.field select {
width: 224px;
}
table.contact td.field textarea {
  width: 220px;
  height: 100px;
  padding: 0 0 0 2px;
  border: 1px solid #666;
  background:#FFF url(../media/interface/css-field-text.gif) top left repeat-x;
  font-size: 12px;
  color: #5D5D5D;
}

table.contact td.required {
  width: 10px;
  font-size: 1px;
}
table.contact td.required-on {
  width: 10px;
  font-size: 1px;
  background: url(../media/interface/css-field-required.gif) top left no-repeat;
}
table.contact tr.error  td.required-on {
  width: 10px;
  font-size: 1px;
  background: #8CA524 url(../media/interface/css-field-required.gif) top left no-repeat;
}
table.contact td.sep {
  height: 20px;
  font-size: 1px;
}
table.contact table.button {
  width: 100%;
}
table.contact table.button input {
  width: 100px;
  height: 20px;
border-top: 1px solid #ECECEC;
  border-right: 0;
  border-bottom: 0;
  border-left: 1px solid #ECECEC;
  background-color: #8CA524;
  font-size: 10px;
  color: #FFFFFF;
  font-weight: bold;
}
table.contact table.button td.space {
  width: 170px;
}
table.contact table.button td.submit {
  width: 120px;
  text-align: left;
}
table.contact table.button td.reset {
  text-align: left;
}
table.contact tr.error {
  background-color: #8CA524;
}
        
div.error {
  color: #467F3A;    
  background-color:#eeeeee;
}                    
div.error div.titre {
  padding: 5px 15px;
  font-size: 1.30em;
  line-height: 1.30em;
  font-weight: bolder;
}         
div.error div.titre img {
  float:left;
}        
div.error div.txt {
  padding: 5px 15px;
}


div.bloc2col {
    padding: 0;
    margin: 0;
    width: 100%;
    padding-top: 1px;
    color:: #7E7E7E;
    text-align: justify;
    font-size:0.7em;
}


/* INPUT TEXT FIELD */
div.input-text div.designation {
    font-size:12px;
}
div.input-text div.designation-error {
    font-weight:bold;
}

div.input-text div.field {
    text-align: left;
}

div.input-text div.field input {
    width:150px;
    height: 15px;
    border: 1px solid #CCCCCC;
    background:url(../media/contact/fond_champ.gif) top left repeat-x;
    background-color: #FFFFFF;
    padding: 2px 0px  0px 2px;
    font-size: 12px;
    color: #6C6A6A;
}

div.input-text-all {
    text-align: left;
}
div.input-text-all input {
    margin: 0px;
    height: 15px;
    background: url(../media/contact/fond_champ.gif) top left repeat-x;
    border: 1px solid #CCCCCC;
    padding: 2px 2px  0px 2px;
    font-size: 12px;
    color: #6C6A6A;
}

fieldset {
    margin: 0;
    padding: 0;
    position: relative;
    border: 0;
}
/* INPUT TEXTAREA    */

div.input-textarea textarea {
    margin: 0px;
    width: 325px;
    height: 100px;
    border: 1px solid #CCCCCC;
    background: url(../media/contact/fond_champ.gif) top left repeat-x;
    background-color: #FFFFFF;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #6C6A6A;
}


/** GALERIE **/
#galerie{
margin:0; padding:0;
background:#FFF;
}
#galerie #galerie_header{
margin-left:10px;
}