/***********************************************/
/* NavigationMenuDetail.css                            */
/*           */
/***********************************************/

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 
 /*
 Couleur et image d'arrière-plan
pour que l'arrière-plan d'un élément soit blanc : background-color: #ffffff; ;
pour qu'une image occupe l'arrière-plan d'un élément :
background-image: url("?url de l'image?") ;
pour que l'image d'arrière-plan ne se répète pas dans l'élément :
background-repeat: no-repeat; ;
pour que l'image d'arrière-plan soit centrée dans l'élément :
background-position: center; ;
pour en savoir plus : les propriétés d'arrière-plan .
Couleur d'avant-plan
pour que l'avant-plan d'un élément soit noir : color: #000000; ;
pour en savoir plus : la couleur d'avant-plan.

Bordures
pour que l'élément ait une bordure noir et continue de 5 pixels d'épaisseur :
border: 5px solid #000000; ;
pour que la bordure soit en pointillé : border: 5px dotted #0000ff; ;
pour que la bordure donne une impression de relief : border: 5px groove #0000ff; ;
pour en savoir plus : les propriétés de bordure.

Taille, alignement et positionnement
Largeurs, hauteurs
pour spécifier la largeur d'un élément (ici 250px) : width: 250px; ;
pour spécifier la hauteur d'un élément (ici 250px) : height: 250px; ;
pour en savoir plus : la largeur du contenu et la hauteur du contenu.

Marges, espacement
pour spécifier la largeur d'une marge autour d'un élément (ici 25px) : margin: 25px; ;
pour spécifier la largeur de l'espacement autour d'un élément (ici 25px) : padding: 25px; ;
pour en savoir plus : exemples de marges, d'espacements et de bordures.

Alignement du texte
pour centrer un texte : text-align: center; ;
pour aligner un texte à gauche : text-align: left; ;
pour aligner un texte à droite : text-align: right; ;
pour en savoir plus : l'alignement.

Positionnement des éléments:
pour centrer horizontalement un élément dans la page (
ici avec une largeur de 70% de celle-ci) : margin-left: 15%; margin-right: 15%; ;
pour extraire un élément du flux normal et le positionner à gauche : float: left; ;
pour extraire un élément du flux normal et le positionner à droite : float: right; ;
pour empêcher un élément flottant de déborder vers le bas sur le contenu qui le suit :

le faire suivre d'un élément <div class="spacer">&nbsp;</div> doté de la propriété .spacer { clear: both; } ;
ou mieux, utiliser un élément <hr /> doté de la propriété hr { clear: both; visibility:
hidden; }
Il ne sera visible que dans les navigateurs non-graphiques pour lesquels il contribuera
à structurer visuellement la page,
la rendant plus accessible et plus agréable à consulter? ;
pour en savoir plus : les flottants et Le contrôle du flux autour des flottants ;

pour extraire un élément du flux normal et le positionner de manière absolue dans la
fenêtre du navigateur (ici, à 25 px des bords haut et droit) : position: absolute;
right: 25px; top: 25px;  ;
pour extraire un élément fixed du flux normal et le positionner de manière fixe
dans la fenêtre du navigateur (ici, à 25 px des bords haut et droit) :
 .fixed { position: absolute; right: 25px; top: 25px; }
 html>body .fixed { position: fixed; }  ;

remarque : le sélecteur html>body permet de cacher la position fixe à MSIE Windows,
qui ne la supporte pas, et qui s'en tiendra à un positionnement absolu ;

pour en savoir plus : la propriété position.

Typographie
pour spécifier une police de caractères (ici type arial) : font-family: arial,
verdana, helvetica, sans-serif; ;

remarque : les noms de police composés doivent être placé entre guillemets:
"Times New Roman" ;

pour spécifier une taille de caractères (ici 1em) : font-size: 1em; ;

remarque : les tailles en em sont préférables aux tailles en pixels car elles
s'adaptent aux réglages personnels des utilisateurs et sont ainsi plus accessibles? ;

pour spécifier une hauteur de ligne (ici 1.5em) : line-height: 1.5em; ;
pour spécifier une mise en italique : font-style: italic; ;
pour spécifier une mise en gras : font-weight: bold; ;

pour en savoir plus : La spécification de police ;

pour spécifier un soulignement : text-decoration: underline; ;

pour en savoir plus : la propriété text-decoration ;

pour barrer un texte : text-decoration: line-through; ;

pour en savoir plus : la propriété text-decoration ;

pour forcer l'affichage du texte en capitales : text-transform: uppercase; ;

pour en savoir plus : la capitalisation.

Formats d'hyperliens
pour définir la couleur par défaut des hyperliens (ici, bleu) : a { color: #0000ff; } ;
pour définir des hyperliens non soulignés : a { text-decoration: none; } ;
pour définir la couleur des hyperliens visités (ici, violet) : a:visited { color: #800080; } ;
pour définir la couleur des hyperliens survolés (ici, violet) : a:hover { color: #800080; } ;
pour définir la couleur des hyperliens activés (ici, violet) : a:active { color: #800080; } ;

 */
 
