@charset "utf-8";
/* CSS Document */

/* 	Couleurs principales 
	
	*/

/*--- GLOBAL ---*/
html, body, div, h1, h2, h3, h4, h5, h6, p, img, dl,
dt, dd, ol, ul, li, table, tr, td, form, object, embed,
article, aside, canvas, command, details, fieldset,
figcaption, figure, footer, group, header, footer, hgroup, legend,
mark, menu, meter, nav, output, progress, section, summary,
time, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

html, body {
    height: 100%;
}

body{ 
	font-family:Arial, Helvetica, sans-serif; 
	font-size:12px; 
	background-color:#333;
	text-align: center;
	background:url(/img/background.jpg) top center;
	overflow:hidden;
}

a {
	color: #15c;
	text-decoration: none;
}
a:active {
	color: #d14836;
}
a:hover {
	text-decoration: underline;
}

/*--- HEADER ---*/
header{ 
	position:fixed;
	height:100px;
	width:100%;
	background-color:#333;
	-moz-box-shadow: 0 0 8px #000;
	-webkit-box-shadow: 0 0 8px #000;
	box-shadow: 0 0 8px #000;
	}


/*--- FOOTER ---*/
footer{ 
	position:fixed;
	height:50px;
	width:100%;
	bottom:0;
	background-color:#333;
	-moz-box-shadow: 0 0 8px #000;
	-webkit-box-shadow: 0 0 8px #000;
	box-shadow: 0 0 8px #000;
	color:#999;
	}
	.liste_foot{
		padding-top:15px;
	}
	.liste_foot a{
		color:#999;
		text-decoration: none;
	}
	.liste_foot a:active{
		color:#999;
	}
	.liste_foot a:hover{
		text-decoration: none;
	}

