#realisation {
	width: 84%;
/* 	height: 100px; */
	margin: 0 auto;
}

#realisation div.back {
	position: absolute;
	top: 0;
	left: 0;
	height: 1000px;
	display: none;
	width: 150%;
	background: var(--color-back-shadow);
	z-index: 2;
/* 
	background: repeating-radial-gradient(circle at 100%, #333, #333 10px, #eee 10px, #eee 20px);
	background: repeating-conic-gradient(gold, #f06 17deg);
	background: linear-gradient(red, white -83%, black 150%, blue);
	background: repeating-conic-gradient(black 0deg 25%, white 0deg 50%);
	background-size: 60px 60px;
	background: conic-gradient(hsl(0,0%,87.5%), white 45deg, black 225deg, hsl(0,0%,87.5%));
	background: conic-gradient(from 45deg, white, black, white);
 */
}

#realisation div.body {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

#realisation section {
	position: relative;
	margin: 20px 20px 60px;
}

#realisation img:first-child {
	position: inherit;
	cursor: pointer;
	opacity: 1;
}

#realisation img {
	position: absolute;
	width: 400px;
	left: 0;
	opacity: 0;
	z-index: 1;
	padding: 16px;
	
	box-shadow: var(--shadow);
	border-radius: 16px;
/* 	background-color: hsl(0, 0%, 98%); */
}

article.home {
	display: flex;
	flex-direction: column;
}

article.home section {
	margin: 10px 50px;
}

article.home div {
	display: inline-block;
	width: 150px;
	margin-right: 10px;
	text-align: center;
}

article.home div img {
	height: 100px;
}

article.home span {
	display: inline-block;
	width: 75%;
}

.construction {
	display: none;
}
.construction {
	transform: rotate(-14deg);
	margin: 0 auto;
	height: 120px;
	width: 320px;
	background-color: yellow;
	text-align: center;
	padding: 12px 0;
	background: repeating-linear-gradient(135deg, black, black 20px, yellow 20px, yellow 40px);
}
.construction div {
	background-color: yellow;
}
.construction span {
	vertical-align: middle;
	text-transform: uppercase;
	font-family: impact;
	font-size: 40px;
	line-height: 60px;
	font-weight: 900;
}