/* 26/07/2010 23:34:45
horiz_feuille_base_1.css
par Michel Troya (Fr) http://micheltroya.fr    developpement@micheltroya.fr  */

/*  '_' caractère underscore devant les réglages concernant uniquement Internet Explorer */


<!--
div.txttitre
{font-family:Arial,Times;font-size:18pt;color:#339933;text-align:center;font-weight:bold}
-->
<!--
div.txtcorps
{font-family:Arial,Times;font-size:11pt;color:#339933;text-align:center;font-weight:bold}
-->
<!--
a.lienbouton
{font-family:Verdana,Arial;font-size:14pt;font-weight:bold;color:gold; text-decoration: none}
a:hover.lienbouton {color: yellow; text-decoration: none}
-->

h2{font-size:7pt;font-weight:normal;color:#FFFFCC;margin-top:2px}  /*  b2eb7a  */
h1{font-size:14px}
.texte_vert{font-family:Arial,Times;font-size:11pt;color:darkgreen;vertical-align:top}
.texte_vert_petit{font-family:Arial,Times;font-size:8pt;color:darkgreen;vertical-align:top}

/* PARTIES GENERAL GAUCHE  */
#partie_gauche{float:left;left:5px;z-index:10;margin-top:35px;border:0px solid blue;width:200px;}
#slide_container{margin-top:200px;margin-left:3px}
#menu{z-index:1000;width:200px;}
#menu1 {z-index:1000;top:0px; width:200px;left:10px;;text-align:left;margin-left:0em;visibility:visible;background-image:url(fond_trait_horiz.gif);background-repeat:repeat}/* div de tout le menu */
#cycle_modules{}
#cycle_sites{height:134px;left:10px}
/*  FIN PARTIE GAUCHE */


#haut_type{z-index:1000;margin-top:1px;width:80%;height:70px;margin-left:auto;margin-right:auto;}

	.type_repos_1 {
		position:relative;
		z-index:500;
		display:block;
		height: 40px;
		width: 100px;
		background:url(images_site/type_pme_repos.png) 0 0 no-repeat; 
	}
	.type_hover_1 {
		position: absolute;
		z-index:500;
		top: 0;
		left: 0;
		display: none;
		height: 40px;
		width: 100px;
		cursor:pointer;
		background:url(images_site/type_pme_survol.png) 0 0 no-repeat;
	}

    	.type_repos_2 {
		position:relative;
		z-index:500;
		display:block;
		height: 40px;
		width: 100px;
		background:url(images_site/type_independants_repos.png) 0 0 no-repeat; 
	}
	.type_hover_2 {
		position: absolute;
		z-index:500;
		top: 0;
		left: 0;
		display: none;
		height: 40px;
		width: 100px;
		cursor:pointer;
		background:url(images_site/type_independants_survol.png) 0 0 no-repeat;
	}
	
		.type_repos_3 {
		position:relative;
		z-index:500;
		display:block;
		height: 40px;
		width: 100px;
		background:url(images_site/type_particuliers_repos.png) 0 0 no-repeat; 
	}
	.type_hover_3 {
		position: absolute;
		z-index:500;
		top: 0;
		left: 0;
		display: none;
		height: 40px;
		width: 100px;
		cursor:pointer;
		background:url(images_site/type_particuliers_survol.png) 0 0 no-repeat;
	}
	
	 	.type_repos_4 {
		position:relative;
		z-index:500;
		display:block;
		height: 40px;
		width: 100px;
		background:url(images_site/type_associations_repos.png) 0 0 no-repeat; 
	}
	.type_hover_4 {
		position: absolute;
		z-index:500;
		top: 0;
		left: 0;
		display: none;
		height: 40px;
		width: 100px;
		cursor:pointer;
		background:url(images_site/type_associations_survol.png) 0 0 no-repeat;
	}
	
		
	 	.type_repos_5 {
		position:relative;
		z-index:500;
		display:block;
		height: 40px;
		width: 100px;
		background:url(images_site/type_g_entreprise_repos.png) 0 0 no-repeat; 
	}
	.type_hover_5 {
		position: absolute;
		z-index:500;
		top: 0;
		left: 0;
		display: none;
		height: 40px;
		width: 100px;
		cursor:pointer;
		background:url(images_site/type_g_entreprise_survol.png) 0 0 no-repeat;
	}

	 	.type_repos_6 {
		position:relative;
		z-index:500;
		display:block;
		height: 40px;
		width: 100px;
		background:url(images_site/type_ecoles_repos.png) 0 0 no-repeat; 
	}
	.type_hover_6 {
		position: absolute;
		z-index:500;
		top: 0;
		left: 0;
		display: none;
		height: 40px;
		width: 100px;
		cursor:pointer;
		background:url(images_site/type_ecoles_survol.png) 0 0 no-repeat;
	}	

	 	.type_repos_7 {
		position:relative;
		z-index:500;
		display:block;
		height: 40px;
		width: 100px;
		background:url(images_site/type_recruteurs_repos.png) 0 0 no-repeat; 
	}
	.type_hover_7 {
		position: absolute;
		z-index:500;
		top: 0;
		left: 0;
		display: none;
		height: 40px;
		width: 100px;
		cursor:pointer;
		background:url(images_site/type_recruteurs_survol.png) 0 0 no-repeat;
	}	
		
#partie_droite{float:right;margin-top:35px;right:5px;border:0px solid red;width:200px;}

#news_titre {z-index:20;position:absolute;top:-21px;right:-2px;_right:-4px; width:147px;_width:145px;height:20px;background-image:url(images_site/fond_trait_vertic_jaune.gif);font-family:verdana,arial;color:#336600;font-size:10px;text-align:center}
#news {z-index:3;height:150px;position:absolute;top:380px;_top:420px;right:10px; width:142px;BACKGROUND-COLOR:FFFFCC;font-family:verdana,arial;color:#336600;font-size:11px;border-style:outset;border-width:1 2 2 1;text-align:center;visibility:visible}

#img_defile {font-family:verdana,arial;color:#336600;font-size:10px;position:absolute;bottom:20px;left:20px; width:200px;height:100px;text-align:center;z-index:2}

#client_titre {width:170px;height:20px;margin-top:0px;margin-left:0px;text-align:left;border:0px solid #336600;
background-image:url(images_site/aqua_trait_petit2.png);font-family:verdana,arial;color:#336600;font-size:11px;text-align:center;visibility:visible} /* fond_trait_vertic2.gif   */
#client {width:170px;height:85px;_height:40px;BACKGROUND-COLOR:DBFEDA;border:0px solid #336600;font-family:verdana,arial;color:#336600;font-size:10px;text-align:center;visibility:visible}/* background-color:FFFFCC */

#moteur_titre {margin-left:-10px;width:170px;height:20px;border:0px solid #336600;background-image:url(images_site/aqua_trait_petit2.png);font-family:verdana,arial;color:#336600;font-size:11px;text-align:center;visibility:visible}
#moteur {margin-left:-10px;width:170px;height:75px;_height:25px;BACKGROUND-COLOR:DBFEDA;border:0px solid #33600;font-family:verdana,arial;color:#336600;font-size:10px;text-align:center;visibility:visible}/* background-color:FFFFCC */


#liens_titre {margin-left:-1px;width:170px;height:20px;background-image:url(images_site/aqua_trait_petit2.png);border:0px solid #336600;font-family:verdana,arial;color:#336600;font-size:11px;} /* background-image:url(images_site/fond_trait_vertic3.gif) */
#liens {width:170px;height:190px;text-align:left;visibility:visible;background-color:DBFEDA;border:0px solid #336600;font-family:verdana,arial;color:#336600;font-size:10px;visibility:visible } /* BACKGROUND-COLOR:lightyellow; */

#maj{ font-family:verdana,arial;color:#336600;font-size:10px;width:190px;text-align:center;visibility:visible }


/*  FIN PARTIE DROITE */

#affiche {position:absolute;z-index:0;line-height:1.5em;text-decoration:none;top:100px;_top:115px;border-width:0px;font-style:normal;font-family:verdana,arial;color:#336600;font-size:12px;width:55%;left:25%;height:40%;align:center; visibility:visible }
#arborescence{position:absolute;z-index:2000;font-family:verdana,arial;color:#336600;font-size:11px;top:80px;_top:87px; right:10px;text-align:right;align:right;visibility:visible;}/* des liens indiquant l'arborescence où l'on se trouve */
#arborescence a{color:#336600}
#arborescence a:hover{color:#336600}
#logo { position:absolute;top:5px;left:5px;z-index:3;width:100%;z-index:7}
#logo_milieu{position:relative;margin-left:180px;margin-right:50px;top:-45px;_top:-48px;height:15px;background-image:url(images_site/logo_traits_milieu.png);background-repeat:repeat-x;z-index:-1}
#logo_fin{position:absolute;border:0px solid red;top:57px;_top:58px;right:30px;_right:45px;width:21px;height:15px;background-image:url(images_site/logo_traits_fin.png);background-repeat:no-repeat;z-index:10}

/*  TABLEAUX */
#tab_titre {visibility:visible;background-image:url(images_site/fond_trait_vertic2.gif);border-style:solid;border-width:1 1 1 1;border-color:#336600;font-family:verdana,arial;color:#336600;font-size:10px;font-weight:bold;visibility:visible } /* BACKGROUND-COLOR:lightyellow; */
#tab_ligne1 {background-color:DBFEDA;border-style:solid;border-width:1 1 1 1;border-color:#336600;font-family:verdana,arial;color:#336600;font-size:10px } /* BACKGROUND-COLOR:lightyellow; */
#td_general{border-style:solid;border-width:thin;border-width:0 0 1 0}
#td_milieu{border-style:solid;border-width:thin;border-width:0 1 1 1}
#td_gauche{border-style:solid;border-width:thin;border-width:0 0 1 1}
#td_droit{border-style:solid;border-width:thin;border-width:0 1 1 0}
#fond_jaune1{background-color:FFFFCC}
#fond_jaune2{background-color:FFFF99}
#fond_vert1{background-color:DBFEDA}
#fond_vert2{background-color:99FF99}
#fond_orange1{background-color:FFCC66}
#fond_orange2{background-color:FFCC33}


#compteur{z-index:4; font-family:verdana,arial;color:#336600;font-size:10px;position:absolute;top:150px; width:130px;height:60px;right:10px;text-align:center;visibility:visible }

#image_bas {font-family:verdana,arial;color:#336600;font-size:10px;position:absolute; bottom:50px;width:130px;right:10px;text-align:center;visibility:visible }/* div de tout le menu */



/*  PARTIE GAUCHE */
#assistance_distance{position:absolute;top:45%;left:0px}
#img2{position:absolute;z-index:4;font-family:verdana,arial;color:#336600;font-size:11px;top:120px; right:10px;text-align:right;align:right;visibility:visible;}/* des liens indiquant l'arborescence où l'on se trouve */

#menu2 {top:160px;left:10px;text-align:left;align:left;margin-left:0em;visibility:visible;position:absolute; background-image:url(fond_trait_horiz.gif);background-repeat:repeat;z-index:10}/* div de tout le menu */

#decale{margin-left:7px}
/*  FIN PARTIE GAUCHE */

#aide { position:absolute;top:0.4em;left:0.4em;width:6.5em;margin-left:90%;height:7em; visibility:visible }


#infos {padding-left:0.1em;padding-bottom:1em;padding-top:10px;border-left:2px solid darkgreen;border-top: 2px solid darkgreen;border-right: 0.3em solidyellow;border-bottom: 0.3em solid yellow;padding-left:0.5em;padding-right:0.5em;margin-right:0.5em;background-color:palegreen;font-family:arial,verdana,times;font-size:14pt; color: darkgreen;position: absolute;top:13em;width:22em;right:0.2em;visibility: visible;alignement:right;text-align:left}
#aide { position:absolute;top:0.4em;left:0.4em;width:6.5em;margin-left:90%;height:6em;visibility:visible }/* entete avec flash utilise ce DIV */
#entete { z-index:2;top: 0.4em; left: 0.4em; margin-left:auto;margin-right:auto;min-width:950px;height: 145px; visibility: visible }/* SOMMAIRE qui apparait si flash pas installe utilise ce DIV */
#texte { position:absolute;top:50px;width:1024px;margin-left:5%;margin-right:5%;visibility:visible;text-align:justify}
#affiche2 {line-height:1.5em;text-decoration:none;top:40px;border-width:0px;z-index:-5;font-style:normal;font-family:verdana,arial;color:#336600;font-size:11px;position:absolute;width:100%;left:5%;align:center; visibility:visible }

#normal{font-style:normal}
.autres_liens{color: darkgreen }
/* LIEN GENERAL */
a{color:#254901;text-decoration:none;} /* 488f03 254901  */
//a:hover{color:darkgreen;font-weight:bold}
a:hover{color:chocolate}

.neutre{color:#336600;text-decoration:none;}
.neutre:hover{color:#336600;text-decoration:none;}

/* en dessous dans une balise <a id="lien_nu" .. va modifier le tyle du lien :hover qd on le survole */
#lien_nu{color: darkgreen;text-decoration:none; }
#lien_nu:hover{color: chocolate;text-decoration:underline; }
.encadre1{width:300px;background-color:DBFEDA; font-family:trebuchet ms,verdana,arial; font-size:9pt; color:darkgreen;  text-align:center; border-style:outset; border-color:darkgreen; border-width:thin; padding:3px;}


ul#menu li ul{
  display:none; /* empêche de voir les menus déroulés tant qu'on ne passe pas dessus (all pour tout voir) */
  z-index:10;
}

ul#menu li:hover>ul{
  display:block;
    z-index:10;
       _width:180px;
}


ul#menu a
{
  display:block;
  width:100%;/* largeur du texte du bloc de niveau 2 */
  color:#336600 ;/* couleur texte au repos*/
  text-decoration:none;
    z-index:10;
}

/* definition generale du menu*/
ul#menu,
ul#menu ul{
  /*background:#ccffcc; */
background-image:url(images_site/fond_trait_horiz.gif);background-repeat:repeat;
  border:0.1em solid ;border-color:darkgreen;
  list-style:none;
  padding:0.4em;
  margin:0.4em;
  font-family:Verdana,Arial;
  font-size:12px;
  _font-size:12px;
  line-height:2;
  float: left;
  text-indent:0.4em;
border-style:outset;/* effet de relief autour des rectangles */
  z-index:10;

/* _ tiret bas au début --> valeur pour Internet Explorer
les cadres étant légèrement décalés à droite et laissant un espace, il faut qu'ils commencent un peu plus à gauche */
}

ul#menu
{
  line-height:2;
    z-index:10;
}


ul#menu/* fonctionne seulement en IE */
{
width:170px;
  z-index:10;
}


/* 1er sous-menu quand le menu de depart le fait apparaitre */
ul#menu ul{
  position:absolute;
  top:-2em;
  left:12.8em;
  _left:12.8em;
 width:25em ;  
 _width = 25em ;
   z-index:10;
}

ul#menu li{
  position:relative;
  padding:0;
width:98%;/* en réduisant le texte de début de ligne, permet que le signe graphique de la ligne ne soit pas tout au bout mais on perd en largeur*/
_width:100%;
  _display:inline;
    z-index:10;
}

/* EXPLIQUE ORDRE DES DEF DES SOUS MENUS */
/* 'menu' est le nom de la balise DIV englobant toute la liste
  'li' signifie qu'on passe sur la 1ere ligne
  'ul' signifie qu'on descend d'un niveau
  2eme 'ul' signifie qu'on descend encore d'un niveau
  on est donc sur la définition du 3eme rectangle de sous menu
*/
#menu li ul ul{ /* 3eme rectangle */
  left:24.1em;
  _left:23.7em;
width:34em;
_width:34em;
  line-height:3;
    z-index:10;
}

