/* CSS Document */ 
html{
    width;100%;
    height:100%;
}
body{
	margin: 10px 0 ;
	padding: 0 ;
	text-align: center ;
	background-color:#4E8A04; font-family : Verdana, Arial, Helvetica, sans-serif; font-size: 11px; behavior:url("csshover3.htc");
}
/* On définit les marges haute et basse à 10px et les marges droite et gauche à 0 */
/* On met le padding à 0 pour le navigateur Opera qui définit des padding par défaut pour le body */
/* On utilise text-align: center ; pour Internet Explorer, 
c'est la seule façon de centrer les éléments de type block avec ce navigateur */

/* ################ caracteristiques des liens par defaut ################ */ 
a:link {background-color : inherit; color: #4E8A04; text-decoration: none; font-family : Verdana, Arial, Helvetica, sans-serif;} 
a:visited { text-decoration : none; background-color : inherit; color : #4E8A04; font-family : Verdana, Arial, Helvetica, sans-serif;} 
a:hover { text-decoration : none; background-color : inherit; color : #AACB00; font-family : Verdana, Arial, Helvetica, sans-serif; }
a:active { color: #AACB00; text-decoration: none; font-weight: normal; } 
/* ############## CADRE DU HAUT : logo ############### */ 
.cadre_logo {background :    url(../photos/logoecoitours.png) no-repeat center center; margin-left: 26px; padding-right : 0px; padding-top : 16px; padding-left : 0x; width : 152px; height: 35px; } 
/* ############## CADRE DU HAUT : banniere ############### 
#banniere { left:0%; margin-left: auto; margin-right: auto; width: 800px; top: 60px; height: 200px; visibility: visible;} 
.banniere1 { background :  url(Images/bannieres/banniere1.png no-repeat center center; left:0%; margin-left: auto; margin-right: auto; width: 800px; top: 60px; height: 200px; visibility: visible;}  
/* <div id="banniere" style="margin-left:auto; margin-right:auto; text-align:center; background:white url(tabanniere.gif) no-repeat center center; width:XXXpx; height: YYYpx;"></div>*/
/* ######################## CONTENEURS DU SITE ###################### */ 
#document { position:absolute; width: 770px; margin: 0 auto ; text-align: left ; background-color:#fff; height: 1320px; left: 50%; margin-left: -400px; margin-top: 0px; color:#333333; } 
#contenu { padding: 0 50px 0 130px ; margin-top: 155px; margin: 0 50px; background-color: #fff; color:#333333;} 
.contenu_p
		{	padding: 8px 0 0 20px ;
		    width : 550px;
			text-align: justify ;
			text-indent: 2em ;
			font-size: 1.0em ;
			line-height: 1.5em ;
			border-left: 1px solid #4E8A04 ;
		}
span
{
	color: #333333;
	font-weight: bold;
	line-height: 20px;
}
ul.square {list-style: square;
		   list-style: url(../images/puce_grey.gif) inside;
		   } 

* html pre
		{
			width: 560px ;
		}
/* 
pre
{
	overflow: auto ;
	width : 570px;
	background: #dea ;
	text-align: justify ;
	border-left: 1px solid #FF3D00 ;
	padding: 5px 0 0 5px ;
	font-size: 1.0em ;
	font-family : Verdana, Arial, Helvetica, sans-serif;
}
pre span
{
	color: #560 ;
}

pre span.comment ou autre terme. Changer les couleurs 
{
	color: #b30000 ;
}
*/
 
/* ############## CADRE CENTRALE ############### 
.cadre_titre { position:absolute; left: 220px; padding-top: 10px; */ 
.cadre_titre { padding-left: 10px ;
    margin-top: 20px; margin-right: 0px; margin-bottom: 4px; margin-left: 30px;
	line-height: 35px ;
	font-size: 1.4em ;
	color: #9b2 ;
	width : 585px;
}

/* ######################## MENU ###################### */ 
#menu { left: 0; } 
#menu {	position: absolute;	width: 577px; top: 21px; height: 19px; left: 183px; visibility: visible;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #AACB00;
	padding: 5px;
	margin: 0px;
}
#menu ul { margin : 10px 0 0 -16px; line-height:12px; padding-left: 4px; font-style : normal; font-family : Verdana, Arial, Helvetica, sans-serif; } 
#menu li  { background: #4E8A04; list-style: none; display: inline; font-size: 10px; text-align: left; margin: 8px;
}
/*autre alternative menu : li a {color: #669933; text-decoration: none; display: inline; height: 100%; border-bottom:0px; border-left:1px solid #669933; border-right:1px solid #669933; font-size : 10px; }*/
#menu li a:link {
    color: #fff;
    padding-top: 4px; padding-right: 4px; padding-bottom: 1px; padding-left: 4px;
	margin-top: 5px; margin-right: 0px;	margin-bottom: 4px; margin-left: 0px;
	text-decoration: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	border-top-width: 1px;	border-right-width: 1px; border-left-width: 1px;
	border-top-style: solid; border-right-style: solid;	border-left-style: solid;
	border-top-color: #AACB00; border-right-color: #AACB00; border-left-color: #AACB00;
	}
#menu li a:visited {color: #fff;
    padding-top: 4px; padding-right: 4px; padding-bottom: 1px; padding-left: 4px;
	margin-top: 5px; margin-right: 2px;	margin-bottom: 4px; margin-left: 0px;
	text-decoration: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	border-top-width: 1px;	border-right-width: 1px; border-left-width: 1px;
	border-top-style: solid; border-right-style: solid;	border-left-style: solid;
	border-top-color: #4B1024;	border-right-color: #4B1024; border-left-color: #4B1024; 
}
#menu li a:hover { background: #AACB00; border-color: #4E8A04; color: #fff; text-decoration: none; font-weight: normal;  
}
#menu li.active a { background: #AACB00; border-color: #4E8A04; color: #fff; text-decoration: none; font-weight: normal;
}
/*#menu li a:visited {color: #990000; text-decoration: none; font-weight: normal; background: #CC0000; height: 100%;}
#menu #last a { margin-right: 0; }
*/

