/*
	Style Sheet pour le site Web de Saint-Félix
	info@solutions-zen.com

*/

* {margin:0;padding:0;}

html {
  height : 100.1%;
  margin:0; padding:0;
} /* pour Opera qui met les marges dans le tag HTML */


body {
   /*background : transparent url(images/Desvongletign_pagehauteur.jpg) repeat-x 0px 0px;*/
   background-color : #111111;
	font : 12px arial,verdana,tahoma,sans-serif;
	text-align:center;
   height : 100.1%;
   margin-bottom : 1px;
   color : #000000;
}

input, select, button, textarea	{
	font : 12px arial,verdana,tahoma,sans-serif;
	padding : 2px;
}

/*   COULEURS   */
.jaune {color: rgb(218,184,110);}   /*  #dab86e    */ 
.jaunepale {color: rgb(237,217,167);}   /*  #edd9a7	 */
.jauneor {color: rgb(144,131,75);}   /*  #90834b  */
.rouge {color: rgb(94,29,27);}   /*  #5e1d1b    */
.vert {color: rgb(51,111,49);}   /*  #336f31    */	
.bleu {color: rgb(59,100,163);}   /*  #3b64a3    */

/*
textarea, input, select {
	border-top : 1px solid #222222;
	border-right : 1px solid #444444;
	border-bottom : 1px solid #555555;
	border-left : 1px solid #333333;
}
*/

/* ****************************  Formatage du texte  ***********************************/

h1 {
   font : bold 32px 'Times New Roman',Georgia,times,serif;
   margin: 10px 0px;
   padding : 0px;      
   color: #000000;
	 text-align : left;
   /*font-weight : normal;*/
}

h2 {
   font : bold 26px 'Times New Roman',Georgia,times,serif;
   margin: 8px 0px 4px 0px;
   padding : 0px;   
   color: #336f31;
	 text-align : left;
   /*font-weight : normal;*/
}

h3 {
   font : bold 20px 'Times New Roman',Georgia,times,serif;
   margin: 6px 0px 4px 0px;
   padding : 0px;
   color: #000000;
	 text-align : left;
   /*font-weight : normal;*/
}

h4 {
   font : bold 18px 'Times New Roman',Georgia,times,serif;
   margin: 4px 0px;
   padding : 2px 4px;
   color: #5e1d1b;
	 text-align : left;
   /*background-color : #9b9285;/* pour tests*/

}
/*
p, td, th, div, blockquote, ol, ul {
	font-size : 12px;
} 						  
*/
p {
	margin : 0 0 8px 0;
	text-align : left;	
}

table {   /* équivalent à "cellspacing 0 et padding 0"*/
    border-collapse: collapse;
    margin : 4px;
    font : 12px arial,verdana,tahoma,sans-serif;
    text-align : left;
}

td {
   padding: 4px;   
   vertical-align : top;
}

.table_bordures {
    border : 2px solid #333333;
}
.table_bordures td {
   border : 1px solid #777777;
}

ul {
	margin:  10px 0px;
   list-style-type : disc;
   padding: 0px;	
}

ol {
	margin:  10px 0px;
   padding: 0px;	
}

li {	
	margin : 0 0 6px 60px;
   padding: 0px;	
}		 


/* ******************************  classes pré-définies   *************************/

#overlay_filtre {
   z-index:150;
   background-color : #99aa99;
   position:absolute;
   top:0px;
   left:0px;
   display:none;
}

.note {
   background-color: #edd9a7;
   color: #993333;
   border : 1px solid #993333;
   font-weight: bold;
   padding:4px;
   margin:4px;
}

.img_gauche {
   float : left;
   margin :  4px 8px 4px 0px;
}

.img_droite {
   float : right;
   margin :  4px 0px 4px 8px;
}
.flotte_gauche {
   float : left;
   margin :  0px 12px 10px 0px;
}
.flotte_droite {
   float : right;
   margin :  0px 0px 10px 12px;
}



/* ******************************  les LIENS   ************************************/

