/*
	Style Sheet pour le site Web de Solutions ZEN
	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/Design_pagehauteur.jpg) repeat-x 0px 0px;*/
   background-color : #111111;
	/*font : 14px 'Times New Roman',Georgia,times,serif;*/
   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   */
.orange {color: rgb(170,78,15);}   /*  #aa4e0f    */
.vert {color: rgb(57,120,0);}   /*  #397800    */


/*
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-size:30px;
   margin: 10px 0px;
   padding : 0px;      
   color: #000030;
   /*font-weight : normal;*/
}

h2 {
   font-size:24px;
   margin: 8px 0px 4px 0px;
   padding : 0px;   
   color: #1a5da4;
   /*font-weight : normal;*/
}

h3 {
   font-size:20px;
   margin: 6px 0px 4px 0px;
   padding : 0px;
   color: #1a5da4;
   /*font-weight : normal;*/
}

h4 {
   font-size:20px;
   margin: 4px 0px;
   padding : 2px 0px;
   color: #c8002b;
   /*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;
    /*border : 2px solid #333333;*/
    margin : 4px;
    /*font : 14px 'Times New Roman',Georgia,times,serif;*/
    font : 12px arial,verdana,tahoma,sans-serif;
    text-align : left;
}

td {
   /*border : 1px solid #777777;*/
   padding: 4px;   
   vertical-align : top;
}

ul {
	margin:  6px 0px;
   list-style-type : square;
   padding: 0px;	
}

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

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


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

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

.note {
   background-color: #1a5da4;
   color: #ffffff;
   border : 2px solid #000000;
   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 : #ffffff url(images/Pattern_droite.gif) repeat-y top right;
	position:relative;		
   color : #000000;
	width : 980px;

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

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

#entete {
   color : #000000;
   font : 12px arial,verdana,tahoma,sans-serif;
   position : relative;
   float:left;
   padding : 0px;
   margin : 0px;
	width : 725px;
   height :  257px;
   z-index : 15;
   overflow : visible;
}
#langue {
   float : right;
   margin : 10px;
   font-size : 14px;
}
#langue a {font-weight : normal; text-decoration:none; outline : none;}
#langue a:link {color:#000000;}
#langue a:visited {color:#000000;}
#langue a:hover {color:#d0c0a0;} /* 998866*/
#langue a:active {color:#aa4e0f; border:none; }

#pied_page {
   clear:both; 
   margin : 0px; 
   padding: 4px 8px;
   /*background-color : #000000;*/
   text-align : right;
   color : #ffffff;
   font-size : 12px;
}


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

#menu_sections {   
   position : absolute;
   top : 209px;
   left : 0px;
   /*float : left;*/
   /*background : #444444 url(images/menu_sections.jpg) repeat-x 0px 0px;*/
   font-family : arial,verdana,tahoma,sans-serif;
   /*width : 900px;*/
   z-index   : 10;
   padding : 0px;
   margin : 0px;   
   height : 42px;
   width : 720px;
   
   margin : 0px;
}

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

.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 : #ffffff; }
#menu_sections a:active { color : #333333; }

.sous_menu {                    /* pop up! */
   /*   border : 1px solid #133666; /*test*/
	background : transparent url(images/Sousmenu_pattern.gif) repeat-y 0px 0px;
	position  : absolute;
	left      : 8px; /* à partir du côté gauche des "menu_item" */
	top     : 35px;
    visibility: hidden;
    z-index   : 100;              /* s'assurer d'être sur le dessus */
	
	width      : 133px;
	padding : 0px;
	text-align : center;
   overflow : hidden;  /* pour l'effet déroulant..*/
   
}
.sous_menu img  {
   position : absolute;
}

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


#menu_sections .sous_menu a:visited {color:#000000;}
#menu_sections .sous_menu a:active {color:#eeeeee;}
#menu_sections .sous_menu a:hover {color:#ffffff;}


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

