/* CSS Document ONGLETS */

body { /* défini le body (la page) */
	background-color:white ; /* le fond de la page est blanc */
	color:black} /* les textes sont noirs */
	margin-right:110px;
	margin-left:110px;

.menu_onglets { /* boite qui contient le menu (les onglets) */
	margin-top:0;/* Les attributs de marges droites et gauche se trouvent dans "menu_gauche.css" et "menu_droit.css" car ils dépendent de la présence de cet élément */
	padding-bottom:0; /* marge intérieure basse */
	margin-right:112px;
	margin-left:112px;
}
* html .menu_onglets {
	margin-bottom:0
}
* html a.onglet{
}

.onglet-actif { /* style de l'onglet de la page active */
	background-image:url('../images/onglet_blanc_gauche.png');
	background-position: left top;
	background-repeat:no-repeat;
	font-size:0.8em;
	padding-left:14px; padding-right:0; padding-top:5px; padding-bottom:4px
}
* html .onglet-actif {
	padding:5px 0 4px 12px;
	margin:0 14px 0 0;/* marges intérieures */
	font-size:0.8em;
}
.onglet_blanc_gauche {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:0.6em;
	background-image:url('../images/onglet_blanc_droit.png');
	background-position: right top;
	background-repeat:no-repeat;
	padding-left:0; padding-right:14px; padding-top:5px; padding-bottom:4px;
	z-index:10;
}
* html .onglet_blanc_gauche {
	padding:0;
	margin:0;
}

.onglet{
	text-decoration:none; /* les liens ne sont pas soulignés */
	background-image:url('../images/onglet_orange_gauche.png');
	background-position: left top;
	background-repeat:no-repeat;
	padding-left:6px; padding-right:0; padding-top:3px; padding-bottom:1px;
	z-index:10;
}
* html .onglet {
	padding:3px 3px 2px 9px;
	margin:0 0 0 0;
}
.onglet_orange_gauche{ /* style des onglets inactifs */
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.6em;
	font-weight:bold;
	background-image:url('../images/onglet_orange_droit.png');
	background-position: right top;
	background-repeat:no-repeat;
	padding-left:0; padding-right:6px; padding-top:3px; padding-bottom:1px
}
* html .onglet_orange_gauche{
	font-size:0.6em;
	padding:0 6px 0 0;
	margin:0;
}


/* CSS Document CADRE */

img{border:none}
.spacer{
	font-size:1px;
	visibility:hidden;
	clear:both;
	margin:0;
	padding:0;
	position:relative;
	width:1px;
}
.spacer_right{
	font-size:1px;
	clear:right;
	visibility:hidden;
	margin:0;
	padding:0
}
.spacer_left{
	font-size:1px;
	clear:left;
	visibility:hidden;
	margin:0;
	padding:0
}
.haut{
	border-top:solid 2px #0000C2 ;
	padding:10px 0 0 0;
}
.haut_gauche{
	background-image:url('../images/coin_blanc_arrondi_hg.png');
	background-position: left top;
	background-repeat:no-repeat;
	margin:0; padding-left:14px; padding-right:0; padding-top:0; padding-bottom:0
}
.haut_droit{
	background-image:url('../images/coin_blanc_arrondi_hd.png');
	background-position: right top;
	background-repeat:no-repeat;
	margin:0; padding-left:0; padding-right:14px; padding-top:1px; padding-bottom:0
}
.bas_gauche{
	background-image:url('../images/coin_blanc_arrondi_bg.png');
	background-position: left bottom;
	background-repeat:no-repeat;
	padding-left:14px; padding-right:0; padding-top:0; padding-bottom:0
}
.bas_droit{
	background-image:url('../images/coin_blanc_arrondi_bd.png');
	background-position: right bottom;
	background-repeat:no-repeat;
	padding-left:0; padding-right:10px; padding-top:10px; padding-bottom:1px
}
.bas{
	border-bottom:2px solid #0000C2;
}
.contenu{
	position:relative;
	margin:0 1px 0 1px;
	border-left:2px solid #0000C2;
	border-right:2px solid #0000C2;
	padding:0 10px 0 10px;
}
* html .contenu{
	paddin:0 75px 0 75px;
}
.contenu p, .contenu b, .contenu img{
	position:relative;
	margin:0;
}
.contenu p, .contenu h1{
	font-family:Arial, Helvetica, sans-serif;
	font-size:1.5em
}
.contenu p, .contenu b{
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.8em;
	font-weight:600;
	color:#777777;
}
.contenu .explications{
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	font-weight:600;
	color:#777777;
	margin:0;
}
* html .contenu .explications{}


* html .contenu .pictos{height:1px}
.contenu .pictos .picto .picto_img{border:none;position:relative;}
.contenu .pictos .picto{
	float:left;
	display:block;
	position:relative;
	border:1px solid #ffffff;
	margin:0;
}
.contenu .pictos .picto:hover{
	border:1px solid #0000C2
}


/* CSS Document  MENU DROIT*/

