body {
	background-color:#333;
	margin-left:0px;
	margin-right:0px;
	margin-bottom:0px;
	font-family:Arial;
}





/* STYLE POUR HEADER */

#header {

	margin-left:6px;
	margin-right:6px;
	margin-bottom:8px;
	padding:1px;
	color: #333;
	background-color:#fff;
	background:url(img/extra_clean_paper.png);
	text-align:center;
}

#menu a {
	color:#fff;
	text-decoration:none;
}

#menu a:hover {
	text-decoration:underline;
}

#header h1 {
	margin-bottom:0px;
}

#menu h2 {
	padding-top:8px;
	padding-bottom:8px;
	margin-top:0px;
	background-color:#333;
}

#header h3 {
	margin-bottom:0px;
}

#menu {
	background-color:#333;
	color:#fff;
}

#contact {
	position:absolute;
	right:20px;
	top:20px;
	color:white;
}

/* STYLE POUR MAIN CONTENT */

#main {
	font-size:0.9em;
	margin-top:100px;
	margin:0px;
	background-color:#555;
	color:#fff;
	background-image:url(img/green_cup.png);
}

.content {
	color:#222;
	border-left: 1px black solid;
	border-right: 1px black solid;
	border-bottom: 1px black solid;
	background-image:url(img/vintage-concrete.png);
	background-color:#ddd;
	padding-left:2%;
	padding-right:2%;
	padding-top:4px;
	padding-bottom:4px;
	margin:auto;
	width:80%;
}

.title {
	text-align:center;
}

.content p {

	margin:auto;
	width:85%;
	text-align:justify;
}

.frag {
	max-width:48%;
	display:inline-block;
	vertical-align:top;
}

.fragmini {
	margin: 10px;
	/*max-height:160px;*/
	max-height:200px;
	padding:4px;
	text-align:center;
	vertical-align:top;
	background-color:white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.frontmini {
	margin: 10px;
	/*max-height:160px;*/
	max-height:300px;
	padding:4px;
	text-align:center;
	vertical-align:top;
	background-color:white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.imgtxt {	
	width:100%;
	margin:auto;
	text-align:center;
	font-size:0.9em;
}


.commentaire {
	display:inline-block;
	width:auto;
}

.left {
	float:left;
}

.right {
	float:right;
}

.line {
margin-top:14px;
width:100%;
border-bottom:solid 1px grey;
}

.container {
width:100%;
margin:auto;
}

#distinctions {
width:75%;
display:inline-block;
vertical-align:top;
}

#illustrations {
width:24%;
display:inline-block;
vertical-align:top;
}

/* STYLE POUR IMAGES */

.photos {
	text-align:center;
	margin:auto;
}

.triptik {
	max-width:30%;
	max-height:200px;
	display:inline-block;
	vertical-align:top;
	background-color:#fff;
	padding:8px;
	margin:5px;
	border:1px solid #777;
}

#print {
	background-color:#fff;
	background-image:url(img/green_cup.png);
	text-align:center;
	overflow:hidden;
}

.mini {
	background-color:#fff;
	padding:8px;
	vertical-align:top;
	margin:5px;
	border:1px solid #777;
	max-height:200px;
	max-width:100%;
	display:inline-block;
}

#print .mini:hover {
	border:1px solid white;
	cursor:selector;
}

.full {
	width:100%;
	border:1px solid #777;
	background-color:#fff;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.front {
	width:70%;
	margin:auto;
}

/* STYLE POUR FOOTER */

#footer {
	text-align:center;
	background-color:#111;
	color:darkorange;
	width:100%;
}

.sec {
	color:#eee;
	background-color:#000;
	width:20%;
	display:inline-block;
}

/* MEDIA MEDIA MEDIA MEDIA MEDIA MEDIA */

@media (max-width: 880px) {

	.frag {
		max-width:96%;
		display:block;
	}


}

@media (max-width: 700px) {


	#distinctions {
	width:100%;
	}

	#illustrations {
	display:none;
	}

	#contact {
	position:relative;
	top:0px;
	right:0px;
	color:black;
	}

	.triptik {
	display:block;
	max-width:90%;
	max-height:100%;
	margin-left:auto;
	margin-right:auto;
	}

	.content {
		width:88%;
	}

	.content p {
		width:98%;
	}

	.fragmini {
		float:none;
		max-height:none;
		max-width:80%;
		margin:auto;
	}

}

@media (max-width: 530px) {

	.frontmini {
	margin:0px;
	padding:0px;
	max-width:100%;
	}

}

@media (max-width: 400px) {

	.mini {
	margin:0px;
	padding:0px;
	}

}