body{
	/*background-color
	background-image:url("SoleilduRwanda.gif");
	background-repeat  : repeat-x*/
	/*background-repeat  : repeat-y
	background-repeat  : no-repeat*/
	/*background-attachment
	background-position: 0% 0%*/
	/*background-position: 100% 0%
	background-position: 0% 100%
	background-position: 100% 0%
	background-position: 6cm 2cm
	background-position: top left
	background-position: top center
	background-position: top right
	background-position: left center
	background-position: center center
	background-position: right center
	background-position: bottom left
	background-position: bottom center
	background-position: bottom right;*/
	background :  url("pactfond.jpeg") no-repeat fixed 0cm 0cm;
   	font-family: Arial,sans-serif;
		
}





/***********************************************/
/* Layout Divs                                 */
/***********************************************/
/*Cette partie contient le logo du dessus et les ménus horizontaux*/
#enteteGeneral{
	margin:0px;
	padding: 0px 0px;
	/*border-bottom: 1px solid #cccccc;*/
	width: 140%;
	height: 15%
}

.enteteLogoTitreSite {
/*background-image: url("SoleilduRwanda.gif");  */
/*pour que l'image d'arrière-plan ne se répète pas:*/
	/*background-repeat: no-repeat; */
/*pour que l'image d'arrière-plan soit centrée dans l'élément :*/
/*background-position: center; */
/*width: 100%;
height: 100%;*/
/*border-bottom: 2px solid #cccccc; */
}


/*emplacement du logo*/
.enteteLogoTitreSite img{
		float: left;
		width: 30%;
	height: 100% /*de la taille de l'entête générale*/
	
}


.enteteLogoTitreSite p {    



color: navy;
}

.enteteLogoTitreSite div { position : absolute ;
      width : 40% ; height : 100% ;
      left : 14cm ; top : 1.5cm ;
      /*overflow : scroll ;*/
      /*background-color : navy*/
      color: white;
      }

#menuhorizontal a{
/*color: #cccccc;*/
padding: 0px 0px 0px 0px;
white-space: nowrap;

             margin: 0px  0px;  /* pour les marges bas et haut*/
     width: auto; /* on définit la taille du bouton de menu */
     height: auto;
     float: right;
     display: block;
     text-align: center;
     border: 1px solid gray;
     text-decoration: none;
     color: #000;
     background: #FFFFF0;
    
}


#menuhorizontal img{
 display: block;
}

#menuhorizontal a {
 font-size: 100%;
 color: #334d55;
	padding: 4px 4px 0px 0px;
}
#menuhorizontal a:hover {
     background: #334d55;
     border: 1px solid gray;
     color: #fff;
     }

#menuhorizontal a:active {
     background: #334d55;
     border: 1px solid gray;
     color: #fff;
     }
     
     
     
     /*tester les onglets en css*/
/*     a:link, a:visited, a:hover {
	color: #006699;
	text-decoration: none;*/
     
#menu1 { /* boite qui contient le menu (les onglets) */
   border-bottom:solid 10px navy ; /* crée le trait bleu en-dessous des onglets */
   padding-top:12px ; /* marge intérieure haute */
   padding-bottom:0px ; /* marge intérieure basse */
   font-family:arial narrow,sans-serif; 
   font-size:small;
   
   background-color:silver} /* le fond du menu */
#menu1 a{
    color:Silver }



.onglet { /* style des onglets inactifs */
   margin: 0px ; /* espace entre deux menus horizontal */
            /*haut droit bas */
   padding:10px 5px 5px 3px ; /* marge intérieure */
   color:white ;  /*couleur des caractères*/
   background:url(coin-haut-droite.gif) no-repeat  right top} /* insère un rectangle noir en haut à droite de l'onglet */


a.onglet { /* style des liens se trouvant dans un onglet inactif */
   background-color:darkred  ; /* le fond de l'onglet est rouge foncé */
   color:white ;  /*couleur des caractères*/

   text-decoration:none

} /* les liens ne sont pas soulignés */
   /*onglet actif*/
/*a.onglet span {
      color:white }*/
      
a.onglet:hover{ /* style de l'onglet de la page active */
    border-bottom:solid 10px groove navy ; /* le trait inférieur est effacé */
    color:white ; 
    text-decoration:none;
    background-color:navy} /* le fond de l'onglet actif est blanc*/  
     

.onglet-actif { /* style de l'onglet de la page active */
    border-bottom:solid 2px white ; /* le trait inférieur est effacé */
    background-color:white} /* le fond de l'onglet actif est blanc*/     
     
     
     
     
     
     
     
     
     
     

  /*   
 ul {padding: 0; margin: 0; border-bottom: 1px solid silver;
  font: 1em sans-serif;}
ul li {list-style-type: none;
  border: 1px solid silver; border-width: 1px 1px 0 3px;
  position: relative; margin: 0; padding: 0;}
ul ul {display: none;}
ul li:hover > ul {display: block; position: absolute; top: -1px; left: 100%;}
li a {display: block; padding: 5px 7px; text-decoration: none;
  background: #FFF;}
ul#topmenu li a:hover {background: yellow;}
li.sub > a {font-weight: bold; background: #FFE;}

h1 {margin: 0; padding: 1em 0.25em 0; font: bold 2.5em Arial, sans-serif; line-height: 0.8em; border-bottom: 1px solid silver; text-align: right; color: #557; letter-spacing: 2px;}

div#main {margin: 0 8em 0 1em; padding: 0; border-right: 1px solid silver;}
div#main p {margin: 1em 3em 1em 0.5em;}
ul#topmenu {width: 6em;}
ul#topmenu > li:hover > ul {width: 10em; top: 1.5em; left: -3px;}

ul ul {width: 10em;}*/