#ensemble_forms_admin {
   position : absolute;
   top : 0px;
   left : 0px;
   z-index : 250;
}
/*
#contenu {
   width : 720px;
   float : left;
   overflow : visible;
   margin:0px;
   padding : 0px;
   z-index : 25;
}*/
#section_droite {
   background : transparent url(images/Entete_droite.jpg) no-repeat  0px 0px;
   position : relative;
   z-index : 10;
   width: 255px;
   float : right;
   margin : 0px 0px 10px 0px;
   padding : 10px 0px 0px 0px;
   overflow : visible;
   text-align : justify;
}
#section_droite .menu_droite {
   clear : both;
   margin : 0px 0px 0px 36px;
}
#section_droite .menu_droite img {
   cursor : pointer;
   margin : 2px 8px;
   float : left;
}
#section_droite .menu_droite a {
   display : block;
   padding : 15px 0px 0px 0px;
   font-weight : bold;
   font-size : 16px;
   text-decoration :none;
   color : #000000;
}
#section_droite_contenu {
   margin : 10px 0px 0px 20px;
   clear : both;
}
#section_droite_contenu h2 {
   color : #ffffff;
   text-align : center;
   font-weight : normal;
}
.element_droite {
   position : relative;
   clear : both;
}
#contenu_pages {
   position : relative;
   
   /*background-color : #ffffff;*/
   color : #000000;
   float  : left;
   width  : 710px;
   padding: 0px;
   margin : 0px 0px 0px 0px;
   z-index : 8;
   height : 100%;
}


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

#sections_image {
 /*  display : none;*/
 padding : 0px;
 margin : 0px;
 text-align:center;
 position : relative;
 width : 180px;
 height: 200px;
 overflow:hidden;
 
}
#sections_image img {
   position : absolute;
   top : 0px;
   left: 0px;
   padding: 0px;
   margin : 0px;
}

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

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

.elements {
   z-index : 10;
   clear : both;
   width : 700px;
   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: 350px;
   float : left;
   margin : 0px;
   padding: 0px;
}
.colonne_droite { /* pour les colonnes du layout */
   position : relative;
   z-index : 10;
   width: 350px;
   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: 330px;
}
.colonne_tier {
   margin: 0px 10px;
   text-align: justify;
   float: left;
   width: 212px;
}
.colonne_quart {
   margin: 0px 10px;
   text-align: justify;
   float: left;
   width: 154px;
}


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

/** pour les onglets.. **/


.onglets {
   z-index : 10;
   clear : both;
   width : 690px;
   position : relative;
   text-align : justify;
   padding : 5px 5px 10px 5px;
   margin : 0px 0px 10px 10px;
   display : none;
   background-color : #eeeeee;
   border-top : 1px solid #88aabb;
   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 23px;
   position : relative;
   z-index : 10;
   margin : 0px 15px;
   padding: 0px;
   height: 100%;
}

#menu_onglets p {
   display : inline;
   margin : 0px;
   padding : 0px;
   line-height : 23px;
}
#menu_onglets a {
   outline : none;
   width : 100%;
   padding: 4px 12px;
   font-size : 13px;
   font-weight : normal;
   text-decoration : none;
   border-top : 1px solid #aabbcc;
   border-right : 1px solid #557788;
   background-color : #eeeeee;
}
#menu_onglets a:hover {
   background-color : #1a5da4;
}
#menu_onglets a.onglet_selection {
   color : #ffffff;
   background-color : #1a5da4;
}
#menu_onglets a.onglet_selection:hover {
   color : #ffffff;
   background-color : #1a5da4;
   cursor : default;
}


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

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

}

#vonglet_actif {
   display:none;
}

#menu_vonglets {
   position : relative;
   z-index : 10;
   clear:left;
   float: left;
   width: 210px;
   margin : 0px 0px 0px 10px;
   padding: 0px;
   border-bottom : 2px solid #444444;

}
#menu_vonglets p {
   /*float : left;*/
   margin : 0px;
   padding : 0px;
}
#menu_vonglets a {
   outline : none;
   /*width : 100%;*/
   display : block;
   padding: 4px 12px;
   margin : 0px;
   font-size : 13px;
   font-weight : normal;
   text-decoration : none;
   border-top : 1px solid #aabbcc;
   border-right : 1px solid #557788;
   background-color : #eeeeee;
}
#menu_vonglets a:hover {
   background-color : #1a5da4;
}
#menu_vonglets a.vonglet_selection {
   color : #ffffff;
   background-color : #1a5da4;
}
#menu_vonglets a.vonglet_selection:hover {
   color : #ffffff;
   background-color : #1a5da4;
   cursor : default;
}



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

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

