/***********************************************************************************/ 
/******************************* == menu (haut de page) ****************************/
/************************************************************************************/ 	


.navbarre {
	background-image: url(/act_page/images/fond_site/img_menu.png);
	background-repeat: no-repeat;
	/* background-position: left top; */
	width: 1118px;
	height: 48px;
	list-style: none;
	padding: 0px 0px 0px 0px;
	margin: -1px 0px 0px 0px;
	clear: left; /* à la place de float: left et remplacer……… <!-- fin menu  --> <br clear="left"> ……  par <!-- fin menu  -->  */
}


#nav {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 56px; /* pour que tous les titres visibles soient au milieu */
list-style-type:none;
list-style-position:outside;
position: relative;
line-height: 16px; 
font-size: 13px; /*met pour tout le reste en 12px*/
font-family: Verdana, Geneva, sans-serif;
font-weight: bold; 
}


#nav a {
	display:block;
	color:#fff;
	text-decoration:none;
	height: 41px;/* TRES IMPORTANT PERMET AU MENU DEROULANT DE NE PAS SE CACHER QUAND ON DESCEND DANS MLES LI */
	width: 144px;/* TRES IMPORTANT PERMET DE PASSER PLUS FACILEMENT D'UN PANNEAU A L'AUTRE SANS QU'IL SE FERME  */
}

#nav a:hover{
color:#FFFF00;
}

#nav li{ /* concerne les grands titres qui ne sont cachés */
list-style-type:none;
float:left;
position:relative;
width: 128px; /* permet de les mettre au milieu et c'est à peu près bon*/
padding: 0px 0px 0px 0px; /* toutes les marges interieures du dessous **/
}
 /* POURQUOI QUANG JE METS UN PADDING-TOP DE 10 PX QUI VA ME DÉCALER TOUT VERS LE BAS, LES TITRES SUR DEUX LIGNES SONT CORRECT DANS LEUR ÉCARTEMENT */
 
 
/* permet de centrer les grand titres du menu */

.sur1ligne {
margin: 15px 0px 0px -2px;
}

.sur2ligne {
margin: 8px 0px 0px -2px;
}

#nav ul { /* concerne tous les menus en dessous qui sont cachés */
list-style-type:none;
position:absolute;
display:none;
text-align: left;
width:140px; /* permet de faire la bonne largeur pour les menus déroulants au dessous */
font-size: 12px; /*met pour tout le reste en 12px*/
padding: 4px 0px 4px 6px; /* toutes les marges interieures du dessous **/
}

#nav li ul a{
list-style-type:none;
text-align: left;
height:auto;
float:left;
margin: 8px 0px 0px 0px; /* permer de mettre les titres en 2 lignes rapprochés **/

}

/* lorqu'il y a 2 lignes, colore le premier panneau et le met à la bonne hauteur */

#nav li ul ul {
list-style-type:none;
margin-left:143px; /*permet de les mettre à côté; les uns des autres*/
margin-top:-4px; /*permet de les mettre à la bonne hauteur*/
}

/* lorqu'il n'y a qu'une ligne, colore le premier panneau et le met à la bonne hauteur */

.sur1quest {
margin-top: -7px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #004667;
}

.sur1comp {
margin-top: -7px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #007FAA;
}

.sur2cn {
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #01C7E2;
}

.sur2ct {
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #600a55;
}

.sur2com {
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #970744;
}

.sur1bio {
margin-top: -7px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #b25371;
}

.sur2trou {
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #ff7f00;
}

.sur1trait {
margin-top: -7px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
margin-left: 8px; /*permet de  mettre à la bonne hauteur les panneaux qui s'ouvrent*/
background-color: #8f4c08;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{
display:none;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{
display:block;
}

/* colore les li*/

.quest {
background-color: #004667;
}

.comp {
background-color: #007FAA;
}

.cn {
background-color: #01C7E2;
}

.ct {
background-color: #600a55;
}

.com {
background-color: #970744;
}

.bio {
background-color: #b25371;
}

.trou {
background-color: #ff7f00;
}

.trait {
background-color: #8f4c08;
}

/***********************************************************************************/ 
/******************************* == bas de page (footer) ****************************/
/************************************************************************************/ 	

#footer {
	text-decoration: none;
	margin: 0px;
	padding: 15px 0px 0px 65px;
	text-align: left;
	background-image: url(/act_page/images/fond_site/img_footer.png);
	background-repeat: repeat-x;
	background-position: left top;
	font-size: 14px;
	font-weight: normal;
	list-style-type: none;
	list-style-image: none;
	height: 200px;
	clear: left;
}

