/***************************************
  Site defaults
 ***************************************/

html {
   font-size: 100%
}

* {
   padding: 0;
   margin: 0;
   outline: none;
}

body {
   font-family: trebuchet MS, arial, helvetica, verdana, sans-serif;
   font-size: .8em;
   text-align: center;
   color: #4F3B41; 
}

div#page {
   width: 778px;
   /*height: 578px;*/
   margin-left: auto;
   margin-right: auto;
   margin-top: 20px;
   margin-bottom: 0;
   text-align:left;
   border: solid 1px #C6C6C6;
}

h1 {
	font-size: 2.3em;
	font-weight: normal;
	padding: 20px 20px 10px;
	color: #937678;
	text-align: right;
}  
  
h2 {
	font-size: 1.3em;
	margin: 1em 0 0.7em 0;
	color: #4F3B41;
}

h3 {
	font-size: 1em;
	margin: .8em 0 0.3em 0;
	color: #7e0e12;
}

h4 {
	font-size: 1.1em;
	margin: .3em 0;
	color: #4F3B41;
}
p {
    margin: 0.7em 10px 0.7em 0;
}

ul, ol, blockquote {
   margin: 0 0 0 2em;
}

li {
   margin: 0;
}

a, a.spip_out, a.spip_in {
   color: #7e0e12;
   text-decoration: none;
}

a:hover {
   color: #4F3B41; 
   text-decoration: underline;
}

table {
   width: auto;
   margin: 0.5em 0;
   color: #000000;
   border: 1px solid #000000;
   border-collapse: collapse;
}

td, th {
   padding: 0.1em 0;
   vertical-align: baseline;
   text-align: center;
   border: 1px solid #000000;
   margin: 0;
   width : 72px;
}

td {
   text-align: right;
   padding: 1.5em 5px .2em 0;
   font-size: .8em;
}


thead, th {
    font-weight: bold;
	background-color: #698CA1;
	color: #FFFFFF;
	border: 1px solid #000000;
	font-size: .9em;
}

/* -------------------------------------
  Columns containers
  -------------------------------------*/

div#columns_container{
    width:780px;
    _width: 778px;
	min-height: 558px;
	_height: 558px;
	background-repeat: no-repeat;
	background-position: left bottom;
}

div#fil_ariane {
   float: left;
   padding: 15px;	
   color: #937678;
   font-size: 0.9em;
}

div#content {
	margin: 10px 20px 10px 355px;
}

div#legende {
   border-top: 1px solid #C6C6C6;
   font-size: 0.8em;
   color: #937678;
   width: 758px;
   padding: 0 10px;	
   font-family: verdana, trebuchet MS, arial, helvetica, sans-serif;
}

div#legende p {
   margin: 0.3em 0;	
}

/* -------------------------------------
  Nouvelles
  -------------------------------------*/

div#nouvelles {
	margin: 250px 20px 30px 75px;
}

div#nouvelles h1 {
   font-size: 1.5em;
   font-weight: bold;
   padding: 0;
   text-align: left;
}

div#nouvelles h4 {
   margin-bottom: 0;
   font-weight: normal;
}

/* -------------------------------------
  Menu
  -------------------------------------*/
div#boutons {
   width: 779px;
   height: 40px;
   margin-left: auto;
   margin-right: auto;
   margin-top: 5px;
   margin-bottom: 0;
   text-align: left;
   border: solid 1px #C6C6C6;
   border-right: none;
}

div#boutons ul {
   margin: 0;
}

div#boutons li {
   list-style-type: none;
   margin: 0;
   float: left;
   position: relative;
   z-index: 1;
   height: 40px;
   border-right: solid 1px #C6C6C6;
}

div#boutons li.selected {
   background-color: #ECE7EA;
}

div#boutons li:hover {
   color: #937678;
   z-index: 2;
   background-color: #ECE7EA;
}

div#boutons li a {
   color: #FFFFFF;
   text-decoration: none;
   display: block;
}

div#boutons li:hover a {
   color: #937678;
}

div#boutons ul li ul {
   width: 139px;
   margin: -1px;
   position: absolute;
   z-index: 100;
   left: 0;
   bottom: 41px;
   display: none;
   background-color: #FFFFFF;
   border: 1px solid #C6C6C6;
   border-bottom: none;
}

div#boutons ul li:hover ul {
   display: block;
}

div#boutons ul li ul li {
   display: block;
   width: 100%;
   height: 100%;
   padding: 0;
   border: none;
   border-bottom: solid 1px #C6C6C6;
   background-color: #FFFFFF;
   z-index: 101;
}

div#boutons ul li ul li a {
   display: block;
   padding: 2px 5px;
   margin: 0;
   color: #937678;
}

div#boutons ul li ul li a:hover {
   background-color: #ECE7EA;
   z-index: 102;
}

/* -------------------------------------
  Footer
  -------------------------------------*/
  
div#footer {
   width: 778px;
   margin: 5px auto 20px;
   text-align: right;
   color: #937678;
   font-size: 0.8em;
}

/* -------------------------------------
  Portfolio
  -------------------------------------*/
div.portfolio h1 {
   padding-bottom: 0;	
} 
  
div#photo {
   float: left;	
   padding: 0 60px 0 20px;
}  

div#photo p {
   padding-bottom: 8px;
   width: 300px;	
}

div.vignettes {
   margin-bottom: 0;
   height: 475px;	
}

div.vignettes a {
   outline: none;
}

div.vignettes img {
   margin: 10px 10px 5px;
}

div#navigation {
   text-align: right;
   margin: 9px 20px 0px; /* 0 20px; */
}

div.portfolio div#legende {
   border-top: none;
   padding-top: 1px;
}


/* -------------------------------------
  Infolettre
  -------------------------------------*/

p.txt_lettre {
   margin-left: 45px;
}

form.infolettre {
   margin-left: 45px;	
}

form.infolettre dl {
   margin: 5px 0;
} 

form.infolettre dt {
   float: left;	
   width: 80px;
}   

form.infolettre p.bouton_retour {
   text-align: right;
   margin-top: 10px;	
}

p.erreur {
   color: #7e0e12;	
}

/***************************************
  Special stuff (IE fixes)
 ***************************************/

/* Clearfix hack */
.clearfix:after {
   content: ".";
   display: block;
   height: 0;
   clear: both;
   visibility: hidden;
}
/* Fix for IE Mac */
.clearfix {
   display: inline-block;
}
/* Fix for IE6 Win */
* html .clearfix {
   height: 1%;
}
.clearfix {
   display: block;
}