body{font-size:80%;
			background: rgb(2,0,36);
			background: linear-gradient(67deg, rgba(0,0,0,1) 0%, rgba(2,0,36,1) 5%, rgba(65,9,121,1) 35%, 
			rgba(125,122,177,1) 57%, rgba(0,83,255,1) 90%, rgba(246,240,193,1) 100%);
			font-family:Verdana;
			color:#efefef;
			}
			h1{}
			p, h2{
			color:#999;padding:10px;
			line-height: 17px;
			text-align:justify; text-justify:newspaper;
			background: rgba(100, 100, 100, 0.25);
			}
			h2{margin-bottom:10px;color: #cb5b15;}
			/* Reset CSS */
			* {
			margin: 0;
			padding: 0;
			box-sizing: border-box;
			}
			img {
			max-width: 120%;
			height: auto;
			vertical-align: middle;
			display: inline-block;
			}
			/* */
			/* add imgcaption */
			/* {box-sizing: border-box;} */
			.imgdiv {
			position: relative;
			}
			.image {
			display: block;
			width: 100%;
			height: auto;
			}
			.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: 20px;
			font-weight: bolder;
			padding: 20px;
			text-align: left;
			}
			.imgdiv:hover .overlay {
			opacity: 1;
			}
			/* */
			/* Main CSS */
			.grid-wrapper > div {
			display: flex;
			justify-content: center;
			align-items: center;
			overflow:hidden;
			background-color:#111;
			/* border-bottom:1px solid #cb5b15; */
			padding:5%;
			}
			.wwide:empty {
			background-color:#888;
			}	
			.grid-wrapper:last-child {
			border-style: dashed;
			border-left:none;border-right:none;
			border-width: 3px;
			}
			.grid-wrapper > div a,
			.grid-wrapper > div > a > img {
			<!-- width: 100%; 
			height: 100%;-->
			<!-- border-radius: 5px; -->
			object-fit: contain;
			}
			.grid-wrapper > div a:hover{
			border:2px solid white;
			}
			.grid-wrapper {
			display: grid;
			grid-gap: 0px;
			grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
			grid-auto-rows: 100px;
			grid-auto-flow: dense;
			width:100%;
			margin:0em auto;
			}
			.box{
			background-image:url("img/the_fond.png");
			background-attachment: local, scroll;
			background-size:contain;
			padding:7.5em;
			background-repeat: no-repeat;
			display: grid;
			width:90%;
			margin:3.5em auto;
			border-color: #cb5b15;
			color: #cb5b15;
			}
			.corps{
			box-shadow: 10px 5px 5px #424251;	
			}
			.grid-wrapper .wwide {
			grid-column: span 4;
			}
			.grid-wrapper .wide {
			grid-column: span 2;
			grid-row: span 2;
			}
			.grid-wrapper .tall {
			grid-row: span 3;
			}
			.grid-wrapper .big {
			grid-column: span 2;
			grid-row: span 2;
			}
			@media screen and (max-width: 1081px) {
			/* pour version petit */
			body{font-size:75%;}
			p, h2{line-height: 16px;padding:0;}
			.box{width:100%;padding:0;}
			.grid-wrapper {width:100%;
			margin:0em auto;}
			.grid-wrapper div{padding:0;}
			.mak{
			width:100%;
			grid-auto-rows: 100px;
			}
			img {
			max-width: 170%;}
			}
			@media screen and (min-width:1260px) {
			/* pour version moyen */
			body{font-size:80%;}
			.box{width:90%;margin:0 auto;padding:8.5em;}
			}
			/* .grid-wrapper{margin-bottom:200px;} */