/* Page */
html, body {
    font-family:    		"Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:	 			10px;   
	color: 		 			black;
	background-color:		white;
}

#textureBackground, #enlargeContainer {
	/*
	background:				url("../img/pba-blur.jpg");
	background-position:	center;
	background-size:		cover;  
	background-attachment: 	fixed;
	*/
}

/* Sesssion */
#session h1 {
	color:	white;
}

/* Filtres par tag */
#filtres {
	padding:				10px;
	background:				rgba(255,255,255,.25);      
	box-shadow:				0 2px 3px rgba(0,0,0,.1);      
	text-align:				center;
}
#filtres .filtreType {
	color:					black;
	padding:				5px;
	margin-left:			15px;
}
#filtres .filtreTag {
	background-color:		#636363;
	color:					white;
	padding:				5px;
	margin:					2px 0px 2px 5px;
	-webkit-border-radius: 	10px;
	-moz-border-radius: 	10px;
	border-radius: 			10px;
}
#filtres .filtreTag:hover {
	background-color: 		#004899;
}
#filtres .filtreTag.selected {
	background-color:		#FFC114;
	color:					black;
}



/* Zones d'affichage des dessins */
.images {
	text-align: 			center;  
	background:none;
}
#imagesContainer {
	padding:				0px 0px 10px 0px;
}



/* Zones d'affichage d'un dessin */
.image {
	text-align: 			center;
}
#enlarge .image {
	padding:				0px 0px 5px 0px;
}
#images .image {
	padding:				5px;
	margin:					20px;
	background-color:		#FFFFFF;
	color:					#9C948C;   
	box-sizing: 			border-box;
	width:					100%;
    width: 					-moz-calc(100% - 40px);
    width: 					-webkit-calc(100% - 40px);
    width: 					-o-calc(100% - 40px);
    width: 					calc(100% - 40px);
	max-width:				250px;   
	border-radius:			3px;              
	box-shadow:				0 2px 5px rgba(0,0,0,.25);
}      
#images .image:hover {
	background-color: 		#EECCBA;    
	color:					#000;      
	/*background-color: 		#EEE; 
	color:					#444;   */  
}    



/* Autre navigation */
.images #moreResults {
	margin-top:				20px;
	margin-bottom:			20px;
	background-color:		#646464;
	padding:				10px;
	width:					150px;   
	font-size:				14px; 
	line-height:			18px;
	border-radius:			5px;
}          
.images #moreResults:hover {            
	background-color:		#444949;    
}



/* Modération */
.infos .moderation {
	font-size:				9px;
	padding-bottom: 		5px;
	text-transform:			uppercase;
}
.locationLink  {
	text-align:				right;
	text-transform:			uppercase;
}



/* Infos liées à l'image */     

#subHeaderMenu {
	width:					100%;
	min-height:				50px;
	background:				black;
	box-shadow:				0 2px 3px rgba(0,0,0,.1);      
	text-align:				center;
	color:					white;
}                    

#subHeaderMenu .print, #subHeaderMenu .save, #subHeaderMenu .close {
	font-size:				10px;
	text-transform:			uppercase;
	line-height:			50px;
	cursor:					pointer;   
	display:				inline-block; 
	margin:0 0 0 10px;      
}    
#subHeaderMenu .date {
	font-size:				12px;
	text-transform:			uppercase;
	line-height:			50px;
	cursor:					pointer;   
	display:				inline-block; 
	margin:0 10px;
}    
#subHeaderMenu .tags {
	font-size:				12px;
	text-transform:			uppercase;
	line-height:			50px;
	cursor:					pointer;   
	display:				inline-block; 
	margin:					0 10px;      
}

.fb-share-button, #twitter-share-button {
	line-height:			50px;
}  

 
.infos .titre {
	font-size:				11px;
	line-height:			30px;
	text-transform:			uppercase;
	padding-top:			5px;
}  
#images .infos {
	position:				relative;
}
#images .webcamIcon, #images .forbiddenIcon {
	position:				absolute;
	height:					32px;
	top:					-245px;
	left:					0px;
}

#images .image {
	pointer-events:			auto;
}
#images .dessin {   
    width:					100%;
}


#enlargeContainer {
   /* background-color:		rgb(242, 241, 237);   */   
	padding-bottom:			100px;
} 


#enlarge img.dessin { 
	background-color:		transparent;  
	border-radius:			3px;              
/*	margin-bottom:			-3%;     */
	display:				inline-block;         
	background-image:		url("../img/bolduc.png");
	background-size:		contain;
}
#enlarge .watermark {
	/*margin-top:				-90px;
	/*height:					70px; */
	margin-bottom:			50px; 
	width:					5%;
	opacity:				1;
}
#enlarge .photosContainer {
	position:				relative;
}
#enlarge .webcamIcon, #enlarge .forbiddenIcon {
	position:				absolute;
	height:					32px;
	top:					30px;
	margin-left:			-600px;
}
.copyrightForbidden {
	color:					red;
}

#enlarge .webcamImg {    
	/*height:				254px;*/
	border-radius:			3px;              
}
#enlarge .message {
	margin-top:				10px;
	font-size:				14px;
}

