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

Couleur primaire orange : rgb(255,116,59) ou #FF743B 
font-family : caviardreams

*/

.indexContainer { width:100%; display:flex; flex-wrap:wrap; padding:1em; justify-content:space-between; }
	.indexContainer-box { width:31.3333%; margin:1%; display:flex; flex-wrap:wrap; padding:1em; background-color:rgba(0,0,0,0.5); align-content:space-between; }
		.indexContainer-box-text { width:100%; display:flex; flex-wrap:wrap; }
			.indexContainer-box-text h3 { width:100%; margin:0; padding:0; }
			.indexContainer-box-text p { width:100%; }
		.indexContainer-box-link { width:100%; display:flex; flex-wrap:wrap; justify-content:center; }
			.indexContainer-box-link a:link, .indexContainer-box-link a:visited { background-color:rgba(255,116,59); color:#FFFFFF; padding:0.5em 1em; }
			.indexContainer-box-link a:hover, .indexContainer-box-link a:active { background-color:#666666; }

	
.indexNews { width:98%; margin:1%; display:flex; flex-wrap:wrap; padding:1em; background-color:rgba(0,0,0,0.5); }
	.indexNews-title { width:100%; display:flex; flex-wrap:wrap; }
		.indexNews-title h3 { margin:0; padding:0; }
	.indexNews-box { width:100%; margin:1em 0; display:flex; flex-wrap:wrap; justify-content:space-between; }
		.container { position:relative; width:31.3333%; }
		.containerDoc { position:relative; width:19%; }
			.image { display:block; width:100%; height:auto; padding-bottom:18%; background-color:rgba(0,0,0); }
			.imageDoc { display:block; width:100%; height:auto; padding-bottom:35%; background-color:rgba(0,0,0); }
			.overlay { position: absolute; bottom:0; left:0; right:0; background-color:rgba(0,0,0,0.75); overflow:hidden; width:100%; height:20%; transition: .5s ease; }
				.container:hover .overlay, .containerDoc:hover .overlay { height:100%; }
				.container:hover .textInside, .containerDoc:hover .textInside { display:block; }
				.text { width:100%; color:white; font-size:1.25rem; position:absolute; top:50%; left:50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform:translate(-50%, -50%); text-align:center; overflow:hidden; }
					.text h4 { width:100%; margin:0; padding:1em 0.5em; }
						.text h4 a:link, .text h4 a:visited { color:rgba(255,116,59); }
						.text h4 a:hover, .text h4 a:active {color:rgba(255,116,59); }
					.textInside { display:none; padding:0 1em; }
						.textInside div { margin:2em auto 2em auto; padding:0 1em; }
						.textInside p a:link, .textInside p a:visited { color:#FFFFFF; }
						.textInside p a:hover, .textInside p a:active { color:#FFFFFF; }
						a.textInside-link:link, a.textInside-link:visited { padding:0.5em 1em; background-color:rgba(255,116,59); color:#FFFFFF; }
						a.textInside-link:hover, a.textInside-link:active { background-color:#666666; }
	
@media screen and (max-width:1600px) {

}

@media screen and (max-width:1280px) {
	/* 17-19 pouces */
}

@media screen and (max-width:1020px) {
	/* 15 pouces */
}

@media screen and (max-width:600px) {
	.indexContainer-box { width:100%; }
	.container, .containerDoc { width:100%; position:static; display:block; margin-bottom:2em; }
		.image, .imageDoc { padding:0; }
		.overlay { position:static; height:auto; }
			.container:hover .overlay, .containerDoc:hover .overlay { height:auto; }
			.container:hover .textInside, .containerDoc:hover .textInside { display:none; }
			.text { position:static; -webkit-transform:none; -ms-transform:none; transform:none;  }
				.textInside { display:none; }
}