/*
	Style Sheet, site municipale de Ham-Nord
	info@solutions-zen.com
*/
/* ******************************************************************************************* */	
/* *******************                    RÈGLES GÉNÉRALES                  ********************/
/* ******************************************************************************************* */

* {margin:0;padding:0;}

body {
	background-color : #1f4d6f;
	text-align : center;
	font    : 0.8em arial,verdana,tahoma,sans-serif;
	color   : #000000;
/*	overflow : scroll; */

}

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

/* Les couleurs du site */ 
.blanc {color:rgb(255,255,255);} /* #ffffff */
.gris {color:rgb(192,192,192);}  /*  #c0c0c0   */
.jauneor {color:rgb(210,174,54);}  /*  #d2ae36  */ 
.beige {color:rgb(236,227,202);}  /* #ece3ca  */
.vert {color:rgb(0,172,137);}  /* #00ac89  */
.vertfonce {color:rgb(13,110,88);}  /*  #0d6e58	 */
.bleu {color:rgb(42,99,150);}  /* #2a6396  */
.bleudoux {color:rgb(71,163,211);}  /*  #47a3d3  */
.rouge {color:rgb(172,45,0);}  /* #ac2d00  */ 
.orangenote {color:#DB9D00;}
.rougemessage {color:#a4363b;}

/* Formatage des images */
img {
    border  :none;
}

/* Formatage des liens (autres que ceux des sous-menus) */
a {color :#2a6396;}
a:visited {color:#5d98c7;} /*  bleu-gris assez pale  */
a:active {color:#2a6396;}
a:hover {color:#000000;}


table {     /* équivalent à mettre toutes les table à "cellspacing 0 et padding 0"*/    
    border-collapse: collapse;    
}

h1 { 
   font-size : 2.0em;  
   color :  #000000;
   margin : 0 0 14px 0;
   text-decoration : none; /* pour éviter qu'un lien sur un titre soit souligné dans IE et pas dans FF.*/
}
h2 {
   font-size : 1.8em;  
   color : #0d6e58;
   margin : 20px 0 12px 0;
   text-decoration : none; /* pour éviter qu'un lien sur un titre soit souligné dans IE et pas dans FF.*/
}
h3 {
   font-size : 1.4em;  
   color : #d2ae36;
   margin : 20px 0 12px 0;
   text-decoration : none; /* pour éviter qu'un lien sur un titre soit souligné dans IE et pas dans FF.*/
}
h4 {
   font-size : 1.2em;  
   color : #0d6e58;
   margin : 16px 0 10px 0;
   text-decoration : none; /* pour éviter qu'un lien sur un titre soit souligné dans IE et pas dans FF.*/
}

input {
	font    : 1.0em arial,verdana,tahoma,sans-serif;

}
textarea {
	font    : 1.0em arial,verdana,tahoma,sans-serif;

}
/* ******************************************************************************************* */	
/* *******************                    TABLE de STRUCTURE                ********************/
/* ******************************************************************************************* */
#table_struct {
	background-color : #ffffff;	
	margin : auto;
	margin-top : 0;	
    text-align : left;


    /* OPTION #1 */
    /* CONSIDÉRER UNE LARGEUR FIXE COMME UN MINIMUM POUR LE SITE */
    /* width  : 800px;     */
     width  : 900px;  
    
    /* Équivalent à "min-width", pour contourner les problèmes avec IE. */
    /* la cellule td_contenu s'élargira automatiquement 
        si elle contient un élément fixe plus large, ce qui élargira toute la table.  */       
        

    /* OPTION #2 */ 
    /* SITE QUI S'AJUSTE À LA PAGE */
    /* pour un site qui s'élargirait en proportion avec le format de la fenêtre, utiliser une
       valeur en pourcentage, tout simplement ! (le site restera centré) */   
       
    /* width : 95%; */

	/*border : 1px solid #000000;    */
	
	
	
	
}

#td_menu {
    background : transparent url(images/Menu_fond.jpg) no-repeat top left;
    vertical-align : top;
    margin : 0;
    padding : 0;
    /* border  : 1px solid #0000ff; */

    width : 205px;
    height : 720px;
}

#td_contenu {    
    /*background : #ffffff url(images/Contenu_top.gif) no-repeat top left;*/
    vertical-align : top;
    margin  :0;
    padding : 0;  
    /*border  : 1px solid #0000ff;   */
}

#td_droite {
	/* background-color: #ece3ca;*/
    vertical-align : top;        
    margin : 0;
    padding : 0;

    width : 185px;
}

#table_struct td {  
   /* ATTENTION ce qui est ici sera aussi hérité dans TOUS les TD du sites */
   /* il est donc préférable d'utiliser les conteneurs définis plus bas pour les DIV,
        et éventuellement effacer cette règle. */
   /* Particulièrement en ce qui concerne les "border"*/ 
}



/* ******************************************************************************************* */	
/* *******************                  formattage entête et pieds          ********************/
/* ******************************************************************************************* */
#entete	{
	background: transparent url(images/Entete_pattern.gif) repeat-x top left;
	margin  : 0;
	padding : 0;
	text-align : left;
    height  : 140px;
	/*border  : 1px solid #0000ff; */ 
}