a {font-weight : bold; outline : none;}
a:link {color:#003978;}
a:visited {color:#003978;}
a:hover {color:#d0c0a0;} /* 998866*/
a:active {color:#aa4e0f; border:none; }

a:focus {-moz-outline-style: none;}
/* *****************************  Formatage des images   *********************************/

img {
    margin : 0px;
    padding : 0px;
    border : none;
}

/* *********************************************************** */

#complet {
   /*background : transparent url(images/contenu_vertical.jpg) repeat-y 0px 0px;*/
	position:relative;	
	background-color : #ffffff;
   color : #000000;
	width : 900px;

	margin-right:auto;
	margin-left:auto;
	margin-top:0px;
	margin-bottom : 0px;
	padding:0px;
	text-align : left;
}

/* ******************************************************************************* */
/*                               ENTETE                                            */
/* ******************************************************************************* */

#entete {
   background : transparent url(images/bg_entete.jpg) no-repeat  0px 0px;
   background-color : #ccddbb;
   color : #000000;
   font : 12px arial,verdana,tahoma,sans-serif;
   position : relative;
   padding : 0px;
   margin : 0px;
	width : 900px;
   height :  189px;
   z-index : 15;
}
#joindre {
   position : absolute;
   bottom : 4px;
   right : 4px;
   font-size : 14px;
}
#joindre a {font-weight : normal; text-decoration:none; outline : none;}
#joindre a:link {color:#000000;}
#joindre a:visited {color:#000000;}
#joindre a:hover {color:#d0c0a0;} /* 998866*/
#joindre a:active {color:#aa4e0f; border:none; }

#pied_page {
   clear:both; 
   margin : 0px; 
   padding: 4px 8px;
   background-color : #333333;
   color : #ffffff;
   font-size : 12px;
}


/* ******************************************************************************* */
/*                                    MENU                                         */
/* ******************************************************************************* */

#menu_sections {   
   position : relative;
   /*float : left;*/
   font-family : arial,verdana,tahoma,sans-serif;
   /*width : 900px;*/
   z-index   : 10;
   padding : 0px;
   /*height : 30px;*/
   margin : 1px 0px 0px 40px;
}

.menu_sections_item {
   position : relative;      
   background-color : transparent;
   float:left;
   font-size : 15px;
   width : 190px;
   height : 34px;
   padding : 0px; /* pas de padding, IMPORTANT !!!*/
   margin : 0px;
   text-align : left;
}

.menu_sections_item span { /* éléments sans liens, padding ICI, important  !!!! */
   position : relative;
   display : block;
   text-decoration : none;
   margin  : 0px;
   padding : 6px 0px;
   overflow : hidden;
   /*height : 30px;*/
   font-weight : bold;
   
   color : #000000;
}

.menu_sections_item a {  /* éléments avec liens, padding ICI,  important  !!!! */
   outline : none;
   position : relative;
   display : block;
   text-decoration : none;
   margin  : 0px;
   padding : 6px 0px;
   overflow : hidden;
   /*height : 30px;*/
   font-weight :bold;
   
   color : #000000;
}

#menu_sections a:visited { color : #000000; }
#menu_sections a:hover { color : #7f2325; }
#menu_sections a:active { color : #000000; }

.sous_menu {                    /* pop up! */
   /*   border : 1px solid #133666; /*test*/
	/*background-color : #ffffff; /*test*/
	position  : absolute;
	left      : 190px; /* à partir du côté gauche des "menu_item" */
	top     : 0px;
    visibility: hidden;
    z-index   : 100;              /* s'assurer d'être sur le dessus */
	
	width      : 210px;
	
	text-align : left;
    overflow : hidden;  /* pour l'effet déroulant..*/
}

#menu_sections .sous_menu a {
    outline : none;
    text-decoration:none;
    display     : block;
    font-size   : 12px;
    font-weight : bold;
    height : auto;
    margin-bottom : 2px;
    padding     : 4px;
    color       : #ffffff;
    background-color : #6d0c0d;/*#91c04c;*/
}


