div#infographie
{
	width:841px; 
	margin-left:auto; 
	margin-right:auto; 
	font-family:arial; 
	color:#FFF; 
	padding:30px;
	font-size:20px;
}

div#titre
{
	vertical-align:middle;
	color:#ffb529;
	margin:auto;
	font-size:50px;
	text-align:center;
}

div#infographie h2
{
	margin:0px;
	padding:10px; 
	background-color:#ffff00; 
	text-align:center; 
	color:#156082;
	font-size:25px;
	font-weight:bold;
}

div#infographie div.cadrejaune
{
	width:200px;
	border:solid 1px #FF0;
	color:#FF0;
	margin-left:auto;
	margin-right:auto;
	padding:10px;
	font-size:20px;
	text-align:center;
}

div#infographie div.cadreblanc
{
	border:solid 1px #FFF;
	color:#FFF;
	padding:10px;
	margin:20px;
	text-align:center;
	display:inline-block;
	font-size:18px;
}

div.cadre video
{
	height:440px;
	background-color:#000000;
	margin:auto;
}

.txtAlLeft
{
	text-align;left;
}

.txtAlRight
{
	text-align;right;
}

.txtAlCenter
{
	text-align;center;
}

div.colonne
{
	float:left; 
}

div#colgauche
{
	width:287px; 
	text-align:center; 
}

div#colcentre
{
	width:237px;
	padding:10px;
	text-align:justify; 
	background-color:#156082;
}

div#coldroite
{
	width:257px; 
}

div.contact
{
	overflow:visible;
	padding:5px;
	float:left;
}

div.col2
{
	float:right;
	text-align:right;
}

.clearboth
{
	clear:both;
}

span.titrejaune
{
	color:#FF0;
}

@media only screen and (max-width: 500px)
{
	div#infographie
	{
		width:100%; 
	}
	
	div.cadre video
	{
		width:100%;
		height:auto;
		background-color:#000000;
		margin:auto;
	}
	
	div.colonne
	{
		float:none; 
		width:100%; 
	}

	div.contact
	{
		width:100%;
		float:none;
		text-align:center;
	}
}