#menu li ul ul ul{  /* 4eme rectangle tres rare mais doit apparaitre a gauche pour ne pas depasser bord droit de l'ecran  */
  left:-20em;
  _left:-18em;
top:-6em;
width:20em;
_width:18em;
  z-index:10;
}


ul#menu { /* largeur du menu de départ*/
  left:0;
width:13.4em;
_width:12em;
  z-index:10;
}


/*ceux qui auront à côté de href dans la page html class="daddy" auront l'image de la fleche indiquant le sous-menu. ne se fait pas automatiquement*/
#menu a.daddy,
#menu li a.daddy,
#menu ul li ul a.daddy,
#menu ul li a.daddy /* qd on passe sur sous menu de niveau 2 */
 {
	background: url(images_site/fleche.gif) center right no-repeat ;
	_width:160px; 
	  z-index:10;

}

ul#menu a.daddy:hover{    /* fonctionne avec IE alors que déf général 1 parag au-dessus ne donne rien ?.. */
	background: url(images_site/fleche.gif) center right no-repeat ; 
     border:0em; /* effacer cadre et fond quand on passe sur ligne de ssmenu */
       z-index:10;
}

ul#menu a.daddy   /* fonctionne avec IE alors que déf général 2 parag au-dessus ne donne rien ?.. */
{
	background: url(images_site/fleche.gif) center right no-repeat ; 
     border:0em; /* effacer cadre et fond quand on passe sur ligne de ssmenu */
       z-index:10;
}