#menu_sections .sous_menu a:visited {color:#ffffff;}
#menu_sections .sous_menu a:active {color:#eeeeee;}
#menu_sections .sous_menu a:hover {color:#ffffff; background-color:#a6393a;}


/* ******************************************************************************* */
/*                               CONTENU                                           */
/* ******************************************************************************* */

#ensemble_forms_admin {
   position : absolute;
   top : 0px;
   left : 0px;
   z-index : 250;
}

#contenu {
   background : #ffffff url(images/bg_contenu.jpg) no-repeat top right;
   width : 900px;
   float : right;
   overflow : visible;
   padding: 0px;
   margin:0px;
   z-index : 25;
   /*height : 100%;*/
}
#section_gauche {
   background : transparent url(images/bg_menu.jpg) repeat-x 0px 0px;
   position : relative;
   z-index : 25;
   width: 244px;
   /*height: 635px;*/
   float : left;
   margin : 0px;
   padding : 3px 0px 0px 0px;
}
#contenu_pages {
   position : relative;
   color : #000000;
   float  : right;
   width  : 656px;
   padding : 105px 0px 0px 0px;
   margin : 0px 0px 0px 0px;
   z-index : 8;
   height : 100%;
}


.titre_pages {
   z-index : 10;
   color : #000000;
  /* background-color : #8899aa; /*test*/
   text-align: left;
   padding : 10px 5px;
   margin : 0px 0px 7px 0px;
}

/*#sections_image {
 /*  display : none;
 float : right;
 padding : 0px;
 margin : 5px;
 text-align:center;
 position : relative;
 width : 205px;
 height: 80px;
 overflow:hidden;
 
}
#sections_image img {
   position : absolute;
   top : 0px;
   left: 0px;
   padding: 0px;
   margin : 0px;
}
*/
/* *********************************************************** */
.clearing {
   clear : both;
   line-height : 1px;
   height : 1px;
}

.elements_absolu {
   position : absolute;
   text-align : left;
   padding : 0px;
   margin : 0px;
}

.elements {
   z-index : 10;
   clear : both;
   width : 635px;
   position : relative;
   text-align : justify;
   padding : 0px;
   margin : 0px 0px 10px 10px;
}
.colonne_gauche { /* pour les colonnes du layout */
   position : relative;
   z-index : 10;
   width: 315px;
   float : left;
   margin : 0px;
   padding: 0px;
}
.colonne_droite { /* pour les colonnes du layout */
   position : relative;
   z-index : 10;
   width: 315px;
   float : right;
   margin : 0px;
   padding: 0px;
}
.elements_colonnes { /* pour les colonnes du layout */
   clear : both;
   z-index : 10;
   position : relative;
   margin: 0px 10px 10px 10px;
   padding : 0px;
   text-align: justify;      
}

/* pour les colonnes des utilisateurs (panneau de gestion) */
.colonne_moitie {
   margin: 0px 10px;
   text-align: justify;
   float: left;
   width: 290px;
}
.colonne_tier {
   margin: 0px 5px;
   text-align: justify;
   float: left;
   width: 182px;
}
.colonne_quart {
   margin: 0px 5px;
   text-align: justify;
   float: left;
   width: 124px;
}


/* *********************************************************** */

/** pour les onglets.. **/


.onglets {
   z-index : 10;
   clear : both;
   width : 624px;
   position : relative;
   text-align : justify;
   padding : 5px 5px 10px 5px;
   margin : 0px 0px 10px 10px;
   display : none;
   background-color : #eeeeee;
   border-top : 1px solid #8899aa;
   border-right : 1px solid #557788;
   border-bottom : 2px solid #444444;

}

.onglet_actif {
   display:none;
}

