@charset "utf-8";
/* CSS Document */
html, body {
	height: 100%;
	margin: 0; padding: 0;
}
body {
	background-color:#f5f0e7;/*= RGB 245, 240, 231*/
	color: #79706F; /*#79706F;*/
	position: relative;
	display : table;
	width: 100%;
	}
.ssfond{
	background-color:#0000;
}
#header  {
	width:100%;
	height:105px;
	text-align: center;
	margin-left: auto;
    margin-right: auto;
	top:0px;
	position:fixed;
	z-index:900;
	overflow: hidden;
	background-color:#fffffff0;/*#f4ece3f0;#c2b8b6; #343333cc ;*/
	}
.medaillonHeader img {
	position:fixed;
	top:-10px;
	right: 10px;
	width: auto;
	height: 115px;
}
.medaillonInverseHeader img {
	position:fixed;
	top:-2px;
	left: 10px;
	width: auto;
	height: 110px;
}
@media (max-width: 900px) {
	#header{height:50px;}
	.medaillonInverseHeader img {
	position:fixed;
	top:2px;
	right: 9px;
	left: auto;
	height: 50px;
}
}
#positionMenu{
	top: 75px;
	width:100%;
	text-align:center;
	position:fixed;
	z-index:900}
@media (max-width: 900px) {
	#positionMenu{display:none;}
}
#positionMenuAdmin{
	top: 0px;
	width:98%;
	text-align:center;
	position:absolute;
	z-index:900}
@media (max-width: 900px) {
	#positionMenuAdmin{display:none;}
}
#menuHeader, #menuHeader ul{
padding:0;
margin:0;
list-style:none;
text-align:center;
}
#menuHeader li{
display:inline-block;
position:relative;
/*border-radius:8px 0 8px 0;*/
/*margin-bottom: 3px;*/
}
#menuHeader ul li{
display:inherit;
/*border-radius:0;*/
}
/*#menuHeader ul li:hover{border-radius:0;}*/
/*#menuHeader ul li:last-child{border-radius:0 0 8px 0;}*/
#menuHeader ul{
position:absolute;
z-index: 1000;
max-height:0;
left: 0;
right: 0;
overflow:hidden;
-moz-transition: .8s all .2s;
-webkit-transition: .8s all .2s;
transition: .8s all .2s;
}
#menuHeader li:hover ul{
max-height:15em;
}
#menuHeader li{
background: rgba(254, 254, 254,1);
/*background:rgba(86, 86, 86, 1);
	background-image: -webkit-linear-gradient(top, rgba(66, 66, 66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);
background-image: linear-gradient(to bottom, rgba(66, 66, 66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);
border: 1px solid rgba(175, 175, 175, 0.8);*/
}
#menuHeader li:li{
background: rgba(254, 254, 254,1);
/*background:rgba(86, 86, 86, 1);
	background-image: -webkit-linear-gradient(top, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);
background-image: linear-gradient(to bottom, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);*/
}
/*#menuHeader li:hover{border-radius:8px 0 0 0;}*/
#menuHeader li:hover {
background: rgba(254, 254, 254,1);
/*background-image: -webkit-linear-gradient(top, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);
background-image: linear-gradient(to bottom, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);*/	
}
 #menuHeader li li:hover{
background: rgba(245, 240, 231,1);
/*background-image: -webkit-linear-gradient(top, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);
background-image: linear-gradient(to bottom, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);*/	
}
#menuHeader a{
text-decoration:none;
display:block;
/*padding:2px 10px;espace autour du texte de bloque onglet*/
width: 180px;
color:black;/*#0166ff;#ff6600;
font-family:"Merienda";*/
font-style: italic;
font-size: 18px;
/*font-weight: bold;*/
}
#menuHeader ul a{
/*padding:8px 0; taille des bloque  du sous menu*/
}
#menuHeader li:hover li a{
color:darkslategray;/*antiquewhite;#0166ff;#ff6600;*/
text-transform:inherit;
}
#menuHeader li:hover a, #menuHeader li li:hover a{
color:darkslategray;/*antiquewhite#ff6600;#000;*/
font-size: 19px;
}
#menuHeader li.PageActuel {
	background: rgba(254, 254, 254,0);
	/*background:rgba(86, 86, 86, 1);
	background-image: -webkit-linear-gradient(top, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);
	background-image: linear-gradient(to bottom, rgba(66,66,66, 0.6) 80%, rgba(191, 181, 180, 1) 100%);*/
}
#menuHeader li.PageActuel a {
	color: darkslategray;/*antiquewhite*/
	font-size: 18px;
}
#MenuMobile , #MenuMobileClose{ display:none}
@media (max-width: 900px) {
#MenuMobile, #MenuMobileClose{
	top:5px;
	display:block;
	margin:0;
	position:fixed;
	z-index:990;
	width:50px;
	height:50px;
	}	