#pied	{
	background-color : transparent;
	color : #000000;
	font-size : 0.8em;
	text-align : center;
	margin  : 0;
	padding : 10px;
	border-top : 1px solid #000000;
	/*  border  : 1px solid #0000ff;   */
}
#pied a {color:#000000; text-decoration:none;}
#pied a:visited {color:#000000;} /*  bleu-gris assez pale  */
#pied a:active {color:#000000;}
#pied a:hover {color:#cccccc;}

/* ******************************************************************************************* */	
/* *******************                    formattage du menu               ******************* */
/* ******************************************************************************************* */

#menu {
    /* background : transparent url(images/Menu_top.gif) no-repeat top left;  */
	margin  : 0 0 0 10px;
	padding : 70px 0 0 0;
	/*border  : 1px solid #00ff00; 	*/ 
   width : 205px;
	text-align : left;    
}
#menu a {
	color :#ffffff;
	text-decoration:none;
}
#menu a:visited {color:#dddddd;} 
#menu a:active {color:#888888;}
#menu a:hover {color:#000000;}


/* ***********   Formatage des sous-menus   ************ */
.menu_item {
	font-family : georgia,times new roman,serif;
	color : #ffffff;
    background-color: transparent;
    position : relative;
	margin  : 0 0px 8px 0;
    padding : 2px;
	/* border-bottom : 1px solid #ffffff; */

    width : 174px;    /* Important pour pop_up menu (dans IE)! */
}

.menu_item_triangle {
    background : transparent url(images/Menu_triangle.gif) no-repeat top right;
	position  : absolute;
	left      : 0px; /* à partir du côté gauche des "menu_item" */
	/* VALEUR si on veut COLLÉE : 196 px*/
	/* pour l'instant, test pour décollé au bout des flèches..)*/
	top       : 4px;
    width      : 172px;
    height      : 110%; 
	
    filter      : alpha(Opacity=55); /* IE */
    moz-opacity : 0.55;              /* mozilla */
    opacity     : 0.55;              /* firefox et autres*/
    
}

.sous_menu {                    /* pop up! */
	border : 1px solid #0d6e58;
	background-color : #b3d1cb;
	position  : absolute;
	
	left      : 174px; /* à partir du côté gauche des "menu_item" */
	/* VALEUR si on veut COLLÉE : 196 px*/
	/* pour l'instant, test pour décollé au bout des flèches..)*/
	
	top       : -3px;
    visibility: hidden;
    z-index   : 10;              /* s'assurer d'être sur le dessus */

	padding   : 2px;
    width      : 160px; 
	text-align : left;
	
    overflow : hidden;  /* pour l'effet déroulant..*/
        
    /* filter      : alpha(Opacity=92); /* IE */
    /* moz-opacity : 0.92;              /* mozilla */
    /* opacity     : 0.92;              /* firefox et autres */
}

