html{font-size:0.8em} 
	body{font-size:1em;margin:0em;padding:0em;font-family:arial;} 
 /*table {border:solid 10px black;}
 td {border:solid thin red;}*/
	
	#ContainerAgrandiTexte{display:none}
	
	/* -------- Gestion noscript (Page accueil) ------------ */	 
	#saver  
	{
		position: absolute; 
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		font-weight:bold;
		padding-left:20px;
		display:block;
		color:white; 
	}
	#saver div img{vertical-align:middle;}
	#saver .message{border-radius:20px;width:70%;margin:auto;background-color:#333333;padding:20px}
	
	#Visites-Maj{width:70%;margin:auto;text-align:center;color:#333333;font-size:0.7em}
	
	/* ***** Gestion les Plus (Page accueil *** */
	#lesPlus{border:solid thin gray;position:fixed;left:50%;top:10px;transform: translate(-50%, 0px);display:none;z-index:999;} 
	#lesPlus .fermerFenetre {cursor:pointer;font-weight:bold;padding:10px;background-color:#808000;color:orange;text-align:center;font-size:1.5em}    
	.lesPlusListeSelectionTitre{color:orange;font-weight:bold}
	
	/* ***** Gestion A la Une (Page accueil *** */
	#alaUneBulle{position:fixed;width:50%;left:50%;top:20px;transform: translate(-50%, 0px);display:none;z-index:999;top:20px} 
	#alaUneBulle .fermerFenetre {width:100%;margin:auto;cursor:pointer;font-weight:bold;padding:10px;background-color:#808000;color:orange;text-align:center;font-size:1.5em}    
	
	/* ***** Gestion et a Bientôt(Page accueil *** */	 
	#etBientotBulle{position:fixed;width:50%;left:50%;top:20px;transform: translate(-50%, 0px);display:none;z-index:999;;top:20px} 
	#etBientotBulle .fermerFenetre {width:100%;margin:auto;cursor:pointer;font-weight:bold;padding:10px;background-color:#808000;color:orange;text-align:center;font-size:1.5em}    
	
	.bulleAlaUne,.bulleBientot{width:10em;font-size:1.7em;margin:auto;text-align:center;cursor:pointer;}
	.bulleAlaUne:hover,.bulleBientot:hover{border:solid thin black;border-radius:15px;background-color:#808000;color:white}
	
	/* ****** La Page accueil ** */	
	#bod{display:none}
	#bod table{width:100%}       
			
	/* -------- Zoom sur photo membres de l'association ------- */
	#contenerMap{z-index:999;position:fixed;top:0px;display:none;margin:auto}
	#contenerMap .fermerFenetre{width:100%;margin:auto;cursor:pointer;font-weight:bold;padding:10px;background-color:#808000;color:orange;text-align:center;font-size:1.5em}			

	/* ----- Boite post-it ----- */
	#postit{}
	
	/* ----- Boite Tiptool----- */
	#tooltipBox{visibility: hidden;position:absolute;top:0px;left:0px;background:white;  
		padding:5px; margin:0px;font-family:'Arial, Verdana, Helvetica, sans-serif';font-size:12px;   
		border-radius:15px;box-shadow:5px 5px 3px gray;
			opacity: 0; 
		z-index:999;
	}  

	#TipTool_tblInfoRdv{border-collapse:collapse;border:solid thin gray}
	#TipTool_tblInfoRdv td{border:solid thin gray;padding-left:10px;padding-right:10px}

			
	/* ---- Click droit --- */
	#contenerStopContextMenu{z-index:999;position:absolute;
		border:1px solid #9D9DA1; background-color:#ffffff;font-size:12px;
		cursor:default; display:none;padding:5px;border-radius:5px;
		background-color:#1a1a1a;color:white;
		box-shadow:5px 4px 7px 3px rgb(192, 192, 192)}
	#contenerStopContextMenu .text{font-size:1.3em}
	 
	 /* --- Agrandissement / Diminution des caractères -------- */
	 
	#ContainerAgrandiTexte  {padding:0px; padding-bottom:5px; margin:0px;font-size:1em;z-index:300}  
	#ContainerAgrandiTexte ul{list-style-type:none;padding:0em;margin:0em;}  
	.NavigationAgrandiTexte{position:relative;padding:0em;margin:0em;}  
	.NavigationAgrandiTexte li{float:left;}  
	.NavigationAgrandiTexte a{display:block;text-decoration:none;color:black;  margin:0px;padding-left:5px;padding-right:5px;z-index:5}
	.NavigationAgrandiTexte a:hover{color:white;}  
	.NavigationAgrandiTexte ul {border-radius:10px;display:none;position:absolute;top:25px;margin:0em;padding:5px; background-color:#d2691e;z-index:5}  /* Niveau 0 */  
	.NavigationAgrandiTexte ul a {margin:0px; border-style:none;   padding:0px;color:black; } /* Niveau 0 */  
	
	.NavigationAgrandiTexte  ul li{ float:none;}   /* Niveau 0 */  
	.NavigationAgrandiTexte .liNiveau0:hover .ulNiveau0{display:block} /* Niveau 0 */ 


	/* ----- Attente chargement ----- */
	#AttenteChargement{display:block;position:fixed;top:50px;left:50%;width:40%;transform: translate(-50%, -50%);background-color:gray;color:white;text-align:center;padding:15px;border-radius:15px;}
	#AttenteLoading{display:none;position:fixed;top:50px;left:50%;width:40%;transform: translate(-50%, -50%);background-color:gray;color:white;text-align:center;padding:15px;border-radius:15px;}
	/* ----- Aides Retour page appelante ----- */
	#retourPage{text-align:center} 
	#retourPage a{color:black;text-decoration: none;cursor:pointer;font-weight:bold;font-size:1.5em}
	#retourPage a:hover{color:gray;text-decoration:underline;} 
	
	/* -------- Formulaire de contact -------- */
	#contenerContact{width:50%;margin:auto;} 
	#contenerContact legend{font-weight:bold;color:red}
	#contenerContact label{display:inline-block;width:15em}
	/* -------- Formulaire de contact -------- */
	
	#contenerSondage{width:50%;margin:auto;} 
	#contenerSondage legend{font-weight:bold;color:red}
	#contenerSondage label{display:inline-block;width:15em}
	
	/* Texte défilant */
	.messagedefilant {display: block;height:3em;width:40em;margin:auto;overflow: hidden;position: relative;}
	.messagedefilant div {width:40em;margin:auto;position:absolute;background-color:#808000;border-radius:15px;color:white;font-size:1.2em}
	.messagedefilant div span, 
	.messagedefilant div:after {position: relative;display: inline-block;font-size: 1.2em;white-space: nowrap;}
	.messagedefilant div span {animation: defilement 15s infinite linear;}
	.messagedefilant div:after {position: absolute;animation: defilement2 10s infinite linear;}   
	.messagedefilant div span a{color:white}
	.messagedefilant div span a:hover{color:#303030}
	
	@keyframes defilement {
	  0% { margin-left: 0; }
	  100% { margin-left: -100%; }       
	}
	@keyframes defilement2 {
	  0% { margin-left: 100%; }
	  100% { margin-left: 0%; }                        
	}	 
	
	      /* Fading animation */
      .fade {
        animation-name: fade;
        animation-duration: 5s;
      }
      @keyframes fade {
        from {
          opacity: 0.3;
        }
        to {
          opacity: 1;
        }
      }
      .slideshow-container {}
      /* Caption text */
      .text {
		background-color:white;
        color: black;
        font-size: 15px;
        position:relative;
		width:80%;
		margin:auto;
		bottom:30px;
        text-align: center;
      }
	
	/* Présentation des images pours loisirs et evènements */
	.contenerImageVideo{display:inline;}
	.contenerImageVideo img{border:solid 10px green;height:150px;padding:10px;}

	.contenerImageCourante{display:inline;}
	.contenerImageCourante img {height:150px;padding:10px}
	
	/* Page confidentialités */
	#Confidentialite, #rgpd{width:80%;margin:auto;z-index:999} 
	#Confidentialite .telecharger,#rgpd .telecharger {cursor:pointer;font-weight:bold;padding:10px;background-color:#808000;color:orange;text-align:center;font-size:1.5em}    
	
	/* Retour page appelante pages Aide */

	#retourEspace{text-align:center} 
	#retourEspace a{color:orange;text-decoration: none;cursor:pointer;font-weight:bold;font-size:1.5em}
	#retourEspace a:hover{color:gray;text-decoration:underline;} 
	
	/* Objet vibrant*/
	.vibre {animation: vibration 2.5s infinite ease-in-out;}

	@keyframes vibration {
		0% { transform: translate(0, 0) rotate(0deg); }
		20% { transform: translate(-2px, 2px) rotate(-1deg); }
		40% { transform: translate(-2px, -1px) rotate(1deg); }
		60% { transform: translate(2px, 2px) rotate(0deg); }
		80% { transform: translate(2px, -2px) rotate(-1deg); }
		100% { transform: translate(0, 0) rotate(0deg); }
	}