/* a:hover signifie 'quand on passe sur le lien' car 'a' symbolise le lien */
ul#menu a:hover{
  background:#E2FDE2;/* couleur fond quand on passe dessus */
  color: #336600; /* couleur texte quand on passe dessus */
  border:0.1em solid;border-color:darkgreen; /* cadre quand on passe dessus */
font-weight:bold;
  font-size:12px;
  _font-size:12px;
    z-index:10;
}

	.boite_vert{background-color:palegreen;border:1px solid darkgreen;}
	.boite_orange{background-color:#F8DFA4;border:1px solid #F9C038;}
	.boite_jaune{background-color:#FCFCC8;border:1px solid darkorange;}
	.boite_bleu{background-color:#BDE3FB;border:1px solid darkblue;
	
	.boite_erreur{font-size:0.8em;border:2px solid red;color:red;font-weight:bold;text;background-color: rgb(253,203,182);padding:10px;}
	.boite_attention_orange{border:2px solid darkorange;color:brown;font-weight:normal;text;background-color:#F8D47C;padding:10px;}
	.boite_valide_vert{border:2px solid darkgreen;color:$vert_2;font-weight:normal;text;background-color:#D3FBD3;padding:10px;}

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

	
	
</style>
<script type="text/javascript">


function hover(obj){
  if(document.all){
    UL = obj.getElementsByTagName('ul');
    if(UL.length > 0){
      sousMenu = UL[0].style;
      if(sousMenu.display == 'none' || sousMenu.display == ''){
        sousMenu.display = 'block';
      }else{
        sousMenu.display = 'none';
      }
    }
  }
}

</style>

<script type="text/javascript">

function hover(obj){
  if(document.all){
    UL = obj.getElementsByTagName('ul');
    if(UL.length > 0){
      sousMenu = UL[0].style;
      if(sousMenu.display == 'none' || sousMenu.display == ''){
        sousMenu.display = 'block';
      }else{
        sousMenu.display = 'none';
      }
    }
  }
}

function setHover(){
  LI = document.getElementById('menu').getElementsByTagName('li');
  nLI = LI.length;
  for(i=0; i < nLI; i++){
    LI[i].onmouseover = function(){
      hover(this);
    }
    LI[i].onmouseout = function(){
      hover(this);
    }
  }
}
</script>