#rtnv {position: absolute; top: 6em; right: 0; width: 8em; margin: 0; padding: 0; font-family: Arial, sans-serif;}
#rtnv > ul {width: 9em; margin-left: -1px; font-size: 85%;}
#rtnv ul {border: 1px solid silver; border-width: 0 0 0 1px;}
#rtnv ul li {border-width: 1px 0; border-color: white; padding: 0 0 0 5px; line-height: 1.25em;}
#rtnv ul ul {border-width: 0 1px 1px 1px; border-color: gray silver gray gray;}
#rtnv ul ul li {border-color: #FEFEFC;}
#rtnv li > a {background-color: transparent; padding: 3px;}
#rtnv li:hover {background-color: #EED;}
#rtnv li.sub:hover {margin-left: -10.2em; border: 1px solid gray; background: #DDB;}
#rtnv li.sub:hover > a {color: #330;}
#rtnv li.sub:hover > ul {top: 1.75em; left: -1px; background: #FEFEFC;}

/*h4 {margin: 0 0.5em 0 0; padding: 0 0.25em; font-size: 90%; border-bottom: 1px solid silver;}  */  
     
   #navigation {
   background:transparent; 
   margin:0em; 
   height:auto; 
 /* cache overflow:hidden de IE5/Mac */ 
 /* \*/ 
   /*overflow: hidden; */
 /* */
   }
 #navigation ul {
   margin:0; 
   padding:0; 
   list-style-type:none; 
   background:transparent;
   }
   
   #navigation ul li {list-style-type: none;
  border: 0.5px solid darkred; border-width: 1px 1px 0 3px;
  position: relative; margin: 0; padding: 1;}
#navigation ul ul {display: none;}
#navigation ul li:hover > ul {display: block; position: absolute; top: -1px; left: 100%;}
#navigation li a {display: block; padding: 1px 0px; text-decoration: none/*distance pour le menu horizontal*/
  background: #FFF;}

#navigation ul#topmenu li a:hover {background: yellow;}
#navigation  li.sub:hover {margin-left: -10.2em; border: 1px solid gray; background: #DDB;}
#navigation  li.sub:hover > a {color: #330;}
#navigation  li.sub:hover > ul {top: 1.75em; left: -1px; background: #FEFEFC;}

/*#navigation li.sub > a {font-weight: bold; background: #FFE;}*/

/*h1 {margin: 0; padding: 1em 0.25em 0; font: bold 2.5em Arial, sans-serif; line-height: 0.8em; border-bottom: 1px solid silver; text-align: right; 
color: #557; letter-spacing: 2px;}*/

#navigation div#main {margin: 0 8em 0 1em; padding: 0; border-right: 1px solid silver;}
#navigation div#main p {margin: 1em 3em 1em 0.5em;}
#navigation ul#topmenu {width: 6em;}
#navigation ul#topmenu > li:hover > ul {width: 10em; top: 1.5em; left: -3px;}

#navigation ul ul {width: 10em;}
   
   
   
 #navigation li {
   display:block; 
   float:left; 
   margin:0px 2px 0px 0px;
   padding: 0px 5px 0px 5px
   }
 .BoxOnglet, .BoxOngletFonce {
   background:transparent;
   }
 .BoxOnglet span {
   text-align:center; 
   color:CornflowerBlue ; 
   margin:0; 
   font-family:verdana; 
   font-size:80%; 
   font-weight:normal;
   }
 .BoxOngletFonce span {
   text-align:center; 
   color:CornflowerBlue ; 
   margin:0; 
   font-family:verdana; 
   font-size:xx-small; 
   font-weight:normal;
   }


.b1, .b2, .b3, .b4 {
   display:block; 
   font-size:xx-small;
 /* cache overflow:hidden de IE5/Mac */ 
 /* \*/ 
   overflow: hidden; 
 /* */ 
   }