#menu .sous_menu a {  
    text-decoration:none;                 
    display     : block; 
    font-size   : 12px;
    margin      : 2px; 
    padding     : 3px;
    color       : #1f4d6f;
    background-color : #f1ebdb;
}

#menu .sous_menu a:visited {color:#555555;}
#menu .sous_menu a:active {color:#1f4d6f;}
#menu .sous_menu a:hover {color:#1f4d6f; background-color:#00ac89;}




/* ******************************************************************************************* */	
/* *******************                   formattage du contenu             ******************* */
/* ******************************************************************************************* */
/* on peut créer ici des nouveaux ID pour des pages plus particulières, et utliser "contenu" comme générique...*/

#contenu {
	background-color:transparent;
	margin  : 30px 0 0 0;
	padding : 8px 15px 20px 8px;	
	/*border  : 1px solid #ff0000;  */
    /* Si on limite la largeur ici, le contenu qui dépasse ne fera PAS augmenter la cellule...*/
}

#contenu img {
	background-color : #b3d1cb;
	border  : 1px solid #073f31;
    margin  : 4px 8px 8px 8px; 
    padding : 5px;
}
#contenu .img_bouton {              /* BOUTONS (surtout pour la partie de gestion) */
    background-color : transparent;
    border : none;
    padding : 0;
    margin : 0;
}
#contenu p {
	font-size:1.0em;
	margin:0 0 12px 0;
}
#contenu ul	{
	margin:0;
	/* border: 1px solid #ff0000;  */
}
#contenu ul	ul {
	list-style-type:circle;
}
#contenu li	{
	font-size:1.0em;
	margin:0 0 0.2em 50px;
	/* border: 1px solid #00ff00; */
}		 

#contenu hr {
	color : #000000;
	margin : 6px 0 6px 0;
	border-style : solid;
	height : 2px; 
	padding : 0px;
} 
#contenu blockquote {
	font-style:italic;
	font-weight:600;
	margin:0 60px 20px 60px;
}
#contenu .asterix {
	color :	#a4363b;
	font-size:2.0em;
}
#contenu .boite {
	background-color : #F4EBD9;
	border : 3px double #A78533;
}
#contenu .boite td {
	padding:10px;
	text-align:left;
}
#contenu .boite img {
	padding: 0px;
	margin: 0px;
	border-color: #F4EBD9 ;
}	
	
#droite {
	margin  : 0;
	padding : 8px;
	width : 185px;
    /*border  : 1px solid #ff0000;  */
}
#droite hr {
	border-style : solid;
	height : 2px;
	color: #2a6396;
	margin : 6px 12px 6px 12px;
}
/* ******************************************************************************************* */	
/* *******************                formattage plus spécifiques          ******************* */
/* ******************************************************************************************* */

#menu_pages {
    margin : 8px;
	padding : 6px;
  	font   : 1.0em arial,verdana,tahoma,sans-serif;
}
#menu_pages a {
    
    
    background-color : #b3d1cb;
	text-decoration:none;
    color   : #000000;
    margin  : 8px 3px;
    padding : 6px;
	border  : 1px solid #000000;
}
#menu_pages a:visited {color:#000000;}
#menu_pages a:hover {color:#000000; background-color : #ffffff;}
#menu_pages .selection {
    background-color : #00ac89;
    color   : #000000;
    margin  : 4px;
    padding : 6px;
	border  : 1px solid #000000;
}
/* ******************************************************************************************* */

.menu_edition_conseil {
    /*  background-color : #aab494;	  */
    margin  : 4px 16px 6px 16px;
    padding : 3px;
    text-align : left;
	border  : 2px solid #aab494;
    clear : both; /* pour éviter d'arriver par dessus une images qui "float" */
    /* si pas assez de texte pour toute la hauteur de l'image. */
}