#menuHeaderMobile, #menuHeaderMobile ul{
padding:0;
margin:0;
list-style:none;/*on enleve les puces*/
text-align:left;
}
#menuHeaderMobile li{
display:inline-block;
position:relative;
border-radius:5px 5px 0 0;
}
#menuHeaderMobile ul li{
display:inherit;
}
#menuHeaderMobile ul li:first-child{
border-radius:0 5px 0 0;
}
/*#menuHeaderMobile ul li:hover{
border-radius:0 5px 0 0;
}*/
#menuHeaderMobile ul li:last-child{
border-radius:0 0 5px 5px;
}
#menuHeaderMobile ul{
position:absolute;
z-index: 1000;
max-height:0;
left: 0;
right: 0;
overflow:hidden;
-moz-transition: .8s all .2s;
-webkit-transition: .8s all .2s;
transition: .8s all .2s;
}
#MenuMobileClose ul:hover:target #MenuMobile ul {
	position:absolute;
z-index: 1000;
max-height:0;
left: 0;
right: 0;
overflow:hidden;
-moz-transition: .8s all .2s;
-webkit-transition: .8s all .2s;
transition: .8s all .2s;}
/*Pour la hauteur des sous-menus augmente le max-height ici*/
#menuHeaderMobile li:hover ul{
max-height:40em;
}
/* background des liens menus :first-child*/
#menuHeaderMobile li ul{
	background-color: rgba(86, 86, 86, 0.90);/*gris*/
	/*background:rgba(255, 102, 1, 0.75);/*orange*/
	width: 20em;
}
/*#menuHeaderMobile li ul:first-child{
border-radius:0 5px 0 0;
}
#menuHeaderMobile li ul:last-child{
border-radius:0 0 5px 5px;
}*/
/* background des liens sous menus first-child*/
#menuHeaderMobile li:li{
background:rgba(86, 86, 86, 0.90);/*gris*/
}
/* background des liens menus et sous menus au survol #menuHeader li:first-child:hover, #menuHeader li:first-child li:hover*/
#menuHeaderMobile li:hover{
background:rgba(86, 86, 86, 0.95);/*gris*/
}
#menuHeaderMobile li li:hover{
background:rgba(86, 86, 86, 0.95);/*gris*/
}
/* les a href 
la largeur des onglets est définie par le padding*/
#menuHeaderMobile a{
text-decoration:none;
display:block;
padding:8px 32px;
color:white;/*#0166ff;*/
font-family:Arial, sans-serif,"Berlin Sans FB", Tahoma, ;
font-size:20px;
}
#menuHeaderMobile ul a{
padding:8px 0;
}
#menuHeaderMobile li:hover li a{
color:white;/*#0166ff;*/
text-transform:inherit;
padding-left: 20px;
}
#menuHeaderMobile li:hover a, #menuHeaderMobile li li:hover a{
color:#000;/*#000;*/
}
#menuHeaderMobile .PageActuel {
	background:rgba(86, 86, 86, 1);/*gris*/
}
}
#bouton-paypal{
	width: 100px;
	margin: auto;
	
}
/*!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
.red{color: red;}
.black{color: black;}
.fond-photo{
	position: fixed;
	top:100px;
	width: 100%;
    margin: auto;
	/*display:inline-block; */
	vertical-align:top; 
}
.fond-photoCarou{
	position: fixed;
	width: 100%;
    margin: auto;
	/*display:inline-block; */
	vertical-align:top; 
	text-align: center;
}
@media(max-width:570px){
	.fond-photoCarou{ margin-top: 55px;}
}
.fond-photoIndex{
	width: 98%;
    margin: auto;
	height:550px;
	display:inline-block; 
	vertical-align:top; 
}
.fond-photoService{
	width: 75%;
    margin-top: 120px;
	margin-left: 12%;
    position: fixed;
    z-index: 100;
}
.fond-photoService2{
	display: block;
    position: relative;
}
.fond-photoService img, .fond-photoService2 img{
	width: 33%;
	height: auto;
}
@media(max-width:570px){
	.fond-photoService2{display:block;}
	.fond-photoService2 img{width: 32%;}
}
@media(max-width:900px){
	.fond-photo{top : 50px;}
	
	.fond-photoIndex{height:300px;}
	.fond-photoService {
		margin-top: 60px;
		margin-left: 2%;
		width: 95%
	}
	.fond-photoService img{width: 32%;}
	}