.global{/* Cette définition ne doit PAS être présente dans "cadre.css" car elle dépend 
		de la présence, ou non, d'éléments style: footer, menus latéraux et autres.
		Elle doit donc être placée dans LES fichiers css portant sur ces éléments 
		et comporter les attributs adéquats au contexte. */
	margin-right:115px;
}
.global_ss_coldroit{
	margin:0 0 0 110px;
}

.menu_onglets {/* Ces définitions influent sur le menu à onglets (cf: onglets.css > pour le reste des définitions de cet éléménent)
		(Problème identique à la définition de global)*/
	margin-right:170px;
}
.menu_droit{
	float:right;
	width:110px;
/*	background-image:url('images/dessus_menu_droit.png');  */
	background-image:url('images/dessus_menu_commerces.png'); 
	background-position: left top;
	background-repeat:no-repeat;
	padding-left:0; padding-right:0; padding-top:166px; padding-bottom:0
}
.menu_droit ul{
	margin:0;
	padding:0;
}
.menu_droit li{
	margin:0;
	padding:0;
	list-style-type:none;
}
* html .menu_droit li{
	border: 1px solid #ffffff;
}
.menu_droit a{
	padding:2px;
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#0000C2;
	text-decoration:none;
	display:block
}
* html .menu_droit a{
	line-height:120%;
	font-size:0.7em
}
.menu_droit a:hover{
	background-color:#bbddff;
}

/* CSS Document  MENU GAUCHE */

.global{/* Cette définition ne doit PAS être présente dans "cadre.css" car elle dépend 
		de la présence, ou non, d'éléments style: footer, menus latéraux et autres.
		Elle doit donc être placée dans LES fichiers css portant sur ces éléments 
		et comporter les attributs adéquats au contexte. */
	margin-left:110px;
}
.menu_onglets {/* Ces attributs influent sur le menu à onglets (cf: onglets.css > pour le reste des attributs de cet éléménent).
		ATTENTION, d'autres attributs de cette définition peuvent se trouver dans des fichiers contextuels (ex: un autres fichier CSS de menu) */
	margin-left:125px;
}
.menu_gauche{
	float:left;
	width:102px;
/*	background-image:url('images/dessus_menu_droit.png');  */
	background-position: left top;
	background-repeat:no-repeat;
	padding:0;
	margin:0 0 0 5px;
}
* html .menu_gauche{
	margin:0;
}

.menu_gauche .accueil_categ{
	display:block;
	height:163px;
	background-image:url('images/dessus_menu_categories.png'); 
	background-position: left top;
	background-repeat:no-repeat
}

.menu_gauche .accueil_assoc{
	display:block;
	height:163px;
	background-image:url('images/dessus_menu_association.png'); 
	background-position:left top;
	background-repeat:no-repeat;
}

.menu_gauche .accueil_liens{
	display:block;
	height:163px;
	background-image:url('images/dessus_menu_liens.png'); 
	background-position:left top;
	background-repeat:no-repeat;
}

.menu_gauche .accueil_report{
	display:block;
	height:163px;
	background-image:url('images/dessus_menu_reportages.png'); 
	background-position:left top;
	background-repeat:no-repeat;
}

.menu_gauche .accueil_info{
	display:block;
	height:163px;
	background-image:url('images/dessus_menu_info.png'); 
	background-position:left top;
	background-repeat:no-repeat;
}

.menu_gauche .accueil_vip{
	display:block;
	height:103px;
	background-image:url('images/vip_anim_100x100.gif'); 
	background-position:left top;
	background-repeat:no-repeat;
}

.menu_gauche ul{
	margin:0;
	padding:0;
}
.menu_gauche ul li{
	background-color:#ffffff;
	margin:0;
	padding:0;
	list-style-type:none;
}
* html .menu_gauche ul li{
	border: 1px solid #ffffff;
}
.menu_gauche ul li a{
	padding:2px;
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#0000C2;
	text-decoration:none;
	display:block;
}
* html .menu_gauche ul li a{
	line-height:120%;
	font-size:0.7em;
}
.menu_gauche ul li a:hover{
	background-color:#bbddff;
}

/* CSS Document ENTETE CATEGORIE */

.entete_cat_photo{
	margin:0px 0 0 20px;
}
.explications{
	display:block;
	position:relative;
	margin:0;
}

/* CSS Document  PHOTOS A GAUCHE */