.b1, .b2, .b3 {height:1px;}
 .b2, .b3, .b4 {
   border-left:1px solid #FFFFFF; 
   border-right:1px solid #FFFFFF;
   }
 .b1 {margin:0 5px; background:#FFFFFF;}
 .b2 {margin:0 3px; border-width:0 2px;}
 .b3 {margin:0 2px;}
 .b4 {height:2px; margin:0 1px;}
 .BoxContenu {
   display:block; 
   border-left:1px solid #FFFFFF; 
   border-right:1px solid #FFFFFF;
   }

/*taille pour le menu horizontal*/
a.menu {
   display:block; 
   text-decoration:none; 
   width:7.5em;
   /*padding: 0px 5px 0px 5px;*/
   }
   
 a.menugrand {
   display:block; 
   text-decoration:none; 
   width:9.5em;
   }
 a.menu:hover, a.menugrand:hover  {
   background:transparent; 
   cursor:pointer;
   
   }
 a.menu:hover span, a.menugrand:hover span {
   /*padding-top:10px;*/
   background:darkred;
   }
  


.rouge {background:#cc3333;}
 .grisbleu {background:#CAD8DE;}
 .bleu {background:navy;}
 .jaune {background:yellow;}
     
     
     
     
     

.head2 {
/*background-image: url('design/head2.gif');*/
width: 770px;
height: 30px;
border-bottom: 1px solid #cccccc;

}

#divMenuIdentification{

  border: 0.8px solid silver;
  /*padding: 1em; */
  /* width: 23.5%;*/
   float: left;
   width: 100%;
   overflow: auto;
   font-size: 80%;
   margin: 0px;

}

#divMenuIdentification p 
{
margin: 5px;
}

#divMenuIdentification ul a:link, #divMenuIdentification ul a:visited 
{display: block;
font-size: 80%;
}
#divMenuIdentification ul {list-style: none; margin: 0; padding: 0;
font-size:80%;
}

/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#divMenuIdentification li 
{border-bottom: 1px solid #EEE;
font-size: 80%;
}

/* fix for browsers that don't need the hack */
html>body #divMenuIdentification li {border-bottom: none;
font-size:80%;
}

/*mise à jour des titres */

#divMenuIdentification h1, #divMenuIdentification h2, #divMenuIdentification h3, #divMenuIdentification h4,
#divMenuIdentification h5, #divMenuIdentification h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
          text-align : center;
}

#divMenuIdentification h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 120%;
 color: #334d55; /*vert olive*/
}

#divMenuIdentification h2{
 font-size: 114%;
 color: #334d55; /*vert*/
}

#divMenuIdentification h3{
 font-size: 100%;
 color: #334d55;
 background-color:#fffacd; border: 1px #000000 solid; /*fond jaune avec contour*/


}

#divMenuIdentification h4{
 font-size: 100%;
 font-weight: normal;
 color: #334d55;
}

#divMenuIdentification h5{
 font-size: 100%;
 color: #334d55;
}



/*********** #divMenuGauche styles ***********/
#divMenuGauche{

  /*border: 1px solid red;*/
  /*background:lightgray; */
  /*padding: 1em; */
   width: 20%;
   float: left;
  /* border-right:solid 1px silver ;*/ /* crée le trait à gauche des onglets */


}

#divMenuGauche a{
color  :navy;
	}
#divMenuGauche legend {
color  :darkred;
align : center;
	}

#divMenuGauche fieldset legend{
text-align : center;
	}


#divMenuGauche img{
		/*float: left;
		width: 100%;
	height: 50%*/ /*de la taille de l'entête générale*/
	}

#divMenuGauche ul a:link, #divMenuGauche ul a:visited {display: block;}
#divMenuGauche ul {list-style: none; margin: 0; padding: 0;}

/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#divMenuGauche li {border-bottom: 1px solid #EEE;}

/* fix for browsers that don't need the hack */
html>body #divMenuGauche li {border-bottom: none;}

/*mise à jour des titres */

#divMenuGauche h1, #divMenuGauche h2, #divMenuGauche h3, #divMenuGauche h4,
#divMenuGauche h5, #divMenuGauche h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
          text-align : center;
}

#divMenuGauche h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 120%;
 color: #334d55; /*vert olive*/
}

#divMenuGauche h2{
 font-size: 114%;
 color: navy; /*vert*/
}

#divMenuGauche h3{
 font-size: 100%;
 color: navy;
 background-color:silver;  /*fond gris sans contour*/

 
}

#divMenuGauche h4{
 font-size: 100%;
 font-weight: normal;
 color: #334d55;
}

#divMenuGauche h5{
 font-size: 100%;
 color: #334d55;
}


/*********** #divMenuDroite styles ***********/
#divMenuDroite{

  /*border: 1px solid red;*/
  /*background:lightgray; */
  /*padding: 1em; */
  font-family: Arial,sans-serif;
  font-size: 70%;
   width: 20%;
   float: right;
   /*border-left:solid 1px silver ;*/ /* crée le trait à gauche des onglets */


}

#divMenuDroite a{
color  :navy;
 font-size: 120%;
 text-decoration: underline;


	}
 
 
#divMenuDroite legend {
color  :darkred;
align : center;
	}

#divMenuDroite fieldset legend{
text-align : center;
	}


#divMenuDroite img{
	/*	float: left;
		width: 100%;*/
	/*height: 50%*/ /*de la taille de l'entête générale*/
	}

#divMenuDroite ul a:link, #divMenuDroite ul a:visited {display: block;}
#divMenuDroite ul {list-style: none; margin: 0; padding: 0;}

/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#divMenuDroite li {border-bottom: 1px solid #EEE;}