/* ######################## SOUS MENU ###################### */
.titre_smenu { position:absolute; top: 10px; left: 10px; }
#s_menu {
    display: inline;
	position: absolute;
	width: 140px;
	top: 260px;
	left: 10px;
	height: 120px;
	/* border-top: 1px solid #FFCC66;
	border-bottom: 1px solid #FFCC66;*/
	padding-top:35px;
	padding-bottom:5px;
	font-size : 11px;
	}
/* version source hubert
#s_menu ul { margin : 10px 0 0 16px; line-height:20px; padding-left:3px; font-style : normal; font-family : Verdana, Arial, Helvetica, sans-serif; } 
*/
div#s_menu ul { margin : 10px 0 0 16px; line-height:12px; padding:0px; font-weight: normal; font-style : normal; font-family : Verdana, Arial, Helvetica, sans-serif; } 

/* fond different au survol de la souris pour les sous menu et les "basiques"*/ 
div#s_menu li  { list-style: square; font-size: 1em; text-align: left; margin: 0px; }
div#s_menu li a:link, a:visited{ color: #4E8A04; text-align: left; }
div#s_menu li a:hover { color: #AACB00; text-decoration: none; }
div#s_menu li.active a { color: #AACB00; }
div#s_menu li.sousmenu:hover { border-bottom: 1px solid #4E8A04; }
div#s_menu li.soussousmenu { z-index: 500; list-style: none; color: #4B1024;}
div#s_menu li.soussousmenu:hover {z-index: 500; list-style: none;}

div#s_menu ul li { position:relative; list-style: square}
div#s_menu ul ul { position: absolute; top: -10px; left: 110px; display:none; width: 160px;}

/* on rajoute une bordure a gauche et des padding, on doit donc réajuster la taille 100-(8 de bordure + 8 de padding) =84 */ 
div#s_menu li a {text-decoration: none; padding: 4px 0 4px 5px; display:block; width:160px}
div#s_menu ul.niveau1 li.sousmenu:hover ul.niveau2 {display:block; background: #fff; 
	border-top-width: 1px; border-bottom-width: 1px;	border-right-width: 1px; border-left-width: 1px;
	border-top-style: solid; border-bottom-style: solid; border-right-style: solid;	border-left-style: solid;
	border-top-color: #4E8A04;border-bottom-color: #4E8A04;	border-right-color: #4E8A04; border-left-color: #4E8A04;
}