*{/* Le * employé comme sélecteur est le sélecteur universel. Il influe sur les éléments de toute la page */
	font-family:Arial, Helvetica, sans-serif
}
.ensemble_photos_gauche{
	position:relative;
	border:1px solid #0000ff;
	padding:0;
	margin:0;
}
.photos_gauche{/* Ne pas oublier de mettre un point devant le sélecteur si on appelle une classe */
	float:left;/* Cet attribut met la colonne à gauche */
	margin:0;/* Marges extérieures, les paramètres se gèrent comme pour l'attribut padding (ligne suivante) */
	padding:/*haut*/0px /*droit*/0 /*bas*/0 /*gauche*/0px; /* Espaces intérieures  de la colonne qui contient les photo */
	width:250px; /* Il suffit d'enlever ce paramètre pour que les photos se remettent à l'horizontale */
	position:relative
}
.photos_gauche img{
/*	border:1px solid #000000;  1er paramètre = largeur en pixels de la bordure / 2e = le type de bordure / 3e = la couleur */
	margin:0; /* pareils que plus haut */
/*	width:100px;             */        
/*	height:100px;            */
	position:relative
}
.photos_gauche .contenu_texte{
	margin:0;
	padding:0
}
* html .photos_gauche .contenu_texte{
}
.photos_gauche .contenu_texte h1{/* Titre du contenu de l'affilié appelé par sa class(dans le HTML) et suivi(parce que imbriqués dans le HTML)de h1, équivalent de <h1>(dans le HTML) */
	font-size:1.5em;/* Taille de la police de caractère en "em" pour les malvoyants (taille règlable) */
	font-weight:bold;/* graisse de la police */
	color:#0066cc;/* couleur de la police */
}
.photos_gauche .contenu_texte h2{/* Le sélecteur composé de la class(précédé d'un point) suivi de h2, équivalent de <h2>(dans l'HTML)*/
	font-size:1em;
	font-weight:bold;
	color:#0066ff;
}
.photos_gauche .contenu_texte p{
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	font-weight:600;
	color:#777777;
	margin:0 0 0 0;
	border:none;
}


/* CSS Document  PHOTOS AU DESSUS */


*{/* Le * employé comme sélecteur est le sélecteur universel. Il influe sur les éléments de toute la page */
	font-family:Arial, Helvetica, sans-serif
}
.photos_au_dessus{
	/* Il n'y pas besoin de l'attribut "float:left" ici */
	/* Ni de l'attribut width */
	padding:5px 0 0 5px;
	margin:10px 0 0 0;
}
.photos_au_dessus img{
/*	border:1px solid #000000;  */
	margin:0 5px 5px 5px;
}
.photos_au_dessus .contenu_texte{
/*	border:1px solid #000000; */
	padding:5px 10px 15px 10px;
	margin:10px 5px 15px /*marge de gauche >>*/5px;/* Il n'y a plus de colonne alors, on diminue la marge de gauche*/
}
.photos_au_dessus .contenu_texte h1{
	font-size:1.5em;
	font-weight:bold;
	color:#0066cc;
}
.photos_au_dessus .contenu_texte h2{
	font-size:1em;
	font-weight:bold;
	color:#0066ff;
}
.photos_au_dessus .contenu_texte p{
	font-size:0.8em;
	color:#000000;
}


/* CSS Document  PHOTOS ALTERNEES */


*{
	font-family:Arial, Helvetica, sans-serif;
}
.titre{
	font-size:1.5em;
	font-weight:bold;
	color:#0066ff;
	color:#0066cc;/* couleur de la police */
}
.alterne_photo_gauche, .alterne_photo_droite{
	display:table;
    padding:/*haut*/0px /*droit*/0 /*bas*/0 /*gauche*/0px; /* Espaces intérieures  de la colonne qui contient les photo */
	margin:0px;/* Quand tu ne mets qu'un seule paramètre, il compte pour les 4 */
	position:relative;
	border:none;  /*Bord noir continu */
}
.alterne_photo_gauche h2, .alterne_photo_droite h2{
	font-size:1em;
	font-weight:bold;
	color:#0066ff;
}
.alterne_photo_gauche p, .alterne_photo_droite p{
	font-size:1em;
	color:#777777;
	position:relative;
}
.alterne_photo_gauche p.hauteur_pleine{
	border:1px solid #0000ff;
	display:table-cell;
	height:100%;
}

.alterne_photo_gauche img{
	float:left;
	margin:0;/* Marges extérieures, les paramètres se gèrent comme pour l'attribut padding (ligne suivante) */
/*	margin:5px;   */
	position:relative
}
.alterne_photo_droite img{
	float:right;
/*	border:1px solid #000000;   */
	margin:0;/* Marges extérieures, les paramètres se gèrent comme pour l'attribut padding (ligne suivante) */
/*	margin:5px;   */
	position:relative
}

.header{
    font-size:0.7em;
	color:#0066ff;
	margin:0px;
}

.footer{
    font-size:0.7em;
  	color:#0066ff;
	margin:0px;
}
	
.recherche{
	float:right;
    font-size:1.0em;
 	font-weight:bold;
	color:#0066ff;
}

.inscription{
 	float:left;
 	font-size:1.0em;
	font-weight:bold;
	color:#0066ff;
}

/* Mise en forme des tableaux */

table.presentation_commerce{
	border-collapse:collape;
	border:none;
	margin:0 0 10px 0;
 	font-weight:bold;
	color:#777777;
}
table.presentation_commerce td.centre{
	text-align:center;
}
table.presentation_commerce td.gauche{
	text-align:left;
}
table.presentation_commerce td h1{
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:1.0em;
	margin-top:0;
	margin-bottom:0;
}
table.presentation_commerce td p{
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:0.7em;
}
* html table.presentation_commerce td p{
	font-size:0.7em;
}
span.signature{
	position:relative;
	margin-left:auto;
	margin-right:auto;
}
.presentation_flash{
	float:right;
	margin:0 0 0 20px;
}