/*********************************** == pub *********************************/
/**************************************************************************************/ 	


.pubcontact {
	float: left;
	margin: -130px 0px 0px 34px; /* pour le mettre au milieu */
	height: 102px;
	width: 160px;
}

.pubcontact a  {
	display: block;
    background-image: url(/act_page/images/fond_site/ordi.png);  
	background-repeat: no-repeat;
	height : 102px; /* hauteur des liens */
}

.pubcontact a:hover, .pubcontact a:focus, .pubcontact a:active {
	display: block;
	 background-image: url(/act_page/images/fond_site/ordia.png);
	background-repeat: no-repeat;
	height : 102px; /* hauteur des liens */
}

.pubcontactcol {
	float: left;
	margin: 0px 0px 20px 34px; /* pour le mettre au milieu */
	height: 102px;
	width: 160px;
}

.pubcontactcol a  {
	display: block;
    background-image: url(/act_page/images/fond_site/ordi.png);  
	background-repeat: no-repeat;
	height : 102px; /* hauteur des liens */
}

.pubcontactcol a:hover, .pubcontactcol a:focus, .pubcontactcol a:active {
	display: block;
	 background-image: url(/act_page/images/fond_site/ordia.png);
	background-repeat: no-repeat;
	height : 102px; /* hauteur des liens */
}
/*********************************** == titres footer *********************************/
/**************************************************************************************/ 	

.foottitg {
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
	color: #0066cc;
	float: left;
	margin-left: 10px;
	margin-top: -6px;
	width: 800px; /* A rajouter, ce qui permet au pavé 1 de passer en dessous */
}
.foottitd {
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;
	color: #0066cc;
	float: right;
	margin-right: 84px;
	margin-top: -6px;

}

/*********************************** == blocs gauches  ********************************/
/**************************************************************************************/

.pave1 {
	/*list-style: none;*/
	margin: 0;
	padding: 0;
	text-align: left;
	font-size: 12px;
	font-weight: bold;
	color: #004766;
	text-decoration: none;
	float: left;
}
#nav_footer1 {
	width: 160px; /* réduit l'écartement entre les pavés */
	padding: 8px 0px 5px 36px;
	margin: 0px;
	text-align: left;
}

#nav_footer1 li a {
	display: block;
	color: #004766;
	text-align: left;
	background-image:  url(/act_page/past/past_footer.png);
	background-repeat: no-repeat;
	padding: 0px 0px 0px 14px; /* pour déplacer le texte par rapport à la puce */
	margin: 0px 0px 0px -14px;
	font-weight: normal;
	height : 18px; /* hauteur des liens */
	line-height : 6px; /* hauteur du texte pour le mettre à la hauteur de la puce */
}

#nav_footer1 li a:hover, #nav_footer1 li a:focus, #nav_footer1 li a:active {
	background-image:  url(/act_page/past/past_footera.png);
	background-repeat: no-repeat;
	color: #FFF; /* colore en blanc */
	padding: 0px 0px 0px 14px;
	margin: 0px 0px 0px -14px;
	font-weight: normal;
	height : 18px; /* hauteur des liens */
	line-height : 6px; /* hauteur du texte pour le mettre à la hauteur de la puce */
}


/*********************************** == blocs droits  *********************************/
/**************************************************************************************/
.pave2 {
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	color: #004766;
	text-decoration: none;
	float: right;
}

#nav_footer2 {
	width: 190px;
	list-style: none;
	padding: 0px;
	margin: 0px;
}

#nav_footer2 li {
	padding: 0px;
	margin: 14px 0px 0px -134px; /* pour le mettre au milieu */
}

#nav_footer2 li a {
	text-decoration: none;
}

/*********************************** == blocs droits  *********************************/
/**************************************************************************************/
.pave3 {
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	color: #004766;
	text-decoration: none;
	float: right;
}

#nav_footer3 {
	width: 190px;
	list-style: none;
	padding: 0px;
	margin: 0px;
}

#nav_footer3 li {
	padding: 0px;
	margin: 14px 0px 0px -134px; /* pour le mettre au milieu */
}

#nav_footer3 li a {
	text-decoration: none;
	opacity: 0.8;
}

#nav_footer3 li a:hover, #nav_footer3 li a:focus, #nav_footer3 li a:active {
	/*opacity: 0.6;*/
	opacity: 1;
}