/*******************************************
*CSS global Jardinamel
********************************************/
* {
outline:none; }

body { /* redéfini les propriétés de toute la page */
	overflow: auto ; 
	margin:0px 0% 20px 140px;
	padding:0; /* marge intérieur à 0 pixels */
	background-color:#e1f0dd;}

.en_tete { /* block fixe en haut de l'écran */
	position: fixed ; /* position du menu = par rapport à la boite parent (ici le body) */
	height:88px;
	top: 0 ; /* Le haut du menu est à 0 pixels du haut de l'écran */ 
	left: 0 ; /* La gauche du menu est à 0 pixels du bas de l'écran */ 
	width: 100% ; /* largeur du menu = 110% de l'écran (pour bug de IE) */
	z-index:20;}

div#banniere1 {
	position:absolute; /* La première partie sera à gauche*/
	left:0px;
	width:593px; /* On définit la largeur de l'image */
	height: 80px; /* On définit la hauteur de l'image */
	background-image: url("images/banniere1.gif");
	background-repeat: no-repeat;
	margin-right: -5px;	/*Pour que la partie 1 se colle à la 2.*/
	border-top: 4px solid #008000;
	border-bottom: 4px solid #008000;
	border-left: 4px solid #008000;}

div#banniere3 {
	position:absolute; /* La dernière partie est à droite */
	right:0px;
	width:134px;
	height: 80px;
	background-image: url("images/banniere3.gif");
	background-repeat: no-repeat;
	margin-bottom: 0px;
	margin-left : -5px; /*Pour que la partie 3 se colle à la 2.*/
	border-top: 4px solid #008000;
	border-bottom: 4px solid #008000;
	border-right: 4px solid #008000;}

div#banniere2 {
	width:auto; /* Se répétera sur la place qu'on lui donne. */
	height: 80px;
	background-image: url("images/banniere2.gif");
	background-repeat: repeat; /* Un repeat-x aurait suffit, mais comme on définit la hauteur, ce n'est pas la peine*/

	border-top: 4px solid #008000;
	border-bottom: 4px solid #008000;}

#banniere {
	padding-top:20px;
	margin-left:640px;
	font-family: Verdana,Helvetica,Arial,serif;
	font-size:1em;
	font-weight: bold;
	color: #008000;}

.content { /* boite prenant toute la page sauf le menu rouge */
	height: 100%; /* la hauteur de la boite occupe 100% de l'écran */
	margin-left:20px;}

.content_livredor { /* boite prenant toute la page sauf le menu, spéciale pour formulaire et affichage messages du livre d'or*/
	height: 100%; /* la hauteur de la boite occupe 100% de l'écran */
	margin-left:20px;
	margin-bottom:70px;}

#menu { /* block fixe à gauche de l'écran */
	position: fixed; /* idem menu1 */
	top: 88px; /* Le haut du menu est à 88 pixels du haut de l'écran (pour ne pas recouvrir la zone du haut) */ 
	left: 0; /* idem menu1 */
	width: 140px; /* largeur du menu */
	height: 100%; /* hauteur du menu (toute la page) */
	background-color:#bdf7b3; /* idem menu1 */} /* bordure droite de la zone fixe */

#menu ul {
	position:absolute;
	list-style-type:none;
	margin-top:5px;
	padding:0;}

#menu ul li a {
	z-index:20;
	display: block;
	width: 126px;
	line-height: 30px ;
	height: 30px;
	font-family: Verdana,Helvetica,Arial,serif;
	font-size: 80%;
	font-weight: bold;
	text-align: center;
	color: #008000;
	text-decoration: none;
	margin-top: 6px;
	margin-left: 7px;
	background: url(images/menu_activ.png) no-repeat 0 -30px ; /* On met une image de background, que l'on positionne à 0px du bord gauche et 0px du bord haut */}

#menu ul li a:hover {
	z-index:20;
	background: url(images/menu_activ.png) no-repeat 0 -60px ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	color: #ffcd1c;}