.photo-ch{
	width: 400px;
	height:240px;
	display:inline-block; 
	vertical-align:top;
	transition: transform .1s;
}
@media(max-width:500px){
	.photo-ch{width: 333px;height:200px;}
}
.fond-aVoir{
	position: relative;
	top: 100px;
	width: 80%;
	/*display:inline-block; */
	vertical-align:top;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
}
.photo-carte{
	width: 500px;
	display:inline-block;
	transition: transform .1s;
	z-index:901
}
.photo-ch:hover{
-ms-transform: scale(1.08); /* IE 9 */
-webkit-transform: scale(1.08); /* Safari 3-8 */
transform: scale(1.08);
}
.photo-carte:hover{
-ms-transform: scale(1.6); /* IE 9 */
-webkit-transform: scale(1.6); /* Safari 3-8 */
transform: scale(1.6);
}
.photo-carte img,.photo-ch img,.fond-photo img,.fond-aVoir img, .fond-photoIndex img{ 
	height: 100%; 
	width: 100%;
}
@media(max-width:750px){	
.fond-aVoir {
	width: 90%;
	top: 80px;
	margin-left: auto;
}
}
.fond-photo.withheight img{ height: auto; }

 .cover img{
	object-fit: cover;
}
#container {
	text-align: center;
	width: 100%;
	max-width: 1550px;
	margin-top: 110px;
	margin-left: auto;
	margin-right: auto;
}
#containerLivre {
	text-align: center;
	width: 100%;
	max-width: 1550px;
	margin-top: 110px;
	margin-left: auto;
	margin-right: auto;
}
@media(max-width:900px){
	#containerLivre {
		margin-top: 60px;
	}
}
#containerService {
	background-image: url("../images/logo/Background.png");
	background-repeat:no-repeat;
	background-position: center;
	background-color: #f5f0e7;
	text-align: center;
	width: 80%;
	max-width: 1300px;
	margin-top: 120px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	z-index: 10;
}
#containerOK {
	text-align: center;
	width: 98%;
	margin-top: 180px;
	margin-left: auto;
	margin-right: auto;
}
#containerInfo {
	width: 98%;
	margin: 5px;
}
#containerWeek {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  padding: 20px;
  perspective: 1000px;
  text-align: center;
  height:auto;
  max-height: 700px;
  margin: 10px;
  box-sizing: border-box;
  overflow: hidden;
}
@media (max-width: 900px){
	#containerWeek{
		padding: 0px;
		margin: 0px;
		max-height: 1000px;
	}
	/*#containerWeek .float-content{display: none}*/
}
.contactW{
	border-radius: 10px;
	background: linear-gradient(#f5f0e7,#f1cbd2);
	text-align: center;
	padding: 10px;
	margin: 10px 20px;
}
@media (max-width: 900px){
	.contactW{
	padding: 1px;
	margin: 10px 2px;
}
}
.colone2{
	column-count: 2;
	column-width: 8em;
	column-gap: 5px;
	border-radius: 10px;
	background: linear-gradient(#f5f0e7,#f1cbd2);
	padding: 20px;
	margin: 50px;
}
#container3block {
	background-image: url("../images/logo/Background.png");
	background-repeat:no-repeat;
	background-position: center;
	text-align: center;
	width: 100%;
	max-width: 1550px;
	margin-top: 120px;
	margin-left: auto;
	margin-right: auto;
}
#positionResa{
	width: 100%;
	top:120px;
	text-align: center;
	position: fixed;
	z-index: 500;
}
#containerResa{
	background-color:rgba(0, 0, 0, 0.7); /* rgba(86, 86, 86, 1) #f5f0e7;*/
	Display : inline-block;
	padding: 10px;
	width: 520px;
	border-radius: 20px;
	text-align: center;
}
#input{
	position: relative;
	bottom: 50px;
	z-index: 100;
}
#containerResa img{
	width: 4%;
	height: auto;
}
#containerResa input{
	background-color: white;
    border-radius: 10px;
	font-size: 15px
}
#containerRech {
	background-image: url("../images/logo/Background.png");
	background-repeat:no-repeat;
	background-position: center;
	background-color: #f5f0e7;
	text-align: center;
	width: 75%;
	margin-top: 30%;
	margin-left: auto;
	margin-right: auto;
	padding-top: 10px;
	padding-bottom: 50px;
	/*top: 70%;*/
	position: relative;
	z-index: 10;
}
#containerIndex {
	background-image: url("../images/logo/Background.png");
	background-repeat:no-repeat;
	background-position: center;
	background-color: #f5f0e7;
	text-align: center;
	width: 80%;
	max-width: 1300px;
	margin-top: 30%;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
	position: relative;
	z-index: 10;
}
.container_colone {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  padding: 20px;
  perspective: 1000px;
}
.colone {
  width: 45%;
  margin: 10px;
  box-sizing: border-box;
  /* text-decoration: none;
  color: inherit;
 transition: transform 0.3s;
  border-radius: 10px;
  overflow: hidden;
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);*/
}
.colone img{ max-width: 500px }
@media(max-width:900px){
	.colone{width: 80%;}
	.colone img{ max-width: 250px }
}
.logo_agre {
	margin-top: 10%;
	right: 10%;
	padding: 10px;
	position: fixed;
	z-index: 10;
}
 .logo_agre img {
	width:auto;
	height:60px;
}