/* fix for browsers that don't need the hack */
html>body #divMenuDroite li {border-bottom: none;}

/*mise à jour des titres */

#divMenuDroite h1, #divMenuDroite h2, #divMenuDroite h3, #divMenuDroite h4,
#divMenuDroite h5, #divMenuDroite h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
          text-align : center;
}

#divMenuDroite h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 120%;
 color: #334d55; /*vert olive*/
}

#divMenuDroite h2{
 font-size: 114%;
 color: navy; /*vert*/
}

#divMenuDroite h3{
 font-size: 114%;
 color: silver;
 background-color:darkred; border: 1px #000000 solid; /*fond jaune avec contour*/


}

#divMenuDroite h4{
 font-size: 100%;
 font-weight: normal;
 color: #334d55;
}

#divMenuDroite h5{
 font-size: 100%;
 color: #334d55;
 
 
}

#divMenuDroite p{
     margin: 0;
  padding: 5px;
}





/*********** #menuVertical styles ***********/

#menuVertical{
	position: relative;
	margin: 0px;
	padding: 0px;
	border-bottom: 1px solid #cccccc;
    /*border-bottom: 1px solid #daa520; */
	font-size: 90%;
}

#menuVertical h3{
	padding: 10px 0px 2px 10px;
}

#menuVertical a:link{
	padding: 2px 0px 2px 10px;
	border-top: 1px solid #cccccc;
	width: 100%;
  voice-family: "\"}\"";
  voice-family:inherit;
	width: auto;
}

#menuVertical a:visited{
	border-top: 1px solid #cccccc;
	padding: 2px 0px 2px 10px;
}

#menuVertical a:hover{
	border-top: 1px solid #cccccc;
	background-color: #dddddd;
	padding: 2px 0px 2px 10px;
}



/*un ménu avec liste et couleurs changeantes*/
#button {
  font-size: 80%;
  /*width: 12em;*/
  /*border-right: 1px solid #000;*//*Retire la bordure de droite*/
  padding: 0 0 1em 0;
  margin-bottom: 1em;
  font-family: 'Arial', 'sans-serif','Trebuchet MS', 'Lucida Grande',
    'Verdana', 'Lucida', 'Geneva', 'Helvetica'
    ;
  background-color: #FFFFF0; /*un fond jaune claire */
  color: #333;
  width:auto; /*sans bord gauche ni droit*/
  }

   /* listes pour le style button*/
   #button ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border: none;
    }

  #button li {
    /*border-bottom: 1px solid #90bade;*/ /*meme couleur que le fond*/
    margin: 0;
    }


    
 #button li a {
    display: block;
    padding: 5px 5px 5px 0.5em;
    /*border-left: 10px solid  #fffacd;*//*Même colorie que le titre*/
    /*border-right: 10px solid #fffacd;
    border-left: 10px solid #1958b7;
    border-right: 10px solid #508fc4;*/
    /*background-color: #334d55;*/  /*retirer le fond qui était vert olive*/
    background: url("pactlogo.gif") no-repeat 0 0 ;
    color: navy; /*fond vert*/
    text-decoration: none;
    width: 100%;
    }

  html>body #button li a {
    width: auto;
    }
      /*changement de couleurs quand la souris passe*/
  #button li a:hover {
    /*border-left: 10px solid #fffacd;
    border-right: 10px solid #5ba3e0;*/
    /*background-color: red;*/
    background: url("pactfond.png") no-repeat 0 0 ;
    color: #fff;
    }
    
    
    


/*********** #divDetail styles ***********/
#divDetail{


  margin-left: 23%;
  width:52%;
  border: 5px solid silver groove;
  background-color:silver;
  
  /*padding: 1em;*/

    padding: 10px 10px 10px 10px;
}

#divDetail a{


  color : navy;

}


/*Gestion des tableaux dans divDetail*/
 #divDetail table {
border:3px solid #334d55;
border-collapse:collapse;
width:90%;
margin:auto;
}
#divDetail thead, #divDetail tfoot {
background-color:#D0E3FA;
/*background-image:url(sky.jpg);*/
border:1px solid #334d55;
}
#divDetail tbody {
background-color:#FFFFFF;
border:1px solid #334d55;
}
#divDetail th {
font-family:monospace;
font-size:80%;
border:1px dotted #334d55;
padding:5px;
background-color:#fffacd;
width:25%;
}
#divDetail td {
font-family:sans-serif;
font-size:80%;
border:1px solid #334d55;
padding:5px;
text-align:left;
}
#divDetail caption {
font-family:sans-serif;
}

/*titre pour les détails*/

 #divDetail h1, #divDetail h2, #divDetail h3, #divDetail h4,
 #divDetail h5, #divDetail h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
}

#divDetail h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 140%;
 color: darkred;
 /*background-color:gray;*/
 padding: 10px 0px 10px 0px;
}

#divDetail h2{
 font-size: 114%;
 color: red;
}

#divDetail h3{
 font-size: 114%;
 /*text-decoration: underline;  */
 color: silver;
 background-color:navy; border: 1px #000000 solid; /*fond jaune avec contour*/

}