#album_pres_thumbs {
   /*clear : both;   /* test */
   float : right; /* test*/
   width : 460px;
   margin : 0px;
   padding : 0px;
}

#album_pres_thumbs_titre {
 /*  text-align:left;
   float:left;
   width : 240px;
   margin : 0px;
   padding: 3px 10px;*/
   margin-bottom : 15px;
   
}
#album_table_matieres {
   float:left;
   width:245px;
   padding : 20px 0px;
}
#album_table_matieres li {
   margin : 4px 0px 6px 28px;
   padding : 0px;
   font-size : 15px;
   /*float : left;
   width : 100px;
   height: 36px;*/
   
}

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

.album_thumbs {
   position : relative;
   float : left;
   width : 215px;
   height : 215px;
   margin: 0px 8px 5px 5px;
   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;
   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 :  #1a5da4;
   /*background : #000030 url(images/bois.png) repeat top left;*/
   border : 2px solid #000030;
   padding : 10px;
   z-index : 200;
   cursor : move;
}


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

#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 : center;
   border-bottom : 2px solid #000000;
   margin : 0px 0px 0px 5px;
   padding:4px 0px 10px 0px;
}
#auteur_article {
   float : right;
   margin : 3px 10px;
   font-weight : bold;
}
#date_parution_article {
   float : left;
   margin : 3px 10px;
   font-style: italic;
}
#contenu_article {
   clear : both;
   padding: 10px;
   font-size: 14px;
   color : #553333;
   text-align : justify;
}

#archives_articles {
   position : relative;
   float  : left;
   width  : 720px;
   padding: 0px 0px 20px 0px;
   margin : 0px 0px 0px 0px;
   z-index : 8;
   height : 100%;   
   display : none;

}
/*
.sommaire_articles_col {
   float:left;
   width:355px;
   margin : 0px;
   padding :0px;
}
*/
.sommaire_articles_col {
   text-align : center;
   margin : 0px;
   padding :0px;
}
.sommaire_articles {
   clear : both;
   text-align : justify;
   width : 645px;
   margin : auto;
   margin-top : 4px;
   margin-bottom : 8px;
   padding : 0px;
   background-color : #eeeeee;
   cursor : pointer;
   font-size:12px;
   overflow : hidden
}
/*
.sommaire_articles {
   float : left;
   width : 645px;
   margin : 2px 0px 8px 10px;
   padding : 0px;
   background-color : #eeeeee;
   cursor : pointer;
   font-size:11px;
   overflow : hidden
}
*/
.sommaire_articles img {
   display : block;
   clear : both;
   padding: 0px;
   margin : 0px;
}
.art_titre {
   text-align : left;
   padding : 2px 0px 0px 5px;
   margin : 0px;
}
.art_date {
   float : left;
   width : 95px;
   margin : 0px 0px 0px 8px;
   color : #444444;
   font-size : 10px;
   font-style: italic;
}
.art_auteur {
   float : right;
   margin : 0px 8px 0px 0px;
   font-size : 10px;
   font-weight: bold;
   color : #444444;
}
.art_court {
   margin : 0px 10px 0px 10px;
   padding : 5px 0px 0px 0px;
   clear:both;
}
/* *********************************************************** */

#cherche_menu_resultats {
   position : absolute;
   top : 18px;
   left : 10px;
   z-index : 100;
   display : none;
   /*background-color : #eeeeee;*/
   /*height: 100%;*/
   width : 700px;
}
#cherche_menu_resultats ul {
   background-color : #666666;
   /*border : 1px solid #993333;*/
   float: left;
   width: 215px;
   padding : 0px;
}

#cherche_menu_resultats li {
   background-color : #ccccdd;
   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:155px;
}


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

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