#menu #active a {
	background: url(images/menu_activ.png) no-repeat 0 0 ; /* Et ici on décale l'image du background de 30px vers le haut pour laisser apparaître la 2eme partie de l'image */
	color: #c00000;}

.rose {
	text-align:center;
	padding-top:320px;}

.pied_de_page { /* block fixe en bas de l'écran */
	position: fixed ; /* position du pied de page = par rapport à la boite parent (ici le body) */
	bottom:0 ; /* Le bas du pied de page est à 0 pixels du bas de l'écran */ 
	left: 0 ; /* La gauche du pied de page est à 0 pixels du bas de l'écran */ 
	width: 99.8% ; /* largeur du pied de page = 99.5% de l'écran */
	height: 31px; /* hauteur du pied de page */
	color:#008000;
	background-color:#bdf7b3;
	border: 2px solid #008000;
	padding-bottom:0px;
	text-align:center;
	font-size: 80%;
	z-index:20;}

.pied_de_page p {
	text-indent:0px;}

#copyright {
	margin-top:8px;
	text-align:center;}

#logo_html {
	float:left;
	margin-top:0px;
	margin-left:140px;
	padding:0;}

#logo_css {
	float:right;
	margin-top:0px;
	margin-right:130px;
	padding:0;}

.boite {
	width:98% ;
	max-width:1280px;
	height:100%;
	font-size:100%;}/* boite servant à faire défiler l'écran, en débordant de la page */

.boite h1 {
	color:#008000;
	font-family:Arial,"Arial black","Times New Roman",Times,serif;
	text-align:center;
	text-decoration:underline;
	text-transform:uppercase;}

.boite h2 {
	height:30px;
	background-image:url("images/titre.gif");
	background-repeat:no-repeat;
	padding-left:50px;
	color:#008000;
	text-align:left;}

.boite h3 {
	font-size:1em;
	margin-left:20px;
	padding-left:5px;
	padding-right:5px;
	display:inline;
	border-left:3px solid #008000;
	border-bottom:1px solid #008000;
	background-image:url("images/titre1.png");
	background-repeat:repeat-y;}

.boite h4 {
	text-indent:20px;}

.boite h5 {
	text-indent:40px;
	font-size:92%;}

.travaux {
	text-indent:30px;
	color:#008000;
	text-decoration:underline;
	margin-bottom:0px;}

.fleches_bas {
	text-align:center;
	margin:20px;}

.image {
	width:800px;
	height:8px;
	background-image:url('images/ligne1.gif');
	background-repeat: no-repeat;
	margin:auto;}

.imgPhoto {
text-align:center;}

.img_left {
	float:left;
	margin-right:20px;
	margin-top:10px;}

.img_right {
	float:right;
	margin-left:20px;
	margin-top:10px;}

.compact {
	float:right;
	margin-right:200px;}

