
/* pour chargement ultérieur */

.encart {  
  font-family: Arial;  
  font-size: 14px;  
  color: green;  
  background-color: yellow;
}

.pied {  
  clear: both;  
  height: 85px;  
  padding-top: 5px;  
  padding-right: 5px;  
  padding-bottom: 5px;  
  padding-left: 5px;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: lightgray;
  text-align: center;  
}

.figsimple {  
  margin-left: 0; margin-right: 0;
  }
.figlarge {margin: 10px;}



.mois { margin-top: 5px; margin-right: 80px; margin-bottom: 5px; margin-left: 50px;}
ul.jours, ul.semaine { font-family : 'Courier-new', monospace; font-size: 0.9em;list-style-type : none; margin : 12px 0px 12px 0; cursor:help}
ul.jours li span { background-color : #006666; border : 1px solid #000; cursor : help; color : #fff; padding : 5px; }
ul.semaine li span.libre    { color : #3C3555; background-color : #EFF5F1; border : 1px solid #999; padding : 1px; }
ul.semaine li span.occuper  { color : #3C3555; background-color : #FCD5B4; border : 1px solid #999; padding : 1px; }
ul.semaine li span.sansdate { color : #fff; background-color : #fff;    border : 1px solid #999; padding : 1px; }
div.calendrier { font-size : 1em; letter-spacing : 0.001em;}

.tableprix {text-align: center; border-collapse: collapse; vertical-align: middle; border-style: none; width: 100%;
            table-layout: fixed;
}

.tdprix {border: 1px solid black; vertical-align: center;}

/* format liste de matériel fourni*/
.tableliste {text-align: left; border-collapse: collapse; vertical-align: top; border-style: none; width: 100%;
            table-layout: auto;
}
.tdliste {border: none; vertical-align: top;}
.introliste {text-align: left;}

/* ZOOM IMAGE */

.twAudessus {
/* La trame de fond */
width: 100%;
height: 100%;
position: fixed;
z-index: 100000; top: 0; left: 0; display: none; background-color: ivory; }

.twAudessus a {
/* Pour centrer l’image */ 
display: table-cell; vertical-align: middle; text-align: center; } 

.twAudessus img {
/* Le contour de l’image */
 max-width:1200px; padding: 5px; background: #ffffff; }

/* Sélecteur « target pour afficher l’image » */
.twAudessus:target { display: table; }

@media screen and (max-width: 1600px){.twAudessus img { max-width:1000px; }}
@media screen and (max-width: 1024px){.twAudessus img { max-width:700px; }}
@media screen and (max-width: 800px){.twAudessus img { max-width:500px; }}
@media screen and (max-width: 600px){.twAudessus img { max-width:400px; }}
@media screen and (max-width: 500px){.twAudessus img { max-width:350px; }}


.texte-illustration {
   overflow: visible; /* empêche le dépassement des flottants */
  
  
}
.texte-illustration .illus-gauche {
    float: left;
    margin: 5px 20px 5px 0;
}
.texte-illustration .illus-droite {
    float: right;
    margin: 5px 0 5px 20px;
}
.texte-illustration p {
    overflow: visible; /* Contexte de formatage. Force le paragraphe à
    adapter sa largeur aux flottants adjacents. */
  
}

#carrousel{
    position:relative;
    height:667px;    /*480*/
    width:890px;     /*640*/
	margin:auto;
    margin-top:2em;
    margin-bottom:1em;
	border-style:solid;
	border-width: 3px;
	border-color:dimgray;
		
}


#carrousel ul li{
    position:absolute;
    top:0;
    left:0;
	
}

#carrousel li
{
list-style: none;
}

.controls {
  position : relative;
  top : 50%;			/*boutons Précédent et Suivant au milieu de la hauteur de l'image */
}


.prev:before {				/* bouton "Précédent" */
     content:"";
     position:absolute;left:-40px;top:0;
	 cursor:pointer;
     
     /* taille */  
     height:0;width:0; 
     
     /* les bordures */
     border-right:36px solid #2C273F;   /* gris foncé*/
     border-bottom:15px solid transparent;
     border-top:15px solid transparent;
     }
	 
.next:after {				/* bouton "Suivant" */
     content:"";
     position:absolute;right:-40px;top:0;
	 cursor:pointer;
     
     /* taille */  
     height:0;width:0; 
     
     /* les bordures */
     border-left:36px solid #2C273F;   /* gris foncé*/
     border-bottom:15px solid transparent;
     border-top:15px solid transparent;
     }	


/* pour adapter la taille du carrousel à la taille de l'écran */
@media screen and (max-width: 1950px){#carrousel  { max-width:870px; max-height:580px;}}
@media screen and (max-width: 1024px){#carrousel  { max-width:700px; max-height:466px;}}
@media screen and (max-width: 800px){#carrousel  { max-width:500px;  max-height:333px;}}
@media screen and (max-width: 600px){#carrousel  { max-width:400px;  max-height:266px;}}
@media screen and (max-width: 500px){#carrousel  { max-width:340px;  max-height:226px;} .prev:before{left:0px;} .next:after{right:0px;}}

	 

]