/*--- CENTRAGE HORIZONTALE ET VERTICAL DU CONTENU ---*/
.tableContainer{
	display:table;
	height:100%;
	table-layout:fixed;
	width:100%;
}

	.tableContainer .cellContainer{
		display:table-cell;
		text-align:center;
		vertical-align:middle;
		width:100%;
	}
	
	/*--- GALERIES ---*/
	.tableContainer .cellContainer .blockContainer{
		display:inline-block;
		outline:none;
		width:900px;
		min-width:741px;
		height:70%;
		overflow:auto;
		overflow-x:hidden;
	}
	
	.liste-galerie{
		list-style-type:none;
		width:900px;
		margin:0 auto;
		top:50;
	}
		.liste-galerie .conteneur-galerie{
			float:left;
			width:200px;
			height:139px;
			margin:40px;
			text-align:left;
			-moz-box-shadow: 0 0 8px #000;
			-webkit-box-shadow: 0 0 8px #000;
			box-shadow: 0 0 8px #000;
		}
		
		.liste-galerie .conteneur-galerie .img{
			max-width:200px;
			max-height:139px;
		}
	
	/*--- PHOTOS ---*/
	.tableContainer .cellContainer .blockContainerPhoto{
		display:inline-block;
		outline:none;
		width:100%;
		height:100%;
		overflow:auto;
		overflow-x:hidden;
		bottom:0;
	}
	
	.vertical{
		padding-top:120px;
		padding-bottom:60px;
		overflow:scroll;
		overflow-x: hidden;
		-ms-overflow-x: hidden;
		height:100%;
	}
	.vertical h2{
		margin:0 auto;
		padding:0;
		color:#c5c5c5;
		border-bottom:1px solid #c5c5c5;
		width:864px;
		padding-bottom:5px;
	}
		.vertical h2 span{
			float:left;
			color:#c5c5c5;
			font-size:12px;
			font-weight:normal;
			margin-top:5px;
		}
		.vertical h2 span a{
			color:#c5c5c5;
		}
	
	
	.liste-photos{
		list-style-type:none;
		width:864px;
		margin:0 auto;
		overflow:auto;
	}
		.liste-photos .conteneur-photos{
			float:left;
			width:156px;
			height:111px;
			margin:30px;
			padding: 0;
			text-align:center;
			background-color: #000;
			-moz-box-shadow: 0 0 8px #000;
			-webkit-box-shadow: 0 0 8px #000;
			box-shadow: 0 0 8px #000;
		}
		
		.liste-photos .conteneur-photos .conteneur-photos-image{
			height:111px;
			width:156px;
			cursor:pointer;
			display : table-cell;
			text-align: center;
			vertical-align: middle;
			padding: 0;
		}
		
		.liste-photos .conteneur-photos .conteneur-photos-image .img{
			max-width:150px;
			max-height:105px;
		}
		
	/*--- FULL VIEW ---*/
	.full-black{
		background-color: rgba(255, 255, 255, .5);
		bottom: 0;
		left: 0;
		overflow: hidden;
		position: fixed;
		right: 0;
		top: 0;
		z-index: 399;display:none;
	}
	.full-white{
		background-color: rgba(0, 0, 0, .8);
		bottom: 0;
		left: 0;
		overflow: hidden;
		position: fixed;
		right: 0;
		top: 0;z-index: 400;
	}
	.tableContainer .cellContainer .blockContainerFull{
		display:inline-block;
		outline:none;
		width:80%;
		height:80%;
		overflow:auto;
		overflow-x:hidden;
		bottom:0;
		padding:10px;
	}
	.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow{
		width:100%;
		height:100%;
		-moz-box-shadow: 0 0 8px #000;
		-webkit-box-shadow: 0 0 8px #000;
		box-shadow: 0 0 8px #000;
		background-color:#FFF;
	}
	
	.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .leftContainer{
    width:calc(100% - 256px);
		height:100%;
		float:left;
		background-color:rgb(192,192,192);
		clear:both;
    position:relative;
	}
		.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .leftContainer .left-action{
			width:50%;
			height:100%;
			text-align:left;
			position:absolute;
			cursor:pointer;
		}
		.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .leftContainer .right-action{
			width:50%;
			text-align:right;
			height:100%;
			position:absolute;
			right:0;
			cursor:pointer;
		}
		.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .leftContainer .left-action:hover{
			background:url(/img/left.png) no-repeat;
			background-position: 10% 50%; 
			cursor:pointer;
		}
		.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .leftContainer .right-action:hover{
			background:url(/img/right.png) no-repeat;
			background-position: 90% 50%;  
			cursor:pointer;
		}
		.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .leftContainer span{
			width:100%;
			height:100%;
			text-align:center;
			display: flex;
			align-items:center;
      justify-content: center;
		}
		.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .leftContainer img{
			max-width:100%;
			max-height:100%;
			vertical-align: middle;
      text-align:center;
		}
	.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .rightContainer{
		float:left;
		width:256px;
		height:100%;
		background-color:#333;
		text-align:left;
	}
	.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .rightContainer table{
		width:216px;
		padding:0;
		border-collapse:0;
		border-spacing:0;
		color:#7b7b7b;
		font-size:10px;
		margin:20px;
		}
		.tableContainer .cellContainer .blockContainerFull .blockContainerFullShadow .rightContainer table td{
			border-bottom:1px solid #5f5f5f;
			padding-top:8px;
			padding-bottom:8px;
			padding-right:8px;
			}
			
	.close-full{
		width:100%;
		text-align:right;
	}
		.close-full img{
			cursor:pointer;
			margin:10px;
		}
		
#comments{
	padding-left:10px;
	padding-right:10px;
	max-height:460px;
	overflow:hidden;
	color:#efefef;
}
	#comments .liste-comments{
		margin:0;
		padding:0;
		list-style-type:none;
		max-height:275px;
		overflow:scroll;
		overflow-x: hidden;
		-ms-overflow-x: hidden;
		border-bottom:1px solid #fff;
		margin-bottom:15px;
	}
	#comments .li-comment{
		border-bottom:1px dotted #999;
		margin-bottom:5px;
		padding-bottom:5px;
	}
	#comments .li-comment .li-texte{
		color:#999;
	}