@media(max-width:900px){
	#containerIndex {
		margin-top: 340px;
		margin-left: 5%;
		width: 85%;
}
	#containerRech {
		width: 90%;
		margin-left: 5%;
		margin-top: 50%;
	}
	#container {margin-top: 80px;}
	#positionResa{top:125px;z-index: 980;}
	#containerResa{
		padding: 5px;
		width: 320px;
	}
	#containerResa input  {
    width: 70px;
    /*font-size: 12px;*/
	}
	#containerResa input[type=number] { width: 30px;}
	#containerResa img {width: 3%;}
	#container3block{margin-top:30px; }
	#containerService {margin-top: 30px;}
	.logo_agre {
	margin-top: 12%;
	right: 0px;
}
	.logo_agre img {height:30px;}
}
#containerAdmin {
	font-family:  Arial, sans-serif,"Berlin Sans FB", Tahoma;
	font-size: 17px;
	font-style: normal;
	text-align: center;
	width: 100%;
	padding-top: 45px;
}
.containerAgenda{
	width: 75%;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	
}
#avoirTel{display: none;}
#avoirTel a{
	text-decoration: none;
	color: black;
}
@media(max-width:580px){
	#avoirTel{
	display: block;
	font-family: "Merienda";
	font-size: 13px;
	padding-left: 30px;
	}	
}
#MenPaCarousel{
		width:95%;
	margin-left: auto;
    margin-right: auto;
	margin-top:4px;
	padding: 1px 1px 1px 5px;
	overflow: hidden;
	}
#MenPaCarouselLivre{
	background-image: url("../images/photos_site/livre.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	width:99%;
	margin-left: auto;
    margin-right: auto;
	margin-top:4px;
	padding: 1px 1px 1px 5px;
	overflow: hidden;
	}
