@charset "utf-8";
/* CSS Document */

A:link {text-decoration: none; color:#5b5550;}
A:visited {text-decoration: none; color:#5b5550;}
A:active {text-decoration: none; color:#5b5550;}
A:hover {text-decoration: none; color:darkorange;}


body {
	padding: 0;
	margin: 0;
	background-color: #ccc;
	color: #333333;
	font-family: 'Roboto', sans-serif;
	font-size: 18px;
	text-align: left;
}

#fond{
	width: 1180px;
	margin: 0 auto;
	background-color: #FFFFFF;
	padding: 10px;
	font-size: 20px;
	color: #000;
	
	

}


.titre2, #titre2{
	
font-size:40px;
color:darkorange;
line-height: 50px;
}

.titre1, #titre1, h1{
	
font-size:40px;
color:darkorange;
text-align: center;
font-weight: bold;
	margin : 20px 0;
}

#alerte{
border-radius: 10px;

font-size:35px;
color:darkorange;
text-align: center;
margin-bottom: 10px;⏶	⏷
}

#titre{
font-size:50px;
color:#5b5550;
text-align: center;
margin-bottom: 10px;⏶	⏷
}

#titredate{
background-color: gold;
font-size:50px;
color:#5b5550;
text-align: center;
margin-bottom: 10px;⏶	⏷
}


.legende{	

font-size:18px;
font-style: oblique; 
}

.txt20, #txt20{	
font-size:20px;
	font-weight: normal;
	color:#000;
}

.txt30, #txt30{	
font-size:30px;
	font-weight: normal;
	color:#000;
}

.txt, #txt{
color:#000000;
font-size:16px;
font-weight: normal;
}

.txtlink{	
font-size:20px;
line-height: 22px;
}
.petit{	
font-size:16px;
line-height: 18px;
}

.txtlink:hover
{
  
	cursor: pointer;
}
tbody .txtlink td {
}
tbody .txtlink td {
}


#soustitre, .soustitre
{

font-size:26px;
font-weight:bold; 
color:#ac947a;	
}
#libelle, .libelle
{

font-size:30px;
font-weight:bold; 
color:#3B3939;
margin: 10px 0;	
	line-height: 32px;
}


#formulaire, .formulaire
{

font-size:20px;
padding:10px;
}

.sstitre
{

font-size:30px;
font-weight:bold; 
color:darkorange;
line-height: 28px;	
margin-bottom: 10px; 
}

.puce
{

font-size:18px;
font-weight:bold;
	line-height:16px;
color:orangered;
}


.petitbouton, .petitbouton a {

font-size:18px;
background-color:orangered;
color:#fff;
padding:8px;
text-align:center;
cursor: pointer;
text-decoration: none;
	border-radius: 12px;
	border:0;
}


a.petitbouton:visited, a.petitbouton:active {color: #fff;}


#boutonaudio, #boutonaudio a {
float:left;
font-size:20px;
background-color:#ccc;
padding:2px;
margin:4px;
text-align:center;
cursor: pointer;
text-decoration: none;
border-radius: 10px;

}
	
.txtarea
{

font-size:20px;
color:#5b5550;
}

#menu, #menu a{
float:left;
text-align:left;
padding:4px 10px;
font-family: 'Roboto', sans-serif;
font-size:18px;
color:#fff;

text-decoration: none;
}
#menuAC, #menuAC a{
	float: left;
	text-align: left;
	font-family: 'Roboto', sans-serif;
	font-size: 18px;
	color: #fff;
	padding:4px 30px;
	text-decoration: none;
	
}




#menu a:hover, #menu2 a:hover, #menuplanning a:hover{background-color: #fad02c; color:#5b5550; text-decoration: none; }


#benevole{
	background-color:#ac947a;color:#fff;  width:174px;height:230px;margin:5px;padding:5px;border:1px solid #5b5550;float:left; text-align: center;
	font-size: 18px;
}

#benevole2{
	background-color:dimgray; color:#fff;  width:173px;height:180px;margin:5px;padding:5px;border:1px solid #5b5550;float:left; text-align: center;
	font-size: 18px;
}

.rond {
   width:120px;
   clip-path: circle(50% at 50% 50%);
	
}
	
#footer, #footer2{
background-color:#554F4F;
padding:20px;
font-weight: normal;
font-size:14px;
color:#fff;
text-align: center;
margin-top:20px;
}

#footer a, #footer2 a{color:#fff;}

	
	.survol {
    display:inline-block;
    position:relative;
    
    text-align:left;
}
.tooltip {
position: relative;
}
.tooltip:hover:after {
content: attr(custom-tooltip);
position: absolute;
background: darkorange;
color: white;
font-size: 18px;
width: 500px;
text-align: left;
padding: 10px;
border-radius: 10px;
	margin-left:5px;
	z-index: 99;
}

.info {
position: relative;
}
.info:hover:after {
content: attr(custom-info);
position: absolute;
background: darkorange;
color: white;
width: 200px;
text-align: left;
padding: 0 5px;
border-radius: 10px;
	margin-left:5px;
	z-index: 99;
}

/* Info-bulle sur plusieurs lignes */
.infobulle {
  text-decoration:none;
  position:relative;
}
.infobulle span {
  display:none;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;

}
.infobulle span img {
  float:left;
  
}
.infobulle:hover span
{
  display:block;
  position:absolute;
  top:0;
  left:0;
  z-index:1000;
  width:200px;
font-size:20px;
  
  background-color: darkorange;
	color:#fff;
  
  overflow:hidden;
  padding:5px;
}

.survol
{
  text-decoration:none;
  position:relative;
}
 
 
.survol span
{
  display:none;
 
  -moz-border-radius:8px;
  -webkit-border-radius:8px;
  border-radius:8px;
  color:black;
  background:white; 
}
 
 
.survol span img
{
  float:left;
  margin:0px 8px 8px 0;
	width:150px;
}
 
 
.survol:hover span
{
  display:block;
  position:absolute;
  top:0;
  left:0;
  z-index:1000;
  width:auto;
  max-width:150px;
border:1px solid #ac947a;
  margin-top:12px;
  margin-left:32px;
  overflow:hidden;
  padding:5px;
	color:#5b5550;
font-size:18px;	
}

#bouton, #bouton a {

font-size:30px;
font-weight:bold;
background-color:darkorange;
color:#fff;
padding:5px;
text-align:center;
cursor: pointer;
text-decoration: none;
	border-radius: 10px;
	margin:10px;
}

#petitbouton, #petitbouton a{

font-size:20px;
font-weight:bold;
background-color:darkorange;
color:#fff;
padding:5px;
text-align:center;
cursor: pointer;
text-decoration: none;
	border-radius: 5px;
	margin:10px;
}

.lasuite, #lasuite, #lasuite a {

font-weight:bold;
	font-style: italic;
	color: darkorange;
	text-align: right;
	float:right;
}

.survoljaune:hover
{
   background-color: #fad02c;
	
}

input[type="text"], input[type="email"], input[type="password"], input[type="file"], input[type="date"], input[type="tel"], input[type="number"], input[type="search"], textarea, select
{
	font-family: 'Roboto Condensed';
	font-size: 1.3rem;
	display:block;
	margin: 10px auto;
	padding: 10px;	
	border:1px solid #ccc;
	border-radius:7px;
	width:700px;
}

input[type="submit"], .submit, #submit
{	display:block;
	margin:10px auto;
	font-size: 1.3rem;
	padding:8px 20px ;
	border-radius: 50px;
	border:none;
	outline:none;
	background-color:orangered;
	cursor: pointer;
	color:#fff;
	
text-align: center;
}