#divDetail h4{
 font-size: 100%;
 font-weight: normal;
 color: #334d55;
}

#divDetail h5{
 font-family: Verdana,Arial,sans-serif;
 font-size: 140%;
 color: navy;
 /*background-color:gray;*/
 padding: 10px 0px 10px 0px;
}

#divDetail p{
	padding: 0px;
}

#divDetail legend{
 font: bold 100% Arial,sans-serif;
 color: #334d55;
}

#divDetail hr
{

border: 10px solid #fffacd;
}



/*********** #divDetailResultat styles ***********/
#divDetailResultat{
        /*position: relative;
 /*top: 70%;
 margin-left: 30%;*/
 /* border: 4px solid #000000;
  padding: 1em;
  width: 70%;
  height: 300px;
  overflow: auto; */

  /*margin-left: 30%;
  border: 10px solid #000000;
  padding: 1em;              */

}

/*Gestion des tableaux dans divDetail*/
 #divDetailResultat table {
border:2px solid #334d55;
border-collapse:collapse;
width:90%;
margin:auto;
}
#divDetailResultat thead, #divDetailResultat tfoot {
background-color:#D0E3FA;
background-image:url(sky.jpg);
border:1px solid #334d55;
}
#divDetailResultat tbody {
background-color:#FFFFFF;
border:1px solid #334d55;
}
#divDetailResultat th {
font-family:monospace;
font-size:80%;
border:1px dotted #334d55;
padding:5px;
background-color:#fffacd;
width:25%;
}
#divDetailResultat td {
font-family:sans-serif;
font-size:80%;
border:1px solid #334d55;
padding:5px;
text-align:left;
}
/*#6495ed*/
#divDetailResultat caption {
font-family:sans-serif;
}

/*titre pour les détails*/

 #divDetailResultat h1, #divDetailResultat h2, #divDetailResultat h3, #divDetailResultat h4,
 #divDetailResultat h5, #divDetailResultat h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
}

#divDetailResultat h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 120%;
 color: #334d55;
}

#divDetailResultat h2{
 font-size: 114%;
 color: #006699;
}

#divDetailResultat h3{
 font-size: 100%;
 color: #334d55;
}

#divDetailResultat h4{
 font-size: 100%;
 font-weight: normal;
 color: #333333;
}

#divDetailResultat h5{
 font-size: 100%;
 color: #334d55;
}

#divDetailResultat p{
	padding: 0px;
}

#divDetailResultat legend{
 font: bold 100% Arial,sans-serif;
 color: #334d55;
}


a:link, a:visited, a:hover {
	color: #006699;
	text-decoration: none;

}

a:hover {
    text-decoration: underline;
}

/* overrides decoration from previous rule for hovered links */

h1, h2, h3, h4, h5, h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
}

/*h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 120%;
 color: #334d55;
}  */

h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 100%;
 /*color: #ffff00;*/
 color:navy;
}

h2{
 font-size: 114%;
 color: #006699;
}

h3{
 font-size: 100%;
 color: red;
}

h4{
 font-size: 100%;
 font-weight: normal;
 color: #333333;
}

h5{
 font-size: 100%;
 color: #334d55;
}

ul{
 list-style-type: square;
}

ul ul{
 list-style-type: disc;
}

ul ul ul{
 list-style-type: none;
}


/*label{
 font: bold 100% Arial,sans-serif;
 color: #334d55;
} */
				




.spacer {
  clear: both;
}






  /************* #siteInfo styles ***************/

#siteInfo{
    text-align:center;
	clear:top;
	border: 1px solid #cccccc;
	font-size: 75%;
	color:white;
 	padding: 10px 10px 10px 10px;
	margin-top: 0px;
 background-color : silver;
}
/* negative top margin pulls siteinfo up so its top border overlaps (and thus lines up with)
	the bottom border of the divMenuGauche in cases where they "touch" */

#siteInfo img{
	padding: 4px 4px 4px 0px;
	vertical-align: middle;
}

#siteInfo a{
 color:navy;
}

/***********************************************/
/*Component Divs                               */
/***********************************************/

#siteName{
	margin: 0px;
	padding: 0px 0px 10px 10px;
}


/*************** #pageName styles **************/

#pageName{
	padding: 0px 0px 10px 10px;
}
.bordures {background-color:#FFFFF0; border: 1px #000000 solid}
.bordures2{border: 1px #000000 solid}

/************* #menuDeroulant styles **************/




/************* #breadCrumb styles *************/

#breadCrumb{
	font-size: 80%;
	padding: 5px 0px 5px 10px;
}


/************** .feature styles ***************/

.feature{
	padding: 0px 0px 10px 10px;
	font-size: 80%;
}

.feature h3{
	padding: 30px 0px 5px 0px;
	text-align: center;
}

.feature img{
	float: left;
	padding: 0px 10px 0px 0px;
	margin: 0 5px 5px 0;
}
/* adjust margins to change separation between the feature image and text flowing around it */


/************** .story styles *****************/

.story{
	clear: both;
	padding: 10px 0px 0px 10px;
	font-size: 80%;
}

.story p{
	padding: 0px 0px 10px 0px;
}





/************* #search styles ***************/

#search{
	padding: 5px 0px 5px 10px;
	border-bottom: 1px solid #cccccc;
	font-size: 90%;
}

