/* ============ templater, clear =============== */
/* ============ ================ =============== */
/* D33E42 */
/* ============ ================ =============== */
:root {
	/*
	--primary-color: #A0D683;
--secondary-color:#72BF78; */
--primary-color: #C7E1E5;
--secondary-color:#40534C;
}
body{
	padding-top:5px;
	/* color:#909C97; */
	font-size:90%;
	font-family:Tahoma;
	font-weight:400;
	background-size: 100%;
	background-color:rgb(92, 90, 90);
	/*
	background: url("break.png") no-repeat bottom center, linear-gradient(to right, #1C1E33, #8A282C) ;*/
	 --scrollbarBG: #CFD8DC;
  --thumbBG: #90A4AE;

  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
.corps{
	overflow:hidden;
	/* border-radius:20px 20px; */
	/* background-color:var(--primary-color); */
}
.box{
	/* padding-bottom:200px; */
	border-radius:20px;
}
h1{} h2{background-color:;
	text-decoration: underline dotted #047C8F;
	}
p{
	width:95%;
	padding:0;
	margin:0;
	text-align:justify; 
	text-justify:newspaper;
	border-radius:4px 4px;
}
b{
	/*background-color:#F3DDC8;
	*/
}
a{
	/* color:#111; */
	font-display:bold;
	/* text-decoration:underline; */
	/* background-color:#7489AF; */
}
a:hover{
	color:#fff;
	background-color:#DB995A;
	text-transform: uppercase;
}
/* Reset CSS */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
img {
	max-width:110%;
	vertical-align: middle;
	display: inline-block;
	/* background: rgba(100, 100, 100, 0.95); */
}
.imgdiv {
	position: relative;
}
.overlay {
	font-family:Arial;
	position: absolute;
	bottom: 0;
	background: rgba(12, 12, 12, 0.5);
	width: 100%;
	transition: .5s ease;
	opacity:0;
	color:#D1D1D1;
	font-size: 16px;
	padding: 20px;
	text-align: center;
}
.imgdiv:hover .overlay {
	opacity: 1;
}
.nor:has(img) {
}
/* merci a csstricks pour le 'has' !!! https://css-tricks.com/the-css-has-selector/	 */
.grid-wrp {
	display:block;
	width:75%;
	margin:0em auto;
	/* background-color:#998E8D; */
	/* box-shadow:3px 3px 5px #998E8D; */
	background-color: #FACA20;
	background-image:url("2024-12fond02.png");
	background-repeat:repeat-x;
	background-position: bottom center;
	background-size: cover;
	
}
.lhed {color:;text-background:#047C8F;background-color:#efefef;background-image:none;}
.lhed p{color:#047C8F;}
.grid-wrp p{width:80%;margin:0 auto;
}
/* Main CSS */
.grid-wrapper > div {
	display: flex;
	justify-content: center;
	align-items: center;
	overflow:hidden;
	padding:1em;
	/* background-color:#E0E0E0; */
	/* border:1px solid #111; */
}
.grid-wrapper > div > p{
	min-height:110px;
}
.grid-wrapper > .nor,.wwide,.wide {
	/* background-color:rgba(0, 0, 0, 0.7); */
}
.grid-wrapper > div a,
.grid-wrapper > div > a > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.grid-wrapper > div.ng {
	grid-column: span 4;grid-auto-rows: 100px;height:100px;
}
.grid-wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	grid-auto-rows: 125px;
	/* grid-gap:10px; */
	width:75%;
	margin:0em auto;
	background: var(--primary-color);
	background-image:url("2024-12fond01.png");
	background-repeat:repeat-x;
	background-position: bottom center;
	background-size: cover;
}
.fug .nor{
	grid-row: span 2;
}
.grid-wrapper .nor {
	grid-column: span 1;
}
.grid-wrapper .wwide {
	grid-column: span 4;
}
.grid-wrapper .wide {
	grid-column: span 2;
}
.grid-wrapper .tall {
	grid-row: span 2;
}
.grid-wrapper .talll {
	grid-row: span 2	;
}
.grid-wrapper .big {
	grid-column: span 2;
	grid-row: span 2;
}
.box:nth-last-child{
	/* padding-bottom:200px; */
}
/* media queries paster = */
@media screen and (max-width: 960px)
{
	body{font-size:95%;}
	p, h2{
		padding:0 0 1em;
	}
	.grid-wrapper p, .grid-wrp p {width:90%;
		}
	.box{width:100%;}
	.grid-wrp {
		display:block;
		width:100%;
		margin:0em auto;
	}
	.grid-wrapper .wwide {
		grid-row: span 1;
	}
	.grid-wrapper {width:100%;
		grid-auto-rows: 190px;
		margin:0em auto;
		grid-gap: 15px;
		}
	.grid-wrapper div{padding:11px;}
	.grid-wrapper .talll {
		grid-row: span 4	;
	}
	.corps{
		width:100%;
		grid-auto-rows: 180px;
		/* border: 3px dashed #72BF78; */
		/* border-radius:15px 15px; */
	}
	img {
		}
}
@media screen and (min-width: 1081px)
{
	body{font-size:95%;}
	p, h2{
		padding:0 1em;
	}
	.box{width:100%;padding:0;}
	.corps{
		/* border-radius:20px 20px; */
		}
	.grid-wrp {
		display:block;
		width:90%;
		margin:0em auto;
	}
	.grid-wrapper .wwide {
		grid-row: span 2;
	}
	.grid-wrapper {
		display: grid;
		/* grid-gap: 15px; */
		grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
		grid-auto-rows: 105px;
		width:90%;
	margin:0em auto;}
	.grid-wrapper div{padding:0;}
	.mak{
		width:100%;
		grid-auto-rows: 100px;
	}
	img {
	}
}
@media screen and (min-width:1260px) {
	.corps{width:80%;margin:0 auto;	
	/* border: 3px dashed #72BF78; */
	border-radius:30px 30px;
	}
	body{font-size:100%;}
	.box{
		margin:0 auto;
		padding:0 4.5em;
	}
	.grid-wrapper {
		grid-auto-rows: 120px;
		grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	}
}