@media(max-width:900px){
	#MenPaCarouselLivre{
	background-image: url("../images/photos_site/livreSmall.png");
	margin-top:-48px;
	height: 800px;
	}
}
#bandeau{
	text-align: center;
	width: 90%;
	padding: 1px 3px;
	font-size:20px;
	padding-top: 50px;
	 }
#image_index{
position:absolute;
	width:30%;
	top:110px;
	right: 15px;
}
#image_index img{
	width:100%;
	height: auto;
}

@media(max-width:750px){
	img.fixe {
	top: 55px;
	}	
}
.centreObjet{
	display: inline-block;
}
.brush{
	font-family: "monsieur-la-doulaise",baskerville ;
}
.miniImg{
	max-width: 100px;
	max-height: 100px;
	text-align: center;
}
.apresImg{
    position: sticky;
    left: 125px;
}
label{
	display: block;
	font-size: 14px;
	line-height: 1.5em;
}
input{
	background: #cfc8c0;/*#bfbcf4;*/
	width: 400px;
	border: none;
	color: black;	
}
input.hasDatepicker {width: 150px}
#MenPaCarousel input{width: 100px}
#affiche input{width: 150px}
.texteDroit input, .texteDroit select, .texteDroit textarea{width: 400px;}
@media(max-width:500px){
	.texteDroit input, .texteDroit select, .texteDroit textarea{width: 250px;}
}
::placeholder {color: #00000080;}

input[type=button], input[type=submit] {
	width: auto;
	border-radius: 10px;
	padding: 5px;
}
input[type=button].virement {
	height: 40px;
	width: 150px;
	margin-left: 50px;
	margin-bottom: 15px;
	border-radius: 20px;
	font-size: 14px;
	font-weight:bold;
	color:white;
	background-color: darkred;
}
input[type=number] {
	width: 40px;
	background: #cfc8c0;
}
input[type=checkbox] {
	width: 40px;
	background: #cfc8c0;
}
select{
	background: #cfc8c0;
	width: 400px;
	border: none;
	color: black;
}
textarea{
	background: #cfc8c0;
	border: none;
	color: black;
	width: 400px;
}
@media (max-width: 500px){
	input,select,textarea{width: 250px}
}
.hp {

    display: none;

}
#bandeaucentre{
	margin: 8px auto;/*  la marge droite peut être indiquée en ems ou en pixels. Elle crée l'espace dans la partie inférieure du côté droit de la page. */
	padding: 0 2px; /* ce remplissage permet de créer un espace vide à l'intérieur du cadre. */
	}
.texteGauche {

    display: block;

	float: left;

	width:35%;
	text-align: right;
    margin-top: auto;

	margin-bottom:inherit;}
.texteDroit {

    display: block;

	float: right;

	width:65%;

    margin-top: auto;

	margin-bottom:inherit;}
@media(max-width:750px){
	.texteDroit {
		display: block;
		width:100%;
		text-align: center;
	}
	.texteGauche {
		display: block;
		width:100%;
		text-align: center;
	}
}
.image-align-left-height{
  float : left;
}
img.image-align-left-height{width: 30% ; height:auto; padding-right: 10px; }
.image-align-left-width, .image-left-width, .image-left{
  float : left;
}
img.image-left{ padding-right: 10px;}
img.image-right{ padding-left: 10px;}
img.image-left-width{width: 30% ; height:auto; padding-right: 10px;}
img.image-right-width{width: 30% ; height:auto; padding-left: 10px;}
img.image-align-left-width{width: 40% ; height:auto; padding-right: 10px;}
img.image-align-right-width{width: 40% ; height:auto; padding-left: 10px;}
.image-align-right, .image-align-right-width, .image-right-width, .image-right{
  float : right;
}
.image-align, .image-align-width, .image-width,.image-align-height {
    float : none ;
	width: 40% ;
	height:auto;
}
@media(max-width:900px){
	img.image-align-left-height{width: 50% ; height:auto; padding-right: 10px; }
	img.image-align-left-width, img.image-left-width{width: 50% ; height:auto; padding-right: 10px;}
	img.image-align-right-width, img.image-right-width, img.image-align-right{width: 50% ; height:auto; padding-left: 10px;}
}
/* A mettre sur le parent pour éviter tout débordement de l'effet float */
.float-content:before,.float-content:after{
	content:""; 
	display:block; 
	clear:both;
}

