/* flipbook */
.cover{
	background:grey;
	text-align:center;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
.legende_image{
	background:grey;
	padding-left: 10px;
}


/*
#titrepage {
width: 85%;
float: right;
}
*/
/*
#nom-site-spip {
width: 100%;
}
*/

#titrepage {
	float: center;
	width: 90%;
}

#nom-site-spip {
	float: center;
	width: 100%;
	font-style: italic;
	font-weight: bold;
	padding-top: 5px;
}
#slogan-site-spip {
	float: right;
	width: 600px;
	font-style: italic;
	padding-top: 10px;
	padding-right: 150px;
}

#auteur-article, .auteur-articles-rubrique, .date-auteur-cadre {
display: none;
}

#documents_portfolio td {
	width: 480px;
}

/*
table.spip td {
vertical-align: middle ;
}
*/

/* Pour faire des tableaux invisibles */
#tableau-invisible table.spip,
#tableau-invisible table.spip thead,
#tableau-invisible table.spip tfoot,
#tableau-invisible table.spip tbody,
#tableau-invisible table.spip tr,
#tableau-invisible table.spip th,
#tableau-invisible table.spip td
{
     border-color: transparent;
     background-color: transparent;
}

/* Pour faire un tableau variable */
#tableau-variable table.spip,
#tableau-variable table.spip thead,
#tableau-variable table.spip tfoot,
#tableau-variable table.spip tbody,
#tableau-variable table.spip tr,
#tableau-variable table.spip th,
#tableau-variable table.spip td
     th:first-child {
width: 15%;
}

.article88 th:first-child {
width: 15%;
}

#tableau_viroles_f
    th:first-child {
width: 7%;
}

#tableau_viroles_a
    th:first-child {
width: 7%;
}

#tableau_traits_6
    th:first-child {
width: 8%;
}

#tableau_traits_6_a
    th:first-child {
width: 8%;
}

#tableau_traits_3
    th:first-child {
width: 8%;
}

#tableau_reperes_6
    th:first-child {
width: 6%;
}

#tableau_reperes_6_a
    th:first-child {
width: 6%;
}

#tableau_tarifs_internat
    td:first-child {
width: 8%;
}

<!-- img[usemap] {
height: auto;
max-width: 100%;
width: auto;
} -->

.conteneur{    display: flex;    
	       justify-content: space-around;		
	       align-items: baseline;
}

/* apparition image au survol */ 

.survolimage{ 
           color:#4c0ed8; 
                 
            } 
.survolimage:hover, .survolimage:focus{
            color:#555;
            }
            
/* Position et couleur bulle */
.survolimage span{ 
                position:absolute;
                margin-top:-160px; 
                margin-left:20px;
                color:#fff; 
                background:transparent; 
                padding:0px; 
                border-radius:8px; 
                
                /* Faire disparaire infobulle par défaut */
                /* On determine l'origine de la rotation */ 
                transform:scale(0) rotate(-180deg);
                /* Faire durer l'effet */
                transition:all .50s;
                /* Effet sur la transparence */ 
                opacity:0;
            }
            
/* Apparition de la bulle avec le scale à 1 */ 
.survolimage:hover span, .survolimage:focus span{ 
                transform:scale(1) rotate(0);
                /* Effet sur la transparence */ 
                opacity:1;
            } 
          
/* création infobulle */ 
 
 /* Règle de base pour le lien */ 
.infobulle{ 
                color:#4c0ed8; 
		font-weight:bold;
                 
            } 
.infobulle:hover, .infobulle:focus{
                color:#FF0000;
            }
            
            /* Position et couleur bulle */
.infobulle span{ 
                position:absolute;
                text-align:center;
                margin-top:-140px; 
                margin-left:0px;
                color:green; 
                background:rgba(255, 255, 255, 0.99); 
                padding:10px; 
                border-radius:10px; 
                border:2px solid green;
                
                /* Faire disparaire infobulle par défaut */
                /* On determine l'origine de la rotation */ 
                transform:scale(0) rotate(-180deg);
                /* Faire durer l'effet */
                transition:all .5s;
                /* Effet sur la transparence */ 
                opacity:0;
            }

            
            /* Apparition de la bulle avec le scale à 1 */ 
.infobulle:hover span, .infobulle:focus span{ 
                transform:scale(1) rotate(0);
                /* Effet sur la transparence */ 
                opacity:1;
            }

/* création infoboule */ 
 
 /* Règle de base pour le lien */ 
.infoboule{ 
                color:#4c0ed8; 
		font-weight:bold;
                 
            } 
.infoboule:hover, .infoboule:focus{
                color:#FF0000;
            }
            
            /* Position et couleur boule */
.infoboule span{ 
                position:absolute;
                text-align:center;
                margin-top:-60px; 
                margin-left:0px;
                color:green; 
                background:rgba(255, 255, 255, 0.98); 
                padding:10px; 
                border-radius:5px; 
                border:2px solid green;
                
                /* Faire disparaire infoboule par défaut */
                /* On determine l'origine de la rotation */ 
                transform:scale(0) rotate(-180deg);
                /* Faire durer l'effet */
                transition:all .5s;
                /* Effet sur la transparence */ 
                opacity:0;
            }

            
            /* Apparition de la boule avec le scale à 1 */ 
.infoboule:hover span, .infoboule:focus span{ 
                transform:scale(1) rotate(0);
                /* Effet sur la transparence */ 
                opacity:1;
            }

.map-container {
	background-size: cover;
	position: relative;
	}

.map-container canvas { position: absolute; }

.map-container img {
	opacity: 0;
	position: absolute;
	}

abbr
{
        border-bottom: 1px dotted #666;
        cursor: help;
}

.info-bulle
{
	position:absolute;
	background-color:yellow;
	border: 1px solid #aaaaca;
	font-size: smaller;
	padding:4px;
	width: 160px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);	
}

#tooltip {
	position: absolute;
	z-index: 3000;
	border: 2px solid green;
	background-color: rgba(255, 255, 255, 0.99);
	border-radius:10px;
	padding: 15px;
	opacity: 0.85;
}
#tooltip h4, #tooltip div, #tooltip p{ margin: 0; }
#tooltip h4, #tooltip div, #tooltip p{ text-align:left; }
#tooltip h4 { font-size: 1.40em; font-weight: bold; }

p.spip {
    text-indent: 60px;
}

img {
  max-width: 100%;
  height: auto;
}

#texte-article .aide,

#texte-article .important,

#texte-article .avertissement,

#texte-article .info,

.spip_cadre, .coloration_code {

	display: inline-block;

	background-position: 20px 50%;

	background-repeat: no-repeat;

	border: none;

	border-radius: 20px;

	margin: 0 2em 2em 2em;

	min-height: 40px;

	padding: 15px 20px 15px 80px;

	text-align: left;

	vertical-align: middle;

	width: 50%;

	box-shadow: 10px 10px 5px #888888;

    color: black;

}

/*titre_num*/
body{counter-reset: h3;}
h3 {
	counter-reset: h4;
}
h4 {
	counter-reset: h5;
}
h5 {
	counter-reset: h6;
}
h3:before {
  content: counter(h3) ".  ";
  counter-increment: h3;
}
h4:before {
  content: counter(h3) "." counter(h4) ".  ";
  counter-increment: h4;
}
h5:before {
  content: counter(h3) "." counter(h4) "." counter(h5) ".  ";
  counter-increment: h5;
}
h6:before {
  content: counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ".  ";
  counter-increment: h6;
}