.souligne { 
	font-weight:bold;
	color:#008000;}

.vert { 
	font-size:1.1em;
	font-weight:bold;
	color:#008000;}

.souligne1 { 
	font-weight:bolder;
	color:red;
	text-transform:uppercase;}

.rouge {
	font-weight:bold;
	color:red;}

.rouge_italic {
	font-size:1.1em;
	font-style:italic;
	font-weight:bold;
	color:red;}

.optimise {
	text-align:center;
	font-style:italic;
	font-weight:bold;
	color:fuchsia;}

.compteur {
	background-color:#bdf7b3;
	width:450px;
	text-align:center;
	font-style:italic;
	height:20px;
	border:2px solid #008000;
	font-weight:bold;
	color:fuchsia;
	display:block;
	margin:auto;}
/*****************************************************************
* CSS tableaux 
*****************************************************************/
caption {
	margin:auto;
	font-size:120%;
	font-weight:bold;
	margin-bottom:10px;}

table {
	margin:auto;
	border-collapse:collapse;
	border:2px solid #008000;}

.capteurs th, .capteurs td {
	font-size:90%;
	padding:2px 10px;}

th {
	background-color:#bdf7b3;
	border:2px solid #008000;}

.orange {
	background-color:#ffcb60;}

.tableau {
	border:2px solid #008000;
	font-size:80%;
	text-align:center;
	padding-top:0px;
	padding-right:5px;
	padding-bottom:0px;
	padding-left:5px;}

.tableau_color {
	background-color:#bdf7b3;
	border:2px solid #008000;
	font-size:80%;
	text-align:center;
	padding-top:0px;
	padding-right:5px;
	padding-bottom:0px;
	padding-left:5px;}

.tableau_colorred {
	background-color:#ff3300;
	border:2px solid #008000;
	font-size:80%;

	text-align:center;
	padding-top:0px;
	padding-right:5px;
	padding-bottom:0px;
	padding-left:5px;}

/*****************************************************************
* CSS tableau Taille
*****************************************************************/
.taille table {
	margin:auto;
	border-collapse:collapse;}

.taille caption {
	margin:auto;
	font-size:140%;
	font-weight:bold;
	color:#008000;
	margin-bottom:10px;}

.taille th {
	background-color:#006400;
	font-size:1.2em;
	color:#ffa500;
	border:2px solid #f4a460;
	padding:3px 0 3px 0;}

.taille th.col1 {
	width:24.5%;}

.taille th.col2 {
	width:25.5%;}

.taille td {
	border:2px solid #ffa500;
	font-size:1em;
	padding:2px 0 2px 5px;}

.taille td.pair {
	background-color:#bdf7b3;}

.taille td.impair {
	background-color:#e1f0dd;}


/*****************************************************************
	CSS albums privés
*****************************************************************/
#albumprive {
	background-color:#ECCCC6;}

.content_albumprive { /* boite prenant toute la page sauf le menu rouge */
	height: 100%; /* la hauteur de la boite occupe 100% de l'écran */
	margin-left: 0;
	background:#ECCCC6;}

.boite_albumprive {
	width:100% ;
	background:#ECCCC6 url(images/album_prive/bg.gif) repeat-x;
	margin-top:88px;
	height:100%;
	font-size:100%;}/* boite servant à faire défiler l'écran, en débordant de la page */

.albums {
	padding:0 10px 0 10px;
	border:0px;}

.albums table, td {
	border:0px;}

.infotable {
	border: 1px dotted #FFFFFF;
	border-collapse: collapse;}

.infotable td {
	border: 1px dotted #FFFFFF;}

.infotable table {
	border-collapse: separate;}

.infotable table td {
	border: 0px;}

.title {
	font-size: 140%;
	font-weight: bold;
	color: #000000;}

.integre {
	border: 1px dotted #869740;
	border-collapse: collapse;
	background-color:#143b05; }

.integre td {
	border: 1px dotted #869740; }

.integre table {
	border-collapse: separate; }

.integre table td {
	border: 0px; }

.dirname {
	font-size: 100%;
	font-weight: bold;
	color: #aa4444;}

.dirname a {
	border:0px;
	color:#990000;
	text-decoration: none;}

.dirname a:hover {
	color:#ffffff;
	text-decoration: none;}

.smalltxt {
	color: #444444;
	font-family: "Comic Sans MS", sans-serif;
	font-size:100%;}

.xsmalltxt {
	color: #444444;
	font-family: "Comic Sans MS", sans-serif;
	font-size:85%;}

.xsmalltxt a {
	border:0px;
	color:#990000;
	text-decoration: none;}

.xsmalltxt a:hover {
	color:#ffffff;
	text-decoration: none;}

.ysmalltxt {
	color: #cce016;
	font-family: "Comic Sans MS", sans-serif;
	font-size: 14px;}

.center {
	text-align:center;}

/*****************************************************************
	CSS Nouveautés  et travaux du mois
*****************************************************************/
#principal {
	width:auto;
	background-image:url('images/gm.png');
	background-repeat: repeat-y;}

#principal2 {
	background-image:url('images/dm.png');
	background-repeat: repeat-y;
	background-position: right;}

#haut {
	height:44px;
	background-image:url('images/hm.png');}

#haut img {
	vertical-align:top;} /* for ie5*/

#coingh {
	width:34px;
	height:44px;
	background-image:url('images/hg.png');
	float: left;}

#coindh {
	width:34px;
	height:44px;
	background-image:url('images/hd.png');
	float: right;}

#contenu_news {
	position:relative;
	left:25px;
	padding: 0px;
	margin-right:50px;
	color:#008000;
	background-image:url('images/coinrond.png');}

#travaux_mois {
	position:relative;
	left:25px;
	padding:0 0 10px 0;
	margin-right:50px;
	background-image:url('images/coinrond.png');
	z-index:10;}

#contenu_news p {
	margin: 0px;
	color:#008000;}

#bas {
	height:34px;
	background-image:url('images/bm.png');}

#coingb {
	width:34px;
	height:34px;
	background-image:url('images/bg.png');
	float: left;}

#coindb {
	width:34px;
	height:34px;
	background-image:url('images/bd.png');
	float:right;}

/*****************************************************************
	CSS Livre d'or
*****************************************************************/
#message {
	border:2px solid #008000;
	padding:5px;
	width:auto;
	background-color:#bdf7b3;}

#presentation_livreor p, #presentation_livreor {
	text-align:center;
	font-weight:bold;
	color:#008000;}

.border_msg {
	border:1px solid #008000;
	padding:4px 5px 10px 5px;
	margin:3px 0 6px 0;
	background-color:#e1f0dd;}
	
#presentation_livreor1 {
	text-align:center;
	font-weight:bold;}

#formulaire_livreor {
	border:1px solid #008000;
	background-color:#bdf7b3;
	width:60%;
	margin:auto;
	padding:5px;
	text-align:center;}

label {/*********************************************/
	color:#008000;
	text-align:center;}

legend {
	text-align:center;
	padding-top:5px;
	font-size:90%;}

.fieldset {
	border:2px solid #008000;
	margin:0px;
	text-align:center;
	background-color:#e1f0dd;}

.fieldset_contact {/*********************************************/
	border:2px solid #008000;
	margin-bottom:10px;
	padding:10px 0px;
	text-align:center;
	vertical-align: middle;
	background-color:#e1f0dd;}

.form {
	text-align:center;
	padding:0 5px 0 5px;}

.center_contact {/*********************************************/
	text-align:center;
	font-weight:bold;}

.question {
	float:left;
	margin-left:0;
	font-weight:bold;
	color:red;}

#website {
	display:none;}

.textarea {
	border:1px solid #008000;
	width:100%;
	height:150px;
	margin:0px ;}

.textarea_contact {/*********************************************/
	border:1px solid #008000;
	width:98%;
	margin-top:5px;
	height:150px;}

.input {
	margin-left:-143px;}

input[type=submit] {
	background:url('images/selection.png') repeat-x 0px -22px;
	border-style:outset;
	border-width:1px;
	border-color:#008000;}

input[type=submit]:hover, input[type=submit]:focus {
	background-position:0px 0px;}

@media screen {
	input[type=submit]:hover, input[type=submit]:focus {
	cursor:pointer;}
}

input[type=submit]:active {
	border-style:inset;}

#livre_dor {
	float:right;
	margin:-80px 120px 20px 0;}

/*****************************************************************
	Sommaire
 *****************************************************************/
.titre_sommaire {
	font-family:"Times New Roman",Times,serif;
	font-size:1.4em;
	color: #008000;
	font-weight:bold;
	text-align:center;
	text-decoration:underline;}

.sommaire {
	background-color:#fecb65;
	width:122px;
	border:2px solid #008000;
	font-family:"Times New Roman",Times,serif;
	font-size:0.8em;
	padding:5px 2px;
	margin-left: 5px;
	margin-top:305px;}

#sommaire_page {
	text-decoration: none;
	font-size:1em;
	padding-left: 0px; 
	margin:0px;}

.sommaire_left, .sommaire_right, .sommaire_center {
	background: url('images/fond_sommaire.png') no-repeat;
	font-size:0.9em;
	padding: 15px 20px 5px 10px;
	border-right: 1px solid #008000;
	border-bottom: 1px solid #008000;
	margin-bottom: 20px;}

.sommaire_left {
	float:left;
	width:29.2%;
	margin-left:0%;}

.sommaire_center {
	width:29.2%;
	margin-left:33.5%;
	margin-right:33.5%;}

.sommaire_right {
	float:right;
	width:29.2%;
	margin-right:0%;
	margin-bottom:110px;}

.legende_img {
	text-align:center;
	font-style:italic;
	font-size:0.9em;}

.italic {
	font-style:italic;
	font-weight:bold;
	color:blue;}

.italicBlack {
	font-style:italic;
	font-weight:bold;
	color:#000000;}

.tiret_double {
	visibility:hidden;}

h1#ancre {
	padding-top:108px;
	padding-bottom:10px;}

h1#ancre_photo {
	padding-top:124px;
	padding-bottom:10px;}	

