/* Page */
html, body {
    font-family:    		'Open Sans';
  	font-weight: 			400;
	font-size:	 			11px;
	background-color: 		white;
	color: 		 			black;
	text-align:				center;
}

p a, .link {
	color: 					#0F81FE;
	cursor:					pointer;
}
p a:hover, .link:hover {
	text-decoration:		underline;
	cursor:					pointer;
}


/* Header */
#header, #footer {
	font-size:	 			12px;
	line-height:			1.5em;
}
#header {
	background:				#FFFFFF url('../img/paperXL.jpg') center 0px repeat-y;
	padding:				30px;
	padding-top:			10px;
	padding-bottom:			10px;
	border-bottom:			1px solid #0F81FE;
	text-align:				left;
}
#footer {
	background:				#323232;
	border-top:				1px solid #0F81FE;
	color:					#808080;
	font-size:				10px;
	
}
#header h1, #footer h1 {
	font-size:	 			60px;
	/*text-shadow: 			2px 2px 2px rgba(0, 0, 0, 0.3);*/
	padding-bottom:			10px;
	margin-bottom:			20px;
	margin-left:			-5px;
  	font-weight: 			300;
	color:					#0F81FE;
	line-height:			50px;
}
#header h1 span {
	font-size:				25px;
	padding-left:			10px;
	font-family:			'Marker Felt';
	font-style:				italic;
	color:					#E46A24;
}
#header p, #footer p {
	padding:				10px 10px 10px 10px;
	margin:					0px 0px 0px -10px;
}

#header h2, #footer h2 {
	font-size:	 			18px;
  	font-weight: 			100;
	text-transform:			uppercase;
	padding:				10px 0px 10px 0px;
}
#header h2.question {
	padding-top:			10px;
}
#header .reponse {
	display:				none;
}
#logo {
	max-width:				500px;
	width:					calc(100% - 15px);
	padding-left:			15px;
}
#langues {
	text-align:				right;
	padding:				0px 15px 0px 0px;
	margin:					0px 10px 0px 0px;
	text-transform:			uppercase;
	font-size:				10px;
}
@media screen and (max-width: 640px) {
	#langues {
		padding-bottom:		20px;
	}
	#header {
		padding:			0px 20px 20px 5px;
	}
}
/*Slideshow*/




.questionContact p, .questionContact img {
	text-align:				center;
}
.questionContact img {
	height:					50px;
}
.questionContact {
	text-align:				center;
}
.questionContact p {
	display:				inline-block;
	vertical-align:			top;
	width:					250px;
}




.questions, .explications {
	text-align:				left;
}
.questionsBlock, .explicationBlock {
	vertical-align:			top;
	display:				inline-block;
	max-width:				calc(49% - 20px);
	width:					100%;
	margin:					5px 10px 5px 10px;
}
.questionsBlock {
	max-width:				calc(49% - 20px - 30px);
	padding:				15px;
	border:					1px solid black;
}
@media screen and (max-width: 640px) {
	.questionsBlock, .explicationBlock {
		max-width:				100%;
		width:					100%;
	}
	.questionsBlock {
		max-width:				calc(100% - 30px);
		width:					calc(100% - 30px);
	}
}


#videoContainer {
	margin-top:				10px;
}
.videoTab {
	display: 				none;
}
#videoMenu {
	text-align:				center;
}
#videoMenu span {
	text-transform:			uppercase;
	margin:					0px 5px 0px 5px;
}
#videoMenu span.selected {
	font-weight:			bold;
	color:					#FB3B06;
}



.questionsBlock:hover {
	border-color:			#0F81FE;
	color:					#0F81FE;
}
.questionsBlock:hover .question {
	color: 					#0F81FE;
}
#header .videoTypomatic {
	position: 			 relative;
	padding-bottom: 	 57%;
	height: 			 0;
	overflow: 			 hidden;
}
#header .videoTypomatic iframe {
	width:				 100%;
	height:				 100%;
	position: 			 absolute;
	top:				 0;
	left:				 0;
}
#header p.videoTypomaticCredits {
	margin-top:				0px;
	padding-top:			0px;
	font-size:				9px;
}


.questionsBlock .question {
	text-align:				center;
}
.questionsBlock div {
	width:					100%;
	text-align:				left;
}

ul {
	margin-left:			10px;
}
li {
	margin-left:			10px;
	list-style-type:		disc;
	padding-bottom:			5px;
}
#header ul {
	padding:				10px 10px 10px 10px;
	margin:					0px 0px 0px -10px;
}


/* Autre */
.gm-style .gm-style-iw h2, .gm-style .gm-style-iw p {
	color:					#0F81FE;
    font-family:    		'Open Sans';
  	font-weight: 			400;
	font-size:	 			11px;
}
.gm-style .gm-style-iw h2 {
  	font-weight: 			700;
	font-size:	 			14px;
}
.gm-style .gm-style-iw p {
  	font-weight: 			400;
	font-size:	 			11px;
}


