@charset "utf-8";
/* CSS Document */
.isogallery{width:930px;margin:0 auto}
#id-gallery {/* border:#666 solid 1px;*/}
/*NEW version avec ITEMFIGURE */
.isogallery .itemfigure {
	width:300px;
	margin:5px;
	float:left;
	position:relative;
	border-radius:3px;
	overflow:hidden;
	text-align:center;
	display:block; /*à vérifier*/
}
.isogallery .itemfigure .picframe{
	display:block;
	position:relative;
	/*border:#63F solid 1px;*/
}
@media screen and (max-width:480px){ 
	.isogallery{width:320px; /*background-color:#F9F;*/}
	.isogallery .itemfigure{margin:5px}
}
@media screen and (min-width:481px) and (max-width:767px){ 
	.isogallery{width:640px; width:95%; /*background-color:#6FF;*/}
	.isogallery .itemfigure{margin:5px;width:45%; height:auto}
	.isogallery .itemfigure img{display:block;max-width:100%;height:auto}
}
@media screen and (min-width:768px)and (max-width:900px){ 
	.isogallery{width:95%;/*background-color:#6C6; border:#333 solid 1px;*/}
	.isogallery .itemfigure{margin:5px;width:31%; height:auto}
	.isogallery .itemfigure img{display:block;max-width:100%;height:auto}
}
div.img-overlay{
	border-radius:3px;
	position:absolute; top:0;left:0;
	/*width:100%; height:100%;*/
/*	bottom:-1px;right:-1px;*/
/*	width:300px; height:100%; */
	width:100%; height:100%;
	min-height:300px;
	z-index:100;
	opacity:0.2;
	overflow:hidden;
	background-color: rgba(255, 255, 255, 0.1);
	display:block;
	cursor: default;
	/*border:#39F solid 2px;*/
}
div.img-overlay:hover{
	opacity:0.5;
	background-color: rgba(0, 0, 0, 0.5);
	/*border:#F36 dashed 2px;*/
}
@media only screen and (device-width: 768px) {
	div.img-overlay{
	cursor: pointer;
	/*border:#6C3 solid 3px;*/
	}
	div.img-overlay:hover{
	opacity:0.7;
	/*border:#6C3 dashed 2px;*/
}
}

.isogallery .itemfigure img{
	border-radius:3px;
	position:relative;
	display:block;
	max-width:100%;
	z-index:20;
}
.isogallery .itemfigure img.transition{
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;/**/
	/*
	-o-transition:1s;-ms-transition:1s;-moz-transition:1s;-webkit-transition:1s;transition:1s; 
	outline: none;*/
}
/*hover marche sur tablette*/
.isogallery .itemfigure img.transition:hover{
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
/*transform: scale(1.3);
-o-transition:1s;-ms-transition:1s;-moz-transition:1s;-webkit-transition:1s;transition:1s; 
outline: none;*/
}
.isogallery .itemfigure .picframe .caption{
	height:75px;
	background:#f6f7f8;
	padding:1em;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	z-index:1000;
	-webkit-transition:-webkit-transform .35s;
	-moz-transition:-moz-transform .35s;-o-transition:-o-transform .35s;
	transition:transform .35s;-webkit-transform:translate3d(0,100%,0);
	transform:translate3d(0,100%,0)
}
.isogallery .itemfigure .picframe .caption{
	position:absolute;
	top:auto;bottom:-1px;left:0;
	width:100%
}
.isogallery .itemfigure .picframe:hover .caption{
	-webkit-transform:translate3d(0,0,0);
	transform:translate3d(0,0,0)
}

.isogallery .itemfigure .picframe .title{
	font-family:"Helvetica Neue",helvetica,"Open Sans",Arial,sans-serif;
	font-size:14px;
	color:#444;
	font-weight:bold;
	text-align:left; 
	/*font-family: "Time Burner",arial, "sans serif";*/
	z-index:3;
	text-transform:uppercase;
	margin:0 0 7px 0;
	-webkit-transition:-webkit-transform .35s;-moz-transition:-moz-transform .35s;-o-transition:-o-transform .35s;
	transition:transform .35s;-webkit-transform:translate3d(0,200%,0);transform:translate3d(0,200%,0)
}
.isogallery .itemfigure .picframe:hover .title{
	-webkit-transition-delay:.1s;
	transition-delay:.1s
}
.isogallery .itemfigure .picframe .links{
	text-align:right;font-size:13px;font-weight:bold;-webkit-transition:-webkit-transform .35s;
	-moz-transition:-moz-transform .35s;-o-transition:-o-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,200%,0);
	transform:translate3d(0,200%,0);z-index:3
}
.isogallery .itemfigure .picframe:hover .links{
	-webkit-transform:translate3d(0,0,0);
	transform:translate3d(0,0,0);
	-webkit-transition-delay:.2s;transition-delay:.2s
}
.isogallery .itemfigure .picframe:hover h2{
	-webkit-transform:translate3d(0,0,0);
	transform:translate3d(0,0,0)
}