p {
	text-indent:30px;}

.remarque {
	font-weight:bold;
	color:red;
	text-decoration:underline;}

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

a:hover {
	color:red;
	text-decoration:none;}

a img {
	border: 0;}

.content ul {

	list-style-image:url("images/puce.png");}

.li_disc li{
	list-style-type:disc;
	text-decoration:none;}

.rouge_retrait {
	font-weight:bold;
	color:red;
	padding-left:20px;}

.retrait_ul {
	list-style-image:url("images/puce.png");
	margin-left:200px;}

.gras {
	font-weight:bold;}

.gras li span {
	font-weight:normal;
	font-style:normal;}

/*****************************************************************
	Div parrainage rue ducommerce
*****************************************************************/
.rueducommerce {
	width:290px;
	height:50px;
	text-align:center;}

/*****************************************************************
	Photo
*****************************************************************/
hr {
	width:auto;
	height:3px;
	background-color:#006400;
	border:0;
	margin-left:10%;
	margin-right:10%;}

.bloc_horizontal {
	width:auto;
	overflow:hidden;}

.bloc_horizontal1 {
	width:auto;
	padding-right:100px;
	overflow:hidden;}

.image_left {
	float:left;
	margin:10px 50px 10px 20px;}

.photo_titre {
	float:right;
	width:190px;
	padding:10px 15px;
	margin-left:120px;}