#search form{
 margin: 0px;
 padding: 0px;
}

#search label{
	display: block;
	margin: 0px;
	padding: 0px;
}





/*********** .relatedLinks styles ***********/

.relatedLinks{
	margin: 0px;
	padding: 0px 0px 10px 10px;
	font-size: 90%;
}

.relatedLinks h3{
	padding: 10px 0px 2px 0px;
}


/************** #advert styles **************/

#advert{
	padding: 10px 0px 0px 10px;
	font-size: 80%;
	border-top: 1px solid #cccccc;
}

#advert img{
	display: block;
}


/************** #headlines styles **************/

#headlines{
	margin: 0px;
	padding: 10px 0px 20px 10px;
	font-size: 80%;
}

#headlines p{
	padding: 5px 0px 5px 0px;
}



/*pour simuler la mise en page avec les tableaux */
.saisie input
{

margin-left: 10%;

}

/* pour afficher un beau formulaire sans tableau
voir dans le login des membre*/
/*pour le cadre principal*/


div.row {
  clear: both;
  padding-top: 5px;
  
  }

div.row span.label {
  float: left;
  width: 40%;
  text-align: left;
  }

div.row span.formw {
  float: right;
  width: 60%;
  text-align: left;
  
  
  }

div.row span.souligne {
  text-decoration: underline;
  /*color: #006699;*/
  color : darkred;
  }
  
  
 /* pour souligner les liens et raccourcies  */
 
 div.ligne {

  }
div.ligne span.souligne{
  text-decoration: underline;
  color: #006699;
  /*color: #334d55;*/ /*fond vert*/
  font-weight: bold/*mettre en gras*/
}

/*à vérifier*/
div.spacer {
  clear: both;
  }
/* un pointeur pour tous les labels cliquables */
label { cursor : pointer;
}


#gauche{

  border: 1px solid #000000;
  /*padding: 1em; */
   width: 40%;
   float: left;
   height: 120px;
  overflow: auto;
}


#droit{

  border: 1px solid #000000;
  /*padding: 1em; */
   width: 50%;
   float: left;
   float: right;
   height: 120px;
  overflow: auto;
}


#grandGauche{

  border: 1px solid #000000;
  /*padding: 1em; */
      width: 75%;
   float: left;
   height: 120px;
  overflow: auto;
}


#petitDroit{

  border: 1px solid #000000;
    width: 24%;
   float: right;
   height: 120px;
   align : left;
  overflow: auto;
}


/*Validation*/

#divDetailCandidat{
        /*position: relative;
 /*top: 70%;
 margin-left: 30%;
  border: 1px solid #000000; */

  width: 99%;
  /*height: 300px;*/
  height:auto;
  overflow: auto;
  margin : auto;
 /* margin-left: 5%;
  border: 10px solid #000000;
  padding: 1em;              */

}

/*pour la validation, il ne faut pas laisser toute la page des candidats visible */
#divDetailCandidatValidation{
        /*position: relative;
 /*top: 70%;
 margin-left: 30%;  */
  border: 1px solid #000000;

  width: 99%;
  /*height: 300px;*/
  height:200px;
  overflow: auto;
  margin : auto;
 /* margin-left: 5%;
  border: 10px solid #000000;
  padding: 1em;              */

}
/*
Formats d'hyperliens
pour définir la couleur par défaut des hyperliens (ici, bleu) : a { color: #0000ff; } ;
pour définir des hyperliens non soulignés : a { text-decoration: none; } ;
pour définir la couleur des hyperliens visités (ici, violet) : a:visited { color: #800080; } ;
pour définir la couleur des hyperliens survolés (ici, violet) : a:hover { color: #800080; } ;
pour définir la couleur des hyperliens activés (ici, violet) : a:active { color: #800080; } ;
 border-left: 10px solid  #fffacd;jaune pale
    border-right: 10px solid #fffacd;
    border-left: 10px solid #1958b7; bleu clair
    border-right: 10px solid #508fc4;
*/
#divDetailCandidatValidation a {
    display: block;
    /*padding: 5px 5px 5px 0.5em;  */

    color: #1958b7; /*fond bleu*/

    /*text-decoration: underline; */

    }
    
 /*  #divDetailCandidatValidation a:link{
	padding: 2px 0px 2px 10px;
	border-top: 1px solid #cccccc;
	width: 100%;
  voice-family: "\"}\"";
  voice-family:inherit;
	width: auto;
}  */

#divDetailCandidatValidation a:visited{
	/*border-top: 1px solid #cccccc;
	padding: 2px 0px 2px 10px;*/
 text-decoration: line-through
}

  html>body #divDetailCandidatValidation  a {
    width: auto;
    }
      /*changement de couleurs quand la souris passe*/
  #divDetailCandidatValidation  a:hover {
    background-color: #334d55;
    color: #fff;
    
        }
    
 #divDetailCandidatValidation  a:active {

    background-color: #334d55;
    color: #fff;
    }

  #divDetailCandidatValidation table {