/*################ CADRE CONTACT ###################*/
.cadre_pcontact {padding-top : 40px; width : 450px; line-height: 1.5em ; color:#333333; font-size : 11px; font-weight : normal; font-family : Verdana, Arial, Helvetica, sans-serif; font-style : normal; text-align:justify; }
.contact_li  { list-style: square; font-size: 1em; text-align: left; margin: 5px; margin-left: 12px; }
/*################ CADRE FORMULAIRE CONTACT ###################*/
.form { font-family : Verdana, Arial, Helvetica, sans-serif; color:#fff;
		position:absolute; left:440px; top:250px; width:270px; height:300px;
	    padding:5px;
		line-height: 1.9em ;
		text-indent: O.1em ;
		font-size: 0.7em ;
	  }
.echored { color: #FF0000; font-weight: bold; }
.echo {text-align: left; font-size: 1.2em ; color: #D42700; font-weight: bold; }
.echomess { text-align: left; font-size: 1.2em ; font-style : italic; color: #D42700; }
label{
color:#4E8A04;
background-color:#fff;
}
INPUT {
color:#fff;
background-color:#AACB00;
}
SELECT {
color:#333333;
background-color:#FF6633;
}
textarea {
color:#333333;
background-color:#AACB00;
}

/*################PARAGRAPHES###################*/
h1 { font-size: 20px; font-weight: bold; color: #AACB00; text-decoration: none; }
h2 { font-size: 14px; font-weight: bold; color: #333333; text-decoration: none; line-height: 20px;}
h3 { font-size: 11px; font-weight: bold; line-height: 5px;}
h4  { font-size: 11px; font-weight: bold; text-decoration: underline; line-height: 5px; }
h5 { font-size: 14px; font-weight: bold; color: #000; text-decoration: none; font-style : italic; }

/*################ TABLEAUX ###################
    Balises élémentaires
	*   <table> : crée un tableau
    * <caption> : légende du tableau (optionnel)
    * <tr> : ligne du tableau
    * <th> : cellules d'en-tête du tableau
    * <td> : cellules du tableau
	Balises complémentaires

    * <thead> : groupe de cellules d'en-tête
    * <tbody> : groupe de cellules de contenu de tableau
    * <tfoot> : groupe de cellules de pied de tableau
*/
#tableau { 
	position: absolute;
	top: 345px;
	left: 240px;
	visibility: visible;
	border: 1px solid #4B1024;
	border-collapse: collapse;
	padding: 4px;
	margin: 0px;
	width: 60%;
	line-height: auto;
	height: auto;
	text-align: left; font-family: sans-serif; font-weight: normal; font-size: 10px;
}

td {color: #CCCCC; 
border: 1px solid #4B1024;
padding: 4px;
text-align: left;
}
.photos { border: #990000;}

/*Ce test vérifie l'implémentation de empty-cells .hide { border-collapse : colapse; empty-cells : hide; }*/
.show { border-collapse : colapse; empty-cells : show; }
.hide { border: none; }
/*################ footer ###################*/
#footer1 {
	position: absolute;
	width: 770px;
	background-color: #AACB00;
	height: 12px;
	visibility: visible;
	font-size : 10px;
	text-align : center;
	border-top: 1px solid #4E8A04;
	border-bottom: 1px solid #4E8A04;
	padding-top:5px;
	padding-bottom:5px;
	margin-left: auto; margin-right: auto;
}
#footer2 { 	
	position: absolute;
	width: 770px;
	background-color: #AACB00;
	height: 12px;
	top: 640px;
	left: 0px;
	visibility: visible;
	font-size : 10px;
	text-align : center;
	border-top: 1px solid #4E8A04;
	border-bottom: 1px solid #4E8A04;
	padding-top:5px;
	padding-bottom:5px;
	margin-left: auto; margin-right: auto;
	}
.footer a:link { color: #fff; }
.footer a:visited { color: #fff; }
.footer a:hover { text-decoration:underline; color: #fff; }