.photo_titre2 {
	float:right;
	width:160px;
	padding:10px 30px;
	margin-left:120px;}

.photo_titre3 {
	float:right;
	width:200px;
	padding:10px;
	margin-left:120px;}

.photo_boutons {
	float:right;
	padding:10px 10px 10px 0;}

.encadre {
	float:right;
	background-color:#bdf7b3;
	width:200px;
	padding:10px;
	margin-left:20px;}

.encadre1 {
	float:right;
	background-color:#e1f0dd;
	width:240px;
	padding:10px;
	margin-left:30px;}

.titre_encadre {
	font-size:24px;
	font-weight:bold;
	margin-bottom:10px;}

/*****************************************************************
	Menu horizontal photos
*****************************************************************/
.content_2 {
	position: fixed;
	top: 88px ;
	margin-left: 20px;
	width: 708px;
	height: 36px;
	background: #98fb98;
	padding: 1px 0 0 0;
	z-index : 100;}

ul.menu_horiz {
	position : absolute;
	list-style-type : none;
	padding : 0;
	margin : 0;
	bottom : 0;
	left : 0;
	z-index : 100;}

ul.menu_horiz a, ul.menu_horiz a:hover {
	text-decoration:none;
	font-family : Arial, sans-serif;
	font-weight : bold;}

/* définition des balises LI */
ul.menu_horiz li.level-one, ul.menu_horiz li.has-submenu {
	position : relative;
	float : left;
	font-size : 14px;
	line-height : 30px;
	margin-right : 4px;
	padding:0 0 0 3px;
	background-repeat : no-repeat;
	background-image : url("images/li-left.png");
	background-position : left top;
	z-index : 100;}

