/*
 body {
      font-family: monospace;
      font-size: 22px;
      background-color: whitesmoke;
      -webkit-transition: background-color 400ms ease;
      transition: background-color 400ms ease;
    }

*/	
	
	
#mainV{
margin: auto;
text-align: center;	
}


/*
#mainV img{
	border-radius: 50%;
	border: 25px solid green;
	opacity: 0.2;
	width: 100px;
	transition-property: border-radius, opacity, width, border;
	transition-duration: 1s;	
}
*/

#mainV .imgVidOff{
	border-radius: 50%;
	border: 2px solid green;
	opacity: 0.2;
	width: 20px;
	transition-property: border-radius, opacity, width, border;
	transition-duration: 0.5s;	
}

/*
#mainV img:hover{
	border-radius: 5%;
	opacity: 1;
	width: 400px;
	border: 10px solid Rgba(63, 107, 149, 0.8);  
}

*/

#mainV .imgVidOn{
	border-radius: 5%;
	opacity: 1;
	width: 400px;
	border: 10px solid Rgba(63, 107, 149, 0.8);  /* Bleu */	
}
	
#mainV .imgVidOnActionPort{
	border-radius: 5%;
	opacity: 1;
	width: 400px;
	/* border: 10px solid red;  */
	animation-name: bordCli;
	animation-duration: 0.5s;
	animation-iteration-count: 15;
}

@keyframes bordCli{
	from{border: 10px solid Rgba(63, 107, 149, 0.8);} 
	50%{border: 15px solid Rgba(255, 165, 0, 0.8);}
	to{border: 20px solid Rgba(255, 0, 0, 0.8);}
}



/* Partie Reconnainssance vocale */		
	
	#monMain{
		/*background-color: rgba(255, 255, 255, 0.6);*/
		background-color: rgba(255, 255, 255, 0.6);
		padding: 0px;
		height: 20%;
		text-align: center;
		font-size: 3em;
	}
	
	.flexi{
		
		
		display: flex;
		flex-direction: row;
		justify-content: center;
	}
	
	.mic{
		align-self: center;
		width: 100px;
		height: 100px;
		/*border: 0px solid transparent;*/
		border-width: 0px;
		border-style: solid;
		border-color: transparent;
		border-radius: 50%;
		/*background-color: whitesmoke;*/
		background-color: yellow;
		transition: border-width 0.5s ease 0s, border-color 0.5s ease 0s;*/
		/*transition-property: border-width;
		transition-duration: 0.5s;*/
	}
	
	.mic:hover{
		border-width: 20px;
		border-color: Rgba(63, 107, 149, 0.2);  /* Bleu */
		transition-duration: 2s;
		background-color: RGBa(255, 10, 0, 0.2);
	}
	
	.micOpen{
		border-width: 55px;
		border-color: Rgba(63, 107, 149, 0.2);	
	}
	
	.mic1{
		border-width: 10px;
		border-color: yellow;
		transition-duration: 0.3s;	
	}
	.mic2{
		border-width: 20px;
		border-color: Rgba(63, 107, 149, 0.2);
		transition-duration: 0.3s;			
	}
	.mic3{
		border-width: 40px;
		border-color: Rgba(63, 107, 149, 0.2);
		transition-duration: 0.3s;	
	}
	.mic4{
		border-width: 60px;
		border-color: Rgba(63, 107, 149, 0.2);
		transition-duration: 0.3s;	
	}
	.mic5{
		border-width: 80px;
		border-color: Rgba(63, 107, 149, 0.2);
		transition-duration: 0.3s;
				
	}
	.mic6{
		border-width: 100px;
		border-color: Rgba(63, 107, 149, 0.2);	
		transition-duration: 0.3s;
		background-color: RGBa(255, 10, 0, 0.2);		
	}
	
	
	.myDivMic{
		background-color: whitesmoke;		
		width: 100%;
		height: 300px;
		
	}