/* ******************************************************************************************* */
/* table utile pour l'affichage des résultats de recherche d'entreprise */
#table_liste_entreprises {
    margin : 2px 0 2px 2px;
    padding : 0;
}

#table_liste_entreprises td {
 	
    text-align : left;
    padding : 1px 8px 1px 4px;    
    font-size : 1.0em;
    vertical-align : top; 	
}
#table_liste_entreprises th { 	
	/*  border  : 1px solid #2a6396;  -*/
	color : #ffffff;
    background-color : #000000;
    text-align : center;
    padding : 1px 10px 2px 6px;    
    font-size : 1.0em;
    vertical-align : top; 	
}

/* ******************************************************************************************* */
/* table utile pour conseil_seances.php et gestion_conseil_seances.php */
.table_conseil_seance {	
	
    margin  : 16px;
	padding : 0px;
	border-collapse:collapse; 
	border : 3px double #2a6396;
}

.table_conseil_seance td {
    margin  : 0px;
	padding : 4px;
	background-color:#ffffff;
	border-bottom : 1px solid #2a6396; 
}

/* ******************************************************************************************* */
/* tables utiles pour les collectes d'ordures, recyclages, compostage, etc */
/* Table pour le calendrier (les classes sont sur les lettes dans un <b class=""></b> */

#table_cal_collectes {
    margin : 2px 0 6px 2px;
    padding : 0;
}
#table_cal_collectes th {
    background-color : #2a6396;
 	border : 1px solid #000000;
    text-align : center;
    width  : 26px;
    height : 24px;
    font-size : 1.2em;
}
#table_cal_collectes td {
 	border : 1px solid #000000;
    background-color : #ffffff;
    text-align : right;
    padding : 1px;
    width : 26px;
    height : 30px;
    font-size : 1.0em;
    vertical-align : bottom; 	
}
#table_cal_collectes .fds {
    background-color : #9db7cb;
}

#table_cal_collectes b { /* les lettre sont dans des <b>...*/
    color : #ffffff;
    padding : 0 1px 1px 1px;
    margin : 0 0 1px 1px;
    float : right;
    font-size : 8px;
    border: 1px solid #ffffff;
}
#table_cal_collectes .cal_ferie       {  background-color : #4a75ff; }
#table_cal_collectes .cal_ordure      {  background-color : #5a1c75; }
#table_cal_collectes .cal_recyclage   {  background-color : #00ac89; }
#table_cal_collectes .cal_compost    {  background-color : #906b40; }
#table_cal_collectes .cal_grosdechets {  background-color : #cc474a; }
#table_cal_collectes .cal_autre       {  background-color : #ccaaaa; }

/* Table pour l'affichage en liste */
#table_liste_collectes {
    margin : 2px 8px 10px 16px;
}
#table_liste_collectes td{
    margin : 0;
    padding : 4px;
    

}
#table_liste_collectes .cal_ferie       { font-size : 0.8em; background-color : #4a75ff; color : #ffffff; width : 12px; border: 2px solid #ffffff; }
#table_liste_collectes .cal_ordure      { font-size : 0.8em; background-color : #5a1c75; color : #ffffff; width : 12px; border: 2px solid #ffffff; }
#table_liste_collectes .cal_recyclage   { font-size : 0.8em; background-color : #00ac89; color : #ffffff; width : 12px; border: 2px solid #ffffff; }
#table_liste_collectes .cal_compost    { font-size : 0.8em; background-color : #906b40; color : #ffffff; width : 12px; border: 2px solid #ffffff; }
#table_liste_collectes .cal_grosdechets { font-size : 0.8em; background-color : #cc474a; color : #ffffff; width : 12px; border: 2px solid #ffffff; }
#table_liste_collectes .cal_autre       { font-size : 0.8em; background-color : #ccaaaa; color : #ffffff; width : 12px; border: 2px solid #ffffff; }



