
#contenu
	{padding-bottom : 20px;}
	
#pasdephoto
	{
	padding-top : 30px;
	}

#enveloppephoto
	{
	position : relative;
	background : black;
	text-align : center;
	}
	@media screen and (min-height: 350px) { #enveloppephoto	{height : 230px;} }
	@media screen and (min-height: 400px) { #enveloppephoto	{height : 280px;} }
	@media screen and (min-height: 450px) { #enveloppephoto	{height : 330px;} }
	@media screen and (min-height: 500px) { #enveloppephoto	{height : 380px;} }
	@media screen and (min-height: 550px) { #enveloppephoto	{height : 430px;} }
	@media screen and (min-height: 600px) { #enveloppephoto	{height : 480px;} }
	@media screen and (min-height: 650px) { #enveloppephoto	{height : 530px;} }
	@media screen and (min-height: 700px) { #enveloppephoto	{height : 580px;} }
	@media screen and (min-height: 750px) { #enveloppephoto	{height : 630px;} }
	@media screen and (min-height: 800px) { #enveloppephoto	{height : 680px;} }
	@media screen and (min-height: 850px) { #enveloppephoto	{height : 730px;} }
	@media screen and (min-height: 900px) { #enveloppephoto	{height : 780px;} }
	@media screen and (min-height: 950px) { #enveloppephoto	{height : 830px;} }
	@media screen and (min-height: 1000px) { #enveloppephoto	{height : 880px;} }
	@media screen and (min-height: 1050px) { #enveloppephoto	{height : 930px;} }
	@media screen and (min-height: 1100px) { #enveloppephoto	{height : 980px;} }
	@media screen and (min-height: 1150px) { #enveloppephoto	{height : 1030px;} }
	@media screen and (min-height: 1200px) { #enveloppephoto	{height : 1080px;} }
	@media screen and (min-height: 1250px) { #enveloppephoto	{height : 1130px;} }
	@media screen and (min-height: 1300px) { #enveloppephoto	{height : 1180px;} }
	@media screen and (min-height: 1350px) { #enveloppephoto	{height : 1230px;} }
	@media screen and (min-height: 1400px) { #enveloppephoto	{height : 1280px;} }
	@media screen and (min-height: 1450px) { #enveloppephoto	{height : 1330px;} }
	@media screen and (min-height: 1500px) { #enveloppephoto	{height : 1380px;} }
	@media screen and (min-height: 1550px) { #enveloppephoto	{height : 1430px;} }
	@media screen and (min-height: 1600px) { #enveloppephoto	{height : 1480px;} }
	@media screen and (min-height: 1650px) { #enveloppephoto	{height : 1530px;} }
		

#titre-galerie
	{
	font-family: 'Indie Flower', cursive;
	color : #CCCCCC;
	line-height : 25px;
	
	position : absolute;
	z-index : 10000;
	right : 30px;
	text-align : right;
	}
#titre-galerie h2, #titre-galerie h3
	{
	margin : 5px;
	padding : 0px;
	}
#titre-galerie h2
	{
	font-size : 2em;
	}
	
#vignettes
	{
	width : 90%;
	height : 160px;
	left : 5%;
	position : absolute;
	bottom : -10px;
	overflow : hidden;
	}
#vignettes img
	{
	margin : 1px;
	vertical-align : middle;
	border : 5px solid transparent;
	max-width : 80px;
	max-height : 80px;
	opacity : 0.5;
	transition : max-height 0.5s, max-width 0.5s;
	-moz-transition : max-height 0.5s, max-width 0.5s;
	-webkit-transition : max-height 0.5s, max-width 0.5s;
	}
#vignettes img:hover
	{
	opacity : 1;
	cursor : pointer;
	max-width : 140px;
	max-height : 140px;
	}
#vignettes img.affichee
	{
	opacity : 1;
	max-width : 120px;
	max-height : 120px;
	border : 2px solid white;
	}
#bandeau
	{
	white-space:nowrap;
	text-align : center;
	height : 160px;
	line-height : 160px;
	vertical-align : middle;
	}

#photo
	{
	width : 100%;
	height : calc(100% - 80px);
	vertical-align : top;
	display : inline-block;
	position : relative;
	}

#photo h2
	{
	display : block;
	color : white;
	background : rgba(255, 255, 255, 0.15);	
	padding : 10px;
	margin : 10px;
	-moz-border-radius: 10px 10px 10px 10px; 
	  -webkit-border-radius: 10px 10px 10px 10px;
	  -0-border-radius: 10px 10px 10px 10px; 
	  border-radius: 10px 10px 10px 10px;	text-align : right;
	font-size : 1.25em;
	}
	
#photo .description
	{
	vertical-align : top;
	display : inline-block;
	width : 25%;
	text-align : left;
	background : rgba(255, 255, 255, 0.15);		
	-moz-border-radius: 0px 25px 0px 0px; 
	  -webkit-border-radius: 0px 25px 0px 0px;
	  -0-border-radius: 0px 25px 0px 0px; 
	  border-radius: 0px 25px 0px 0px;	padding : 0px;
	margin-top : 60px;
	}
#photo img
	{
	vertical-align : top;
	max-width : 75%;
	height : auto;
	width : auto;
	max-height : 100%;
	}
	
#flecheg, #fleched
	{
	position : absolute;
	top : 50%;
	color : black;
	background : rgba(128, 128, 128, 0.5);
	height : 30px;
	line-height : 30px;
	width : 30px;
	display : inline-block;
	text-align : center;
	vertical-align : middle;
	-moz-border-radius: 15px 15px 15px 15px; 
	  -webkit-border-radius: 15px 15px 15px 15px;
	  -0-border-radius: 15px 15px 15px 15px; 
	  border-radius: 15px 15px 15px 15px;	font-size : 2em;
	
	cursor : pointer;
	}
#flecheg:hover, #fleched:hover
	{
	background : rgba(255, 255, 255, 0.85);
	}
#flecheg img, #fleched img
	{
width : 30px;
	}
#flecheg
	{
	left : -20px;
	}
#fleched
	{
	right : -20px;
	}
	