.menu_onglets {
   background : transparent url(images/menu_onglets_bg.jpg) repeat-x 0px 22px;
   position : relative;
   z-index : 10;
   margin : 0px 12px;
   padding: 0px;
   height: 100%;
}
.menu_onglets p {
   display : inline;
   margin : 0px;
   padding : 0px;
   line-height : 22px;
}
.menu_onglets a {
   outline : none;
   width : 100%;
   padding: 4px 12px;
   font-size : 14px;
   font-weight: normal;
   text-decoration : none;
   border-top : 1px solid #f4f4f4;
   border-right : 1px solid #777777;
   background-color : #e4e4e4;
}
.menu_onglets a:hover {
   border-top : 1px solid #cccccc;
   color : #000000;
   background-color : #8899aa;
}
.menu_onglets a.onglet_selection {
   color : #ffffff;
   border-top : 1px solid #cccccc;
   background-color : #8899aa;
}
.menu_onglets a.onglet_selection:hover {
   color : #ffffff;
   border-top : 1px solid #cccccc;
   background-color : #8899aa;
   cursor : default;
}


/** pour les onglets verticaux !! **/

.vonglets {
   z-index : 10;
   /*clear : both;*/
   float:left;
   width : 430px;
   position : relative;
   text-align : justify;
   padding : 5px 5px 10px 5px;
   margin : 0px;
   display : none;
   background-color : #eeeeee;
   border-top : 1px solid #8899aa;
   border-right : 1px solid #557788;
   border-bottom : 2px solid #444444;

}

.vonglet_actif {
   display:none;
}

.menu_vonglets {
   position : relative;
   z-index : 10;
   float: left;
   width: 180px;
   margin : 0px 0px 0px 10px;
   padding: 0px;
   border-top : 1px solid #8899aa;
   border-bottom : 2px solid #444444;

}
.menu_vonglets p {
   /*float : left;*/
   position : relative;
   width : 180px;
   margin : 0px;
   padding : 0px;
}
.menu_vonglets a {
   outline : none;
   
   display : block;
   padding: 4px 8px;
   margin : 0px;
   font-size : 13px;
   font-weight : bold;
   text-decoration : none;
   border-bottom : 1px solid #777777;
   border-right : 1px solid  #8899aa;
   background-color : #eeeeee;
}
.menu_vonglets a:hover {
   color : #000000;   
   background-color : #8899aa;
}
.menu_vonglets a.vonglet_selection {
   color : #ffffff;
   background-color : #8899aa;
}
.menu_vonglets a.vonglet_selection:hover {
   color : #ffffff;
   cursor : default;
}



/* *********************************************************** */

/** pour la page des albums photo.. **/

#album_pres_thumbs {
   clear : both;   /* test */
   /*float : left; /* test*/
   /*width : 350px;*/
   margin : 12px 10px;
   padding : 10px 0px;
}

#album_pres_thumbs_titre {
   text-align:left;
   float:left;
   width : 240px;
   margin : 0px;
   padding: 3px 10px;
   
}
#album_table_matieres {
   float:right;
   width:355px;
}
#album_table_matieres li {
   margin : 4px 0px 6px 16px;
   padding : 0px;
   float : left;
   width : 100px;
   height: 36px;
   
}

.album_thumbs_pages {      
   display : none;   
   padding : 0px;
}

.album_thumbs {
   position : relative;
   float : left;
   width : 125px;
   height : 125px;
   margin: 0px 15px 5px 7px;
   padding: 0px;
   text-align : center;
   overflow : hidden;
   cursor : pointer;
}

.album_thumbs img {
   margin : auto;
   padding : 0px;
}

.album_photo_infos {
   display : none;
}

#album_pres_titre {
   text-align : center;
	 color : #b1ccb0;
   margin : 2px;
}

#album_pres_photo {
   text-align : center;
   margin-top : 0px;
   margin-bottom : 0px;
   margin : auto;
   padding : 0px;
}

#album_pres_photo img {
   margin : 0px;
   padding : 0px;   
}


#album_pres_conteneur {
   width : auto;
   display : none;
   position : absolute;
   /*top  :-150px;
   left : -370px;*/
   top : 15px;
   left:15px;
   overflow : hidden; /* enlever pour l'ombrage */
   /*margin: auto;
   margin-top : 22px;*/
   background-color : #333333;
   border : 1px solid #000030;
   padding : 10px;
   z-index : 200;
   cursor : move;
}


