/* =========================================================== 
	          cette page css sera utilisée pour sitcom49 
	============================================================*/		  

    body {          /*largeur de la page (en block) ici 1024px*/

      width:1024px;/* largeur de la page en pixels*/
      margin:auto; /*mettre la page dans le milieu du navigateur*/
      margin-top:0px;    /* la page ne sera pas mise tout en haut mais à 0% du bord supérieur*/
      margin-bottom:20px; /*meme chose pour le bas*/  
	  behavior: url("csshover.htc"); 
      font-family:"arial", serif;
      background-color:#FFFFFF; /* fond de la page en blanc*/
      }

    /*==========================================================
                                             L'en-tête 
	 ==========================================================*/
    .entete {
      background-image:url("images/bandeau_titre2.png"); /*bandeau de sitcom49 */
      background-repeat:no-repeat; /* ne pas répéter l'image du bandeau */
      margin:auto;/*centrer l'image dans la page */
      margin-top:10px; /* a 40px du haut de la page */
     }
    .bienvenue {
      position:absolute;  /*texte de bienvenue avec la date du jour et l'heure de connexion sur le site */
	  top:130px; 
	  margin-left:205px;
      width:820px;
	  border-bottom:1px solid black;
	  height:25px;
	  text-align:center;
	  }
	/*==========================================================
                            menu vertical-plus
	 ==========================================================*/
	 .formulevitrine {
	  position:absolute; 
	  top:403px; 
	  margin-left:15px;
	  }
	 .menu-navig {
	  position:absolute;  
	  top:560px; 
	  margin-left:0px;
	  }
	  .navigation { /* pour l'ensemble du menu accordéon */
	  margin: 5px;
	  padding: 0;
	  list-style: none;
	  background: #FFFFFF;
	  color: #OOOOOO;
	  width: 190px;
	  font-size: 10px;
	  font-family:arial;
	  }
    .navigation a, .navigation span {  /* pour les span et les liens sur tout le menu accordéon */
      margin:0px;
	  display: block;
	  padding: 5px 5px;
	  color: #OOOOOO;
	  font-size:13px;
	  text-decoration: none;
	  background: #FFFFFF url() left bottom no-repeat;
	  }
    .navigation .toggleSubMenu a, .navigation .toggleSubMenu span { /* pour les togglesubmenu */
	  margin:0px;
	  background-image: url(images/enroule.jpg);
	  }
	.navigation .open a, .navigation .open span {
	  margin:0px;
	  background-image: url(images/deroule.jpg);
	  }
    .navigation a:hover, .navigation a:focus, .navigation a:active {
	  margin:0px;
	  color:#00AFCA;
	  }
    .navigation .subMenu {
	  width:190px; /* largeur du menu déroulant */
	  height:150px; /* hauteur du menu déroulant */
	  font-size: 10px;
	  background: #ffffff;
	  margin: 0px;
	  padding: 0px;
	  overflow-y:auto; /* menu déroulant */
	  border-bottom: 1px solid #FFFFFF;
	  }
    .navigation ul.subMenu a {
	  margin:0px;
      background: none;
	  padding: 3px 20px;
	  }
	.menu-v-pro{ /* image transparente pour le lien vers cote pro */
	  position:absolute;
	  top:760px;
	  margin-left:45px;
	  }
	.fleche-haut{
	  position:absolute;
	  top:620px;
	  margin-left:155px;
	  }
	.gedeon {  /* image en flash de gédéon */
      position:absolute;
	  width:150px;
	  height:130px;
      top:850px;
	  margin-top:20px;
	  margin-left:33px;
	  }
    .invitegedeon {  /*image du lien vers la page jeux de gédéon */
      position:absolute;
	  top:928px;
	  border:1px solid #8ADBBD;
      background-repeat:no-repeat;
	  margin-left:22px;
	  }
	.horos-tv {
	  position:absolute;  
	  top:1040px; 
	  margin-left:10px;
	  }
	.horos-tv  a{
	 text-decoration: none;
	 font-size:12px;
	 font-family:arial;
	 color: #4075A4;
	 }
	.horos-tv  a:hover{
	 text-decoration: none;
	 color:red;
	 }
	 /*==========================================================
                             fin du menu vertical-plus
	 ==========================================================*/
	 
	 
	 
	 /*==========================================================
                           début de la page index plus 
	 ==========================================================*/
	 .ariane{
	  position:absolute;
	  top:373px;
	  margin-left:220px;
	  }
	  .ariane a{
	  font-size:12px;
	  font-family:arial;
	  color:black;
	  }
	  .ariane a:hover  { /* Quand on pointe sur un lien du menu */
	  text-decoration: none;
	  color:red;
	  }
	  
	 .fond-index-plus{     /*fond de la page index-plus*/
	  position:absolute;
	  top:400px;
	  margin-left:200px;
	  }
	 .trans-zinc{
	  position:absolute;
	  top:825px;
	  margin-left:215px;
	  }
	 
	 .pignons {
	  position:absolute;
	  top:420px;
	  margin-left:550px;
	  }
	 .nouvelle{
	  position:absolute;
	  top:430px;
	  width:392px;
	  height:187px;
	  margin-left:255px;
	  background-image:url(images/fond-texte-carousel.jpg);
	  border:0px solid black;
	  }
	 .nouvelle p{
	  font-size:12px;
	  font-family:arial;
	  color: #OOOOOO;
	  text-align:left;
	  }
	 .affichage-zinc{
	  position:absolute;
	  top:850px;
	  width:400px;
	  height:150px;
	  margin-left:430px;
	  overflow-y:auto;    /* menu déroulant */
	  border:0px solid black;
	  }
	  .affichage-zinc p{
	   font-size:10px;
	   font-family:arial;
	  }
	 .accueil-carousel{ /* position du texte au dessus du carousel */
	  position:absolute;
	  top:450px;
	  width:380px;
	  height:170px;
	  margin-left:250px;
	  text-align:center;
	  border:0px solid black;
	  }
	 .accueil-carousel p{ 
	   font-size:12px;
	   font-family:arial;
      }
	 .pub300x250{
	  position:absolute;
	  top:402px;
	  margin-left:722px;
	  }
	 