/* Filtres par tag */
#filtres {
	background-color:		rgba(0, 0, 0, 0.2);
	color:					black;
	padding:				10px;
	text-align:				center;
}
#filtres .filtreType {
	color:					white;
	padding:				5px;
	margin-left:			15px;
}
#filtres .filtreTag, #filtres #filtreSearch {
	background-color:		rgba(0, 0, 0, 0.2);
	color:					white;
	padding:				5px;
	margin:					2px 0px 2px 5px;
	-webkit-border-radius: 	10px;
	-moz-border-radius: 	10px;
	border-radius: 			10px;
	border:					0px solid transparent;
	text-align:				center;
}
#filtres .filtreTag.hover {
	background-color: 		#7DB7FA;
}
#filtres .filtreTag:hover /*, #filtres #filtreSearch:hover*/ {
	background-color: 		#0F81FE;
}
#filtres .filtreTag.selected, #filtres #filtreSearch.selected {
	background-color:		#FB3B07;
}



/* Zones d'affichage des dessins */
.images {
	text-align: 			center;
}
#textureBackground, #enlarge {
	background:				url('../img/bois.jpg') repeat;
}


/* Zones d'affichage d'un dessin */
.image {
	text-align: 			center;
}
#enlarge .image {
	padding:				0px 5px 5px 5px;
}
#images .image {
	padding:				5px;
	margin:					25px 15px 35px 15px;
	color:					#4F4F4F;
}      
#images .image:hover {
	color: 					#0F81FE;
}

#images .image .deroule {
	-moz-box-shadow: 		0px 0px 10px 0px rgba(0, 0, 0, 0.7);
	-webkit-box-shadow: 	0px 0px 10px 0px rgba(0, 0, 0, 0.7);
	-o-box-shadow: 			0px 0px 10px 0px rgba(0, 0, 0, 0.7);
	box-shadow: 			0px 0px 10px 0px rgba(0, 0, 0, 0.7);
}
#enlarge .image .deroule {
	-moz-box-shadow: 		0px 0px 10px 0px #000;
	-webkit-box-shadow: 	0px 0px 10px 0px #000;
	-o-box-shadow: 			0px 0px 10px 0px #000;
	box-shadow: 			0px 0px 10px 0px #000;
}



/* Autre navigation */
.images #moreResults {
	color:					white;
	margin-top:				20px;
	margin-bottom:			20px;
	background-color:		rgba(0, 0, 0, 0.4);
	padding:				10px;
	width:					100px;
}



/* 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 */
.infos .titre {
	font-size:				12px;
	text-transform:			uppercase;
	padding-bottom:			5px;
  	font-weight: 			600;
}
.infos.minimalist .titre {
	font-size:				8px;
}
.infos .date {
	padding-bottom:			5px;
	line-height:			13px;
}
.infos.minimalist .date {
	font-size:				8px;
}
.infos .tags {
	text-transform:			uppercase;
	padding-bottom:			5px;
	line-height:			11px;
}
.infos.minimalist .tags {
	font-size:				8px;
}

.infos .fb-share-button {
	padding-top:			3px;
}

.infos .print, .infos .close, .infos .save {
	text-transform:			uppercase;
	padding-bottom:			5px;
	cursor:					pointer;
}
#enlarge .infos {
	color:					black;
	text-align:				right;
	padding:				10px;
	vertical-align:			baseline;
}
#enlarge .infos .titre {
	font-size:				16px;
}
#enlarge .infos.mobile {
	padding:				5px;
}
#enlarge .infos .titre, #enlarge .infos .date, #enlarge .infos .tags, #enlarge .infos .print, #enlarge .infos .close, #enlarge .infos .social {
	padding-top:			15px;
}
#enlarge .infos .print, #enlarge .infos .save {
	padding-top:			25px;	
}
#enlarge .infos .close {
	padding-top:			20px;	
}








/* Fond de l'image (au cas où image PNG transparent) */
#images .imageBackground  { 
	background-size:	200%;
}
.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 */
.deroule {
	margin:					auto;
}

.image .deroule {
	position:				relative;
	padding-bottom:			5px;
}
.image .deroule div {
	position:				absolute;
	top:					0px;
	left:					0px;
}

#enlarge .deroule {
	display:				inline-block;
	-webkit-touch-callout: 	none;
	-webkit-user-select: 	none;
	-khtml-user-select: 	none;
	-moz-user-select: 		none;
	-ms-user-select: 		none;
	user-select: 			none;
}

.image .deroule .shadow {
	-webkit-transition: -webkit-box-shadow 1s;
	transition: -webkit-box-shadow		   1s;
	-webkit-transition: -moz-box-shadow    1s;
	transition: -moz-box-shadow 		   1s;
	-webkit-transition: -box-shadow 	   1s;
	transition: -box-shadow 			   1s;
}
.image .deroule .shadowBottom {
	-webkit-box-shadow: 	0px  10px 15px 0px 	rgba(0,0,0,0.15);
	-moz-box-shadow:    	0px  10px 15px 0px 	rgba(0,0,0,0.15);
	box-shadow:         	0px  10px 15px 0px 	rgba(0,0,0,0.15);
}
.image .deroule .shadowTop {
	-webkit-box-shadow: 	0px -10px 15px 0px 	rgba(0,0,0,0.15);
	-moz-box-shadow:    	0px -10px 15px 0px 	rgba(0,0,0,0.15);
	box-shadow:         	0px -10px 15px 0px 	rgba(0,0,0,0.15);
}
.image .deroule .noShadow {
	-webkit-box-shadow: 	0px 0px 15px 0px 	rgba(0,0,0,0.0001);
	-moz-box-shadow:    	0px 0px 15px 0px 	rgba(0,0,0,0.0001);
	box-shadow:         	0px 0px 15px 0px 	rgba(0,0,0,0.0001);
}

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