border:2px solid #334d55;
border-collapse:collapse;
width:auto;
/*margin:auto; */
}



#moyenMilieuDetail{

  border: 1px solid #000000;
    width: 30%;
   float: right;
   height: 150px;
   align : left;
  overflow: auto;
}

/*div horizontal dans laquelle  d'autres 3 petits div vont se placer*/
#divDetailCandidatHorizontal{

  border: 1px solid #000000;

  width: 99%;
  height: 152px;
  overflow: auto;
  /*padding: 1em; */
}

#divDetailCandidatHorizontalGauche{

  border: 1px solid #000000;
    width: 16%;
   float: left;
   height: 150px;
   align : left;
  overflow: auto;
}

#divDetailCandidatHorizontalMilieu{

  border: 1px solid #000000;
    width: 26%;
   float: left;
   height: 150px;
   align : left;
  overflow: auto;
}

#divDetailCandidatHorizontalDroit{

  border: 1px solid #000000;
    width: 58%;
   float: left;
   height: 150px;
   align : left;
  overflow: auto;
}



 /* la même div que celle précédente mais plus haut dans laquelle il y a également 3 div*/
#divDetailCandidatHorizontalHaut{

  border: 1px solid #000000;

  width: 99%;
  height: 320px;
  overflow: auto;

  /*padding: 1em; */

}



#divDetailCandidatHorizontalHautGauche{

  border: 1px solid #000000;
    width: 16%;
   float: left;
   height: 318px;
   align : left;
  overflow: auto;
}

#divDetailCandidatHorizontalHautMilieu{

  border: 1px solid #000000;
    width: 57%;
   float: left;
   height: 318px;
   align : left;
  overflow: auto;
}



 #divDetailCandidatHorizontalHautDroit{

  border: 1px solid #000000;
    width: 27%;
   float: left;
   height: 318px;
   align : left;
  overflow: auto;}




#petitGaucheDetail{

  border: 1px solid #000000;
    width: 20%;
   float: right;
   height: 150px;
   align : left;
  overflow: auto;
}






#moyenMilieuDetailH{

  border: 1px solid #000000;
    width: 24%;
   float: right;
   height: 150px;
   align : left;
  overflow: auto;
}

#moyenDroitDetail{

  border: 1px solid #000000;
    width: 38%;
   float: right;
   height: 150px;
   align : left;
  overflow: auto;
}



#gaucheRecherche{

  border: 1px solid #000000;
  /*padding: 1em; */
   width: 53%;
   float: left;
   height: 250px;
  overflow: auto;
}


#droitRecherche{

  border: 1px solid #000000;
  /*padding: 1em; */
   width: 20%;
   float: right;
   height: 250px;
   align : left;
  overflow: auto;
}




/*********** #nouvellePage styles ***********/
#nouvellePage{


  /*margin-left: 25%;
  border: 1px solid #000000;

  padding: 1em;*/

}


/*Gestion des tableaux dans divDetail*/
 #nouvellePage table {
border:3px solid #334d55;
border-collapse:collapse;
width:90%;
margin:auto;
}
#nouvellePage thead, #nouvellePage tfoot {
background-color:#D0E3FA;
/*background-image:url(sky.jpg);*/
border:1px solid #334d55;
}
#nouvellePage tbody {
background-color:#FFFFFF;
border:1px solid #334d55;
}
#nouvellePage th {
font-family:monospace;
border:1px dotted #334d55;
padding:5px;
background-color:#fffacd;
width:25%;
}
#nouvellePage td {
font-family:sans-serif;
font-size:80%;
border:1px solid #334d55;
padding:5px;
text-align:left;
}
#nouvellePage caption {
font-family:sans-serif;
}

/*titre pour les détails*/

 #nouvellePage h1, #nouvellePage h2, #nouvellePage h3, #nouvellePage h4,
 #nouvellePage h5, #nouvellePage h6 {
	font-family: Arial,sans-serif;
	margin: 0px;
	padding: 0px;
}

#nouvellePage h1{
 font-family: Verdana,Arial,sans-serif;
 font-size: 120%;
 color: #334d55;
}

#nouvellePage h2{
 font-size: 114%;
 color: #006699;
}

#nouvellePage h3{
 font-size: 100%;
 color: #334d55;
 text-align : center;
}

#nouvellePage h4{
 font-size: 100%;
 font-weight: normal;
 color: #334d55;
}

#nouvellePage h5{
 font-size: 100%;
 color: #334d55;
}

#nouvellePage p{
	padding: 0px;
}

#nouvellePage legend{
 font: bold 100% Arial,sans-serif;
 color: #334d55;
}

#nouvellePage hr
{

border: 10px solid #fffacd;
}


#messageRouge
{
font:  Arial,sans-serif;
color:darkred;

}

#messageRouge a
{
font:  Arial,sans-serif;
color:darkred;
text-decoration:underline;

}