/* ------------------------------------------- content ------------------------------------------- */

#content{
	width:100%;
}
/* ================================================================================== */

section a{ 
	width:226px;
	height:228px;
	display:block;
	float:left;
	position:relative;
	color:#FFF;
}

section a img{
	border:none;
	width:226px;/*226*/ /*500/1200*100*/
	height:228px;/*228*/
}

section a span img.voir{
	width:50px;
	height:50px;
	margin:129px 0 0 89px;
}

section a span{
	position:absolute;
	width:226px;
	height:228px;
	display:none;
}

section a:hover span{ 
	display:block;
}

section span.titre{
	text-align:center;
	line-height:30px;
	position:absolute;
	top:25px;
	font-size:25px;
}

section span.description{
	text-align:center;
	position:absolute;
	top:60px;
}

section span.bg{
	top:0;
	left:0;
	width:226px;
	height:228px;
	background:rgba(0,0,0,0.7);
}


/* =============================================================================== */	

h2, h3, h4, p{
	font-family:'helvetica','sans-serif';
}

h2{
	font-size:30px;
	padding-top:44px;
}

h4{
	font-size:20px;
	padding-top:25px;
	line-height:23px;
}

p{	
	color:#FFF;
	height:50px;
	padding:30px 0 0 20px;
	font-size:16px;
}

.view{
	float:right;
	padding-right:15px;
}

/*.titre{
	
	height:200px;
	margin-top:-4px;
	padding-left:8px;
}*/

/*.titre2{
	background-color:#282726;
	height:150px;
	color:#FFF;
	margin-top:-4px; /* white-space */
/*	padding-left:8px;
}*/

.petit a{ /* liens view the project */
	text-decoration:none;
}

/* #content img{
	height:48.95833333%; /* 470/960*100 */
	/*width:auto; /* 470px */
/*}*/

section h3{
	color:#FFF;
	background-color:#282726;
	height:50px;
	font-size:1.3em;
	padding:34px 10px 0 10px;
	margin-top:-4px;
} 

/*#aviation{*/
/*	width:48.95833333%; /* 470/960*100 */
/*	margin-right:23px;
	float:left;
	max-width:226px;
	min-width:226px;
}*/

/*#halo{*/
	/*width:48.95833333%; /* 470/960*100 */
	/*float:left;	
	max-width:226px;
	min-width:226px;*/
/*}*/

/*.img-aviation, .img-halo{
	width:100%; 
	height:auto;
	max-width:226px;
}*/

/*#aviation, #halo, #rocket, #theory, #bad, #kenzo, #meal, #million, #snow, #dome, #banniere, #bandeaux, #daganaud, #simpsons, #angry, #superbusy, #question{
	width:226px;
	float:left;
}*/

/*#halo, #kenzo, #rocket, #theory, #pioneer, #meal, #snow, #banniere, #bad, #simpsons, #angry, #dome, #superbusy{
	margin-left:20px;
}
*/
.clearfix{
	clear:both;
}



@media screen and (max-width:3000px){
}

/*@media screen and (max-width:1596px){
#conteneur{
	width:58%;}
}*/

@media screen and (max-width:1500px){
	/*#banniere, #simpsons, #pioneer, #rocket, #bandeaux, #million{margin-left:15px;}*/
	#content{width:720px;margin:auto;}
	/*#aviation{margin-right:9px;}*/
	/*#theory, #kenzo, #snow, #superbusy{margin-left:0}*/
}

@media screen and (max-width:960px){
	/*#banniere, #simpsons, #pioneer, #theory, #snow, #superbusy{margin-left:15px;}*/
	#content{width:485px;margin:auto;}
	/*#aviation{margin-right:9px;}*/
	/*#rocket, #kenzo, #million, #dome, #angry, #bandeaux{margin-left:0;}*/
}

/*@media screen and (max-width:960px){
	#content{width:470px;margin:auto;}
	#meal, #bad, #kenzo, #million, #banniere, #dome, #bandeaux, #daganaud{margin-left:0;}
	#pioneer, #meal, #banniere, #theory, #snow{margin-left:18px;}
}*/

@media screen and (max-width:768px){ /*(condition) {règles css}*/ /*768px = tablettes */
	
} 

@media screen and (max-width:668px){
	#content{width:230px;}
	/*#rocket, #theory, #pioneer, #kenzo, #meal, #million, #snow, #dome, #banniere, #simpsons, #halo, #superbusy, #bad{margin-left:0;}*/
}

@media screen and (max-width:320px){ /*(condition) {règles css}*/ /*320px = smartphone */

}