section {
	padding-top:30px;
	width:90%;
	margin:auto;
	text-align:center;
	}
	
.membre {
	width:250px;
	height:350px;
	position:relative;
	display:inline-block;
	margin:0 130px 70px 130px;
	text-decoration:none !important;
	}
	
.membre .membre_photo {
	width:250px;
	height:350px;
	background-size:cover;
	background-position:center center;
	position:relative;
	overflow:hidden;
	}
	
.membre .membre_photo .coin_top_left,
.membre .membre_photo .coin_bottom_right {
	background-color:#009246;
	width:250px;
	height:100px;
	position:absolute;
	opacity:100%;
	}
	
.membre .membre_photo .coin_top_left {
	top:-55px;
	left:-100px;
	transform:rotate(-25deg);
	}
	
.membre .membre_photo .coin_bottom_right {
	bottom:-35px;
	right:-110px;
	transform:rotate(-25deg);
	}
	
.membre:hover .membre_photo .coin_top_left,
.membre:hover .membre_photo .coin_bottom_right {
	opacity:0%;
	}
	
.membre .membre_infos {
	background-color:#009246;
	color:#FFFFFF;
	padding:10px;
	text-align:left;
	width:275px;
	height:20px;
	position:absolute;
	left:50px;
	top:330px;
	overflow:hidden;
	}
	
.membre .membre_infos p {
	margin:0;
	margin-bottom:10px;
	}
	
.membre .membre_infos .membre_profession {
	font-style:italic;
	}
	
.membre .membre_infos .membre_nom {
	font-weight:bold;
	margin-bottom:15px;
	font-size:1.2em;
	}
	
.membre .membre_infos .membre_societe_logo_contain {
	width:100px;
	height:100px;
	background-color:#ffffff;
	display:inline-block;
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
	padding:10px;
	position:relative;
	overflow:hidden;
	}
	
.membre .membre_infos .membre_societe_logo_contain .membre_societe_logo {
	width:100px;
	height:100px;
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
	}
	
.membre .membre_infos .membre_societe_logo_contain .coin_top_left,
.membre .membre_infos .membre_societe_logo_contain .coin_bottom_right {
	background-color:#009246;
	width:100px;
	height:40px;
	position:absolute;
	opacity:100%;
	}
	
.membre .membre_infos .membre_societe_logo_contain .coin_top_left {
	top:-25px;
	left:-40px;
	transform:rotate(-25deg);
	}
	
.membre .membre_infos .membre_societe_logo_contain .coin_bottom_right {
	bottom:-25px;
	right:-40px;
	transform:rotate(-25deg);
	}
	
.membre:hover .membre_infos {
	width:230px; 
	left:0;
	top:0;
	text-align:center;
	padding:40px 10px 10px 10px;
	height:300px;
	animation-name: membre_info;
	animation-duration: 1s;
	background-color:rgba(0, 146, 70, 0.8);
	}
	
@keyframes membre_info {
	0%   {
		width:275px;
		left:50px;
		top:330px;
		padding:10px;
		text-align:left;
		height:20px;
		background-color:rgba(0, 146, 70, 1);
		}
	30% {
		width:230px; 
		left:0;
		top:330px;
		padding:10px;
		text-align:center;
		height:20px;
		background-color:rgba(0, 146, 70, 1);
		}
	100% {
		width:230px; 
		left:0;
		top:0;
		text-align:center;
		padding:40px 10px 10px 10px;
		height:300px;
		background-color:rgba(0, 146, 70, 0.8);
		}
	}
	
@media screen and (max-width: 580px) { 
	.membre {
		width:100%;
		height:auto;
		margin:0;
		margin-bottom:30px;
		}
		
	.membre .membre_photo {
		margin:auto;
		}
		
	.membre:hover .membre_photo .coin_top_left,
	.membre:hover .membre_photo .coin_bottom_right {
		opacity:100%;
		}
	
	.membre .membre_photo .coin_bottom_right {
		bottom:-55px;
		}
		
	.membre .membre_infos {
		background-color:transparent;
		color:#009246;
		text-align:center;
		width:100%;
		height:auto;
		position:relative;
		left:0;
		top:0;
		}
	
	.membre:hover .membre_infos {
		background-color:transparent;
		width:100%;
		left:0;
		top:0;
		padding:10px;
		height:auto;
		animation-name: none;
		}
	
	.membre .membre_infos .membre_societe_logo_contain {
		display:none;
		}
	
	.membre .membre_infos p {
		margin:0;
		}
	
	.membre .membre_infos .membre_nom {
		margin-bottom:0;
		font-size:1.2em;
		}
	}