:root{
--lighter-grey: #ecf1f0;
--light-grey: #c0c1c1;
--grey: #a7a9ac;
--blanc: #FFFFFF;
--black: #101315;
--gold: #b08208;
--ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1.000);
--ease-out: cubic-bezier(0.215, 0.610, 0.355, 1.000);
--ease-in: cubic-bezier(0.550, 0.055, 0.675, 0.190);
--faster-duration: 0.15s;
--fast-duration: 0.3s;
--duration: 0.6s;
--long-duration: 0.9s;
--circle-top: 50px;
--circle-left: 50px;
--circle-fill-size: 100vh;
--logo-height: 100px;
--header-height: calc(var(--logo-height) + var(--margin-wrap) * 2);
--pagination-height: 80px;
--margin-wrap: 20px;
}
.has-lighter-grey-background-color{
background-color: var(--lighter-grey);
}
[data-ratio] {display: block; max-width: 100%; position: relative}
[data-ratio]:before {content: ''; display: block;}
[data-ratio] > * {display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%;}
[data-ratio='20:9']::before { padding-top: 47.5%; }
[data-ratio='16:9']::before { padding-top: 56.25%; }
[data-ratio='4:3']::before { padding-top: 75%; }
[data-ratio='3:4']::before { padding-top: 133.33%; }
[data-ratio='1:1']::before { padding-top: 100%; }
body{
font-family: 'Poppins', sans-serif;
font-size: 80%;
line-height: 150%;
color: var(--black);
background-color: var(--black);
overflow: hidden;
}
.body--loaded{
background-color: transparent;
overflow: initial;
}
.body--menu, .body--transition{
overflow: hidden;
}
a{
text-decoration: none;
}
a:hover{
color: var(--gold);
}
.broken{
word-break: break-all;
}
.wrapper{
padding-right: var(--margin-wrap);
padding-left: var(--margin-wrap);
box-sizing:border-box;
}
.background-fill{
position: fixed;
top: 0; right: 0; bottom: 0; left: 0;
z-index: 2;
overflow: hidden;
-webkit-transform: translateX(0);
transform: translateX(0);
pointer-events: auto;
transition: -webkit-transform 0s var(--duration);
transition: transform 0s var(--duration);
}
.background-fill--loading{
z-index: 5;
}
.body--loaded .background-fill{
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
transition: -webkit-transform 0s calc(var(--duration) * 2 + var(--duration));
transition: transform 0s calc(var(--duration) * 2 + var(--duration));
pointer-events: none;
}
.body--menu .background-fill, .body--transition .background-fill, .body--lighter-grey .background-fill{
-webkit-transform: translateX(0%);
transform: translateX(0%);
pointer-events: none;
transition: -webkit-transform 0s;
transition: transform 0s;
}
.background-fill__circle{
position: absolute;
top: var(--circle-top); left: var(--circle-left);
width: calc(var(--fill-size) * 2);
height: calc(var(--fill-size) * 2);
-webkit-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
background: var(--black);
border-radius: 50%;
transition: -webkit-transform var(--duration);
transition: transform var(--duration);
transition-timing-function: var(--ease-in-out);
}
.body--menu .background-fill__circle--menu{
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.body--menu-transition .background-fill__circle--menu{
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.background-fill__circle--transition{
background: var(--black);
}
.body--transition .background-fill__circle--transition{
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.background-fill__circle--loading{
background: var(--black);
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.body--loaded .background-fill__circle--loading{
-webkit-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
transition: -webkit-transform var(--duration) var(--duration);
transition: transform var(--duration) var(--duration);
}
.background-fill__circle--lighter-grey{
background: var(--lighter-grey);
}
.agencements .item{
display: flex;
flex-direction: column;
align-items: stretch
}
.card{
display:block;
padding: 0.5rem;
border:1px solid transparent; border-radius:0.35rem;
-webkit-transition:all 0.2s ease; transition:all 0.2s ease;
background-color: transparent;
flex : 1 1 auto
}
.card span{
display:block;
}
.card-vignette{
margin:0 auto;
overflow: clip;
}
.card-body{
padding:0.5rem 0; color: var(--grey);
}
.card-title{
text-transform:uppercase;
font-size:1.10rem; color: var(--gold);
}
.card:hover{
border-color: var(--grey);
}
.img-thumbnail{
border:none;
} .loading{
position: fixed;
top: 50%; left: 50%;
z-index: 5;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
transition: opacity var(--duration);
pointer-events: none;
}
.body--loaded .loading{
opacity: 0;
}
.body--transition .loading{
opacity: 1;
transition: opacity var(--duration) var(--fast-duration);
}
.loading__anim-home{
width: 25px;
height: 40px;
display: none;
}
.body--home .loading__anim-home{
display: block;
}
.loading__screen-1{
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
border: 1px solid #fff;
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s;
-webkit-animation-name: screenin-1;
animation-name: screenin-1;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.loading__screen-2{
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
border: 1px solid #fff;
-webkit-transform: translateX(110%);
transform: translateX(110%);
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s;
-webkit-animation-name: screenin-2;
animation-name: screenin-2;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.loading__swipe{
position: absolute;
top: 45%; left: -50%;
width: 130%;
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s;
-webkit-animation-name: swipin;
animation-name: swipin;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.loading__hand{
display: none;
}
.loading__anim-page{
width: 45px;
height: 45px;
display: block;
}
.body--home .loading__anim-page{
display: none;
}
.loading__circular{
-webkit-animation: rotate 2s linear infinite;
animation: rotate 2s linear infinite;
}
.loading__circular-path{
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
-webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
stroke-linecap: round;
} header{
padding-top: var(--margin-wrap);
padding-bottom: var(--margin-wrap);
box-sizing: border-box;
height: var(--header-height);
position: relative;
z-index: 4;
transition: background-color 0s;
}
header .prestations{
display:none;
}
.body--menu header{
background-color: var(--black);
transition: background-color 0s var(--duration);
}
.body--menu-transition header{
background-color: var(--black);
}
.body--transition header{
pointer-events: none;
}
.logo{
width: var(--logo-height);
position: relative;
}
.logo a{
display:inline-block
}
.logo__svg{
width: 100%;
display: block;
overflow: hidden;
opacity: 1;
transition: fill var(--duration) var(--fast-duration);
}
.body--menu .logo__svg{
fill: #fff;
transition: fill var(--duration);
}
.body--page .logo__svg, .body--single .logo__svg{
fill: #fff;
transition: fill var(--fast-duration) var(--fast-duration);
}
.logo__growing{
-webkit-transform-origin: center;
transform-origin: center;
transition: -webkit-transform var(--duration);
transition: transform var(--duration);
width:100%; height:auto
} .logo__line{
stroke-dasharray: 331.5;
stroke-dashoffset: 331.5;
transition: stroke-dashoffset var(--long-duration), stroke var(--duration) var(--fast-duration);
}
.body--menu .logo__line{
stroke: #fff;
transition: stroke var(--duration);
}
.body--page .logo__line, .body--single .logo__line{
stroke: #fff;
transition: stroke var(--fast-duration) var(--fast-duration);
}
.body--loaded .logo__svg .logo__line{
stroke-dashoffset: 0;
}
.logo__agencement{
opacity: 0;
-webkit-transform: translate(-25%, -25%);
transform: translate(-25%, -25%);
transition: opacity var(--fast-duration) var(--duration), -webkit-transform var(--fast-duration) var(--duration);
transition: opacity var(--fast-duration) var(--duration), transform var(--fast-duration) var(--duration);
transition-timing-function: var(--ease-out);
}
.body--loaded .logo__svg .logo__agencement{
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
.logo__montfort{
opacity: 0;
transition: opacity var(--long-duration);
}
.body--loaded .logo__svg .logo__montfort{
opacity: 1;
}
.menu-trigger{
position: absolute;
top: calc(var(--margin-wrap) + 10px); right: var(--margin-wrap);
height: 25px;
font-weight: 800;
opacity: 0;
transition: opacity var(--duration) var(--duration);
}
.body--loaded .menu-trigger{
opacity: 1;
pointer-events: auto;
padding:1rem; background-color: var(--black);
border-radius:8px;
}
.body--transition .menu-trigger{
pointer-events: none;
}
.menu-trigger:before{
content: 'close';
position: absolute;
top: 3px; right: 0;
color: #fff;
opacity: 0;
transition: opacity var(--fast-duration) var(--fast-duration);
}
.body--menu .menu-trigger:before{
opacity: 1;
}
.menu-trigger:after{
content: 'menu';
position: relative;
top: -9px;
opacity: 1;
transition: opacity var(--fast-duration) var(--fast-duration);
}
.body--page .menu-trigger:after, .body--single .menu-trigger:after{
color: #fff;
}
.body--menu .menu-trigger:after{
opacity: 0;
transition: opacity var(--fast-duration);
}
.menu-trigger__container{
display: inline-block;
width: 35px;
height: 25px;
margin-right: 15px;
position: relative;
overflow: hidden;
}
.menu-trigger__container:before, .menu-trigger__container:after{
content: '';
position: absolute;
top: 0; bottom: 0; left: 0;
width: 2px;
background: var(--black);
transition: -webkit-transform var(--fast-duration) var(--fast-duration);
transition: transform var(--fast-duration) var(--fast-duration);
transition-timing-function: var(--ease-in-out);
}
.body--page .menu-trigger__container:before, .body--page .menu-trigger__container:after, .body--single .menu-trigger__container:before, .body--single .menu-trigger__container:after{
background: #fff;
}
.menu-trigger__container:after{
right: 0; left: auto;
}
.body--menu .menu-trigger__container:before{
-webkit-transform: translateY(100%);
transform: translateY(100%);
transition: -webkit-transform var(--fast-duration);
transition: transform var(--fast-duration);
}
.body--menu .menu-trigger__container:after{
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
transition: -webkit-transform var(--fast-duration);
transition: transform var(--fast-duration);
}
.menu-trigger__bar{
position: absolute;
top: 0; bottom: 0; left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 2px;
background: var(--black);
transition: opacity var(--fast-duration) var(--fast-duration);
}
.body--page .menu-trigger__bar, .body--single .menu-trigger__bar{
background: #fff;
}
.body--menu .menu-trigger__bar{
opacity: 0;
transition: opacity var(--fast-duration);
}
.menu-trigger__cross{
position: absolute;
top: 0; bottom: 0; left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 2px;
opacity: 0;
transition: opacity 0s var(--fast-duration);
}
.body--menu .menu-trigger__cross{
opacity: 1;
}
.menu-trigger__cross:before, .menu-trigger__cross:after{
content:'';
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
background: #fff;
transition: -webkit-transform var(--fast-duration);
transition: transform var(--fast-duration);
transition-timing-function: var(--ease-in-out);
}
.body--menu .menu-trigger__cross:before{
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
transition: -webkit-transform var(--fast-duration) var(--fast-duration);
transition: transform var(--fast-duration) var(--fast-duration);
}
.body--menu .menu-trigger__cross:after{
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
transition: -webkit-transform var(--fast-duration) var(--fast-duration);
transition: transform var(--fast-duration) var(--fast-duration);
} nav{
position: fixed;
top: 0; right: 0; bottom: 0; left: 0;
z-index: 2;
padding-top: var(--header-height);
padding-bottom: calc(var(--margin-wrap) * 2);
overflow: hidden;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
pointer-events: none;
transition: -webkit-transform 0s var(--duration);
transition: transform 0s var(--duration);
}
.body--menu nav{
-webkit-transform: translateX(0);
transform: translateX(0);
pointer-events: auto;
transition: -webkit-transform 0s;
transition: transform 0s;
overflow:auto
}
.nav__menus{
margin-top: var(--margin-wrap);
}
.nav__menu{
margin-bottom: 30px;
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
transition: opacity var(--fast-duration), -webkit-transform 0s var(--fast-duration);
transition: opacity var(--fast-duration), transform 0s var(--fast-duration);
transition-timing-function: var(--ease-in);
}
.body--menu .nav__menu{
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: opacity var(--fast-duration) var(--fast-duration), -webkit-transform var(--fast-duration) var(--fast-duration);
transition: opacity var(--fast-duration) var(--fast-duration), transform var(--fast-duration) var(--fast-duration);
transition-timing-function: var(--ease-out);
}
.body--menu .nav__menu:nth-child(2){
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.2), -webkit-transform var(--fast-duration) calc(var(--fast-duration)*1.2);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.2), transform var(--fast-duration) calc(var(--fast-duration)*1.2);
}
.body--menu .nav__menu:nth-child(3){
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.4), -webkit-transform var(--fast-duration) calc(var(--fast-duration)*1.4);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.4), transform var(--fast-duration) calc(var(--fast-duration)*1.4);
}
.nav__main-link{
display: inline-block;
color: #fff;
font-size: 1.75em;
line-height: 1.5em;
text-transform: lowercase;
font-weight: 700;
margin-bottom: 20px;
pointer-events: none;
}
.nav__sub-link{
display: block;
font-family: 'Questrial', sans-serif;
text-transform: uppercase;
color: var(--light-grey);
letter-spacing: 0.15em;
margin-bottom: 7px;
}
.nav__sub-link:last-child{
margin-bottom: 0;
}
.nav__under{
margin-bottom: var(--margin-wrap);
}
.nav__under-block{
margin-bottom: 30px;
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
transition: opacity var(--duration), -webkit-transform 0s var(--duration);
transition: opacity var(--duration), transform 0s var(--duration);
}
.body--menu .nav__under-block:nth-child(1){
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.6), -webkit-transform var(--fast-duration) calc(var(--fast-duration)*1.6);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.6), transform var(--fast-duration) calc(var(--fast-duration)*1.6);
}
.body--menu .nav__under-block:nth-child(2){
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.8), -webkit-transform var(--fast-duration) calc(var(--fast-duration)*1.8);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.8), transform var(--fast-duration) calc(var(--fast-duration)*1.8);
}
.nav__under-block:last-child{
margin-bottom: 0;
}
.nav__under-link{
display: block;
color: #fff;
font-size: 1.75em;
font-weight: 700;
text-transform: lowercase;
}
.nav__footer{
position: relative;
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
transition: opacity var(--duration), -webkit-transform 0s var(--duration);
transition: opacity var(--duration), transform 0s var(--duration);
}
.body--menu .nav__footer{
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.8), -webkit-transform var(--fast-duration) calc(var(--fast-duration) * 2);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.8), transform var(--fast-duration) calc(var(--fast-duration) * 2);
} .nav__footer-network{
display: block;
margin-top: 20px;
}
.nav__footer-networks svg{
margin: 0;
}
.nav__footer-link{
display: block;
color: #fff;
font-size: 1.75em;
font-weight: 700;
text-transform: lowercase;
margin-top: 30px;
}
nav .link--on{
color: var(--gold);
pointer-events: none;
} .home-container{
position: relative;
opacity: 0;
}
.body--loaded .home-container{
opacity: 1;
}
.texte-carousel{
height: calc(100vh - var(--header-height) - var(--pagination-height));
min-height: 320px;
position: relative;
}
.texte-carousel__slide{
display: flex;
align-items: center;
height: 100%;
}
.texte-carousel__texte{
padding: 0;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}
.texte-carousel__texte-container{
width: 100%;
}
.texte-carousel__surtitre{
display: block;
font-family: 'Questrial', sans-serif;
text-transform: uppercase;
color: var(--gold);
letter-spacing: 0.15em;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.texte-carousel__titre{
text-transform: lowercase;
font-size: 2.6em;
font-weight: 900;
line-height: 1em;
margin: 30px 0;
width: calc(100vw - 40px);
position: relative;
z-index: 1;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.texte-carousel__extrait{
color: var(--black);
margin-bottom: 30px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.texte-carousel__placeholder{
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}
.texte-carousel__placeholder .image{
overflow:hidden; position:relative;
margin-top :1rem;
}
.texte-carousel__placeholder .image img{
width:auto;
position:absolute; left:50%; top:50%;
-webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
}
.texte-carousel__container-lien{
display: block;
color: var(--black);
text-decoration: none;
font-weight: 700;
max-width: 220px;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.texte-carousel__container-lien:before{
content:'';
position: absolute;
top: 50%; right: 5px; left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
height: 2px;
background: var(--black);
}
.texte-carousel__container-lien:after{
content:'';
position: absolute;
top: 50%; right: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
border-top: 4px solid transparent;
border-bottom: 4px solid transparent;
border-left: 7px solid var(--black);
}
.texte-carousel__lien{
position: relative;
left: -15px;
padding: 0 15px;
background: #fff;
pointer-events: none;
}
.sub-carousel{
display: none;
}
.image-carousel{
position: absolute;
top: calc(var(--margin-wrap) * -1); right: 0; bottom: 0;
pointer-events: none;
}
.image-carousel__image{
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
background-color: var(--lighter-grey);
}
.image-carousel__image.lazyloaded{
background-color: none;
}
.image-carousel__sub-slider{
display: none;
}
.home-pagination{
height: var(--pagination-height);
position: relative;
right: 0; bottom: calc(var(--pagination-height) * -1); left: 0;
}
.home-pagination__bullets{
position: absolute;
left: 50%; bottom:var(--margin-wrap);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
height: 15px;
width: 80%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.home-pagination__bullets--inactive{
pointer-events: none;
}
.home-pagination__bullet{
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
height: 100%;
position: relative;
}
.home-pagination__bullet:after{
content: '';
position: absolute;
top: 50%; right: 0; left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
height: 4px; border-radius:2px;
background-color: var(--light-grey);
}
.home-pagination__bullet--active:after{
height: 8px;
background-color: var(--gold);
border-radius: 4px;
}
.home-adresse{
text-align: center;
padding-top: 6rem;
display: block;
line-height: 5%;
}
.home-footer, .footer-contact {
display: none;
}
.home-footer{
-webkit-margin-before: 2.5%;
margin-block-start: 2.5%;
}
.nav__footer-logo {
display: none;
}
.home-footer-logo, .footer-logo{
display: block;
margin: 0;
width: 100px;
}
.home-footer-logo img, .footer-logo img{
width:100%; height: auto
}
footer .reseaux{
display: flex;
align-items: center
}
footer .mentions{
margin:1rem;
padding:1rem 1rem 0 1rem;
border-top:1px dotted var(--gold)
}
footer .menu-mentions-container ul{
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1rem;
list-style: none;
margin:0; padding:0;
font-size:0.75rem;
}
footer .menu-mentions-container ul li a{
color: var(--black)
} .page-container{
opacity: 0;
}
.body--loaded .page-container{
opacity: 1;
}
.page__header{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
height: calc(85vh - var(--header-height));
min-height: 320px;
margin-top: calc(var(--header-height) * -1);
padding-top: var(--header-height);
padding-bottom: calc(var(--margin-wrap) * 2);
box-sizing: border-box;
position: relative;
background: #e0e5e0;
overflow: hidden;
left:17.5%;
width:calc( 100% - 17.5%)
}
.page__header.home{
height:65vh; min-height:auto; padding:0;
background:var(--blanc);
}
.body--single .page__header{
height: calc(75vh - var(--header-height));
}
.page__header-bg{
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
background-size: cover;
background-position: center;
mix-blend-mode: multiply;
}
.page__surtitre{
display: block;
font-family: 'Questrial', sans-serif;
text-transform: uppercase;
color: #fff;
letter-spacing: 0.15em;
position: relative;
z-index: 1;
}
.page__titre{
font-size: 2.6em;
font-weight: 900;
line-height: 0.8em;
margin: 10px 0 0;
color: #fff;
position: relative;
z-index: 1;
text-shadow:0 0 5px rgb(0,0,0,.6);
}
.page__titre.home{
text-shadow:none; margin:0 0 0.5em 0; line-height:105%;
}
.page__titre.home .cap{
background: var(--gold); background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(176,130,8,1) 100%); background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(176,130,8,1) 100%); background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(176,130,8,1) 100%); -webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
}
.page__header.home .front-image{
position:absolute; background-position:center; background-size:cover; background-repeat : no-repeat; background-color: rgb(235,235,235);
overflow:hidden;
}
.page__header.home .front-image .bordure{
position:absolute; left:0; top:0; width:calc(100% - 6px); height:calc(100% - 6px); border:3px solid var(--black);
}
.page__header.home .front-image.one{
top:0; left:0;
height:70%; width:100%;
}
.page__header.home .front-image.one .bordure{
border-top:0; height:calc(100% - 3px); border-right:0; width:calc(100% - 3px);
}
.page__header.home .front-image.third .bordure{
border-right:0; width:calc(100% - 3px);
}
.page__header.home .front-image.two{
bottom:0; left:0;
height:calc(30% - 0.35em); width:calc(50% - 0.25rem);
}
.page__header.home .front-image.third{
bottom:0; right:0;
height:calc(30% - 0.25rem); width:calc(50% - 0.25rem);
}
@media screen and (orientation: landscape){
.page__header.home .front-image.one{
top:0; left:0;
height:100%; width:60%;
}
.page__header.home .front-image.one .bordure{
border-right:3px solid var(--black); width:calc(100% - 6px);
}
.page__header.home .front-image.two{
top:0; right:0; bottom:unset; left:unset;
height:calc(50% - 3px); width:calc(40% - 0.5rem);
}
.page__header.home .front-image.two .bordure{
border-right:0; border-top:0; width:calc(100% - 3px); height:calc(100% - 3px);
}
.page__header.home .front-image.third{
bottom:0; right:0;
height:calc(50% - 0.25rem); width:calc(40% - 0.5rem);
}
}
.page__scroll{
display: none;
}
.page__part{
margin-top: calc(var(--margin-wrap) * 2);
margin-bottom: calc(var(--margin-wrap) * 2);
overflow: hidden;
}
.page__part-texte{
font-weight: 300;
}
.page__part-texte h2{
margin: 1.9em 0 1.6em;
font-size: 1.5em;
line-height: 1.2em;
}
.page__part-texte h3{
margin: 1.6em 0 1.3em;
font-size: 1.2em;
line-height: 1.2em;
}
.page__part-texte p{
color: var(--black);
}
.page__part-texte a{
color: var(--gold);
font-weight: 600;
opacity: 0.7;
transition: opacity .1s ease-in;
}
.page__part-texte a:hover{
opacity: 1;
}
.page__part-texte.wow{
-webkit-transform: translateX(var(--margin-wrap));
transform: translateX(var(--margin-wrap));
opacity: 0;
transition: -webkit-transform var(--long-duration), opacity var(--long-duration);
transition: transform var(--long-duration), opacity var(--long-duration);
transition-timing-function: var(--ease-out);
}
.page__part-texte.animated{
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
.page__part-texte > *:first-child{
margin-top: 0;
}
.page__part-texte > *:last-child{
margin-bottom: 0;
}
.page-carousel__image{
width: 80%;
background-size: cover;
background-position: center;
background-color: var(--grey); margin-top: 15px;
margin-bottom: 15px;
border-right: 10px solid #fff;
border-left: 10px solid #fff;
box-sizing: border-box;
transition: height var(--duration), margin var(--duration);
}
.page-carousel__image.swiper-slide-active{ margin: 0;
}
.page-carousel__zoom{
display: none;
}
.page__gutter{
display: none;
}
.page-map{
width: 80%;
margin: 0 auto;
background-color: var(--grey);
padding-bottom: 100%;
box-sizing: border-box;
position: relative;
z-index: 1;
}
.page-map__container{
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
}
.page-map__container h4{
margin: 10px 0 10px;
}
#gmap{
height: 100%;
position: relative
}
#gmap .infos{
position: absolute;
left: 50%;
top:1rem;
z-index:10;
background: rgba(255,255,255,.8);
padding:2rem;
transform: translateX(-50%)
}
.row{
padding-right: 4rem;
}
.card-body{
text-align: center;
}
.card-lien{
color: var(--gold);
} div.wpcf7{
margin: var(--margin-wrap) 0;
}
.formulaire-contact input, .formulaire-contact textarea, .formulaire-contact select{
width: 100%;
padding: 15px 20px;
box-sizing: border-box;
margin-bottom: 20px;
background: #fff;
border: 2px solid var(--lighter-grey);
}
.formulaire-contact input[type=checkbox]{
width:18px; height:18px;
}
.formulaire-contact select{
width: 100%;
padding: 8px 10px;
box-sizing: border-box;
border: none;
background: #eee;
}
.formulaire-contact textarea{
resize: vertical;
height:150px;
}
.formulaire-contact input[type="submit"]{
display:inline-block;
width:auto;
border:none;
font-family: 'Poppins', sans-serif;
font-weight: 600;
font-size:2rem;
background-color: #fff;
color: var(--gold);
margin-bottom: 0;
text-transform: uppercase;
padding:0.5em 0;
}
.formulaire-contact input[type="radio"]{
margin-bottom:0;
padding-right:10px;
}
.formulaire-contact span.wpcf7-not-valid-tip {
margin-top:-10px;
margin-bottom: 20px;
color: var(--gold);
}
div.wpcf7-response-output {
margin: 0;
padding: 15px;
}
.formulaire-contact .indic{
display:block;
margin-bottom:5px;
}
.formulaire-contact span.wpcf7-list-item {
margin: 0;
text-align: center;
}
.formulaire-contact p {
padding-left: 0 !important;
margin: 0 !important;
} .actu{
margin-bottom: calc(var(--margin-wrap) * 2);
}
.actu:last-child{
margin-bottom: 0;
}
.actu__image-une{
padding-bottom: 50%;
background-size: cover;
background-position: center;
margin-bottom: 20px;
position: relative;
}
.actu__image-lien{
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
}
.actu__date{
text-transform: uppercase;
color: var(--light-grey);
letter-spacing: 0.2em;
}
.actu__titre{
margin: 20px 0;
}
.actu__titre-lien{
font-weight: 600;
color: var(--black);
}
.actu__extrait{
color: var(--grey);
}
.actu__lien{
text-transform: uppercase;
color: var(--black);
letter-spacing: 0.2em;
}
.swiper-button-prev, .swiper-button-next{
position: relative;
border: none;
background-color: transparent;
}
.swiper-button-next{
background-image: url(http://agencement-montfort.astraga.io/wp-content/uploads/2022/09/chevron-right.png);
margin-left: 18rem;
}
.swiper-button-prev{
background-image: url(http://agencement-montfort.astraga.io/wp-content/uploads/2022/09/chevron-left.png);
margin-left: 1rem;
} footer{
border-top:1px solid var(--gold);
padding:2.5em 7.5% 1em 7.5%;
}
footer .ttl{
text-transform:uppercase; font-weight:bold;
}
footer .adresses{
margin:0.5em 0;
}
.bt-contact{
position: fixed;
left:2.5%; bottom:0;
background: var(--black);
padding:1.5rem 1.5rem 2rem 1.5rem;
z-index:50;
display: flex;
flex-direction: column;
align-items: stretch;
gap:0.5rem;
transform: translateY(100%);
transition: all 0.5s ease-out
}
.bt-contact.active{
transform: translateY(0)
}
.bt-contact .before{
content:"";
display:block;
height:30px; width:80px;
position:absolute;
left:0; bottom:100%;
background: var(--black) url(//agencement-montfort.fr/wp-content/themes/hors-lignes/img/bt-contact.svg) no-repeat center / auto 75%;
padding:0.25rem;
border-radius:0.5rem 0.5rem 0 0;
cursor: pointer;
}
.bt-contact a{
color: var(--blanc)
}
.bt-contact img{
width:50px; height: auto;
}
.reseaux__label{
display: none;
}
.reseaux__reseau{
height: 20px;
margin: 0 30px var(--margin-wrap) 0;
padding: 0 3px;
}
.contact__container-lien{
display: block;
color: var(--black);
text-decoration: none;
font-weight: 700;
max-width: 200px;
position: relative;
}
.contact__container-lien:before{
content:'';
position: absolute;
top: 50%; right: 5px; left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
height: 2px;
background: var(--black);
}
.contact__container-lien:after{
content:'';
position: absolute;
top: 50%; right: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
border-top: 4px solid transparent;
border-bottom: 4px solid transparent;
border-left: 7px solid var(--black);
}
.contact__lien{
position: relative;
left: -15px;
padding: 0 15px;
background: #fff;
pointer-events: none;
text-transform: lowercase;
}
.analytics-footer .off .phone {
display: none;
}
.analytics-footer .on .see-number {
display: none;
}
.analytics-footer .on .see-email {
display: none;
}
.analytics-footer .off .email {
display: none;
}
.analytics-footer .email, .analytics-footer .phone{
text-decoration: none;
color: var(--black);
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
white-space: nowrap;
cursor: pointer;
}
.analytics-footer .email:hover {
color: var(--black);
}
.analytics-footer .phone:hover {
color: var(--black);
} .lity-iframe .lity-container {
max-width: 1150px;
}
.lity-container {
width: 65%;
pointer-events: none;
}
.lity-content img{
margin:auto;
max-height: 80vh !important;
}
.lity-content::after {
display:none;
}
.lity-close {
width: 50px;
height: 50px;
font-size:50px;
}
.page__contenu section{
padding:2.5rem 7.5%;
}
.page__contenu section.titre{
text-align:center;padding-bottom:2rem; padding-top:2rem;
background-color: var(--black); position:relative; left:17.5%;
width: calc(100% - 17.5%); box-sizing:border-box; color: var(--blanc);
-webkit-transform: translateY(-3px); transform: translateY(-3px);
}
.page__contenu section.titre .coordos{
border-top:1px solid var(--grey); padding-top:1rem; text-align:left;
}
.page__contenu section.titre .bt{
padding:0.75rem 1.5rem 0.75rem 3rem; border-radius: 3rem;
background-color: var(--gold); color: var(--blanc); margin:0.25rem;
background-position:1rem center; background-size:20px; background-repeat: no-repeat; cursor: pointer; display:block; white-space: nowrap;
}
.page__contenu section.titre .bt.phone{
background-image: url(//agencement-montfort.fr/wp-content/themes/hors-lignes/img/mobile.svg);
}
.page__contenu section.titre .bt.email{
background-image: url(//agencement-montfort.fr/wp-content/themes/hors-lignes/img/email.svg);
}
.page__contenu section.titre .adresse{
padding-left:2.5rem; text-align:left; margin:0.25rem 0;
background: url(//agencement-montfort.fr/wp-content/themes/hors-lignes/img/marker.svg) no-repeat left center / 35px;
}
.analytics .off .phone {
display: none;
}
.analytics .on .see-number {
display: none;
}
.analytics .on .see-email {
display: none;
}
.analytics .off .email {
display: none;
}
.analytics .email, .analytics .phone{
text-decoration: none;
color: var(--blanc);
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
white-space: nowrap;
}
.analytics .email:hover {
color: var(--blanc);
}
.analytics .phone:hover {
color: var(--blanc);
}
.analytics{padding-top: 1rem;}
@media screen and (min-width: 360px) { :root{
--logo-height: 100px;
--margin-wrap: 30px;
}
.texte-carousel__titre{
font-size: 3em;
}
.page__header {
height: calc(90vh - var(--header-height));
}
.page__titre{
font-size: 3em;
}
}
@media screen and (min-width: 375px) {
:root{
--pagination-height: 110px;
}
.texte-carousel{
min-height: 320px;
}
.texte-carousel__titre{
font-size: 3.2em;
}
.page__titre{
font-size: 3.2em;
}
}
@media screen and (min-width: 568px) {
.texte-carousel {
min-height: 280px;
}
.texte-carousel__titre{
font-size: 3.4em;
}
.home-pagination__bullets {
max-width: 500px;
}
.page__titre{
font-size: 3em;
}
}
@media screen and (min-width: 768px) {
:root {
--logo-height: 120px;
--pagination-height: 150px;
--margin-wrap: 60px;
}
body{
font-size: 82%;
}
.nav__menu {
margin-bottom: 40px;
padding-right: 10px;
padding-left: 10px;
box-sizing: border-box;
}
.nav__under-block{
margin-bottom: 0;
padding-right: 10px;
padding-left: 10px;
box-sizing: border-box;
}
.loading__anim-page {
width: 55px;
height: 55px;
}
.loading__anim-home {
width: 32px;
height: 50px;
}
.texte-carousel__titre{
font-size: 4.5em;
margin: 70px 0 50px;
}
.texte-carousel__extrait{
margin-bottom: 50px;
}
.home-pagination__bullets{
top: 50%; bottom: auto;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.page__titre{
font-size: 4.5em;
margin: 15px 0 0;
}
.page__part {
margin-top: calc(var(--margin-wrap) * 1.5);
margin-bottom: calc(var(--margin-wrap) * 1.5);
}
.page__part h2 {
font-size: 2em;
}
.page__part h3 {
font-size: 1.5em;
}
.page-carousel__image{ margin-top: 30px;
margin-bottom: 30px;
border-right: 20px solid #fff;
border-left: 20px solid #fff;
}
.page-carousel__image.swiper-slide-active{ }
.formulaire-contact .first{
padding-right: 10px;
margin:0;
box-sizing: border-box;
}
.formulaire-contact .second{
padding-left: 10px;
box-sizing: border-box;
}
.actu {
margin-bottom: calc(var(--margin-wrap) * 1.5);
}
}
@media screen and (min-width: 800px) {
:root {
--pagination-height: 220px;
}
.page__contenu section.titre .bt{display: inline-block;}
}
@media screen and (min-width: 1024px) {
:root {
--header-height: calc(var(--logo-height) + var(--margin-wrap));
--pagination-height: 120px;
--logo-height: 110px;
}
header{
padding-top: calc(var(--margin-wrap) / 2);
padding-bottom: calc(var(--margin-wrap) / 2);
}
.menu-trigger {
top: calc(var(--margin-wrap) / 2 + 10px);
}
.nav__menus {
margin-top: calc(var(--margin-wrap) / 2);
}
.nav__menu {
margin-bottom: 0;
padding-right: 20px;
padding-left: 20px;
}
.nav__under {
margin-top: var(--margin-wrap);
margin-bottom: calc(var(--margin-wrap) / 2);
}
.nav__under-block{
padding-right: 20px;
padding-left: 20px;
}
.image-carousel {
top: calc(var(--margin-wrap) / -2);
}
.texte-carousel {
min-height: 350px;
}
.page__header {
height: calc(95vh - var(--header-height));
padding-bottom: calc(var(--margin-wrap));
}
.page-carousel__image{ }
.page-carousel__image.swiper-slide-active{ }
.page-map{
padding-bottom: 50%;
}
.actu:nth-child(2n+1) {
padding-right: 20px;
box-sizing: border-box;
}
.actu:nth-child(2n+2) {
padding-left: 20px;
box-sizing: border-box;
}
}
@media screen and (min-width: 1200px) {
header .under-block{
display: flex;
justify-content: space-between;
align-items: end;
border-top:1px solid var(--black);
}
header .prestations{
display:block;
width:calc(17.5% - 4%);
position:absolute; left:0; top:100%;
padding:1rem 2%;
border-top:3px solid var(--black); border-bottom:3px solid var(--black);
font-size:1.15rem;
flex: 0 0 50%
}
header .prestations p{
margin: 1.25em 0;
}
header .prestations .logo{
display:flex; justify-content: center;
width:100%; padding-top:0.5rem;
}
header .prestations .logo img{
width:100px; height:auto;
}
header .under-block .rezo{
flex:0 0 50%;
display: flex;
justify-content: center
}
header .under-block .rezo img{
width:45px;
}
header .under-block .rezo a{
transition: all 0.2s ease
}
header .under-block .rezo a:hover{
transform: scale(1.1);
}
}
@media screen and (min-width: 1280px) {
:root {
--margin-wrap: 70px;
--logo-height: 120px;
}
body{
font-size: 84%;
}
.page-carousel{
margin-left:32.5%;
}
.page__contenu section{
padding:5rem 5%;
}
.broken{
word-break: initial;
}
.background-fill--colors{
z-index: -1;
}
.body--lighter-grey .background-fill__circle--lighter-grey{
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.loading__anim-home {
width: 90px;
height: 60px;
}
.loading__swipe{
display: none;
}
.loading__hand{
display: block;
position: absolute;
top: 18%;
width: 35%;
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s;
-webkit-animation-name: grabin;
animation-name: grabin;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.loading__release{
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s;
-webkit-animation-name: release;
animation-name: release;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.loading__grab{
-webkit-animation-duration: 1.2s;
animation-duration: 1.2s;
-webkit-animation-name: grab;
animation-name: grab;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
header{
z-index: initial;
}
.body--menu header{
background-color: transparent;
}
.logo{
z-index: 4;
}
.menu-trigger{
cursor: pointer;
z-index: 4;
}
nav{
width: 85vw;
margin: auto;
padding-bottom: calc(var(--margin-wrap));
}
.nav__menus{
margin-top: calc(var(--margin-wrap) / -2);
}
.nav__menu{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
text-align:right;
}
.nav__main-link{
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
margin: 40px 40px 0 0;
}
.nav__sub{
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}
.nav__sub-link{
transition: color var(--faster-duration), padding-right var(--faster-duration);
}
.nav__sub-link:hover{
color: var(--lighter-grey);
padding-right: 5px;
}
.nav__under-block{
transition: opacity var(--fast-duration), -webkit-transform 0s var(--fast-duration);
transition: opacity var(--fast-duration), transform 0s var(--fast-duration);
}
.body--menu .nav__under-block:nth-child(2) {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.6), -webkit-transform var(--fast-duration) calc(var(--fast-duration)*1.6);
transition: opacity var(--fast-duration) calc(var(--fast-duration)*1.6), transform var(--fast-duration) calc(var(--fast-duration)*1.6);
}
.nav__under-link{
display: block;
height: 120px;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
transition: padding-left var(--fast-duration);
}
.nav__under-link:hover{
padding-left: 10px;
}
.nav__under-image{
display: block;
position: absolute;
top: 0; right: 0; bottom: 0; left: 15%;
z-index: -1;
background-color: var(--grey);
background-size: cover;
background-position: center;
opacity: 0.6;
}
.nav__footer, .nav__footer-logo{
bottom: var(--margin-wrap);
}
.nav__footer{
position: absolute;
right: 7.5vw;
}
.nav__footer-link{
display: inline-block;
font-size: 1em;
margin: 0 0 0 40px;
transition: color var(--faster-duration);
}
.nav__footer-link:hover{
color: var(--gold);
}
.nav__footer-networks{
position: static;
display: inline-block;
}
.nav__footer-network {
display: inline-block;
margin: 0 0 0 40px;
}
.image-carousel{
width: auto;
transition: top var(--duration) var(--fast-duration), right var(--duration) var(--fast-duration), bottom var(--duration) var(--fast-duration), left var(--duration) var(--fast-duration);
transition-timing-function: var(--ease-in-out);
}
.texte-carousel__placeholder .image{
margin-right:15%; margin-top:0;
}
.texte-carousel__placeholder .image.droite{
margin-left:15%; margin-right:0; margin-top:0;
}
.image-carousel[data-tpl="image_texte"]{
top: 10%; right: 45%; bottom: 0%; left: var(--margin-wrap);
}
.image-carousel[data-tpl="image_texte_alt"]{
top: -15%; right: 45%; bottom: 0%; left: 20%;
}
.image-carousel[data-tpl="texte_image"]{
top: 10%; right: var(--margin-wrap); bottom: 0%; left: 45%;
}
.image-carousel[data-tpl="texte_slider"]{
top: 0%; right: 0%; bottom: 10%; left: 45%;
}
.image-carousel:after{
content: '';
position: absolute;
top: -1px; right: -1px; bottom: -1px; left: -1px;
background-color: var(--lighter-grey);
z-index: 1;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
transition: -webkit-transform 0s, background-color var(--duration);
transition: transform 0s, background-color var(--duration);
transition-timing-function: var(--ease-in-out);
}
.body--lighter-grey .image-carousel:after{
background-color: #fff;
}
.image-carousel--transition-start:after{
-webkit-transform: translateX(0%);
transform: translateX(0%);
transition: -webkit-transform var(--fast-duration);
transition: transform var(--fast-duration);
}
.image-carousel--transition-end:after{
-webkit-transform: translateX(100%);
transform: translateX(100%);
transition: -webkit-transform var(--fast-duration) var(--fast-duration);
transition: transform var(--fast-duration) var(--fast-duration);
}
.image-carousel__image{
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
width: auto !important;
margin: 0 !important;
opacity: 0;
transition: opacity 0s var(--fast-duration);
}
.image-carousel__image.swiper-slide-active{
opacity: 1;
}
.image-carousel__image--texte_slider{
background: transparent !important;
}
.sub-carousel{
display: block;
position: absolute;
top: 8%; right: 0%; bottom: 10%; left: 45%;
opacity: 0;
pointer-events: none;
transition: opacity 0s calc(var(--fast-duration));
}
.texte-carousel__slide.swiper-slide-active .sub-carousel{
opacity: 1;
pointer-events: auto;
transition: opacity 0s calc(var(--duration) + var(--fast-duration));
}
.sub-carousel:after{
content: '';
position: absolute;
top: -1px; right: -1px; bottom: -1px; left: -1px;
z-index: 1;
background-color: var(--lighter-grey);
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
transition: -webkit-transform 0s, background-color var(--duration);
transition: transform 0s, background-color var(--duration);
transition-timing-function: var(--ease-in-out);
}
.swiper-slide-active .sub-carousel:after{
background-color: #fff;
}
.texte-carousel--transition-start .sub-carousel:after{
-webkit-transform: translateX(0);
transform: translateX(0);
transition: -webkit-transform var(--fast-duration);
transition: transform var(--fast-duration);
}
.texte-carousel--transition-end .sub-carousel:after{
-webkit-transform: translateX(100%);
transform: translateX(100%);
transition: -webkit-transform var(--fast-duration) var(--fast-duration);
transition: transform var(--fast-duration) var(--fast-duration);
}
.sub-carousel__sub-slide{
display: inline-block;
height: 100%;
width: 30%;
position: relative;
background-size: cover;
background-position: center;
}
.swiper-container-fade .texte-carousel__slide.swiper-slide-active .swiper-slide {
pointer-events: auto;
}
.sub-carousel__details{
position: absolute;
right: 0; bottom: 0; left: 0;
padding: 20px;
background-color: #fff;
}
.sub-carousel__titre{
display: block;
margin-bottom: 2px;
font-weight: 600;
}
.sub-carousel__lien{
color: var(--gold);
text-transform: lowercase;
transition: padding-left var(--faster-duration);
}
.sub-carousel__lien:hover{
padding-left: 5px;
}
.texte-carousel {
min-height: 450px;
}
.texte-carousel__placeholder{
-webkit-box-ordinal-group: NaN;
-ms-flex-order: initial;
order: initial
}
.texte-carousel__texte{
-webkit-box-ordinal-group: NaN;
-ms-flex-order: initial;
order: initial;
-webkit-box-align: initial;
-ms-flex-align: initial;
align-items: initial;
z-index: 2;
}
.texte-carousel__slide--texte-slider .texte-carousel__texte, .texte-carousel__slide--texte-image .texte-carousel__texte{
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.texte-carousel__slide--texte-slider .texte-carousel__texte, .texte-carousel__slide--texte-image .texte-carousel__texte{
padding-right: 0;
}
.texte-carousel__slide--image-texte .texte-carousel__texte, .texte-carousel__slide--image-texte-alt .texte-carousel__texte{
padding-left: 0;
} .texte-carousel__titre{
margin: 80px 0 50px;
width: auto;
font-size: 5em;
line-height: 1em;
}
.texte-carousel__slide--texte-slider .texte-carousel__titre{
margin: 50px 0 50px;
}
.texte-carousel__extrait{
width: 80%;
margin-left: auto;
}
.texte-carousel__slide--texte-image .texte-carousel__extrait{
margin-left: 0;
}
.texte-carousel__slide--texte-slider .texte-carousel__extrait{
margin-bottom: 0;
}
.texte-carousel__container-lien{
margin-left: auto;
max-width: 60%;
}
.texte-carousel__slide--texte-image .texte-carousel__container-lien{
margin-left: 0;
}
.texte-carousel__slide--texte-slider .texte-carousel__container-lien{
display: none;
}
.texte-carousel__lien{
transition: left var(--fast-duration);
}
.texte-carousel__container-lien:hover .texte-carousel__lien{
left: 15px;
}
.home-pagination__bullets{
height: 25px;
}
.home-pagination__bullet{
cursor: pointer;
}
.home-pagination__bullet:after{
transition: background-color var(--faster-duration);
}
.home-pagination__bullet:hover:after{
background-color: var(--black);
}
.page__header{
min-height: 520px;
padding-bottom: calc(var(--margin-wrap) * 1.5);
}
.body--single .page__header {
height: calc(70vh - var(--header-height));
}
.page__surtitre{
text-align: center;
}
.page__titre{
font-size: 5em;
margin: 25px 0 0;
text-align: center;
}
.page__part h2 {
font-size: 2.3em;
}
.page__part h3 {
font-size: 1.8em;
}
.page__part-texte{
max-width: 700px;
}
.page__contenu{
position: relative;
}
.page__gutter{
display: block;
position: absolute;
top: 0;
height: 100%;
box-sizing: border-box;
}
.page-carousel__image{ margin-top: 40px;
margin-bottom: 40px;
}
.page-carousel__image.swiper-slide-active{  }
.page-carousel__zoom{
display: block;
width: 40px;
height: 40px;
background: #fff;
position: absolute;
bottom: 0; left: 50%;
opacity: 0;
-webkit-transform: translate(-50%, 100%);
transform: translate(-50%, 100%);
transition: bottom var(--fast-duration), -webkit-transform var(--fast-duration), opacity var(--fast-duration);
transition: bottom var(--fast-duration), transform var(--fast-duration), opacity var(--fast-duration);
transition-timing-function: var(--ease-in-out);
border-radius: 1px;
}
.page-carousel__image:hover .page-carousel__zoom{
bottom: 50%;
-webkit-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);
opacity: 1;
top:unset;
}
.page-carousel__zoom-icon{
width: 65%;
position: absolute;
top: 50%; left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.page__sticky{
position: -webkit-sticky;
position: sticky;
top: var(--margin-wrap);
z-index: 1;
list-style-type: none;
margin: 0;
padding: 0 var(--margin-wrap) 0 0;
text-align: right;
}
.page__sticky-list{
margin-bottom: 10px;
}
.page__sticky-link{
font-size: 1.6em;
font-weight: 600;
color: var(--black);
transition: padding-right var(--fast-duration);
}
.page__sticky-link:hover{
padding-right: 10px;
}
.page__sticky-link.link--on{
color: var(--light-grey);
pointer-events: none;
}
.home-footer, .footer-contact{
display: block;
margin: 0;
opacity: 0;
}
.body--loaded .home-footer, .body--loaded .footer-contact{
opacity: 1;
}
.body--loaded .home-footer{
-webkit-margin-before: 2.5%;
margin-block-start: 2.5%;
}
.home-footer-logo, .footer-logo {
margin-left: 30px;
}
.footer-logo{
-webkit-margin-before: 2%;
margin-block-start: 2%;
}
.body--loaded .home-footer-logo, .body--loaded .footer-logo, .body--loaded .nav__footer-logo{
opacity: 1;
}
.home-reseaux{
display: inline-block;
vertical-align: bottom
}
.home-reseaux .reseaux__reseau{
margin: 0 40px 0 0;
}
.home-contact{
display: inline-block
}
.home-contact__lien{
color: var(--black);
font-weight: 700;
transition: color var(--faster-duration);
}
.home-contact__lien:hover{
color: var(--gold);
}
.footer__container{
width: 300px;
margin-left: auto;
}
.reseaux__label{
display: inline-block;
font-weight: 700;
}
.reseaux__reseau{
height: 20px;
margin: 0 0 0 30px;
float: right;
transition: fill var(--faster-duration);
}
.reseaux__reseau:hover{
fill: var(--gold);
}
.contact {
margin-top: calc(var(--margin-wrap) / 2);
width: 300px;
margin-bottom: calc(var(--margin-wrap) / 2);
}
.contact__container-lien{
max-width: initial;
}
.contact__lien{
transition: left var(--fast-duration);
}
.contact__container-lien:hover .contact__lien{
left: 15px;
}
div.wpcf7{
margin: calc(var(--margin-wrap) / 2) 0;
}
.actu {
margin-bottom: calc(var(--margin-wrap));
}
.actu__titre-lien{
transition: color var(--faster-duration);
}
.actu__titre-lien:hover{
color: var(--gold);
}
.actu__lien{
transition: color var(--faster-duration);
}
.actu__lien:hover{
color: var(--gold);
}
}
@media screen and (min-width: 1366px) {
body{
font-size: 86%;
}
.texte-carousel__extrait {
width: 75%;
}
.texte-carousel__container-lien{
max-width: 75%;
}
}
@media screen and (min-width: 1440px) {
:root {
--margin-wrap: 80px;
}
body{
font-size: 88%;
}
nav {
width: 80vw;
padding-bottom: calc(var(--margin-wrap) / 2);
}
.nav__under{
margin-bottom: 0;
}
.nav__under-link{
height: 150px;
}
.texte-carousel__extrait {
width: 70%;
}
.texte-carousel__container-lien{
max-width: 70%;
}
.sub-carousel__sub-slide {
width: 23%;
}
.home-contact{
margin-left: 30px;
}
.nav__footer, .nav__footer-logo{
bottom: calc(var(--margin-wrap) / 2);
}
.nav__footer-logo{
left: calc(var(--margin-wrap) / 1000);
-webkit-margin-after: 2%;
margin-block-end: 2%;
}
}
@media screen and (min-width: 1680px) {
:root {
--header-height: calc(var(--logo-height) + (var(--margin-wrap) / 1.5) * 2 );
--margin-wrap: 100px;
--logo-height: 130px;
--pagination-height: 140px;
}
body{
font-size: 90%;
}
header {
padding-top: calc(var(--margin-wrap) / 1.5);
padding-bottom: calc(var(--margin-wrap) / 1.5);
}
.menu-trigger {
top: calc(var(--margin-wrap) / 1.5);
}
nav {
width: 75vw;
}
.nav__main-link {
font-size: 2em;
}
.nav__under-link {
height: 200px;
font-size: 2em;
}
.nav__footer{
right: 0;
text-align: right;
}
.nav__footer-network{
display: block;
}
.nav__footer-networks svg{
margin: 0 0 30px;
}
.nav__footer-link{
display: block;
margin: 10px 0 0;
}
.nav__footer-link--slim{
font-weight: 400;
color: var(--grey);
font-size: 0.9em;
}
.home-container{
width: 95vw;
margin: 0 auto;
}
.image-carousel[data-tpl="image_texte"]{
top: 12%; right: 45%; bottom: 8%; left: calc(var(--margin-wrap) - 2.5vw);
}
.image-carousel[data-tpl="image_texte_alt"]{
top: -20%; left: 16%;
}
.image-carousel[data-tpl="texte_image"]{
top: 10%; right: calc(var(--margin-wrap) - 2.5vw); bottom: 0%; left: 45%;
}
.image-carousel[data-tpl="texte_slider"]{
top: -6%; right: -2.5vw; left: 36%;
}
.texte-carousel{
height: calc(100vh - var(--header-height) - var(--pagination-height) + var(--margin-wrap) / 2);
margin: calc(var(--margin-wrap) / -2) auto 0;
overflow: initial;
}
.texte-carousel__slide--texte-slider .texte-carousel__texte{
padding-left: calc(var(--margin-wrap) / 2);
padding-right: calc(var(--margin-wrap) / 2);
}
.texte-carousel__titre{
margin: 1em 0;
}
.texte-carousel__extrait {
width: 65%;
}
.texte-carousel__slide--texte-slider .texte-carousel__extrait{
margin-right: var(--margin-wrap);
}
.texte-carousel__container-lien{
max-width: 65%;
}
.texte-carousel__container-lien:before {
right: 60px;
}
.texte-carousel__container-lien:after {
right: 55px;
}
.sub-carousel{
top: 0; right: -2.5vw; left: 36%;
}
.page__header {
height: calc(93vh);
padding-bottom: calc(var(--margin-wrap) * 3);
position: relative;
}
.body--single .page__header {
height: calc(80vh - var(--header-height));
padding-bottom: var(--margin-wrap);
}
.page__titre{
font-size: 6em;
}
.page__scroll{
display: block;
position: absolute;
bottom: 25px; left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
color: #fff;
}
.page__scroll:before{
content:'';
position: absolute;
width: 1px;
height: calc(var(--margin-wrap) * 1.5);
top: -25px; left: 50%;
-webkit-transform: translate(-50%, -100%);
transform: translate(-50%, -100%);
background: #fff;
}
.page__scroll:after{
content:'';
position: absolute;
top: -25px; left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
border-top: 7px solid #fff;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
}
.page__sticky-list {
margin-bottom: 15px;
}
.page__sticky-link {
font-size: 2em;
}
.page__part h2 {
font-size: 3.5em;
}
.page__part h3 {
font-size: 2em;
}
.page__part-texte p{
letter-spacing: 0.05em;
line-height: 175%;
}
.page-carousel__image { width: 60%;
border-right: 30px solid #fff;
border-left: 30px solid #fff;
}
.page-carousel__zoom{
width: 50px;
height: 50px;
}
.page-map{
width: 60%;
padding-bottom: 39%;
}
}
@media screen and (min-width: 1920px) {
:root{
--margin-wrap: 90px;
}
body{
max-width: 1920px;
margin: 0 auto;
}
nav {
width: 70vw;
}
.nav__menus {
margin-top: calc(var(--margin-wrap) * -1);
}
.nav__under-link {
height: 225px;
}
.home-container{
width: 92vw;
}
.image-carousel[data-tpl="image_texte"]{
left: calc(var(--margin-wrap) - 4vw);
}
.image-carousel[data-tpl="image_texte_alt"]{
right: 48%; left: 15%;
}
.image-carousel[data-tpl="texte_image"]{
right: calc(var(--margin-wrap) - 4vw);
}
.image-carousel[data-tpl="texte_slider"]{
top: -8%;
}
.image-carousel:after{
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.image-carousel--transition-start:after{
-webkit-transform: translateY(0);
transform: translateY(0);
}
.image-carousel--transition-end:after{
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
.sub-carousel:after{
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.texte-carousel--transition-start .sub-carousel:after{
-webkit-transform: translateY(0);
transform: translateY(0);
}
.texte-carousel--transition-end .sub-carousel:after{
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
.texte-carousel__slide--image-texte-alt .texte-carousel__placeholder{
width: 57%;
}
.texte-carousel__slide--image-texte-alt .texte-carousel__texte{
width: 43%;
}
.texte-carousel__container-lien:before {
right: 120px;
}
.texte-carousel__container-lien:after {
right: 115px;
}
.sub-carousel{
top: 0; padding-left: 1rem;
}
.page__titre {
font-size: 6.5em;
}
} @-webkit-keyframes screenin-1 {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
33% {
opacity: 0;
}
66% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
opacity: 0;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
}
@keyframes screenin-1 {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
33% {
opacity: 0;
}
66% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
opacity: 0;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
}
@-webkit-keyframes screenin-2 {
0% {
-webkit-transform: translateX(50%);
transform: translateX(50%);
opacity: 0;
}
33% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
opacity: 1;
}
66% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 0;
}
}
@keyframes screenin-2 {
0% {
-webkit-transform: translateX(50%);
transform: translateX(50%);
opacity: 0;
}
33% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
opacity: 1;
}
66% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 0;
}
}
@-webkit-keyframes swipin {
0% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
left: -55%;
}
30% {
-webkit-transform: scale(1);
transform: scale(1);
left: -100%;
}
95% {
-webkit-transform: scale(0.97);
transform: scale(0.97);
}
100% {
-webkit-transform: scale(0.96);
transform: scale(0.96);
left: -50%;
}
}
@keyframes swipin {
0% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
left: -55%;
}
30% {
-webkit-transform: scale(1);
transform: scale(1);
left: -100%;
}
95% {
-webkit-transform: scale(0.97);
transform: scale(0.97);
}
100% {
-webkit-transform: scale(0.96);
transform: scale(0.96);
left: -50%;
}
}
@-webkit-keyframes grabin {
0% {
left: 50%;
}
30% {
left: 10%;
}
100% {
left: 50%;
}
}
@keyframes grabin {
0% {
left: 50%;
}
30% {
left: 10%;
}
100% {
left: 50%;
}
}
@-webkit-keyframes release {
0% {
opacity: 0;
}
29% {
opacity: 0;
}
30% {
opacity: 1;
}
100% {
opacity: 1;
}
}
@keyframes release {
0% {
opacity: 0;
}
29% {
opacity: 0;
}
30% {
opacity: 1;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes grab {
0% {
opacity: 1;
}
29% {
opacity: 1;
}
30% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@keyframes grab {
0% {
opacity: 1;
}
29% {
opacity: 1;
}
30% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes rotate {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotate {
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -35px;
}
100% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -124px;
}
}
@keyframes dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -35px;
}
100% {
stroke-dasharray: 89, 200;
stroke-dashoffset: -124px;
}
}
.form-field .g-recaptcha {
position: fixed;
right: 0;
visibility: hidden !important;
}