html {
  scroll-behavior: smooth;
}
body{
	background-color: #E8E6E3;
}
.menu{
	background-color: #E8E6E3 ;
	display: flex;
/*
	flex-wrap:wrap;
*/
}

.container {
	background-color: none ;
	display : flex ;
	flex-wrap:wrap;
}
.colonne{
	background-color: #E8E6E3;
	flex: 1 1 30% ;
	margin: 1vh;
}
.projet{
	filter:greyscale(0);
	mix-blend-mode:none;
}
.projet:hover{
	filter:greyscale(1);
	mix-blend-mode:hard-light;
}
.projet:hover > .block{
	opacity:1;
	transition-duration:0.2s;
}
.block{
	background-color: none ;
	margin: 1vh ; 
	padding:3px; 
	display : inline-block ;
	font-family:garamond bold;
	opacity:0;
	position:absolute;
	margin-left:-30%;
	margin-top:2vh;
	background-color:white;
	/*filter: drop-shadow(0px 0px 5px #fff);*/
	border-radius: 5px;
	transition-duration:0.5s;
}
.element img{
	width:100%;
	max-width:250px;
}
.element{
	background-color: none;
	flex: 1 1 30% ;
	margin: 1vh;
	filter:greyscale(0);
	mix-blend-mode:none;
}
.element:hover{
	background-color: none;
	flex: 1 1 30% ;
	margin: 1vh;
	filter:greyscale(1);
	mix-blend-mode:hard-light;
}

.element2{
	background-color: none;
	flex: 1 1 30% ;
	text-align: right;
	font-size:25px;
	color:#34549B;
	font-family:garamond bold;
	margin: 2vh;
	filter:greyscale(0);
	mix-blend-mode:none;
}
.element2:hover{
	background-color: none;
	flex: 1 1 30% ;
	text-align: right;
	font-size:25px;
	color:#34549B;
	font-family:garamond bold;
	margin: 2vh;
	filter:greyscale(1);
	mix-blend-mode:hard-light;
}
.espace{
	flex:1 1 70%;
}
footer{
	background-color: none ;
	display : flex ;
	flex-wrap:wrap;
	margin-top:15vh;
}

.bigcolonne{
	background-color: none;
	flex: 1 1 20% ;
	margin: 1vh;
}
.bigcolonne2{
	background-color: none;
	flex: 1 1 10% ;
	margin: 1vh;
}
.titre{
	font-size:20px;
	color:#34549B;
	font-family:garamond; 
	margin-bottom:5px;
	margin-top:10px;
	font-weight:bold;
}
.titre-m{
	font-size:17px;
	color:#34549B;
	font-family:garamond; 
	margin-bottom:2px;
	margin-top:5px;
}
.text{
font-family: garamond;
}
img.hover-shadow {
  transition: 0.3s;
}
.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}