#enlarge .first {
	max-height:				calc(100vh - 200px);
	width:					auto;
	margin-top:				50px;
}
#enlarge .second {
	max-width:				500px;
	width:					60%;
	margin-top:				30px;
}


/* Fond de l'image (au cas où image PNG transparent) */
#images .imageBackground  { 
	background-size:	200%;  
	background:none;
}
.imageBackground0  { background-image: url('../img/papier-0.jpg'); }
.imageBackground1  { background-image: url('../img/papier-1.jpg'); }
.imageBackground2  { background-image: url('../img/papier-2.jpg'); }
.imageBackground3  { background-image: url('../img/papier-3.jpg'); }
.imageBackground4  { background-image: url('../img/papier-4.jpg'); }
.imageBackground5  { background-image: url('../img/papier-5.jpg'); }
.imageBackground6  { background-image: url('../img/papier-6.jpg'); }
.imageBackground7  { background-image: url('../img/papier-7.jpg'); }
.imageBackground8  { background-image: url('../img/papier-8.jpg'); }
.imageBackground9  { background-image: url('../img/papier-9.jpg'); }
.imageBackground10 { background-image: url('../img/papier-10.jpg'); }



/* CSS spécifique */
#code {
	background-color:		white;
	color:					black;
	padding-top:			40px;
	padding-bottom:			40px;
	text-align:				center;
	-webkit-touch-callout:  none;
	-webkit-user-select:    none;
	-khtml-user-select:     none;
	-moz-user-select:       none;
	-ms-user-select:        none;
	user-select:            none;
}
#pincode {
	padding-bottom:			20px;
}

.touche {
	font-size:				40px;
	display:				inline-block;
	vertical-align:			middle;
	background-color:		#C8C8C8;
	margin:					0px 10px 0px 10px;
	width:					60px;
	height:					60px;
	line-height:			60px;
	-webkit-border-radius: 	30px;
	-moz-border-radius: 	30px;
	border-radius: 			30px;
	cursor:					pointer;
}
.touche.digit {
	background-color:		transparent;
	margin:					0px 0px 0px 0px;
	font-size:				80px;
}
.touche.cancel {
	background-color:		#D70005;
	color:					white;
}
.touche.valide {
	background-color:		#68C028;
	color:					white;
}
#reboot {
	margin-top:				30px;
	text-transform:			uppercase;
	cursor:					pointer;
}
#reboot:hover {
	text-decoration:		underline;
}

.insivible {
	display:				none;
}


/* Rating */
.rating img {
	width:					16px;
}
#enlarge .rating {
	display:				inline-block;
	padding-left:			30px;
	margin-left:			30px;
	border-left:			1px solid white;
}


/* Upload manuel */
.upload {
	text-align:				left;
	margin:					10px 0px 0px 20px;
}

/* Statistiques */
table#statistiquesTable, table#statistiquesFilesTable {
	width:				100%;
}
#statistiquesTable tr, #statistiquesFilesTable tr {
	
}
#statistiquesTable tr th, #statistiquesTable tr td, #statistiquesFilesTable tr th, #statistiquesFilesTable tr td {
	padding:			3px 10px 3px 10px;
	text-align:			center;
	vertical-align:		middle;
	width:				100px;
}
#statistiquesTable tr th, #statistiquesFilesTable tr th {
	padding:			10px;
	background-color:	#505050;
	color:				white;
}
#statistiquesTable tr td, #statistiquesFilesTable tr td {
	
}
#statistiquesForm {
	background-color:#fff;
	color:#000;         
	padding:	20px;     
}

.depliableTitle, #displayHidden {
	cursor:					pointer;
}
.depliable {
	display:				none;
}
.depliableTitle {
	margin-top:				10px;
}               


/* Modération */                      
.moderationRefused .moderation, .moderationRefusedNegative .moderation {
	color:					#97D126;
}
.moderationRefused, .moderationRefusedNegative {
	opacity: 				0.5;    
}
.moderationRefusedNegative {
	opacity: 				0.5;
}   
#images .moderationRefusedNegative {
	display:				none; 
	/*display:				inline-block;  */
} 
#images .showHidden .moderationRefusedNegative {
	display:				inline-block;  
}   

/* Bulle */
#bgVideoPopup {
	position:	absolute;
	width:  	100%;
	height:  	100%;
	background-color:	rgba(0, 0, 0, 0.8);
	display:	none;
}
#bgVideoPopup iframe {
	position:	absolute;
	top:		10vh;
	left:		10vw;
	width:		80vw;
	height:		45vw;
}



/* Header */ 
#moderaheader {
	margin:	20px;
}
#moderaheader h2 {
	padding-bottom:	10px;
}
#moderaheader h2:hover {
	text-decoration: underline;
}
#manualUploadForm input[type=text], #manualUploadForm input[type=number] {
	background-color:	rgba(255, 255, 255, 0.2);
	color:				white;
	padding:			2px;
	text-align:			center;
}
#statistiquesFilesPlaceholder a:hover {
	text-decoration:	underline;
}


/* Print */
#printBtn {
	margin-top:			10px;
	margin-bottom:		10px;
}
#printImg {
	height:				250px;
}