.projet{
padding:2rem 7.5%;
color: var(--blanc)
}
.projet .fond{
position:absolute; left:0; top:0;
width:100%; height:100%;
background-color: var(--vertclair);
filter: grayscale(100%); opacity: 0.3;
}
.projet .filtre{
position:absolute; left:0; top:0;
width:100%; height:100%;
background-color: var(--vertclair);
mix-blend-mode: multiply;
}
.projet .boutons a{
display:block;
max-width:250px;
margin:0.75rem 0;
}
footer{
background-color: var(--noir);
padding:2rem 5%;
color: var(--blanc);
font-size:0.9rem;
}
footer a{
color: var(--vertclair);
}
footer a.picto{
width:65px; height:auto;
margin-bottom:1rem;
display:inline-block;
overflow:hidden;
background-color: var(--blanc);
border:2px solid var(--blanc);
}
footer a.picto:hover{
-webkit-transform: scale(1.075); transform: scale(1.075);
}
footer .picto img{
width:100%
}
footer .ttl{
font-weight:500; color: var(--vertclair);
font-size:1.25rem;margin-bottom:1rem;
}
footer ul{
list-style:none; margin:0; padding:0;
}
footer .rezos ul{
display:flex;
justify-content: start;
flex-wrap: wrap;
margin-top:2rem;
}
footer .rezos ul li{
margin-right:1.5rem; 
}
footer .rezos ul li a{
color: var(--blanc);
width:115px; height:115px;
display: block; border-radius:50%; border:2px solid;
margin-bottom:1rem;
}
footer .rezos ul li a:hover{
background-color: var(--vertclair); border-color: var(--vertclair);
}
footer .rezos ul li a img{
display:inline-block;
width:35px; height:auto;
position:absolute; left:50%; top:50%;
-webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
-webkit-transition:all 0.2s ease; transition:all 0.2s ease;
}
footer .rezos ul li a:hover img{
-webkit-transform: translate(-50%, -50%) scale(1.3); transform: translate(-50%, -50%) scale(1.3);
}
footer .signatures{
font-size:0.75rem;
}
footer .signatures .copyright, footer .signatures .signature{
margin:0.5rem 0;
}
footer .signatures .signature img{
height:0.8rem; width:auto;
}
footer .menu-mentions-container{
border-bottom: 1px solid var(--grismedium);
padding-bottom:0.5rem; margin-bottom:2rem;
}
footer .menu-mentions-container ul li{
margin:0.75rem 0;
}
footer .carte{
background-color: var(--grismedium);
margin:1rem 0;
}
.nav-mobile{
display:block;
position: fixed; left:0; top:0; width:100vw; height: 100vh;
overflow:auto;
background-color: var(--vert); color: var(--blanc);
-webkit-transform: translateX(-100%); transform: translateX(-100%);
-webkit-transition:all 0.5s ease-out; transition:all 0.5s ease-out;
z-index:998;
}
.nav-mobile .menu-principal-container{
display:block;
}
.nav-mobile .menu-principal-container ul ul.sub-menu{
display:none;
}
.nav-mobile.opened{
-webkit-transform: translateX(0); transform: translateX(0);
}
.nav-mobile .inner{
padding:150px 17.5%;
}
.nav-mobile ul{
list-style:none; margin:0; padding:0;
}
.nav-mobile ul li{
text-align:left; text-transform:uppercase;
font-size:1.15rem; font-weight:500;
}
.nav-mobile ul li a{
display: block; padding:1rem 0; border-bottom:1px solid;
color: var(--blanc);  
}
.nav-mobile ul ul.sub-menu li{
text-transform:none; font-weight:300
}
.nav-mobile ul ul.sub-menu li a{
border-bottom:none;
}
.nav-mobile .menu-mentions-container{
margin-top:2rem;
}
.nav-mobile .menu-mentions-container ul li{
text-transform: none; font-size:1rem;
}
@media screen and (min-width:800px){
.avis-mobile{
display:none;
}
}
@media screen and (min-width:1200px){
.nav-mobile{
display:none;
}
}
@media screen and (min-width:1440px){
footer, .projet{
padding-top :3.5rem; padding-bottom:3.5rem
}
}
@media screen and (min-width:1680px){
.projet{
padding-left:15%; padding-right:15%;
}
}
@media screen and (min-width:1921px){
footer{
padding-left:15%; padding-right:15%;
}
}