/* --------------------------------------------------

	LIST PROJECTS

-------------------------------------------------- */

.list-projects {
	text-align:left;
}

/* --------------------------------------------------
	.item
-------------------------------------------------- */

.list-projects a.item {
	display:block;
	text-decoration:none;
}
.list-projects .item {
	margin-bottom:30px;
	padding-left:260px;
	position:relative;
}
.list-projects .item:before {
	content:'.';
	display:block;
	height:0;
	overflow:hidden;
	
	border-top:1px solid #222;
	position:absolute;
	left:0;
	bottom:0;
	right:0;
	
	margin-bottom:-15px;
}
.list-projects .item:last-of-type:before {
	content:none;
}
.list-projects .item:after {
	content:'.';
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.list-projects a.item:hover {
	background-color:#444;
	-webkit-transition:background 200ms ease-in-out;
	   -moz-transition:background 200ms ease-in-out;
			transition:background 200ms ease-in-out;
}

/* -------------------------
	.thumb
------------------------- */

.list-projects .item .thumb {
	width:260px;
	float:left;
	display:block;
	
	margin-left:-260px;
	position:relative;
	
	overflow:hidden;
}
.list-projects .item .thumb .thumb-img {
	height:0;
	display:block;
	position:relative;
	padding-top:63%; /* 63.33333 arrondi pour éviter des pixels vides */
}
.list-projects .item .thumb .thumb-img img {
	width:100%;
	max-width:none;
	position:absolute;
	top:0;
	left:0;
}

/* -------------------------
	.infos
------------------------- */

.list-projects .item .title {
	width:60%;
	float:left;
	display:block;
	padding:5px 12px 5px 24px;
	
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
			box-sizing:border-box;
	
	color:#fff;
	font-family:'Futura',Arial,sans-serif;
	font-weight:200;
	font-size:3em; /* 39px */
	line-height:1em;
	text-transform:uppercase;
}

.list-projects .item .infos {
	width:40%;
	float:left;
	display:block;
	padding:5px 12px 5px 24px;
	
	color:#999;
	line-height:1.3em;
	text-align:right;
	text-transform:uppercase;
	
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
			box-sizing:border-box;
}

.list-projects .item .infos span {
	display:block;
}

/* --------------------------------------------------
	WIDTH <= 900px
-------------------------------------------------- */

@media
only screen and (max-width:900px)
{
	.list-projects .item .title,
	.list-projects .item .infos {
		width:auto;
		float:none;
		text-align:left;
	}
	.list-projects .item .title {
		font-size:2.3em; /* 30px; */
	}
}

/* --------------------------------------------------
	WIDTH <= 650px
-------------------------------------------------- */

@media
only screen and (max-width:650px)
{
	.list-projects .item {
		padding-left:150px;
	}
	
	.list-projects .item .title {
		font-size:1.38461em; /* 18px */
	}
	
	.list-projects .item .thumb {
		width:150px;
		margin-left:-150px;
	}
	
	.list-projects .item .thumb .thumb-img {
		padding-top:100%;
	}
	
	.list-projects .item .thumb .thumb-img img {
		width:auto;
		height:100%;
		left:-30%;
	}
}

/* --------------------------------------------------
	WIDTH <= 500px
-------------------------------------------------- */

@media
only screen and (max-width:500px)
{
	.list-projects {
		margin-top:-16px;
		margin-bottom:-14px;
	}
	.list-projects .item {
		padding-left:100px;
	}
	
	.list-projects .item .thumb {
		width:100px;
		margin-left:-100px;
	}
}

/* --------------------------------------------------
	WIDTH <= 400px
-------------------------------------------------- * /

@media
only screen and (max-width:400px)
{
	.list-featured .item .thumb {
		width:35%;
	}
	
	.list-featured .item .infos {
		width:65%;
	}
}