#album_pres_contenu{   
   margin: auto;
   margin-top : 12px;
   padding: 4px;
   text-align:left;
   color : #ffffff;
}

#album_pres_contenu a {font-weight : bold; color:#397800;}
#album_pres_contenu a:link {color:#397800;}
#album_pres_contenu a:visited {color:#307033;}
#album_pres_contenu a:hover {color:#aa4e0f;}
#album_pres_contenu a:active {color:#112200; border:none;}


/* *********************************************************** */

/** pour les articles.. **/


#titre_article {
   text-align : left;
   /*  background-color : #bbbb99;	*/
   margin : 0;
   padding: 10px 0 0 10px;
}
#auteur_article {
   float : right;
   font-family : 'Times New Roman',Georgia,times,serif;
   color : #666666;
   margin : 3px 10px;
   font-weight : bold;
   font-style: italic;
   font-size : 12px;
}
#date_parution_article {
   float : left;
   font-family : 'Times New Roman',Georgia,times,serif;
   color : #666666;
   font-size : 12px;
   margin : 0;
   padding : 3px 10px 3px 10px;
   /*  font-style: italic;	 */
}
#contenu_article {
   clear : both;
   padding: 10px;
   font-size: 16px;
   text-align : justify;
}

#archives_articles {
   position : relative;
   float  : right;
   width  : 656px;
   padding: 0 0 10px 0;
   margin : 0 0px 0 0;
   z-index : 8;
   height : 100%;
   display : none;

}

.sommaire_articles_col {
   position : relative;
   float: left;
   width: 325px;
   margin : 0;
   padding :0;
}
.sommaire_articles {
   position:relative;
   clear : both;
   margin : 2px 2px 8px 8px;
   padding : 0px;
   background-color : #fbf7ed;
   cursor : pointer;
   
   overflow : hidden
}
.art_titre {   
   display : block;
   text-align : left;
   padding : 2px 0px 0px 5px;
   margin : 0px;
}
.art_date {
   position :relative;
   float : left;
   font-family : 'Times New Roman',Georgia,times,serif;
   color : #666666;
   width : 100px;
   margin : 0;
   padding: 2px 0px 0px 10px;
   font-size : 12px;
}
.art_auteur {
   position :relative;
   float : right;
   font-family : 'Times New Roman',Georgia,times,serif;
   color : #666666;
   margin : 0px 8px 0px 4px;
   padding: 2px 0px 0px 0px;
   font-size : 12px;
   font-weight: bold;
   font-style: italic;
}
.art_court {
   margin : 0px 10px 0px 10px;
   padding : 5px 0px;
   font-size : 13px;
   clear:both;
   
}
/* *********************************************************** */

/** pour les entreprises.. **/

#liste_entreprises {
   position : relative;
   float  : right;
   width  : 650px;
   padding: 0px 0px 10px 0px;
   margin : 0px 0px 0px 0px;
   z-index : 8;
   height : 100%;
   display : none;

}



/* *********************************************************** */

#cherche_menu_resultats {
   position : absolute;
   top : 16px;
   left : 26px;
   z-index : 100;
   display : none;
   background-color : transparent;
   /*height: 100%;*/
   width : 860px;
}
#cherche_menu_resultats ul {
   background-color : #ccccdd;
   /*border : 1px solid #993333;*/
   float: left;
   width: 215px;
   padding : 0px;
}

#cherche_menu_resultats li {
   background-color : transparent;
   border-right : 1px solid #777799;
   cursor : pointer;
   padding :4px 2px;
   margin : 0px 0px 0px 20px;
	font : 12px arial,verdana,tahoma,sans-serif;
   font-weight : bold;
}

#cherche_menu_resultats h4 {
  background-color : #ddcccc;
  padding: 10px 0px;
  margin : 0px;
}
#cherche_menu_q {
   width:135px;
   padding : 2px 2px 2px 18px;
   background : #ffffff url(images/textfield_chercher.png) no-repeat left center;
}


/* *********************************************************** */

#sablier { position : absolute; top:20px; left:20px; visibility:hidden; z-index:500;}