/*=================================================================
	     formulaire d'inscription direct sur page accueil index-plus
      =================================================================*/
	  
	 .inscripaccueil{
	  position:absolute;
	  text-align:left;
	  margin-left:870px;
	  padding:0px;
	  top:795px;
	  }
 
	 .inscripaccueil p{
	  font-size:12px;
	  font-family:arial;
	  color:black;
	  }
	 .inscripaccueil a{
	  font-size:10px;
	  color:black;
	  }
	 .macommune{
	  position:absolute;
	  text-align:left;
	  margin-left:785px;
	  top:765px;
	  }
	  /*===========================================================
	                              page titre plus  
	 ============================================================*/
	 
	.fond-index{     /*barre de menu de la page titre-plus*/
	  position:absolute;
	  top:330px;
	  margin-left:200px;
	  }
	
	.pourquoisite {
	  position:absolute;
	  top:355px;
	  margin-left:860px;
	  }
	
	
	.bouton_recherche { /* postion du bouton recherche */
	  position:absolute;
	  top:157px;
	  margin-left:220px;
	  }
	.fetedujour { /* emplacemente du texte fete du jour */
	  position:absolute;
	  margin-left:890px;
	  top:205px;
	  font-size:12px;
      font-family:"tahoma" arial;
	  text-align:center;
	  color:#006400;
	  }
	.recommander{
	  position:absolute;
	  margin-left:790px;
	  top:280px;
	  }
	.recommander a{
	  text-decoration: none;
	  font-size:12px;
	  font-family:arial;
	  }
	.fond-fete-du-jour { /* image de fond de la partie fete du jour */
	  position:absolute;
	  margin-left:820px;
	  top:170px;
      background-repeat:no-repeat;
	  }
	.lien_fete  { /* les liens "offrir une carte ou des fleurs" dans la partie fete du jour */
	  position:absolute;
	  top:230px;
	  margin-left:885px;
	  font-size:9px;
      font-family:arial;
	  color:#228B22;
	  }
	.favoris{
	  position:absolute;
	  top:280px;
	  margin-left:430px;
	  }
	.favoris a{
	  text-decoration: none;
	  font-size:12px;
	  font-family:arial;
	  }
	.ligne {
	  position:absolute;
	  top:400px;
	  margin-left:220px;
	  }
	.ligne p{
	  font-size:12px;
	  font-family:arial;
	  }
	.formulaire {    /* le formulaire lui même ( la ligne ou l'on met le nom de la commune */
      position:absolute;
      top:220px;
      margin-left:225px;
	  }
	.formulaire p{
	 font-size:11px;
	 font-family:arial;
	 color:#2F4F4F;
	 }
	.menu-horiz{
	  position:absolute;
	  top:335px;
	  margin-left:245px;
	  }
	.menu-horiz a {
	  font-size:12px;
	  font-family:arial;
	  color:black;
	  }
	.menu-horiz a:hover  { /* Quand on pointe sur un lien du menu */
     color: black;
      }
	  /*============================================================
	                             page plan de site plus
	================================================================*/
    .text-plan{
	  position:absolute;
	  width:440px;
	  height:500px;
	  padding-right:30px;
	  overflow-y:auto;
	  border:0px solid black;
	  top:490px;
	  margin-left:230px;
	  }
	 .text-plan p {
      font-size:12px;
	  font-family:arial;
	  }
	/*============================================================
	                          fin de la   page plan de site plus
	================================================================*/
	  
	.Facebook{ /*lien vers facebook */
	  position:absolute;
	  top:170px;
	  margin-left:780px;
	  }
	.Twitter{ /* lien vers twitter */
	  position:absolute;
	  top:205px;
	  margin-left:780px;
	  }
	.Myspace{ /* lien vers myspace */
	  position:absolute;
	  top:240px;
	  margin-left:780px;
	  }
	 .souv-ecole{ /* description souvenirs d'école de la page index2 */
	  position:absolute;
	  top:620px;
	  margin-left:430px;
	  }
	 .lezinc {
	  position:absolute;
	  top:470px;
	  margin-left:430px;
	  }
	 .translezinc {
	  position:absolute;
	  top:470px;
	  margin-left:430px;
	  }
	 .req-zinc { /* affichage de la requete Le Zinc sur la page index*/
	  width:145px;
	  height:75px;
	  top:496px;
	  position:absolute;
	  padding:5px;
	  overflow-y:auto;
	  margin-left:628px;
	  }
	 .req-zinc  p{
	  font-size:10px;
	  font-family:arial;
	  }
	.req-com { /* affichage de la requete "commerçants" sur la page index*/
	  width:190px;
	  height:105px;
	  top:850px;
	  position:absolute;
	  padding:5px;
	  overflow-y:auto;
	  margin-left:200px;
	  }
	.req-com  p{
	  font-size:10px;
	  font-family:arial;
	  }
	.req-art{ /* affichage de la requete "artisans" sur la page index*/
	  width:190px;
	  height:105px;
	  top:850px;
	  position:absolute;
	  padding:5px;
	  overflow-y:auto;
	  margin-left:430px;
	  }
	.req-art p{
	  font-size:10px;
	  font-family:arial;
	  }
	.req-tour{ /* affichage de la requete "artisans" sur la page index*/
	  width:190px;
	  height:105px;
	  top:850px;
	  position:absolute;
	  padding:5px;
	  overflow-y:auto;
	  margin-left:820px;
	  }
	.req-tour p{
	  font-size:10px;
	  font-family:arial;
	  }
	 .postit {
	  position:absolute;
	  top:620px;
	  margin-left:650px;
	  }
	  .annonces{/* description "je recherche" de la page index2 */
	  position:absolute;
	  top:470px;
	  margin-left:200px;
	  }
	  .emploi{/* description  page emploi dep de la page index2 */
	  position:absolute;
	  top:620px;
	  margin-left:200px;
	  }
	  .chien{/* description animal perdu trouvé de la page index2 */
	  position:absolute;
	  top:470px;
	  margin-left:820px;
	  }
	  .commercant{/* description liste des commerçants  de la page index2 */
	  position:absolute;
	  top:770px;
	  margin-left:200px;
	  }
	  .artisan{/* description liste des artisans de la page index2 */
	  position:absolute;
	  top:770px;
	  margin-left:430px;
	  }
	  .covoiturage{/* description covoiturage de la page index2 */
	  position:absolute;
	  top:620px;
	  margin-left:820px;
	  }
	 .lien-entreprise {
	  position:absolute;
	  top:850px;
	  margin-left:655px;
	  }
	  .tourisme{ /* description liste des activité tourisme de la page index2 */
	  position:absolute;
	  top:770px;
	  margin-left:820px;
	  }
	   /*==========================================================
                           début de la page notice plus 
	 ==========================================================*/
	 .notice{
	  position:absolute;
	  width:440px;
	  height:330px;
	  padding-right:30px;
	  overflow-y:auto;
	  border:0px solid black;
	  top:670px;
	  margin-left:230px;
	  }
	  .notice a{
      font-size:12px;
	  font-family:arial;
	  }
	  .notice p {
      font-size:12px;
	  font-family:arial;
	  text-align:left;
	  }
	 .formul-notice{
	  position:absolute;
	  width:280px;
	  height:310px;
	  border:0px solid black;
	  top:690px;
	  margin-left:730px;
	  }
	 .formul-notice p{
	  font-size:12px;
	  font-family:arial;
	  }
	  /*=================================================================
	                    page cartes virtuelles gratuites 
          =================================================================*/
	.carte-virtuelle { /* en attente de la mise en place de la page finale, à supprimer ensuite */
	  position:absolute;
	  top:410px;
	  margin-left:210px;
	  }
	.pub-carte-haut { /* en attente de la mise en place de la page finale, à modifier ensuite */
	  position:absolute;
	  top:490px;
	  margin-left:700px;
	  }
	  /*===============================================================
	                               page sortir plus
	 ===============================================================*/
	 
	.sortir-formulaire{
	 position:absolute;
	 top:505px;
	 margin-left:340px;
	 }
	 .id-ajout-sort{
	 position:absolute;
	 top:410px;
	 margin-left:560px;
	 }
	.id-ajout-sort-go{
	 position:absolute;
	 top:417px;
	 margin-left:660px;
	 }
	.cinemactu{
	 position:absolute;
	 top:775px;
	 margin-left:735px;
	 }
	.bout-banniere{
	 position:absolute;
	 top:720px;
	 margin-left:755px;
	 }
	.bout-trans-cine{
	 position:absolute;
	 top:955px;
	 margin-left:755px;
	 }
	.bout-trans-cine a{
	 font-size:12px;
	 font-family:arial black;
	 color: black;
	 }
	.bout-trans-cine a:hover  { /* Quand on pointe sur un lien du menu */
	  text-decoration: none;
	  color:red;
	  }
	.titre{
	 position:absolute;
	 width:200px;
	 height:40px;
	 top:910px;
	 margin-left:755px;
	 text-align:center;
	 }
	 .titre p{
	 font-size:10px;
	 font-family:Verdana;
	 }
	 .saisie-sortir-img{
	  position:absolute;
	  top:470px;
	  margin-left:208px;
	  }
	.formul-saisie-sortir{ /* page saisie sur la page sorties */
	  position:absolute;
	  width:420px;
	  height:405px;
	  top:540px;
	  margin-left:270px;
	  border:0px solid black;
	  }
	 .formul-saisie-sortir p{
	  font-size:12px;
      font-family:arial;
      color: black;
      }	  
	 .formul-saisie-sortir legend{
	  font-size:13px;
	  font-family:arial;
	  color:blue;
	  }
	 .tout-afficher{
	  position:absolute;
	  top:530px;
	  margin-left:230px;
	  }
	 .trait-liste-infos{
	  position:absolute;
	  width:445px;
	  height:385px;
	  padding:20px;
	  overflow-y:auto;
	  top:570px;
	  margin-left:215px;
	  border:0px solid black;
	  }
	 .trait-liste-infos p{
	  font-size:12px;
	  font-family:arial;
	  text-align:left;
	  }
	 .trait-liste-infos fieldset {
	  background-color: #F7F7F7;
	  }
	 .trait-infos{ /* page affichage de la liste des sorties */
	  position:absolute;
	  width:445px;
	  height:385px;
	  padding:20px;
	  overflow-y:auto;
	  top:570px;
	  margin-left:215px;
	  border:0px solid black;
	  }
	 .trait-infos p{
	  font-size:12px;
	  font-family:arial;
	  text-align:left;
	  }
	  /*===============================================================
	                               page gedeon plus 
	 ===============================================================*/
	 .poisson {
	  position:absolute;
	  top:840px;
	  margin-left:810px;
	  }
	 .coloriage{
	  position:absolute;
	  width:470px;
	  height:100px;
	  border:0px solid black;
	  top:520px;
	  margin-left:220px;
	  }
	 .coloriage p{
	  font-size:12px;
	  font-family:arial;
	  }
	 .expo-coloriage{
	  position:absolute;
	  width:200px;
	  height:170px;
	  overflow-y:auto;
	  padding-right:5px;
	  border:0px solid black;
	  top:780px;
	  margin-left:508px;
	  }
	 .expo-coloriage p{
	  font-size:11px;
	  font-family:arial;
	  text-align:center;
	  }
	 .expo-dessin{
	  position:absolute;
	  top:734px;
	  margin-left:270px;
	  }
	 .nom-gagnant{
	  position:absolute;
	  top:935px;
	  margin-left:300px;
	  }
	 .nom-gagnant p{
	  font-size:12px;
	  font-family:arial;
	  text-align:center;
	  }
	 .petitesmains-texte{
	  position:absolute;
	  width:300px;
	  height:50px;
	  border:0px solid black;
	  top:955px;
	  margin-left:700px;
	  }
	 .petitesmains-texte p{
	  font-size:12px;
	  font-family:arial;
	  }
	 .petitesmains{
	  position:absolute;
	  top:960px;
	  margin-left:530px;
	  }
	  .astwinds-jeux{
	  position:absolute;
	  top:1115px;
	  margin-left:310px;
	  }
	 .sudoku-gedeon{
	  position:absolute;
	  top:890px;
	  margin-left:220px;
	  }
	 .sudoku-gedeon p{
	  font-size:12px;
	  font-family:arial;
	  }
	 /*===============================================================
	                  page horoscope et programme tv plus
	  ===============================================================*/
	 .horoscope{
	  position:absolute;
	  width:470px;
	  height:500px;
	  overflow-y:auto;
	  top:490px;
	  margin-left:220px;
	  }
	 .programmetv{
	  position:absolute;
	  width:505px;
	  height:500px;
	  overflow-y:auto;
	  top:510px;
	  margin-left:205px;
	  }
	 .transjerecherche{ /*image transparente pour le lien "je recherche" sur la page horoscope*/
	  position:absolute;
	  top:710px;
	  margin-left:740px;
	  }
	 .transsouvenir{ /*image transparente pour le lien "souvenirs d ecole" sur la page horoscope*/
	  position:absolute;
	  top:880px;
	  margin-left:730px;
	  }
	  
     /*===============================================================
	                page promotion e-vitrine
	  ===============================================================*/
	  
	.fond-promo-photo{
	  width:800px;
	  height:250px;
	  top:340px;
	  position:absolute;
	  border-bottom:1px solid black;
	  margin-left:210px;
	  }
	.transpromo {
	  position:absolute;
      top:495px;
      margin-left:220px;
	  }
	.parrainage {
	  position:absolute;
      top:700px;
      margin-left:770px;
	  }
	.parrainage a{
	  font-size:12px;
	  font-family:arial;
	  text-decoration: none;
	  color:red;
	  }
	.fond-promo{
	  width:800px;
	  height:700px;
	  top:400px;
	  position:absolute;
	  background-image:url(images/promo3.jpg);
	  background-repeat:no-repeat;
	  border:0px solid black;
	  margin-left:210px;
	  }
	.text-promo{
	  width:460px;
	  height:380px;
	  top:630px;
	  position:absolute;
	  overflow-y:auto;
	  padding-right:20px;
	  margin-left:210px;
	  }
	 .text-promo p{
	  font-size:14px;
	  font-family:arial;
	  text-align:left;
	  }
	  .text-promo a{
	   text-decoration: none;
	   font-size:15px;
	   font-family:arial;
	   color:black;
	   }
	  /* ============================== rollover sur la page "les six bonnes raisons .. " ======================*/
     .rol-e-vitrine {
       position:absolute;
       top:430px;
       font-size:12px;
       font-family:arial;
       margin-left:490px;
       }
       /* Quelques effets sur les menus */
   
     .rol-e-vitrine p    { /* Tous les liens se trouvant dans un menu */
       color: red;
       }
     .rol-e-vitrine a:hover  { /* Quand on pointe sur un lien du menu */
	   color: black;
       }
     a.rolvit {
      position: relative;
      color: black;
      text-decoration: none;
      }
     a.rolvit span {
      display: none; /* on masque l'infobulle */
      }
     a.rolvit:hover {
      background: none; /* correction d'un bug IE */
      z-index: 600; /* on définit une valeur pour l'ordre d'affichage */
      }
     a.rolvit:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
	  width:225px;
	  height:160px;
	  text-align:justify;
      top:-10px; /* on positionne notre infobulle */
      right:220px;
      background-color:#EEEFFF;
      color: black;
	  font-size: 12px;
      padding: 10px;
      border: 1px solid red;
      border-right: 6px solid red;
      }
	 a.rolvit1 {
      position: relative;
      color: black;
      text-decoration: none;
      }
     a.rolvit1 span {
      display: none; /* on masque l'infobulle */
      }
     a.rolvit1:hover {
      background: none; /* correction d'un bug IE */
      z-index: 600; /* on définit une valeur pour l'ordre d'affichage */
      }
     a.rolvit1:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
	  width:225px;
	  height:160px;
	  text-align:justify;
      top:-25px; /* on positionne notre infobulle */
      right:170px;
      background-color:#EEEFFF;
      color: black;
	  font-size: 12px;
      padding: 10px;
      border: 1px solid red;
      border-right: 6px solid red;
      }
	  a.rolvit2 {
      position: relative;
      color: black;
      text-decoration: none;
      }
     a.rolvit2 span {
      display: none; /* on masque l'infobulle */
      }
     a.rolvit2:hover {
      background: none; /* correction d'un bug IE */
      z-index: 600; /* on définit une valeur pour l'ordre d'affichage */
      }
     a.rolvit2:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
	  width:225px;
	  height:160px;
	  text-align:justify;
      top:-40px; /* on positionne notre infobulle */
      right:208px;
      background-color:#EEEFFF;
      color: black;
	  font-size:12px;
      padding: 10px;
      border: 1px solid red;
      border-right: 6px solid red;
      }
	  a.rolvit3 {
      position: relative;
      color: black;
      text-decoration: none;
      }
     a.rolvit3 span {
      display: none; /* on masque l'infobulle */
      }
     a.rolvit3:hover {
      background: none; /* correction d'un bug IE */
      z-index: 600; /* on définit une valeur pour l'ordre d'affichage */
      }
     a.rolvit3:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
	  width:225px;
	  height:160px;
	  text-align:justify;
      top:-55px; /* on positionne notre infobulle */
      right:201px;
      background-color:#EEEFFF;
      color: black;
	  font-size: 12px;
      padding: 10px;
      border: 1px solid red;
      border-right: 6px solid red;
      }
	  a.rolvit4 {
      position: relative;
      color: black;
      text-decoration: none;
      }
     a.rolvit4 span {
      display: none; /* on masque l'infobulle */
      }
     a.rolvit4:hover {
      background: none; /* correction d'un bug IE */
      z-index: 600; /* on définit une valeur pour l'ordre d'affichage */
      }
     a.rolvit4:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
	  width:225px;
	  height:160px;
	  text-align:justify;
      top:-70px; /* on positionne notre infobulle */
      right:179px;
      background-color:#EEEFFF;
      color: black;
	  font-size: 12px;
      padding: 10px;
      border: 1px solid red;
      border-right: 6px solid red;
      }
	  a.rolvit5 {
      position: relative;
      color: black;
      text-decoration: none;
      }
     a.rolvit5 span {
      display: none; /* on masque l'infobulle */
      }
     a.rolvit5:hover {
      background: none; /* correction d'un bug IE */
      z-index: 600; /* on définit une valeur pour l'ordre d'affichage */
      }
     a.rolvit5:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
	  width:225px;
	  height:160px;
	  text-align:justify;
      top:-85px; /* on positionne notre infobulle */
      right:179px;
      background-color:#EEEFFF;
      color: black;
	  font-size: 12px;
      padding: 10px;
      border: 1px solid red;
      border-right: 6px solid red;
      }
	   
    /*===============================================================
	                page précommande e-vitrine
	  ===============================================================*/
	.precommande {
      position:absolute;	 
	  top:400px;
	  border-bottom:0px solid black;
	  margin-left:210px;
	  }
	.precom-com{
	  position:absolute;	 
	  width:300px;
	  height:200px;
	  border:0px solid black;
	  top : 480px;
	  margin-left:650px;
	  }
	.precom-com p {
	  font-size:12px;
	  font-family:arial;
	  text-align:center;
	  }
	.precom-texte{
	  position:absolute;	 
	  width:400px;
	  height:650px;
	  border:0px solid black;
	  top :630px;
	  margin-left:600px;
	  overflow-y:auto;
	  }
	.precom-texte p {
	  font-size:11px;
	  font-family:arial;
	  text-align:left;
	  }
	.formulaire-precom { 
	  position:absolute;	 
	  top:450px;
	  width:350px;
	  height:700px;
	  border:0px solid black;
	  margin-left:210px;
	  }
	.formulaire-precom p{ 
	  font-size:11px;
	  font-family:arial;
	  text-align:left;
	  }
	.reponseprecom {
	  position:absolute;
      top:300px;	  
	  margin-left:400px;
	  }
	   /*===============================================================
	                Fin de la page précommande e-vitrine
	  ===============================================================*/
	/*===============================================================
	                page cote-pro-cote-pub
	  ===============================================================*/
	 .gratuit{  /* ligne dans la page ajout accueil*/
	  width:440px;
	  height:200px;
	  position:absolute;
	  top:570px;
	  margin-left:230px;
	  }
	 .gratuit p { 
	  font-size:12px;
	  font-family:arial;
	  text-align:justify;
	  }
	 .gratuit a{
	   text-decoration: none;
	   color:#B52400;
	   }
	 .popup {
	  width:460px;
	  height:400px;
	  border:1px solid black;
	  padding: 20px;
	  }
	 .popup p{
	  font-size:12px;
	  font-family:arial;
	  text-align:justify;
	  }
	 .anim {
	  position:absolute;
	  top:690px;
	  margin-left:830px;
	  }
	 .anim2{
	  position:absolute;
	  top:740px;
	  margin-left:750px;
	  }
	 .anim2 p{
	   font-size:12px;
	   font-family:arial;
	   color:#B52400;
	   }
	 .anim2 a{
	   text-decoration: none;
	   color:#B52400;
	   }
	 .telechargement{
	   position:absolute;
	   top:780px;
	   margin-left:740px;
       width:230px;
	   height:200px;
	   }
	 .telechargement p{
	   font-size:10px;
	   font-family:arial;
	   }
	  .inscrire{
	   position:absolute;
	   top:980px;
	   margin-left:750px;
	  }
	  .inscrire a{
	   text-decoration: none;
	   font-size:10px;
	   font-family:arial;
	   color:#B52400;
	  }
	   .tarifs{
	    position:absolute;
	    top:833px;
	    margin-left:732px;
	  }
	  /*=================================================================
	    page e-vitrine-département49-plus.php
       ================================================================*/
	   
	 
	 .bouton-e-vitrine { /* partie téléchargement à partir de la page coté-pub*/
	  position:absolute;
	  top:715px;
	  margin-left:770px;
	  }
	  .bouton-motcle{
	  position:absolute;
	  top:870px;
	  margin-left:770px;
	  }
	  .e-vit-professionnels {
	  position:absolute;
	  width:452px;
	  height:500px;
	  border:0px solid black;
	  padding:20px;
	  overflow-y:auto;
	  top:460px;
	  margin-left:220px;
	  }
	  .e-vit-professionnels p {
	  font-size:12px;
	  font-family:arial;
	  text-align:left;
      }
	  
	 /*==================================================================
	         encart " création d'une nouvelle activité " 
	  =================================================================*/
	.fond-creation-index{ /*fond de la partie "nouvelle création"*/
	 position:absolute;
	 top:1020px;
	 margin-left:210px;
	 }
	.creation-index{ /* partie texte de l'encart "nouvelle creation" */
	 position:absolute;
	 width:430px;
	 height:150px;
	 padding:10px;
	 overflow-y:auto;
	 top:1100px;
	 margin-left:210px;
	 }
	.creation-index p{ /* taille de la police de l'encart "nouvelle création" */
	 font-size:12px ;
	 font-family: arial;
     color:black;
	 text-align:left;
	 }
	.creation-photo-index{ /* image pour la section "nouvelle création"*/
	 position:absolute;
	 width:130px;
	 height:130px;
	 border:1px solid black;
	 top:1118px;
	 margin-left:860px;
	 }
	.texte-defilant{
	 position:absolute;
	 top:1055px;
	 margin-left:795px;
	 border:0px ;
	 }
	 /*==========================================================================
	     rollover de la page ajout activité formulart, formulcom, formulsant, formulasso
    =============================================================================*/
	 a.inforub {
      position: relative;
      color: black;
      text-decoration: none;
      }
     a.inforub span {
      display: none; /* on masque l'infobulle */
      }
     a.inforub:hover {
      background: none; /* correction d'un bug IE */
      z-index: 300; /* on définit une valeur pour l'ordre d'affichage */
      }
     a.inforub:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
	  width:100px;
	  text-align:center;
      top:30px; /* on positionne notre infobulle */
      margin-left:0px;
      background-color:#EEEFEB;
      color: black;
	  font-size: 10px;
      padding: 10px;
      border: 1px solid black;
      border-left: 4px solid red;
      }
	
	/*===========================================================
	   block de page formulaire, ou est positionné le formulaire de demande du nom de la commune - plus 
    ============================================================*/
	
	.text-recherche{
	  position:absolute;
	  top:830px;
	  margin-left:230px;
	  }
	.text-recherche p{
	  font-size:12px;
      font-family:arial;
	  }
	/*============================================================
	    page avec message d'erreur "commune introuvable " et 
	   page de recherche de la commune par son nom, dans le menu déroulant 
	=============================================================*/
	.message_erreur { 
	  position:absolute;
	  top:490px;
	  margin-left:220px;
	  }
	.rech_men {   /* la page de recherche par liste des communes  déroulante */
	  position:absolute;
	  top:588px;
	  margin-left:545px;
	  font-size: 13px;
      font-family:arial black;
	  color:red;
	  }
    .liste-deroulante {  /* la liste déroulante dans la page de recherche par liste de communes */
      position:absolute;
      width:287px;
      height:100px;
      top:170px;
      margin-left:460px;
      border-left:1px solid green;
	  border-right:1px solid green;
      padding-left:10px;
      padding-right:10px;
      }
  
    .element_menu {
      width:200px;
	  height:325px;
      padding-right:20px;
	  top:685px;
	  margin-left:795px;
      position:absolute;
      overflow: auto;
	  font-size:10px;
      font-family:arial;
	  }
	  .element_menu a {
      text-decoration: none; /* Les liens ne seront plus soulignés */
      color: black; /* Les liens seront en noir au lieu de bleu */
       }
      a:hover /* Quand le visiteur pointe sur le lien */
            {
      text-decoration: underline; /* Le lien deviendra souligné quand on pointera dessus */
      color:red; /* Le lien sera écrit en vert quand on pointera dessus */
      }
		   
	.pub-deroulant-recherche { /* block pub pour page déroulant communes */
	  width:250px;
	  height:710px;
	  font-size:12px;
      font-family:arial;
	  position:absolute;
	  top:380px;
	  margin-left:770px;
	  border-left:1px solid green;
	  border-right:1px solid green;
	  border-bottom:1px solid green;
	  text-align:center;
      }
	  
	  
	/*===========================================================
	                  " page menu vertical"   
	  ===========================================================*/  
  
   .positionmenu {
    position:absolute;
	top:150px;
	width:195px;
	height:1200px;
    background-image:url(images/fond-menu-vertical.jpg);
	border:0px solid #E4E6E6;
	float:left;
	}
	.texte-menu-vert {
	 position:absolute;
	 top:380px;
	 margin-left:15px;
	}
	.texte-menu-vert p{
	 font-size: 11px;
     font-family:arial;
	 color:black;
	 }
	.texte-menu-vert2{
	 position:absolute;
	 top:425px;
	 margin-left:15px;
	}
	.texte-menu-vert2 p{
	 font-size: 11px;
     font-family:arial;
	 color:black;
	 }
   .fondaide { /* image du fond du menu aide*/
     position:absolute;
     top:0px;
     float:left;
     margin-bottom:20px;
     }
   .aide {
     position:absolute;
     top:25px;
     font-size: 12px;
     font-family:arial;
     margin-left:29px;
     }
    /* Quelques effets sur les menus */
   .aide li{
     margin-bottom:7px;
     }
   .aide a    { /* Tous les liens se trouvant dans un menu */
     color: #89A97F;
     }
   .aide a:hover  { /* Quand on pointe sur un lien du menu */
     color: black;
     }
   /*=================================================================*/

   .fondevitrines{  /* fond menu " e-vitrines" */
     position:absolute;
     top:115px;
     float:left;
     margin-bottom: 30px;
     }
   .evitrines{
     position:absolute;
     top:140px;
     font-size:12px;
     font-family:arial;
     margin-left:29px;
     }
     /* Quelques effets sur les menus */
   
   .evitrines a    { /* Tous les liens se trouvant dans un menu */
     color: #89A97F;
     }
   .evitrines a:hover  { /* Quand on pointe sur un lien du menu */
     color: black;
     }
       
   
  /*=========================================================
        ici la page gédéon code plus bas 
    =========================================================*/
   .fond-autres-liens{
   position:absolute;
   top:900px;
   margin-left:0px;
   margin-bottom: 30px;
   }
   .autres-liens{
   position:absolute;
   top:930px;
   float:left;
   font-size: 12px;
   font-family:arial;
   margin-left:29px;
   }
    .autres-liens li{/* Quelques effets sur les menus */
   margin-bottom:7px;
   }
   .autres-liens a    { /* Tous les liens se trouvant dans un menu */
   color: #89A97F;
   }
   .autres-liens a:hover  { /* Quand on pointe sur un lien du menu */
   color: black;
   }
	/*==================================================================*/

   /*==============================================================================
             menu pour les pages commmunes , sans java script
     ============================================================================*/
    .menupro{
	 width:160px;
	 height:190px;
	 background-image:url(images/fond-menuhaut-communes.gif);
	 background-repeat: no-repeat;
	 position:absolute;
	 text-align:left;
	 top:530px;
	 margin-left:220px;
	}
	.menupro a{
	 text-decoration:none;
	 font-size:11px;
	 color:black;
	 font-family:arial;
	}
	.menupro a:hover {
	 color:#CCCDCD;
	}
	.menuservices{
	 width:160px;
	 height:190px;
	 background-image:url(images/fond-menubas-communes.gif);
	 background-repeat: no-repeat;
	 position:absolute;
	 text-align:left;
	 top:630px;
	 margin-left:220px;
	}
	.menuservices a{
	 text-decoration:none;
	 font-size:11px;
	 color:black;
	 font-family:arial;
	}
	.menuservices a:hover {
	 color:#CCCDCD;
	}
	.menudéroulant{
	position:absolute;
	top:560px;
	margin-left:215px;
	}
    #menu_dynamique {   /* menu de base */
	position:absolute;
    width:auto; 
    font-size:10px;
    font-family:arial;	/*(marges et taille automatique) */
    margin:8px 0px; /* une marge de 10px à gauche et 0 à droite*/
    padding:0px;    /* pas de marge intérieure*/
   }
    #menu_dynamique ul {  /* partie " ul " du menu */
    width:125px;      /*une largeur fixe (à modifier selon la largeur du texte contenu) ;La largeur de la liste DOIT être précisée afin de positionner correctement les sous-menus par la suite.*/
    list-style:none;  /*désactivation des puces ;*/
    padding:0px;      /*aucune marge (interne ET externe) ;*/
    margin:0px;       /*  "     "  */
    border-right:1px solid silver;  /* tracé d'un trait pour la bordure droite.*/
   }


    #menu_dynamique li a {  /*partie " li et a du menu */
    display:block;
    height:18px;
    text-decoration:none;
    color:#046404;
    background-color:#FFFFFF;
   }
    #menu_dynamique ul li {
    width:auto;        /*je mets en forme les <li> avec une largeur automatique,*/
    margin-left:5px;   /*j'applique une marge externe pour que mon menu ne soit pas collé au bord gauche de l'écran,*/
    padding-left:20px; /*je mets également une marge interne à gauche de 20px*/
    text-indent:5px;   /*puis je décale à nouveau mon texte de 5px par rapport à cette marge.*/
    height:18px;       /*Il ne me reste plus qu'à préciser une hauteur ainsi qu'une image de fond*/
    background:url("images/bordure.png") no-repeat;/*notez qu'elle ne se répète pas).*/
   }
    #menu_dynamique ul li ul {
    display:none;/* pour ne pas laisser de trace */
   }
    #menu_dynamique ul li:hover ul {
    display:block;
    position:relative;/*Grâce au positionnement relatif, on peut placer le sous-menu à droite de son lien d'appel.*/
    top:-24px;        /*les valeurs en pixels de top et de left sont a tester jusqu'à ce que le positionnement  satisfasse,*/
    left:98px;
   }
    #menu_dynamique ul li ul, #menu_dynamique ul li:hover ul li ul, #menu_dynamique ul li:hover ul li:hover ul li ul{
    display:none;
   }
    #menu_dynamique ul li:hover ul, #menu_dynamique ul li:hover ul li:hover ul, #menu_dynamique ul li:hover ul li:hover ul li:hover ul{
    display:block;
    position:relative;
    top:-24px;
    left:98px;
   }
    #menu_dynamique ul li.extend a { /*lorsque l'une des lignes dispose d'un sous-menu, apparait à droite de cette ligne un petit triangle noir que voici : sous-menu.*/
    background:white url("images/61998.gif") right no-repeat;
   }
   #menu_dynamique ul li.extend:hover ul li.end a { /*spécifier que chaque <li> de classe end des sous-menus ne possède pas d'image de fond dans ce cas*/
    background-image:none;
   }
   #menu_dynamique li:hover { /* définir comme image de fond notre flèche lorsque l'on survole une ligne <lien>*/
    background:url("images/61951.png") no-repeat; /* image */
   }
   #menu_dynamique li a:hover { /*Changer la couleur du texte et du fond (du lien :p )*/
    color:black;
    background-color:#BBB7C7;/*On applique donc, comme je l'ai dit, une couleur de texte ainsi qu'une couleur de fond à notre lien (qui, rappelons-le, est de type block, ce qui permet que la  couleur de fond remplisse bien TOUTE la ligne, et non pas seulement la place occupée par le texte.*/
   }
   #menu_dynamique ul li.extend:hover a, #menu_dynamique ul li.extend:hover ul li:hover a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li:hover a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li.extend:hover ul li:hover a{ 
   background-color:#F7F3E9;
   }/*l se trouve que les lignes de classe extend ne se voient pas attribuer de couleur de fond au survol du lien (ainsi que tous les éléments des sous-menus et de leur descendance).  Pour cela, on va ajouter une bloc de propriétés CSS supplémentaire qui s'occupera spécialement de ces lignes-là*/
   {/*C'est alors que vous remarquez que TOUS les sous-menus et leurs descendants se trouvent affublés de cette couleur de fond sans avoir été survolés :-° .
Problème rapidement résolu ainsi :*/}
   #menu_dynamique ul li.extend:hover ul li a, #menu_dynamique ul li.extend:hover ul li:hover ul li a, #menu_dynamique ul li.extend:hover ul li.extend:hover ul li:hover ul li a{
   background-color:#FFFFFF;
   }
   #menu_dynamique li.first{
   border-top:1px solid silver;
   }
   #menu_dynamique li.last{
   border-bottom:1px solid silver;
   }
   {/*Sur la version 6 de IE sous laquelle j'ai testé mon menu, le fait de survoler un lien qui laisse apparaître un sous-menu étire le menu de base, le rendant très moche :euh: .
Pour palier ce problème, j'ai décidé de masquer les extensions indésirables grâce à la propriété CSS overflow.*/}
   #menu_dynamique ul li.extend:hover { /*insi, je définis une largeur et une hauteur au survol de mes lignes de classe extend et j'y applique un overflow:hidden; afin de masquer tout débordement intempestif; De cette façon, plus d'extension de mon menu et ainsi, on obtient le même rendu que sous FF.*/
   width:100px;
   height:18px;
   overflow:hidden; /*FF aussi exécute le overflow et donc masque nos sous-menus.*/
   }
   html > body #menu_dynamique ul li.extend:hover { /*utiliser une méthode que seul FF interprète */
   overflow:visible;
   }
	
	  
	
	/*=========================================================
	page gédéon , du menu au contenu 
	==========================================================*/
	
	.page-gedeon{ /*page gedeon pour les enfants*/ 
	  position:absolute;
	  width:800px;
	  height:980px;
	  top:350px;
	  margin-left:220px;
	  }
	.gedeon2 {
      position:absolute;
	  top:345px;
	  width:150px;
	  height:130px;
	  margin-left:275px;
	  }	
	.encart-concours{
	  position:absolute;
	  top:520px;
	  margin-left:750px;
	}
	
	
	/*fin de la page gédéon*/
	/*====================================================
	            page "mention legale " 
	 ====================================================*/
	
	 .mentions-legales{ /* page sur les mentions légales*/
	  position:absolute;
	  width:470px;
	  height:480px;
	  padding-right:10px;
	  overflow-y:auto;
	  top:510px;
	  margin-left:220px;
	  }
	.mentions-legales p{
	  text-align:justify;
	  font-size:12px;
      font-family:arial;
	  color:black;
	 }
	
	.fond-devenir-membre{
	  position:absolute;
	  top:360px;
	  margin-left:220px;
	  }
	.devenir-membre{ /* page sur comment devenir membre de sitcom*/
	  width:520px;
	  height:460px;
	  position:absolute;
	  margin-left:210px;
	  padding:20px;
	  top:440px;
	  overflow-y:auto;
	  }
	.devenir-membre p{
	 text-align:justify;
	 font-size:12px;
     font-family:arial;
	 color:black;
	 }
	.fond-utiliser-site{
	  position:absolute;
	  top:360px;
	  margin-left:220px;
	  }
	.utiliser-site{ /*page besoin d'aide, le mode d'emploi*/
	  width:520px;
	  height:460px;
	  position:absolute;
	  text-align:center;
	  margin-left:210px;
	  padding:20px;
	  top:440px;
	  overflow-y:auto;
	  }
	.utiliser-site p{
	 text-align:justify;
	 font-size:13px;
     font-family:arial;
	 color:#134900;
	 }
	.utiliser-site a{
	 font-size:14px;
     font-family:arial;
	 color:#713602;
	 }
    
	  
	 /*====================================================================================================
	   partie concernant les pages modifié " communes appelées par commune.php " 
	   modifié le 11/05 pour le cssplus
	  ===================================================================================================*/
	

	.communes {    /* blok contenant le bandeau de la page commune */
	  width:800px;
	  height:120px;
	  position:absolute;
	  top:385px;
	  margin-left:230px;
	  }
	#pourquoi-image{
	  position:absolute;
	  top:730px;
	  margin-left:220px;
	  }
	.pourquoi-texte{
	  width:570px;
	  height:550px;
	  position:absolute;
	  margin-left:205px;
      padding:30px;
	  top:720px;
	  }
    .pourquoi-texte p{
	  font-size: 12px;
	  text-align:justify;
	  color:#001C06;
	  }
	
	  
	/*=============================================================
	          menu du zinc pour écrire et lire, 
	 =========================================================*/
	.journalzinc {
	 position:absolute;
	 top:0px;
	 margin-left:0px;
	 }
	.block-zinc-bon-plan{
	 position:absolute;
	 top:610px;
	 margin-left:470px;
	 width:350px;
	 height:80px;
	 border-bottom: 1px solid grey;
	 border-right:1px solid grey;
	 }
	.im-1 {
	  width:790px;
	  height:500px;
	  position:absolute;
	  top:380px;
	  margin-left:210px;
	  background-repeat:no-repeat;
	   }
	.im-2 {
	  position:absolute;
	  top:485px;
	  margin-left:230px;
	  background-repeat:no-repeat;
	  }
	.video {
	  position:absolute;
	  top:485px;
	  margin-left:500px;
	  }
	.im-3 {
	  position:absolute;
	  top:485px;
	  margin-left:750px;
	  }
	.marquee {
	  position:absolute;
	  top:660px;
	  margin-left:620px;
	  }
	/*============================================================
	             image publicité dans la partie pub-commune 
	   =======================================================*/
	.images-com {  /*image pub  */
	  position:absolute;
	  width:200px;
	  height:800px;
	  top:480px;
	  margin-left:840px;
	  font-size:10px;
      font-family:arial;
	  text-align:center;
	  }
	.images-com p,.pubcom-bas p {
	  font-size:12px;
      font-family:arial;
	  color:green;
	  }
	.pubcom-haut {  /*image pub commune haut  */
	  position:absolute;
	  top:560px;
	  margin-left:865px;
	  text-align:center;
	  }
	.concours {  /* jeux concours  */
	  position:absolute;
	  width:150px;
	  height:200px;
	  border:1px solid black;
	  top:795px;
	  margin-left:865px;
	  font-size:10px;
      font-family:arial;
	  text-align:center;
	  }
	.gif-prev{
	  position:absolute;
	  top:800px;
	  margin-left:880px;
	  }
	.pubcom-bas {  /*image pub commune du bas  */
	  position:absolute;
	  top:1030px;
	  margin-left:865px;
	  text-align:center;
	  }
	.prefcom{
	  position:absolute;
	  top:450px;
	  margin-left:320px;
	  }
	.prefcom h4{
      font-family:"arial" verdana, tahoma;
	  }
	
	.nom-commune { /* nom de la commune affichée en haut de page */ 
	  position:absolute;
	  top:480px;
	  margin-left:420px;
	  }
	.nom-commune h1 {
	  font-family:"arial" verdana, tahoma;
	  }
	.nom-commune p {
	  font-size:13px;
	  font-family:"arial" verdana, tahoma;
	  }
    /*==========================================================================
	                                page " emploi-dep" 
	==========================================================================*/
	.id-ajout-emploi{ /* formulaire d'identification pour ajouter une annonce texte */
	 position:absolute;
	 top:410px;
	 margin-left:530px;
	 }
	.tout-affich-emplois{
	 position:absolute;
	 top:533px;
	 margin-left:240px;
	 }
	.recherche-form-emploi{
	 position:absolute;
	 top:515px;
	 margin-left:427px;
	 }
	.reche-select{ /*bouton "rechercher" sur la sélection d'emplois, page emploi dep*/
	 position:absolute;
	 top:555px;
	 margin-left:571px;
	 }
	.lien-inscription{
	 position:absolute;
	 top:455px;
	 margin-left:370px;
	 }
	.lien-inscription a{
	 font-size:10px;
	 font-family:arial;
	 }
	/*==========================================================================
	                                page " recherche-plus " 
	==========================================================================*/
     .video{
     position:absolute;
     top:685px;
     margin-left:710px;
     }
	.rech-video-plus{/*position des liens sous le lecteur de vidéo*/
	  position:absolute;
	  width:272px;
	  height:90px;
	  padding-right:10px;
	  overflow-y:auto;
	  top:910px;
	  margin-left:727px;
	  border:0px solid black;
	  }
	.rech-video-plus a{
	  text-decoration:none;
      color:#4090A4;
	  font-size:11px;
	  font-family:arial;
	 }
	 .rech-video-plus a:hover{
	  color:red;
	  }
	.video-rech{
     width:450px;
	 height:230px;
	 padding:10px;
	 text-align:left;
	 border:0px solid black;
	 position:absolute;
     top:960px;
     margin-left:210px;
	 overflow-y:auto;
     }
    .video-rech p	{ 
     font-size:12px;
	 font-family:arial;
	 }
	.video-rech  fieldset{
	 font-size:12px;
	 font-family:arial;
	 }
	.recherche-formulaire{ /* position de formulaire des recherche texte*/
	 position:absolute;
	 top:550px;
	 margin-left:430px;
	 }
	.tout-affich-rech{
	 position:absolute;
	 top:540px;
	 margin-left:250px;
	 }
	 .formul-saisie-recherche{ /* page saisie sur la page jerecherche plus */
	  position:absolute;
	  width:445px;
	  height:405px;
	  top:600px;
	  margin-left:240px;
	  overflow-y:auto;
	  }
	 .formul-saisie-recherche p{
	  font-size:12px;
      font-family:arial;
      color: black;
      }	  
	 .formul-saisie-recherche legend{
	  font-size:13px;
	  font-family:arial;
	  color:blue;
	  }
	 .resultat-recherche { /*page pour indiquer le résultat de la  saisie */
	  position:absolute;
	  overflow-y:auto;
	  top:670px;
	  margin-left:270px;
	  }
	  .trait-liste-rech{
	  position:absolute;
	  width:445px;
	  height:405px;
	  padding-right:10px;
	  overflow-y:auto;
	  top:600px;
	  margin-left:235px;
	  border:0px solid black;
	  }
	 .trait-liste-rech p{
	  font-size:12px;
	  font-family:arial;
	  text-align:left;
	  }
	  .resultat-recherche p{ /* paramètres caracèteres  saisie */
	  font-size:13px;
	  font-family:arial;
	  color:blue;
	  text-align:center;
	  }
	  .trait-detail-rech{ /* page affichage de la liste des sorties */
	  position:absolute;
	  width:445px;
	  height:365px;
	  padding:20px;
	  overflow-y:auto;
	  top:597px;
	  margin-left:210px;
	  border:0px solid black;
	  }
	 .trait-detail-rech p{
	  font-size:12px;
	  font-family:arial;
	  text-align:left;
	  }
	  .trait-infos-rech{ /* page affichage de la liste des sorties */
	  position:absolute;
	  width:445px;
	  height:385px;
	  padding:20px;
	  overflow-y:auto;
	  top:610px;
	  margin-left:215px;
	  border:0px solid black;
	  }
	 .trait-infos-rech p{
	  font-size:12px;
	  font-family:arial;
	  text-align:left;
	  }
	 .trait-liste-infos-rech{
	  position:absolute;
	  width:445px;
	  height:385px;
	  padding:20px;
	  overflow-y:auto;
	  top:580px;
	  margin-left:215px;
	  border:0px solid black;
	  }
	 .trait-liste-infos-rech p{
	  font-size:12px;
	  font-family:arial;
	  text-align:left;
	  }
	.lecteur-video-plus{
	  position:absolute;
	  top:685px;
	  margin-left:722px;
	 }
	.id-ajout-text{ /* formulaire d'identification pour ajouter une annonce texte */
	 position:absolute;
	 top:410px;
	 margin-left:560px;
	 }
	.id-ajout-text-go{ /* position du bouton ajout annonce texte */
	 position:absolute;
	 top:417px;
	 margin-left:660px;
	 }
	 .id-ajout-video{  /* formulaire d'identification pour ajouter une annonce video */
	 position:absolute;
	 top:465px;
	 margin-left:560px;
	 }
	.id-ajout-video-go{ /* position du bouton ajout annonce video */
	 position:absolute;
	 top:468px;
	 margin-left:660px;
	 }
	/*==========================================================================
	                  page " souvenirs d'école " 
	 =========================================================================*/
	.ajouter-souv{
	  position:absolute;
      top:550px;
      margin-left:230px;
	  }
	.ajouter-souv a{
	  text-decoration:none;
	  font-family: Comic Sans MS;
	  font-size:12px;
	  color:#5E3F00;
	  }
	.ajouter-souv a:hover{
	  color:red;
	  }
	.souv-include{
	  width:290px;
	  height:340px;
	  padding:10px;
	  text-align:justify;
	  border:0px solid #1E7F00;
	  position:absolute;
      top:480px;
      margin-left:340px;
	  overflow-y:auto;
	}
	.souv-include p {
	  font-family: "Comic Sans MS", arial ;
	  font-size:13px;
	  }
	.ecran-classe{
	  position:absolute;
      top:705px;
      margin-left:833px;
	  }
	.bout-jerecherche{
	  position:absolute;
      top:1195px;
      margin-left:220px;
	  }
	.date{
	  position:absolute;
      top:440px;
      margin-left:520px;
	  }
	.date p{
	  font-family:Comic Sans MS;
	  font-size:12px;
	  }
	  /*==========================================================================
	                   page Emploi dep plus / 
	 =========================================================================*/
	 
	 .anno-emp{ /*page besoin d'aide, le mode d'emploi*/
	  width:520px;
	  height:460px;
	  position:absolute;
	  text-align:center;
	  margin-left:250px;
	  padding:20px;
	  top:910px;
	  }
	.anno-emp p{
	 text-align:justify;
	 font-size:13px;
     font-family:arial;
	 color:#134900;
	 }
	.offreemp{
	  width:405px;
	  height:190px;
	  position:absolute;
	  border:0px solid black;
	  padding-right:20px;
	  text-align:justify;
	  margin-left:240px;
	  top:550px;
	  overflow-y:auto;
	  }
	.offreemp p{
	 text-align:justify;
	 font-size:12px;
     font-family:arial;
	 color:#3E004D;
	 }
	 .rechemp{
	  width:405px;
	  height:190px;
	  position:absolute;
	  border:0px solid black;
	  padding-right:20px;
	  text-align:justify;
	  margin-left:240px;
	  top:800px;
	   overflow-y:auto;
	  }
	.rechemp p{
	 text-align:justify;
	 font-size:12px;
     font-family:arial;
	 color:#3E004D;
	 }
	/*==========================================================================
	                   partie page commune (formulaire d'inscription pour activité )
	 =========================================================================*/
	.formulcom p{
	  font-size:12px;
      font-family:arial;
	  }
    .formulcom {
	  position:absolute;
	  width:580px;
	  height:550px;
	  overflow-y:auto;
	  border:1px solid black;
	  top:720px;
	  padding:10px;
      margin-left:220px;/* la page ne sera pas mise tout en haut mais à 1% du bord supérieur*/
      background-color: #E7EAEA;
      margin-bottom:20px;
	   }
	   input, textarea{
      font-family: "arial", verdana; /* On modifie la police du texte tapé l'intérieur des champs */
       }
      input:focus, textarea:focus {/* Quand le curseur est sur un champ (ne marche pas sur IE) */
      background-color: #FDFDD9;
       }
	   label{
	  font: 15px "arial", sans-serif;
      color: #006400; /* Colorer en bleu tous les labels (bah oui, pourquoi pas en bleu ?) */
       }
	   legend{ /* On met un peu plus en valeur les titres des fieldset */
      font-family: Arial, "Arial Black", Georgia, "Times New Roman", Times, serif;
      color: #FF7F50;
      font-weight: bold;
      }
	  fieldset{
      margin: auto;
      margin-bottom: 5px; /* Une marge pour séparer les fieldset */
      background-color: transparent;
      }
	.reponse-formulcom{/* page d'ouverture avec la réponse à la saisie d'ajout d'activité*/
	  position:absolute;
	  width:800px;
	  height:300px;
	  border:4px solid green;
      text-align:center;
	  padding-top:100px;
	  top:400px;
	  margin-left:210px;
	  }
	.reponse-formulcom p{
	  font-size:15px;
      font-family:arial;
	  color:green;
	  }

	/*==================================================================================
	        LE ZINC  page inscription sur le Zinc / les boutons de liens / écriture et lecture
            ===============================================================================*/
	.ajout-activite{ /*ligne du lien ajout activité*/
	  position:absolute;
	  top:690px;
	  margin-left:470px;
	  }
	.ajout-activite a{ 
	  text-align:center;
	  font-size:12px;
      font-family:arial;
	  color:#B20094;
	  }
	.ajout-activite a:hover{
	  color:#F60101;
	  }
	.ajouter-activite{
	  width:570px;
	  height:550px;
	  border:1px solid #713602;
	  position:absolute;
	  margin-left:220px;
      padding:10px;
	  top:720px;
	  background-color:#E7EAEA;
	  }
	.ajouter-activite p{
	  text-align:center;
	  font-size:12px;
      font-family:arial;
	  color:black;
	 }
	.ajouter-activite h3{
	 text-align:center;
	 }
	
	 
	.inscription{ /* bouton a cliquer  pour lien d'inscription dans la page commune*/
	  position:absolute;
	  top:0px;
	  margin-left:170px;
      background-image:no-repeat;
      border:0px solid black;
	  }
	.ecrire-le-zinc{/*bouton a cliquer pour lien pour écrire sur le zinc*/
	  position:absolute;
	  top:40px;
	  margin-left:250px;
      background-image:no-repeat;
      border:0px solid black;
	  }
	.bons-plans-bouton{/*bouton a cliquer lien pour ouvrir les bons plans de la semaine*/
	  position:absolute;
	  top:0px;
	  margin-left:0px;
      background-image:no-repeat;
      border:0px solid black;
	  }
	.lire-zinc{ /* bouton a cliquer pour lire le zinc*/
	  position:absolute;
	  top:40px;
	  margin-left:0px;
      background-image:no-repeat;
      border:0px solid black;
	  }
	.fond-corps-communes{
	  position:absolute;
	  top:730px;
	  margin-left:220px;
	  }
	.corps-communes{
	  position:absolute;
	  width:560px;
	  height:600px;
	  padding:15px;
	  top:715px;
	  margin-left:220px;
	  }
	.corps-communes p{
	  font-size:11px;
      font-family:arial;
	  color:green;
	  text-align:center;
	  }
	.lien-contact{
	  position:absolute;
	  top:1220px;
	  margin-left:520px;
	  }
	.lien-besoin-aide{
	  position:absolute;
	  top:1130px;
	  margin-left:500px;
	  }
	.inscriptionzinc{ /* formulaire d'inscription sur sitecom49 */
	  width:570px;
	  height:550px;
	  overflow-y:auto;
	  border:1px solid black;
	  position:absolute;
	  margin-left:215px;
	  padding-left:10px;
	  padding-right:10px;
	  top:730px;
	  background-color:#E7EAEA;
	  }
	.inscriptionzinc p{ /* police de caractère du formulaire d'inscription*/
	 text-align:justify;
	 font-size:12px;
     font-family:arial;
	 color:black;
	 }
	.resultinscription{   /* réponse du résultat d'inscription sur le Zinc */
	  position:absolute;
	  width:120px;
	  height:150px;
	  top:850px;
	  text-align: center;
	  font-family:Arial black;
	  font-size: 12px;
	  color:red;
	  margin-left:610px;
	 }
	.saisie-info-zinc{  /* formulaire pour écrire sur le zinc*/
	  position:absolute;
	  width:570px;
	  height:550px;
	  border:1px solid black;
	  top:730px;
	  padding:10px;
      margin-left:220px; 
      background-image:url(images/ecrire.png);
	  margin-bottom:20px;
	   }
	.saisie-info-zinc p{
	  text-align:justify;
	  font-size:12px;
      font-family:arial;
	  color:black;
	  }
	.zinc-fond{ /*image de fond du zinc (journal)*/
	  position:absolute;
	  top:710px;
	  margin-left:200px;
	  }
	.reponse-zinc{
	  position:absolute;
	  top:700px;
	  margin-left:250px;
	  color:green;
	  font-size:20px;
      font-family:arial;
	  }
	.titre-commune-zinc{
	  position:absolute;
	  top:815px;
	  margin-left:230px;
	  }
	.titre-commune-zinc p{
	  font-size:13px;
	  font-family:tahoma;
	  }
	.choisir-titre {  /* choisir le titre dans le zinc */
	  position:absolute;
	  width:120px;
	  height:350px;
	  overflow-y:auto;
	  border:0px solid black;
	  top:940px;
	  padding:10px;
      margin-left:675px; 
	   }
    .choisir-titre p{
	  text-align:centrer;
	  font-size:12px;
      font-family:tahoma;
	  color:black;
	  }
	.position-titre { /* positionnement du titre et de l'auteur dans la page zinc*/
	  position:absolute;
	  top:850px;
	  margin-left:450px;
	  }
	.position-titre p{
	  font-size:12px;
      font-family:tahoma;
	  color:#788483;
	  }
	.position-photo{ /* positionnement de la photo grand format dans le zinc */
	  position:absolute;
	  width:410px;
	  height:250px;
	  top:905px;
	  text-align: center;
	  margin-left:227px;
	  border:0px solid black;
	  }
	.position-contenu { /* positionnement du block texte du zinc */
	  position:absolute;
	  width:395px;
	  height:140px;
	  overflow-y:auto;
	  border:0px solid black;
	  top:1205px;
	  padding:10px;
      margin-left:220px; 
	   }
	.position-contenu p{ 
	  font-size:12px;
      font-family:tahoma;
	  color:grey;
	  }
	.text-info-zinc{
	  position:absolute;
	  top:725px;
	  margin-left:675px;
	  }
	.text-info-zinc p{
	  text-align:center;
	  font-size:8px;
      font-family:arial;
	  color:black;
	  }
	.text-info-zinc-bas{
	  position:absolute;
	  top:1310px;
	  margin-left:680px;
	  }
	.text-info-zinc-bas p{
	  text-align:center;
	  font-size:5px;
      font-family:tahoma;
	  color:black;
	  }
	.fond-formul-pratique{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.formul-pratique{  /* formulaire pour faire une demande d'emploi ou rechercher un animal*/
	  position:absolute;
	  width:570px;
	  height:550px;
	  overflow-y:auto;
	  top:720px;
	  padding:10px;
      margin-left:220px; 
	  text-align:center;
      margin-bottom:20px;
	   }
	.formul-pratique p{
	  text-align:justify;
	  font-size:12px;
      font-family:arial;
	  color:black;
	  }
	.fond-livreor{
	  position:absolute;
	  top:360px;
	  margin-left:210px;
	  }
	
	.fond-accueil-com {  /* lire le zinc */
	  position:absolute;
	  top:790px;
      margin-left:230px; 
	   }
	.fond-e-commerce{
	  position:absolute;
	  top:360px;
	  margin-left:210px;
	  }
	.e-commerce h3 {
	  font-family :arial;
	  }
	.e-commerce p{
	  font-size:15px;
	  font-family:arial;
	  }
	  .e-commerce{
	  position:absolute;
	  width:510px;
	  height:470px;
	  top:530px;
	  padding:20px;
	  text-align: center;
      margin-left:210px; /* la page ne sera pas mise tout en haut mais à 210px du bord gauche*/
      margin-bottom:20px;
	   }
	/*=================================================================
           page contact  et page signaler un abus( mail vers contact@sitcom49.fr et abus@sitcom49.fr
            ===============================================================*/							   

	.contact{  /* page contact plus , c'est le formulaire */
	  position:absolute;
	  top:670px;
	  margin-left:270px;
	  border:0px solid black;
	  text-align:center;
	  }
	.contact p{
	  font-size:12px;
      font-family:arial;
	  }
    .traitementcontact{
	  position:absolute;
	  top:720px;
	  font-size:15px;
	  font-family:arial;
	  color:red;
	  margin-left:300px;
	}
	.contactpro{ /* page sur comment devenir membre de sitcom*/
	  position:absolute;
	  top:670px;
	  margin-left:270px;
	  border:0px solid black;
	  text-align:center;
	  }
	.contactpro p{
	  font-size:12px;
      font-family:arial;
	  }
	.affaires-pro {
	  position:absolute;
	  width:280px;
	  height:250px;
	  top:760px;
	  margin-left:715px;
	  border:0px solid black;
	  text-align:center;
	  }
	.affaires-pro p{
	  font-size:11px;
      font-family:arial;
	  }
    .traitementcontactpro{
	  position:absolute;
	  top:720px;
	  font-size:15px;
	  font-family:arial;
	  color:red;
	  margin-left:300px;
	}
	
		   
    /*===============================================================
	   pages artisan, commerçants, associations, et autre praticiens en include dans la page commune concernée 
	  ==============================================================*/
	.fond-bon-plan{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.bons-plans{
	  position:absolute;
	  top:725px;
	  margin-left:240px;
	  font-size:15px;
	  font-family:arial;
	  }
	.lesplans{
	  width:580px;
	  height:430px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:230px;
	  font-size:15px;
	  font-family:arial;
	  top:790px;
	 }
	 .lesplans th { 
       background-color: #F7ED5A;
       color: #F7AE5A;
       font-size:1.1em;
       font-family: arial;
	   }
	.fond-artisans{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.titre-artisans{
	  position:absolute;
	  top:725px;
	  margin-left:240px;
	  }
	  
	#artisans{
	  width:590px;
	  height:540px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:220px;
	  top:790px;
	 }
	#artisans a{
	  text-align:center;
	  font-size:11px;
      font-family:arial;
	  padding:0px;
	 }
	#artisans p{
	 font-size:11px;
     font-family:arial;
	 }
	 #artisans fieldset{
	 background-color:#F9F2E9;
	 }
	 #artisans legend{
	 color:#755600;
	 }
	 .retour-cotepub{
	  position:absolute;
	  top:390px;
	  margin-left:660px;
	  }
	 
	  .fond-diaporama { /* partie téléchargement à partir de la page coté-pub*/
	  position:absolute;
	  top:350px;
	  margin-left:210px;
	  }
	 .diaporama {
	  position:absolute;
	  margin-left:250px;
	  font-size:16px;
	  font-family:arial;
	  top:540px;
	 }
	 .diaporama2 {
	  position:absolute;
	  margin-left:250px;
	  font-size:12px;
	  font-family:arial;
	  top:750px;
	 }
	 .déroulant-diaporama {
	  width:250px;
	  height:100px;
	  position:absolute;
	  margin-left:560px;
	  overflow-y:auto;
	  font-size:12px;
	  font-family:arial;
	  top:740px;
	 }
	 .explication {
	  width:250px;
	  height:70px;
	  position:absolute;
	  margin-left:560px;
	  overflow-y:auto;
	  font-size:10px;
	  font-family:arial;
	  top:870px;
	 }
	.bouton-telecharger  {
	  position:absolute;
	  top:840px;
	  margin-left:550px;
	  }
	.telecharger  {
	  position:absolute;
	  top:850px;
	  margin-left:580px;
	  font-size:12px;
	  font-family:arial;
	  }
	.fond-commercants {
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.titre-commercants {
	  position:absolute;
	  top:725px;
	  margin-left:240px;
	  }
     #commercants{
	  width:590px;
	  height:530px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:220px;
	  top:790px;
	 }
	 #commercants a{
	  text-align:center;
	  font-size:11px;
      font-family:arial;
	  padding:0px;
	 }
	 #commercants p{
	 font-size:11px;
     font-family:arial;
	 }
	 #commercants fieldset{
	  background-color:#EAF9EF;
	 }
	 #commercants legend{
	 color:#095A00;
	 }
	.fond-associations{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.titre-associations{
	  position:absolute;
	  top:725px;
	  margin-left:240px;
	  }
	 #associations{
	  width:590px;
	  height:530px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:220px;
	  top:790px;
	 }
	 #associations a{
	  text-align:center;
	  font-size:11px;
      font-family:arial;
	  padding:0px;
	 }
 	 #associations p{
	 font-size:11px;
     font-family:arial;
	 }
	 #associations fieldset{
	  background-color:#F9F9D4;
	 }
	 #associations legend{
	 color:#F38A01;
	 }
	.fond-medical{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.titre-medical{
	  position:absolute;
	  top:725px;
	  margin-left:240px;
	  }
	 #medical{
	  width:590px;
	  height:530px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:220px;
	  top:790px;
	 }
	 #medical fieldset{
	  background-color:#EEF1F9;
	 }
	 #medical legend{
	 color:#112B80;
	 }
	 #medical a{
	  text-align:center;
	  font-size:11px;
      font-family:arial;
	  padding:0px;
	 }
	 #medical p{
	 font-size:11px;
     font-family:arial;
	 }
	.fond-emplois{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.titre-emplois{
	  position:absolute;
	  top:725px;
	  margin-left:230px;
	  }
	 #emplois{
	  width:590px;
	  height:470px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:220px;
	  top:793px;
	 }
	 #emplois fieldset{
	  background-color:#EBECEC;
	 }
	 #emplois legend{
	 color:#0D8000;
	 }
	 #emplois a{
	  text-align:center;
	  font-size:11px;
      font-family:arial;
	  padding:0px;
	 }
	 #emplois p{
	 font-size:11px;
     font-family:arial;
	 text-align:left;
	 }
	 
	 #co-voiturage{
	  width:570px;
	  height:550px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:230px;
	  top:700px;
	 }
	.fond-animaux{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	.titre-animaux{
	  position:absolute;
	  top:725px;
	  margin-left:360px;
	  }
	 #animaux{
	  width:590px;
	  height:450px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:220px;
	  top:790px;
	 }
 	 #animaux fieldset{
	  background-color:#FDE2CA;
	 }
	 #animaux legend{
	 color:#914400;
	 }
	 #animaux a{
	  text-align:center;
	  font-size:11px;
      font-family:arial;
	  padding:0px;
	 }
	 #animaux p{
	 font-size:11px;
     font-family:arial;
	 }
	 
	.fond-vie-pratique{
	  position:absolute;
	  top:720px;
	  margin-left:220px;
	  }
	
	 #vie-pratique{
	  width:590px;
	  height:550px;
	  overflow-y:auto;
	  position:absolute;
	  margin-left:230px;
	  top:830px;
	 }
 	 #vie-pratique fieldset{
	  background-color:#F3DAF4;
	 }
	 #vie-pratique legend{
	 color:#6C016F;
	 }
	 #vie-pratique a{
	  text-align:center;
	  font-size:11px;
      font-family:arial;
	  padding:0px;
	 }
	 #vie-pratique p{
	 font-size:11px;
     font-family:arial;
	 }
	
	 /*================================================================
	                          pages "besoin d'aide" 
         ================================================================*/
	
	 .pub-aide {   /*pub "dep49" pour la page horoscope */
      width:250px;
	  height:1100px;
	  font-size:12px;
      font-family:arial;
	  position:absolute;
	  top:350px;
	  margin-left:770px;
	  border-right:1px solid green;
	  text-align:center;
	  }
	  /*================================================================
	                          pages "partenaires et liens plus " 
         ================================================================*/
		 
	 .liens-dep {
      width:450px;
	  height:170px;
	  top:410px;
	  position:absolute;
	  padding:10px;
	  margin-left:220px;
	  border:0px solid black;
	  }	
	 .liens-dep p {
	  font-size:11px;
	  font-family:arial;
	  text-align:justify;
	  } 
	  
	 .liens-deroul{
	  width:450px;
	  height:660px;
	  overflow-y:auto;
	  top:620px;
	  position:absolute;
	  padding:10px;
	  margin-left:220px;
	  border:1px solid black;
	  }	
	 .liens-deroul p{
	  font-size:11px;
	  font-family:arial;
	  text-align:center;
	  } 
	 .referencement{
	  width:305px;
	  height:450px;
	  overflow-y:auto;
	  top:410px;
	  font-size:12px;
      font-family:arial;
	  position:absolute;
	  margin-left:700px;
	  border-bottom:1px solid black;
	  padding-left:10px;
	  }	
     .liens-sitcom49{
      width:305px;
	  height:410px;
	  overflow-y:auto;
	  top:890px;
	  font-size:11px;
      font-family:arial;
	  position:absolute;
	  margin-left:700px;
	  border-top:1px solid black;
	  padding-left:10px;
	  text-align:center;
	  }	 
	  .liens-sitcom49 p{
	  font-size:11px;
      font-family:arial;
	  text-align:center;
	  }
	/*=================================================================
                                                pied de page plus
           ===============================================================*/			 
	.pied_de_page{
	  position:absolute;
	  margin-left:0px;
	  top:1390px;
	  margin-bottom:50px;
	  }
	.texte_pied{
	  position:absolute;
	  margin-left:220px;
	  top:1465px;
	  }
	.texte_pied a{
	  font-size:12px;
	  font-family:arial;
	  text-decoration: none;
	  color:#OOOOOO;
	  }
	.texte_pied a:hover{
	  text-decoration: none;
	  color:#FFFFFF;
	  }
    .pub-google-com{   /* pub google en bas des pages communes*/
	  position:absolute;
	  top:1370px;
	  margin-left:240px;
	  }
	.logo-indexweb{
	  position:absolute;
	  top:1435px;
	  margin-left:120px;
	  }