/* CODE CSS FORMAT VIDEO */


.container-video {width: 90%; margin: auto;}




                    /* CODE CSS LOGOS ET PICTOGRAMMES  */

.logo
{
    position: absolute; 							/* dimensions et position du logo*/
    left: 5vw;
    top: 5vh; 
    max-width: 175px;
    max-height: auto;
}


.param-logo:hover
{
    margin:10px 0px 10px 55px;
	max-width: 40px;
	opacity:0.3;
}	


.colibri
{
    position: absolute; 							/* dimensions et position du logo*/
    right: 5vw;
    top: 5vh; 
    max-width: 100px;
    max-height: auto;
}




.petit-picto
{
    max-width: 100px;
    display: flex;
    margin: auto;    
}

.moyen-picto
{
    max-width: 250px;
    display: flex;
    margin: auto;    
}
.grand-picto
{
    max-width: 500px;
    display: flex;
    margin: auto;    
}


#Div-picto30deg
{transform: rotate(30deg);}

#Div-picto-30deg
{transform: rotate(-30deg);}


.picto-rs
{
    max-width: 50px;
    display: flex;
    margin: auto;    
}




                /* CODE CSS FORMAT IMAGE BLOC PRINCIPAL*/


.image-entete-bloc
{
	max-width:94%;
    height: auto;
	Margin:2% 3%;
	border:solid 1px green;
	padding: 2px
}

.image-horizontale-bloc
{
	max-width:90%;
    height: auto;
	Margin:5% 5%;
	border:solid 1px green;
	padding: 2px
}
		
.image-horizontale-bloc-red
{
	max-width:90%;
    height: auto;
	Margin:5% 5%;	
	border: solid 1px red;
	padding: 2px;							
}
		
.texte-image-horizontale-bloc
{
	max-width:90%;
    height: auto;
	Margin:auto;
	border:2px solid silver;
	background-color: #F0F0F0;
	padding:5px 10px 5px 10px;
	font-family: Arial; 
	font-size:1.3rem; 
	font-style: italic; 
	font-variant:; 
	font-weight:; 
	color:#000000;
	text-align: justify;
} 
	
.image-verticale-bloc
{
	max-width:80%;
	Margin:2% 10%;
	border:solid 1px green;
	padding: 2px
}
		
.image-verticale-bloc-red
{
	max-width:80%;
	Margin:2% 10%;	
	border: solid 1px red;
	padding: 2px;							
}
	
.texte-image-verticale-bloc
{
	max-width:80%;
	Margin:auto;
	border:2px solid silver;
	background-color: #F0F0F0;
	padding:5px 10px 5px 10px;
	font-family: Arial; 
	font-size:1.3rem; 
	font-style: italic; 
	font-variant:; 
	font-weight:; 
	color:#000000;
	text-align: justify;
} 
	
.img-float-gauche
{	
	float: left;
	margin-right:10px;
	border: solid 1px green;
	padding: 2px;	
}
		
.img-float-gauche-red
{	
	float: left;
	margin-right:10px;
	border: solid 2px red;
	padding: 2px;	
}


.img-center
{	
	float: left;
    margin: 0% 40%;
}


.img-float-droite
{		
	float: right;
	margin-left:10px;
	border: solid 2px green;
	padding: 2px;
}
	
.img-float-droite-red
{		
	float: right;
	margin-left:10px;
	border: solid 2px red;
	padding: 2px;
}

 
.titre-item-circulaire 
{
	text-align: Center;
	font-family:Arial;
    font-style: normal;
	font-size: 1.35rem;
	color:#333333;
} 		
	
.texte-item-ciculaire
{
	margin: 6%;
	font-family: Arial;    											
	font-style: normal;
	font-size:1.2rem;
	text-align:justify;
	color:#333333;																			
}	

.img-float-dr-item
{
    float: right;
	margin-left:5%;
    max-width:45%;
    height: auto;
    border: solid 1px green;
	padding: 0.5%;
}






					/* CODE CSS PHOTOS GALLERIE */	


	
.photo-galerie
{
	max-width: 90%;
	height: auto;
	border: solid 1px green;
    display: flex;
	padding:1%;
   	margin: auto;
}


.photo-galerie:hover 
{
	opacity: 0.5;
}

.photo-galerie-verticale
{
	max-width: 60%;
	height: auto;
	border: solid 1px green;
    display: flex;
	padding:1%;
   	margin: auto;
}

.photo-galerie-verticale:hover 
{
	opacity: 0.5;
}



figcaption 												/* Paramétrage balise figcaption */
{
	max-width: 90%;
	/*border: solid 1px green; */
	padding: 2px;
	Margin: auto;
	background-color: #F0F0F0;
    font-family: arial;  
	color: black;		  										
	font-size: 1.0rem;
    font-weight: bold;
	font-style: normal;
    text-align: center;
}
	
.galerie-texte-photo-horizontale														
{
	max-width: 150px;
	/*border: solid 1px green; */
	padding: 2px;
	Margin:6px 0px;
	background-color: #F0F0F0;
	color: black;
	font-family: Arial;     										
	font-size: 1.15rem;
	font-style: normal;
	text-align: justify;
}

.galerie-texte-photo-verticale
{           
	max-width: 67px;
	/*border: solid 1px green; */
	padding: 2px;
	Margin:6px 0px;
	background-color: #F0F0F0;
	color: black;
	font-family: Arial;     										
	font-size: 1.15rem;
	font-style: normal;
	text-align: justify;
}
  


					/* TYPE D'ANIMATION */

@keyframes astuces 														
{
    0% {background:#FFFFF0;} 
    33% {background:#FFFFF0;} 
    66% {background: #CCFFCC;}
	100% {background: #FFCCCC;}
   
}