/* ******************************************************************************************* */
/* tables utiles pour les activites  */
/* Table pour le calendrier (les classes sont sur les lettes dans un <b class=""></b> */
#table_cal_activites {
    margin : 2px 0 6px 2px;
    padding : 0;
}
#table_cal_activites th {
    background-color : #0d6e58;
 	/* border : 2px solid #f5ecdf;	*/
 	border : 1px solid #000000;
    text-align : center;
    width  : 26px;
    height : 24px;
    font-size : 1.2em;
}
#table_cal_activites td {
 	border : 1px solid #000000;
    background-color : #ffffff;
    text-align : right;
    padding : 1px;
    width : 26px;
    height : 30px;
    font-size : 1.0em;
    vertical-align : bottom;
}
#table_cal_activites a {
    text-decoration : none;
}
#table_cal_activites .fds {
    background-color : #bce0d8;
}

#table_cal_activites b { /* les lettre sont dans des <b>...*/
    color : #ffffff;
    padding : 0 1px 1px 1px;
    margin : 0 0 1px 1px;
    float : right;
    font-size : 8px;
    border: 1px solid #ffffff;
    
}
#table_cal_activites .cal_cult   {  background-color : #cc474a; }
#table_cal_activites .cal_soc    {  background-color : #4a75ff; }
#table_cal_activites .cal_sport  {  background-color : #00ac89; }
#table_cal_activites .cal_spirit {  background-color : #BB9600;}


/* Table pour l'affichage en liste */
#table_liste_activites {
    margin : 2px 8px 10px 16px;
}
#table_liste_activites td{
    margin : 0;
    padding : 4px;
}
#table_liste_activites .cal_cult   { font-size : 0.8em; background-color : #cc474a; color : #ffffff; width : 12px; border: 2px solid #ffffff;}
#table_liste_activites .cal_soc    { font-size : 0.8em; background-color : #4a75ff; color : #ffffff; width : 12px; border: 2px solid #ffffff;}
#table_liste_activites .cal_sport  { font-size : 0.8em; background-color : #00ac89; color : #ffffff; width : 12px; border: 2px solid #ffffff;}
#table_liste_activites .cal_spirit { font-size : 0.8em; background-color : #BB9600; color : #ffffff; width : 12px; border: 2px solid #ffffff;}


/* ******************************************************************************************* */
/* table générale de l'interface de gestion, s'il n'y en a pas une particulière */

.table_gestion {
    margin  : 16px;
	padding : 0px;
}

.table_gestion td {
    margin  : 0px;
	padding : 4px;
	border : 1px solid #2a6396; 
}
.table_gestion th {
    text-align : center;
    margin  : 0px;
	padding : 4px;
	border : 1px solid #2a6396; 
}

#gestion_message {
    color : #ffffff;
    background-color : #ac2d00;
    margin  : 15px;
    padding : 5px;
    text-align : center;
}

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

.actualite_court {
    /*  background-color : #aab494;	  */
    color : #000000;
    margin  : 0 3px 0 3px;
    padding : 4px;
}

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

#iframe_google_maps  {
	border : 1px solid #baa26a;
	background-color:  #ffffff;/* #aab494; #e3d6c4; IE NE PREND PAS CE PARAMETRE EN CONSIDERATION : BLANC*/
	width : 606px;
	height: 460px;
    color : #ffffff;
    margin  : 4px 8px 6px 8px;
    padding : 14px;
}

/* ******************************************************************************************* */
.table_taxes {
    margin  : 12px;
	padding : 0px;
}

.table_taxes td {
    margin  : 0px;
	padding : 4px;
	border : 1px solid #000000; 
}
.table_taxes th {
    background-color : #f5c700;
    text-align : center;
    margin  : 0px;
	padding : 4px;
	border : 1px solid #000000; 
}