/* Définition de toutes les balises A, dans Ll */
ul.menu_horiz li.level-one a {
	line-height : 30px;
	display : block;
	padding : 2px 15px 4px;
	float : left;
	color : #ffffff;
	background-image : url("images/li-right.png");
	background-repeat : no-repeat;
	background-position : right top;}

ul.menu_horiz li.level-one a:hover {
	color : #1c5009;}

ul.menu_horiz li.has-submenu a {
	padding-right : 25px;
	background-image : url("images/li-right-arrow.png");}

/* Au passage de la  souris, fond centré pour le premier niveau LI*/
ul.menu_horiz li.level-one:hover a {
	padding-top : 2px;
	padding-bottom : 4px;}

/* Au passage de la  souris, fond centré pour le premier niveau A */
ul.menu_horiz li.level-one:hover a {
	background-position : right -100px;}

/* Définition des sous-menu UL dans premier niveau LI */
ul.menu_horiz li.level-one dl {
	display : none;
	position : absolute;
	top : 36px;
	left : -3px;
	width : 190px;
	list-style-type : none;
	font-size:12px;
	padding : 5px 0 0;
	margin : 0;
	background-image : url("images/ul-top.png");
	background-repeat : no-repeat;
	background-position : left top;}

/* Supprimer les propriétés héritées pour le niveau suivant LI*/
ul.menu_horiz li.level-one dd {
	position : relative;
	margin : 0;
	line-height : 25px;
	width : 100%;}

ul.menu_horiz li.level-one dd a {
	line-height : 25px;
	padding : 0 10px !important;
	margin : 0 1px;
	width : 100%;
	display : block;
	float : none;
	background-image : none;
	background-color : transparent;
	color : #1c5009;
}
ul.menu_horiz li.level-one dl dd:hover {
	background-color : #e87f31;}

ul.menu_horiz li.level-one dd a:hover {
	color : #ffffff;}

ul.menu_horiz li.level-one dl dt.separator,
ul.menu_horiz li.level-one dl dt.separator:hover {
	background-image : url("images/separator.png");
	background-position : left;
	background-repeat : repeat-x;
	height : 2px;
	line-height : 2px;
	margin : 1px 5px 0 !important;
	font-size : 0;}

ul.menu_horiz li.level-one dl dt.bottom-menu_horiz,
ul.menu_horiz li.level-one dl dt.bottom-menu_horiz:hover {
	background-image : url("images/ul-bottom.png");
	background-position : left bottom;
	background-repeat : no-repeat;
	height : 5px;
	line-height : 5px;
	font-size : 0;}

/* Ajouter des propriétés des navigateurs "standard" (pas IE6) */
ul.menu_horiz li.level-one dl dd a {
	display : block;
	width : auto;}

/* Au passge de la souris, afficher sous menu UL */
ul.menu_horiz li.level-one:hover dl {
	display : block;}

/* sous sous menu */
ul.menu_horiz dd.has-submenu {
	background-image : url("images/dd-sub.png");
	background-repeat : no-repeat;
	background-position : right top;}

ul.menu_horiz dd ul {
	display : none;
	position : absolute;
	top : -5px;
	left : 190px;
	width : 210px;
	margin : 0;
	padding : 5px 0 0;
	background-image : url("images/dd-ul1.png");
	background-repeat : no-repeat;
	background-position : left top;
	list-style-type : none;}

ul.menu_horiz dd li {
	margin : 0;
	padding : 0;}

ul.menu_horiz li.level-one dd li a {
	display : block;
	width : auto;}

ul.menu_horiz li.level-one dd li:hover {
	background-color : #505050;}

ul.menu_horiz li.level-one dd li.bottom-menu_horiz,
ul.menu_horiz li.level-one dd li.bottom-menu_horiz:hover {
	background-image : url("images/dd-ul-bottom1.png");
	background-position : left bottom;
	background-repeat : no-repeat;
	height : 5px;
	line-height : 5px;
	font-size : 0;}

ul.menu_horiz dd:hover ul {
display : block;}