@media all and (max-device-width: 480px)
{
    /* Vos règles CSS pour les mobiles ici */
	
	header
	{
		width : device-width;
		height : 10%;
		background-color :  rgb(52,61,67);
		border-bottom: 2px solid black;
		margin-top : 0px;
		color : white;
	}
	
	article
	{
		width : device-width;
		height : device-height;
		background-color : black;
		overflow: auto;
		position : relative;
	}
	
	
}


article
{
	width: 100%;
	/*width : device-width;*/
	height : 100%;
	/*background-color : black;*/
	/*background: url("gradient.png");*/
	overflow: auto;
	position: absolute;
	/*top: 58;*/
}



/*section h1
{
	color : orange;
	position : absolute;
	left : 140px;
	top : 0px;

}*/

table
{
	width : 100%;
	border-collapse: collapse;
	margin-top : 2rem;

}

td
{
	border: 0px solid white;
}

td .TDnormal
{
	width : 33%;
	height : 100px;
}

td .TDgrand
{
	width : 63%;
	height : 200px;
}

td .TDdouble
{
	width : 63%;
	height : 100px;
}


.sectionHeader
{
	width : 100%;
	height : 30%;
	background-color :  rgb(52,61,67);
	border-bottom: 0px solid black;
	margin-top : 0px;
	opacity: 0.9;
	/*font-family: 'Trebuchet MS', Arial, sans-serif;*/
	font-size : 20px;
	text-align : center;
	font-family: "Open Sans", Sans-serif;
	color : white;
	text-align: bottom;
	
}

.post
{
	width : 100%;
	height : 20%;
	border-bottom : 1px solid white;
	color : white;
	overflow : hidden;
	position : relative;

}

.grand
{
	/*width : 251px;*/
	/*min-width : 268px;*/
	min-width : 267px;
	width : 100%;
	height : 204px;
	/*background-color : #52b6cc;*/
	background-color: rgb(254,1,39);
	float : left;

}

.double
{
	/*width : 251px;*/
	/*min-width : 268px;*/
	min-width : 267px;
	width : 100%;
	min-height : 101px;
	background-color : #52b6cc;
	float : left;

}

.cinema
{
	/*background-color : rgb(200,140,240);*/
	background-color : rgb(60,240,40);
	/*background-image : url("test3.jpg");
	/*width : 124px;*/
	min-width : 128px;
	/*height : 100px;*/
	min-height : 101px;
	/*float: right;*/
	background-repeat : no-repeat;

}


.sport
{
	background-color : #e7a300;
	/*background-image : url("test3.jpg");
	/*width : 124px;*/
	min-width : 128px;
	/*height : 100px;*/
	min-height : 101px;
	/*float: right;*/
	background-repeat : no-repeat;

}

.technologie
{
	background-color : #954fa7;
	/*background-image : url("test3.jpg");
	/*width : 124px;*/
	min-width : 128px;
	/*height : 100px;*/
	min-height : 101px;
	/*float: right;*/
	background-repeat : no-repeat;

}

.economie
{
	background-color : rgb(128,128,192);
	/*background-image : url("test3.jpg");
	/*width : 124px;*/
	min-width : 128px;
	/*height : 100px;*/
	min-height : 101px;
	/*float: right;*/
	background-repeat : no-repeat;

}

.culture
{
	background-color : rgb(128,255,128);
	/*background-image : url("test3.jpg");
	/*width : 124px;*/
	min-width : 128px;
	/*height : 100px;*/
	min-height : 101px;
	/*float: right;*/
	background-repeat : no-repeat;

}

.people
{
	/*background-image : url("test3.jpg");
	/*width : 124px;*/
	min-width : 128px;
	/*height : 100px;*/
	min-height : 101px;
	/*float: right;*/
	background-repeat : no-repeat;
	background-color : rgb(255,128,255);

}



.postImg
{
	width : 30%;
	height : 100%;
	float : left;
	margin-top : -10px;
	margin-left : 8px;
	margin-bottom : 2px;
	margin-right : 10px;


}

.imageNormal
{
	width : 100%;
	height : 100%;
}

section .desc
{
	font-family: 'Trebuchet MS', Arial, sans-serif;
	font-size : 12px;
	text-align : left;
	font-style : italic;
	color : white;
	overflow: auto;
	position : absolute;
	left : 150px;
	top : 35px;


}


section .titre
{
	font-family: 'Trebuchet MS', Arial, sans-serif;
	font-size : 18px;
	text-align : left;
	font-style : bold;
	color : orange;
	overflow: auto;
	position : absolute;
	left : 140px;
	top : -4px;


}


section .date
{
	font-family: 'Trebuchet MS', Arial, sans-serif;
	font-size : 10px;
	text-align : right;
	font-style : italic;
	color : grey;
	overflow: auto;
	right : 10px;
	vertical-align : top;
	position : absolute;
	top : 10px;

}

footer ul
{
	list-style-type: none;
}

footer li
{
	display: inline-block;
    margin-right: 55px;
}
footer
{
	width : 100%;
	height : 60px;
	background-color: rgb(52,61,67);
    color: white;
    opacity: 0.7;
	overflow: auto;
	word-wrap: break-word;
	position : absolute;
	bottom : 0px;
	
	
	

}

a{
	text-decoration: none;
	color : orange;
}
a:hover /* Apparence au survol des liens */
{
   text-decoration: none;
   color: red;
}