table { width: 100%;}
/*-----------------------------------*/
#pied{
	margin-left: auto;
    margin-right: auto;
	margin-top:4px;
	/*font-family: "Berlin Sans FB", Tahoma, Arial, sans-serif;
	background-color: #FFFFFF;#FFF000jaune
	border: 5px solid #ff6600;/*orange   #0166ff;bleu
	box-shadow: 3px 3px 10px #656565;*/
	text-align: center;
	width: 90%;
	padding: 1px 3px;
	font-size:20px;
	display : table-row;
	height: 60px;
	 }
@media (max-width: 900px) {#pied{height: 30px}}
#piedpage {
	 position: absolute;
  bottom: 0;
  width: 100%;
	font-family:  Arial, Helvetica, sans-serif, Tahoma,"Berlin Sans FB";
	font-size: small;
	font-style: normal;
	color: #7B6A66;
	text-align: center;
	/*background-color:#c2b8b6; #001370;*/
	}
@media (max-width: 900px) {
	#piedpage{display:none}
}
.lien {
	color: #7B6A66;
	text-decoration: none;}
.piedpagepetit {font-size: x-small;}
.reseauS {
	font-size: small;
	font-family:"Merienda"; 
	position: absolute;
	right : 10px;
	bottom : 10px;
	text-align: right;
	z-index: 900;
	
}
@media (max-width: 900px) {.reseauS{right: 35px}}
.clearfloat { /* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */
	clear:right;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
#scrollUp
{
position: fixed;
bottom : 10px;
right: -120px;
opacity: 0.9;
z-index: 1000;
}
@media (max-width: 500px){
	#scrollUp img { 
		width: 30px;
		height: auto;
	}
}
/* Texte défilant */
.messagedefilant {
  display: block;
  position:absolute;
   width: 80%;
  max-width: 100%;
  margin-left: 10%;
  height: 25px;
  top:50px;
    font-size: 17px;
  color: black; /*#ff6600;orange*/
  	font-family: poppins ;
	font-style: normal;
	font-variant: normal;
  white-space: nowrap;
  overflow-X: hidden; /*empeche le scroll horizontal*/
  z-index: 1000;
}
@media (max-width: 900px) {
	.messagedefilant {top:30px;}
}
.messagedefilant div {
  position: absolute;
  min-width: 100%; /* au minimum la largeur du conteneur */
}
.messagedefilant div span, 
.messagedefilant div:after {
  position: relative;
  display: inline-block;
  top:0;
}
.messagedefilant div span {
  animation: defilement 30s infinite linear;
}
.messagedefilant div:after {
  position: absolute;
  top:0; left:0;
  content:attr(data-text);
  animation: defilement2 30s infinite linear;
}
 
@keyframes defilement {
  0% { margin-left: 0; }
  100% { margin-left: -100%; }
}
@keyframes defilement2 {
  0% { margin-left: 100%; }
  100% { margin-left: 0%; }
}
#map {
      height: 250px;
		width: 100%;
    }
a.infoT{
	position: relative;
	text-decoration: none;
	margin: 20px;
	/*display: block;*/
}

a.infoT span {
	display: none; /* on masque l'infobulle */
	color: black;
}
a.infoT:hover {
	background: none; /* correction d'un bug IE */
	z-index: 1001; /* on définit une valeur pour l'ordre d'affichage */
} 

a.infoT:hover span  {
	display: inline; /* on affiche l'infobulle*/
	position: absolute; 
	white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
	/*top: 45px;  on positionne notre infobulle */
	left: 40%;
	text-align: left;
	color:white;
	font-family: Arial, sans-serif,"Berlin Sans FB", Tahoma, ;
	background: #666;
	padding: 3px;
	border: 1px solid #ff6600;
	border-radius: 5px  ;
	box-shadow: 3px 3px 10px #656565;
	z-index:1001
}
@media (max-width: 900px) {a.infoT:hover span  {top: 20px;}}
