/*  FONTS ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700');


@font-face {
  font-family: 'BespokeSans-Variable';
  src: url('../fonts/BespokeSans-Variable.woff2') format('woff2'),
       url('../fonts/BespokeSans-Variable.woff') format('woff'),
       url('../fonts/BespokeSans-Variable.ttf') format('truetype');
  font-weight: 300 800;
  font-display: swap;
  font-style: normal;
}




iframe {
	border: 0;
	display: block;
	max-width: 100%;
	margin: 0 auto;
}

* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing : grayscale;
scroll-behavior: smooth;
}





/*  COLORS & STYLES ============================================================================= */

:root {
--brand: #138654;
--brand_hover: #066F42;
--brand_1200: #1E352B;
--brand_1000: #186242;
--brand_900: #2D7154;
--brand_600: #09B96D;
--brand_400: #09C372;
--brand_300: #C6E2D6;
--brand_200: #D4F6E8;
--brand_100: #9ac7b5;
--brand_transparent: 19,134,84,0.10;
--green_1: #09b96d;
--green_2: #d4f6e8;
--green_3: #008f51;
--orange_1: #d64b0a;
--orange_2: #fdddce;
--contrast_900: #83470B;
--contrast_800: #9C4F02;
--contrast_700: #B65E07;
--contrast_500: #E89D51;
--contrast_transparent: 232,157,81,0.10;
--grey_1: #1A1A1F;
--grey_1_5: #2D2D34;
--grey_2: #575760;
--grey_3: #747480;
--grey_4: #9A9AA2;
--grey_5: #CACACE;
--grey_6: #f1f4f2;
--light: #F7F0E9;
--light_2: #f5e9dc;
--dark: #1A1A1F;
--black: #000000;
--white: #FFFFFF;
--fs_1: 36px;
--fs_2: 34px;
--fs_2_5 : 20px;
--fs_3: 18px;
--fs_4: 16px;
--fs_5: 14px;
--fs_6: 12px;

--fs_1_m: 30px;
--fs_2_m: 26px;
--fs_3_m: 22px;
--fs_4_m: 16px;



--fs_subtitle: 24px;
}

*{
-webkit-tap-highlight-color: rgba(51,209,146,0.36)
}

.bc_brand:{background-color: var(--brand);}
.bc_brand_hover:{background-color: var(--brand_hover);}
.bc_brand_1200:{background-color: var(--brand_1200);}
.bc_brand_1000:{background-color: var(--brand_1000);}
.bc_brand_900:{background-color: var(--brand_900);}
.bc_brand_600:{background-color: var(--brand_600);}
.bc_brand_400:{background-color: var(--brand_400);}
.bc_brand_300:{background-color: var(--brand_300);}
.bc_brand_200:{background-color: var(--brand_200);}
.bc_green_1{background-color: var(--green_1);}
.bc_green_2{background-color: var(--green_2);}
.bc_green_3{background-color: var(--green_3);}
.bc_orange_1{background-color: var(--orange_1);}
.bc_orange_2{background-color: var(--orange_2);}
.bc_grey_1{background-color: var(--grey_1);}
.bc_grey_1_5{background-color: var(--grey_1_5);}
.bc_grey_2{background-color: var(--grey_2);}
.bc_grey_3{background-color: var(--grey_3);}
.bc_grey_4{background-color: var(--grey_4);}
.bc_grey_5{background-color: var(--grey_5);}
.bc_grey_6{background-color: var(--grey_6);}
.bc_black{background-color: var(--black);}
.bc_white{background-color: var(--white);}
.bc_light{background-color: var(--light);}
.bc_light_2{background-color: var(--light_2);}
.bc_dark{background-color: var(--dark);}
.bc_contrast_700{background-color: var(contrast_700);}
.bc_contrast_500{background-color: var(contrast_500);}
.bc_contrast_transparent{background-color: var(contrast_transparent);}


.bc_pattern_1{
position: relative;
}


.bc_pattern_1::before{
background-image: url(../image/pattern_pet.svg);
background-repeat: repeat;
background-position: top left;
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height:100%;
z-index:0;
opacity:0.15;
}

.bc_blur{
    backdrop-filter: blur(6px);
    border: 1px solid rgba(var(--brand_transparent));
}


.fc_brand{color: var(--brand);}
.fc_brand_1200{color: var(--brand_1200);}
.fc_brand_1000{color: var(--brand_1000);}
.fc_brand_900{color: var(--brand_900);}
.fc_brand_600{color: var(--brand_600);}
.fc_brand_400{color: var(--brand_400);}
.fc_brand_300{color: var(--brand_300);}
.fc_brand_200{color: var(--brand_200);}
.fc_brand_100{color: var(--brand_100);}
.fc_green_1{color: var(--green_1);}
.fc_green_2{color: var(--green_2);}
.fc_green_3{color: var(--green_3);}
.fc_orange_1{color: var(--orange_1);}
.fc_orange_2{color: var(--orange_2);}
.fc_grey_1{color: var(--grey_1);}
.fc_grey_1_5{color: var(--grey_1_5);}
.fc_grey_2{color: var(--grey_2);}
.fc_grey_3{color: var(--grey_3);}
.fc_grey_4{color: var(--grey_4);}
.fc_grey_5{color: var(--grey_5);}
.fc_grey_6{color: var(--grey_6);}
.fc_black{color: var(--black);}
.fc_white{color: var(--white);}
.fc_contrast_900{color: var(--contrast_900);}
.fc_contrast_700{color: var(--contrast_700);}
.fc_contrast_500{color: var(--contrast_500);}
.fc_contrast_transparent{color: var(--contrast_transparent);}

.nomargin {margin:0;padding:0;}
.smallmargin {padding:10px;}
.marginbottom {margin-bottom:15px;}
.mb_M {margin-bottom:20px;}
.mb_L {margin-bottom:40px;}
.mb_XL {margin-bottom:80px;}
.mb_XXL {margin-bottom:100px;}
.bigmarginbottom {margin-bottom:30px;}
.hugemarginbottom {margin-bottom:80px;}
.stdpadding {padding:20px;}
.bigpaddings {padding: 50px auto 100px auto;}
.margintop {margin-top: 20px;}
.big_margin_bottom {margin-bottom:200px !important;}
.big_margin_top {margin-top:50px !important;}

.mt_XS {margin-top:6px !important;}
.mt_S {margin-top:10px !important;}
.mt_M {margin-top:20px !important;}
.mt_L {margin-top:40px !important;}
.mt_XL {margin-top:80px !important;}
.mt_XXL {margin-top:100px !important;}

.min150{min-width:150px}
.min160{min-width:160px}
.min250{min-width:250px}

h1, h2 {
  font-family: 'BespokeSans-Variable', sans-serif;
}

.ff_title{
  font-family: 'BespokeSans-Variable', sans-serif;
}

body {
  font-family: 'Inter', sans-serif;
}

h1{font-size: var(--fs_1);margin:0px auto;font-weight:900;}
h2{font-size: 44px;margin:0 auto; text-align:center; font-weight:900;}
h3{font-size: 30px;margin:0;font-weight:900;}
h4{font-size: 20px;margin:0;}

.fs_h3{font-size: 30px;}

.subtitle{font-size: var(--fs_2_5);}

.fs_1{font-size: var(--fs_1);}
.fs_2{font-size: var(--fs_2);}
.fs_2_5{font-size: var(--fs_2_5);}
.fs_3{font-size: var(--fs_3);}
.fs_4{font-size: var(--fs_4);}
.fs_5{font-size: var(--fs_5);}
.fs_6{font-size: var(--fs_6);}

.fs_subtitle{font-size: var(--fs_subtitle);}

.fs_info{
font-size: var(--fs_4);
}

.shadow_text{
text-shadow: 0px 1px 6px rgba(0,0,0,0.8);
}


.left {text-align:left !important;}
.center {text-align:center !important;}
.right {text-align:right !important;}



.max100 {max-width: 100px;margin:auto;}
.max150 {max-width: 150px;margin:auto;}
.max220 {max-width: 220px;margin:auto;}
.max200 {max-width: 200px;margin:auto;}
.max250 {max-width: 250px;margin:auto;}
.max300 {max-width: 300px;margin:auto;}
.max350 {max-width: 350px;margin:auto;}
.max400 {max-width: 400px;margin:auto;}
.max450 {max-width: 450px;margin:auto;}
.max500 {max-width: 500px;margin:auto;}
.max600 {max-width: 600px;margin:auto;}
.max700 {max-width: 700px;margin:auto;}
.max800 {max-width: 800px;margin:auto;}
.max900 {max-width: 900px;margin:auto;}
.max550 {max-width: 550px;margin:auto;}
.max650 {max-width: 650px;margin:auto;}
.max750 {max-width: 750px;margin:auto;}
.max850 {max-width: 850px;margin:auto;}
.max950 {max-width: 950px;margin:auto;}


.min300 {min-height: 300px;}
.min500 {min-height: 500px;}

.displayPC{display:block;}

.nounderline{text-decoration:none;}
.bold {font-weight: bold;}

.radius{border-radius:8px;}
.radius_medium{border-radius:20px;}
.radius_large{border-radius:40px;}

.hidden {display:none !important;}

p{
color : var(--grey_2);
line-height: 22px;
margin: 0 0 16px;
}

a{
text-decoration: none !important;
}

.navspacer_M{scroll-margin-top: 150px;}
.navspacer_L{scroll-margin-top: 200px;}

.availability_legend > p{
display:inline-block;
vertical-align: middle;
margin: 10px;
}

.cc-color-override--164055446,
.cc-window {
    box-shadow: 0px 0px 20px 13px #0000004d;

}

.cc-color-override--641981760,
.cc-btn{
 border-radius: 100px !important;
}

.cc-color-override--641981760:hover,
.cc-btn:hover,
.cc-color-override--641981760:active,
.cc-btn:active{
 border-radius: 100px !important;
background-color: var(--brand_hover) !important;
}


.cog-button{
 background-color: var(--brand) !important;
}


.legend_out:before{
content: '';
display: inline-block;
width: 30px;
height: 30px;
vertical-align: middle;
margin-right: 6px;
background-color: var(--grey_1);
border: solid 2px var(--grey_1);
border-radius: 6px;
}

.legend_free:before{
content: '';
display: inline-block;
width: 30px;
height: 30px;
vertical-align: middle;
margin-right: 6px;
background-color: var(--grey_6);
border: solid 2px var(--grey_3);
border-radius: 6px;
}

.legend_full:before{
content: '';
display: inline-block;
width: 30px;
height: 30px;
vertical-align: middle;
margin-right: 6px;
background-color: var(--contrast_700);
border: solid 2px var(--contrast_700);
border-radius: 6px;
}

.legend_yearend:before{
content: '';
display: inline-block;
width: 30px;
height: 30px;
vertical-align: middle;
margin-right: 6px;
border: solid 2px var(--green_3);
border-radius: 6px;
}


.month_list{
margin: 0;
padding: 0;
display: block;

}

.table_container {
display: inline-block;
width: 100%;
max-width: 400px;
box-sizing: border-box;
margin: 0;
text-align: -webkit-match-parent;
background-color: white;
padding:18px;
}

.month_name{
display: block;
font-size: 1.17em;
margin-block-start: 1em;
margin-block-end: 1em;
margin-inline-start: 0px;
margin-inline-end: 0px;
font-weight: bold;
}

table {
display: table;
text-align: center;
box-sizing: border-box;
text-indent: initial;
border-spacing: 2px;
width: 100%;
}

thead {
display: table-header-group;
vertical-align: middle;
text-align: center;
}

tr {
display: table-row;
vertical-align: inherit;
}

thead td {
color: var(--grey_2);
font-size: var(--fs_5);
}

td {
width: 14%;
max-width:35px;
height: 35px;
color: var(--grey_2);
display: table-cell;
vertical-align: inherit;
}

tbody {
display: table-row-group;
vertical-align: middle;
}

tbody td {
color: var(--grey_2);
border: solid 1px var(--grey_6);
background-color: var(--grey_6);
border-radius: 6px;
}

.full{
color: white;
background-color: var(--contrast_700);
border-color: var(--contrast_700);
}

.out{
color: white;
background-color: var(--grey_1);
border-color: var(--grey_1);
}

.off{
color: white;
background-color: white;
}

.yearend{
border-color: var(--green_1);
color: var(--green_1);
}


.slick-prev{
background: rgb(241,243,243) !important;
background: linear-gradient(90deg, rgba(245,233,220,1) 2%, rgba(245,233,220,0.8) 100%) !important;
height:100% !important;
width: 100px !important;
top:0 !important;
left:0 !important;
transform: none !important;
//max-height:400px !important;
z-index: 2 !important;
}


.slick-next{
background: rgb(241,243,243) !important;
background: linear-gradient(90deg, rgba(245,233,220,0.8) 0%, rgba(245,233,220,1) 98%) !important;
height:100% !important;
width: 100px !important;
top:0 !important;
right:0 !important;
transform: none !important;
//max-height:400px !important;
z-index: 2 !important;
}

.slick-prev::before{
background: transparent url('../image/carousel_arrow.svg') no-repeat center center !important;
background-size: cover !important;
opacity: 1 !important;
height:30px !important;
width: 30px !important;
font-size:0 !important;
content: "" !important;
display:block !important;
margin:auto !important;
}

.slick-next::before{
background: transparent url('../image/carousel_arrow.svg') no-repeat center center !important;
background-size: cover !important;
opacity: 1 !important;
height:30px !important;
width: 30px !important;
transform: rotate(180deg) !important;
font-size:0 !important;
content: "" !important;
display:block !important;
margin:auto !important;
}


.slick-dots li button::before {
font-size:0 !important;
content: "" !important;
width: 10px !important;
height: 10px !important;
opacity: 1 !important;
display: block !important;
border: 2px solid var(--brand) !important;
border-radius:100% !important;
padding:0 !important;
margin:0 !important;
}

.slick-dots li.slick-active button::before{
background-color: var(--brand) !important;
}

.slick-dots button{
padding:0 !important;
margin:0 !important;
width: 14px !important;
height: 14px !important;
}

.slick-dots li{
padding:0 !important;
margin:4px !important;
width: 14px !important;
height: 14px !important;
}


.leftmobile {
text-align: center;
}



/*  MENU RESPONSIVE ============================================================================= */
.navlogo{
    display: block;
    float:left;
    padding:0 10px;
    float: left;
    width:294px;
}


.topnav{
    background-color: var(--white);
    overflow: hidden;
    text-align: right;
    margin: 0px auto 10px auto;
}

.topnav .select{
    font-weight:bold;
    color: var(--green_1);
}



/* Style the links inside the navigation bar */
.menulabel{
    display:inline-block;
    color: var(--grey_1);
    text-align: center;
    padding: 16px 12px;
    text-decoration: none;
    font-size: var(--fs_4);
    font-weight:bold;
    font-family: 'Inter', sans-serif;
    margin-top: 5px;

    transition: color 400ms;
}

/* Change the color of links on hover */
.menulabel:hover,
.menulabel:active {
    color: var(--brand);
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
    display: none;
    border: 0px;
    font-size:28px;
    padding: 5px 20px;
}


/* BLOCK LAYOUT */

body{
margin: 0;
padding: 0;
font-family: 'Inter', sans-serif;
font-color:var(--grey_1);
font-size: var(--fs_4);
}

.border-top{
border-top: 5px solid var(--brand);
}


.section{
display:block;
float:left;
width:100%;
margin: 0;
padding: 80px 0px 100px 0px;
text-align:center;
}

.section_menu{
display:block;
float:left;
width:100%;
margin: 0;
padding: 0;
text-align:center;
z-index: 999;
border-bottom: 3px solid var(--brand);
position: fixed;
top: 0px;
background-color: var(--white);
}

.section_container{
width: 100%;
max-width: 1200px;
text-align: center;
margin: auto;
z-index:1;
position: relative;
}

.index2{
z-index:2 !important;
}

.section_photos{
margin:0 20px;
padding:0;
}

.section_container_photo{
margin:0;
padding:0 10px;
}

.section_container_photo p{
    color: var(--grey_2);
    margin-top: 10px;
}

.photo_carousel{
max-height: 500px;

}

.section_alert{
display:block;
float:left;
width:100%;
margin: 0;
padding: 0px 0px 30px 0px;
text-align:center;
}


.section_header{
display:block;
float:left;
width:100%;
margin: 0;
padding: 0px 0px 100px 0px;
text-align:center;
}

.headerimage{
background-image: url(../image/header_pension.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
background-color: var(--grey_1);
padding-top:120px;
}

.headerimage2{
background-image: url(../image/header_pension_2.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
background-color: var(--grey_1);
padding-top:120px;
}

.ranking{
display:inline-block;
width:100%;
margin-bottom:40px;
text-decoration:none;
}

.ranking_star{
display:inline-block;
height:20px;
margin:0;
}

.ranking p{
display:inline-block;
margin:auto;
font-size: var(--fs_4);
}



.h1_container{
Display:block;
float:left;
width: 600px;
margin: 50px 50px 60px;
padding: 28px 40px 40px;
text-align: left;
color: var(--white);
background-color:rgba(26,26,31,0.85);
border-radius: 40px;
backdrop-filter: blur(6px);
}

.h2_spacer{
display:inline-block;
width:100%;
margin: 0 0 20px 0;
}

.introduction {
font-size: var(--fs_4);
line-height: 28px;
margin:20px 0px 20px 0px;
}

.section_offer{
margin-top:20px;
}


.section_offer p{
margin:5px auto 20px auto;
color: var(--grey_3);
}

.section_footer{
display:block;
float:left;
width:100%;
margin: 0;
padding: 25px 0px 25px 0px;
text-align:center;
}

.column_menu{
box-sizing: border-box;
display:block;
float:left;
width:100%;
margin: 0;
padding: 5px 0 0 0;
text-align:center;
}

.column_1{
box-sizing: border-box;
display:block;
float:left;
width:100%;
margin: 0px;
padding: 10px;
text-align:center;
}

.column_2{
box-sizing: border-box;
display:inline-block;
vertical-align: top;
width:49%;
margin: 0px;
padding: 10px;
text-align:center;
}



.column_3{
box-sizing: border-box;
display:block;
float:left;
width:33.33%;
margin: 0px;
padding: 10px;
text-align:center;
}

.column_4{
box-sizing: border-box;
display:block;
float:left;
width:25%;
margin: 0px;
padding: 10px;
text-align:center;
}


.column_X{
min-height: 100px;
box-sizing: border-box;
display:inline-block;
vertical-align: top;
width:60%;
margin: 0px;
padding: 10px;
text-align:center;
}

.column_Y{
min-height: 100px;
box-sizing: border-box;
display:inline-block;
vertical-align: top;
width:33.33%;
margin: 0px;
padding: 10px;
text-align:center;
}


.content_margin{
width:100%;
box-sizing: border-box;
text-align:center;
margin: auto;
padding: 15px;
}

.content_margin_time{
width:100%;
box-sizing: border-box;
text-align:center;
margin: auto;
padding: 15px;
}


.content_margin_menu{
width:100%;
box-sizing: border-box;
text-align:center;
margin: auto;
padding: 0;
}

.reglement_styling h3{
margin-top:30px;
}


.display_mobile{
display:none;
}

.display_desktop{
display:inline-block;
}

.hide_desktop{
display: none !important;
}

.clearfloat{
clear: both;
}


.tarif {box-sizing: border-box;display:inline-block;width:100%;margin:5px 0px 5px 0px;padding:0px 10px 10px 15px;}
.titre-tarif {box-sizing: border-box;display:inline-block;width:100%;margin:0px 0px 10px 0px;text-align:left;vertical-align:middle;}
.image-tarif {box-sizing: border-box;display:inline-block;width:25%;text-align:left;vertical-align:middle;}
.categorie-tarif {box-sizing: border-box;display:inline-block;width:70%;margin:10px 0px 10px 0px;text-align:left;vertical-align:middle;}
.categorie-tarif-large {box-sizing: border-box;display:inline-block;width:100%;margin:20px 0px 10px 0px;text-align:left;vertical-align:middle;}
.produit-tarif{box-sizing: border-box;display:inline-block;width:60%;margin:0px 0px 10px 0px;text-align:left;vertical-align:middle;}
.prix-tarif{box-sizing: border-box;display:inline-block;width:37%;margin:0px 0px 10px 0px;text-align:left;vertical-align:middle;}
.legend-tarif{box-sizing: border-box;display:inline-block;width:100%;margin:0px 0px 10px 0px;text-align:left;vertical-align:middle;}


.section_quote{
background-image: url('../image/quote.svg');
background-size: cover;
background-position: right 25px bottom 40px;
background-repeat: no-repeat;
background-size: 78px 60px;
padding:25px !important;
}

.section_quote_bottom_spacer{
margin-bottom: 26px;
}

.quote_ranking{
display:inline-block;
width:100%;
mmargin:0;
text-decoration:none;
}

.quote_divider{
display:inline-block;
width:70%;
height:0px;
border-top: 2px solid var(--grey_6);
}

.quote_owner{
color: var(--grey_2);
font-size: var(--fs_4);
font-weight: 600;
margin: 10px 0 5px 0;
}

.quote_date{
margin:0;
color: var(--grey_3);
font-size: var(--fs_5);
}



.button_container{
display:inline-block;
width:100%;
margin: 15px 0px 0px 0px;
padding: 0;
text-align: center;
font-size: var(--fs_5);
}

.h1_container .button_primary{
margin-left:0px;
}

.reglementbox {
box-sizing: border-box;
display:inline-block;
width:70%;
text-align:left;
margin:0;
padding:0;
vertical-align:middle;
line-height:24px;
}

.messagebox {
box-sizing: border-box;
display:inline-block;
width:100%;
text-align:left;
margin:5px 0;
padding:0;
vertical-align:middle;
line-height:24px;
}

.button_primary{
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--green_1);
border: 2px solid var(--green_1);
border-radius:50px;
color: var(--white);
padding: 10px 35px;
margin:5px;
font-weight:bold;
transition: all 400ms;
font-size: var(--fs_5);
}

.button_primary:hover,
.button_primary:active{
	background-color: var(--green_3) !important;
	border-color: var(--green_3);
}

.button_secondary_bright{
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--white);
border: 2px solid var(--green_1);
border-radius:50px;
color: var(--green_1);
padding: 10px 25px;
margin:5px;
font-weight:bold;
transition: all 400ms;
font-size: var(--fs_5);
}

.button_secondary_dark{
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--grey_1);
border: 2px solid var(--green_1);
border-radius:50px;
color: var(--green_1);
padding: 10px 25px;
margin:5px;
font-weight:bold;
transition: all 400ms;
font-size: var(--fs_5);
}


.button_secondary_bright:hover,
.button_secondary_bright:active,
.button_secondary_dark:hover,
.button_secondary_dark:active{
	background-color: var(--green_1) !important;
	border-color: var(--green_1);
	color: var(--white);
}




.reglementbutton{
box-sizing: border-box;
display:inline-block;
width: 25%;
text-align:center;
margin:0;
padding:0;
vertical-align:middle;
text-align: right;
float: right;
}

.button {
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--green_1);
border: 2px solid var(--green_1);
color: var(--white);
padding: 10px 25px;
margin:0;
font-weight:bold;
transition: all 400ms;
font-size: var(--fs_5);
}

.bouton_secondaire {
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--white);
border: 2px solid var(--green_1);
color: var(--green_1);
padding: 10px 25px;
margin:0;
font-weight:bold;
transition: all 400ms;
font-size: var(--fs_5);
}

.button:hover,
.button:active,
.cc-color-override-300330458 .cc-btn:hover,
.cc-color-override-300330458 .cc-btn:active, 
.cc-color-override-300330458 .cc-btn:focus {
	background-color: var(--brand) !important;
	border-color: var(--brand);
}

.cc-color-override-300330458 .cc-btn,
.cc-color-override-300330458 .cc-link {
transition: all 400ms;
}

.button_border {
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--green_1);
border: 2px solid var(--white);
color: var(--white);
padding: 15px 20px;
margin:0;
font-weight:bold;
transition: all 400ms;
}

.button_border:hover,
.button_border:active {
	background-color: white;
	color: var(--green_1);
}

.button_border_white {
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--white);
border: 2px solid var(--green_1);
color: var(--green_1);
padding: 12px 20px;
font-weight:bold;
transition: all 400ms;
font-size: var(--fs_5);
}

.button_border_darkgrey {
box-sizing: border-box;
display:inline-block;
text-align:center;
background-color: var(--grey_1);
border: 2px solid var(--green_1);
color: var(--green_1);
padding: 12px 20px;
font-weight:bold;
transition: all 400ms;
font-size: var(--fs_5);
}

.button_border_white:hover,
.button_border_white:active,
.button_border_darkgrey:hover,
.button_border_darkgrey:active {
	background-color: var(--green_1);
	color: var(--white);
}

.image-offre {
width:calc(100% + 30px);
display:block;
float: left;
margin: 15px -15px 0px -15px;
padding :0px;
background-color: var(--grey_1);
}

.image-offre img {
display: block;
}

.offer_list{
margin:10px 0px 20px 0px;
padding:0;
list-style: none;
}

.offer_list li{
margin-bottom: 8px;
    position: relative;
    padding-left: 20px;
}

.offer_list li:before {
    content: '';
    width: 7px;
    height: 11px;
    position: absolute;
    background-image: url('../image/fleche.png');
    background-size: cover;
    background-position: center;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.galerieblock{
background-image: url(../image/voir_galerie.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
background-color: var(--grey_1);
}


.galerie-text{
display:inline-block;
width: 50%;
vertical-align:middle;
box-sizing: border-box;
padding: 10px 10px;
}

.galerie-button{
display:inline-block;
width: 40%;
vertical-align:middle;
background-color: var(--grey_1);
border: 2px solid var(--white);
color: var(--white);
text-align: center;
padding: 10px 10px;
box-sizing: border-box;
text-decoration: none;
transition: all 400ms;
}

.galerie-button:hover,
.galerie-button:active{
background-color: var(--white);
color: var(--grey_1);
}

.row{
margin-bottom:3px;
}

.halfcolumnleft{
display:inline-block;
width:46%;
vertical-align:middle;
margin: 0;
padding: 0px 15px 0px 0px;
text-align:right;
font-weight: bold;
}

.halfcolumnright{
display:inline-block;
width:46%;
vertical-align:middle;
margin: 0;
padding: 0px 0px 0px 15px;
text-align:left;
}

.cell_time{
display:inline-block;
width: 100px;
}


.fit100 {width:100%;}

.contact_box{
box-sizing: border-box;
display:inline-block;
width:100%;
margin:4px 0px 0px 0px;
padding:10px;
}

.contact_icon{
box-sizing: border-box;
display:inline-block;
width:15%;
text-align:left;
vertical-align: middle;
}

.contact_text{
box-sizing: border-box;
display:inline-block;
width:80%;
text-align:center;
vertical-align: middle;
}



.testimonial_section{
background-image: url(../image/citation.png);
background-repeat: no-repeat;
background-position: center;
width: 400px;
height: 400px;
}



.section_new{
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
padding: 130px 0;
}

.section_text_flex{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 40px;
}


.section_text_flex h2{
 margin: 0px;
}


.section_text_flex_center{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    padding: 40px;
    margin-top: 40px;
}


.section_imagetext_flex{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}

.column_flex{
    display: flex;
    flex-direction: column;
    gap:20px;
}

.section_new_footer{
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
padding: 40px 0;
}


.section_header_flex{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.header_flex{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 50px;
}

.header_text_flex{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
}

.header_image_flex{
width:100%;
max-width: 500px;
}

.offer_flex{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    gap: 20px;
    margin-bottom: 20px;
}

.offer_card_flex{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    padding: 20px 20px 0;
}

.offer_title_flex{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
}

.icon_benefit{
    height: 40px;
}

.price_flex{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 50px 0px 40px;
    gap: 30px;
}


.price_row_flex{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    width: 100%;
    padding:40px;
    box-sizing: border-box;
}


.price_card{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 30px;
}

.price_card_split{
width: 1px;
border-left: 1px solid rgba(255,255,255,0.1);
height: 250px;
}

.price_card_header{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}


.price_card_title{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.price_card_list{
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 14px;
}

.price_card_item{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.illustration_animal{
 height: 80px;
}


.footer_flex{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    color: var(--grey_4);
}

.footer_flex a{
    color: var(--grey_4);
}

.button_menu{
   display: inline-block;
    background-color: var(--brand);
    color: white !important;
    padding: 16px 29px;
    border-radius: 100px;
    margin-right: 20px;
    transition: all 0.15s ease;
}

.button_menu:hover,
.button_menu:active{
    background-color: var(--brand_hover);

}

.cta_buttons{
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 20px;
    align-items: center;

}

.cta_buttons_header{
    display: flex;
    flex-direction: row;
    gap: 20px;
    align-items: center;
    justify-content: flex-start;
    min-height: 54px;
}

.maxscreen{
 width:100%;
 max-width: 1200px;
 padding: 0 20px;
 box-sizing: border-box;
 z-index:1;
}

.testimonial_flex{
    display: flex;
    flex-direction: row;
    gap: 20px;
}

.testimonial_flex_column{
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

.testimonial_card{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 20px;
    background-image: url(../image/quote.svg);
    background-size: cover;
    background-position: right 25px bottom 40px;
    background-repeat: no-repeat;
    background-size: 78px 60px;
}

.testimonial_quote{
    display: flex;
    flex-direction: column;
    width: 100%;
}

.testimonial_owner{
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}


.time_flex {
    display: flex;
    flex-direction: column;
}


.calendar_legend{
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 20px;
}

.month_row{
    display: flex;
    flex-direction: row;
    gap: 20px;
    width: 100%;
}

.month_card{
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
    padding: 20px;
    width: 100%;
}

.location_flex{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 20px;
}

.location_flex_card{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

.contact_flex{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    gap: 40px;
}

.contact_form_flex{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 40px 20px 20px;
    width:66%;
}


.contact_phone_flex{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 40px 20px;
    width:33%;
}

.cta_banner{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background-color: rgba(var(--brand_transparent));
    padding: 40px 40px 40px 50px;
}

.cta_card{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background-color: rgba(var(--brand_transparent));
    padding: 40px;
}


.info_banner{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background-color: rgba(var(--contrast_transparent));
    padding: 20px 20px 20px 40px;
}

.cta_button_primary_L{
    background-color: var(--brand);
    color: white;
    border-radius: 100px;
    padding: 18px 28px 18px 50px;
    text-align: center;
    cursor: pointer;
    transition: all 0.15s ease;
}

.cta_button_primary_L:hover,
.cta_button_secondary_L:hover,
.cta_button_secondary_L_light:hover,
.cta_button_primary_L:active,
.cta_button_secondary_L:active,
.cta_button_secondary_L_light:active{
    padding-left: 39px;
    padding-right: 39px;
    background-color: var(--brand_hover);
    color: white;
}

.cta_container_flex{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.cta_container_flex img{
    opacity: 0;
    transition: opacity 0.2s ease, transform 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);
    transform: translateX(-20px);
    margin-left: 10px;
    width: 12px;

}

.cta_container_flex:hover img,
.cta_container_flex:active img{
    opacity: 1;
    transform: translateX(0px);
}

.cta_button_primary_contrast_L{
    background-color: var(--contrast_700);
    color: white;
    border-radius: 100px;
    padding: 18px 28px 18px 50px;
    text-align: center;
    cursor: pointer;
    transition: all 0.15s ease;
}

.cta_button_primary_contrast_L:hover,
.cta_button_primary_contrast_L:active{
    padding-left: 39px;
    padding-right: 39px;
    background-color: var(--contrast_800);
}

.cta_button_secondary_L{
    background-color: rgba(var(--brand_transparent));
    color: var(--brand_900);
    border-radius: 100px;
    padding: 18px 28px 18px 50px;
    text-align: center;
    cursor: pointer;
    transition: all 0.15s ease;
}

.cta_button_secondary_L_light{
    background-color: rgba(var(--brand_transparent));
    color: var(--brand_100);
    border-radius: 100px;
    padding: 18px 28px 18px 50px;
    text-align: center;
    cursor: pointer;
    transition: all 0.15s ease;
}

.cta_button_secondary_dark{
    display: flex;
    background-color: var(--dark);
    color: var(--brand);
    border-radius: 100px;
    padding: 18px 50px;
    flex-direction: column;
    align-items: center;
}

.cta_button_secondary_dark_medium{
    display: flex;
    background-color: rgba(var(--brand_transparent));
    color: var(--brand_600);
    border-radius: 100px;
    padding: 16px 46px;
    flex-direction: column;
    align-items: center;
}

/* MENU OFFSET ANCHOR */

.anchor a {
  position: absolute;
  left: 0px;
  top: -100px;
}

.anchor {
  position: relative;
z-index: 0;

}

.anchor::before { content: ''; display: block; height: 90px; margin: -90px 0 0 0; }

.list--faq { position: relative; width: 80%; margin: 40px auto 40px; padding: 0; }
.list--faq > li { display: block; margin-top: 7px; }

.faq { text-align: left; background-color: var(--white); transition: background-color 400ms; }
.faq:hover, .faq:active { background-color: var(--white); }
.faq:hover .faq__question:after, .faq:active .faq__question:after { border-top-color: var(--white); }

.faq.on .faq__question:after { transform: rotate(180deg); top: calc(50% - 10px); right: 38px; border-width: 14px; margin-left: -14px; }
.faq.on .faq__question:before { transform: rotate(180deg); top: calc(50% - 10px); right: 40px; border-width: 12px; margin-left: -12px; }
.faq.on .faq__answer { display: block; }

.faq__question { position: relative; padding: 25px 90px 25px 40px; cursor: pointer; }
.faq__question:after, .faq__question:before {
	top: 50%;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	margin-top: -6px;
	transition: border-top-color 400ms;
}
.faq__question:after {
	right: 42px;
	border-color: rgba(255, 255, 255, 0);
	border-top-color: var(--white);
	border-width: 10px;
	margin-left: -10px;
}
.faq__question:before {
	right: 40px;
	border-color: rgba(255,255,255, 0);
	border-top-color: var(--brand);
	border-width: 12px;
	margin-left: -12px;
}

.faq__answer {
padding: 0 90px 20px 40px;
display: none;
}


.box--rules { overflow: hidden; padding: 30px; }
.map { margin-top: 30px; }
.box--address .content_margin { padding-left:0; padding-right: 0; }
.box--address .halfcolumnright { width: 100%; text-align: left; padding: 0; }
.box--address .halfcolumnleft { width: 100%; text-align: left; margin-bottom: 10px; }


/* RESPONSIVE LAYOUT */

@media screen and (max-width: 1023px) {

.column_1,
.column_2,
.column_3,
.column_4,
.column_X,
.column_Y{
display:block;
float:left;
width:100%;
padding:16px 5%;
}

p{
text-align:left;
}

.anchor {
padding:0 5%; text-align: left;
}

.anchor h2{
text-align: left;
}


.section{
padding: 0px 0px 80px 0px;
}

.section_header{
padding: 0;
margin:0;
}

.headerimage,
.headerimage2{
padding-bottom: 0px;
padding:0;
margin:0;
}

.content_margin_time{
padding: 10px;
}

.cell_time{
width:46%;
}

.halfcolumnleft{width:30%;text-align:left;}
.halfcolumnright{width:58%;}

.h1_container{
box-sizing: border-box;
width:100%;
margin:0;
padding: 150px 5% 40px 5%;
border-radius:0px;
}

h1{font-size: var(--fs_1_m);}
h2{font-size: var(--fs_2_m);text-align: left; width: 100%;}
h3{font-size:var(--fs_3);}
h4{font-size:var(--fs_4);}

.fs_h3{font-size: 22px;}
.subtitle{font-size: var(--fs_4);text-align: left;}


.section_menu{background-color:transparent;border-bottom:0;}
.navlogo{width:230px;height:auto;}

.topnav {float:none;background-color:transparent;margin-bottom:0;}
.menulabel {display: none;border-bottom:1px solid var(--grey_6);margin-top:0px;}
.topnav.responsive {position: relative; margin-bottom: 0;}
.topnav a.icon {float: right;display: block;position: absolute;right: 0;top: 16px;z-index:3;}
.topnav.responsive a.menulabel{float: none; display: block; text-align: left; padding: 24px 0 24px 32px; }
.topnav.responsive img {}
.topnav.responsive .logobar{margin:0;width:100%;display:block;overflow:hidden;float:none;}
.topnav .logobar{z-index:2;position:relative;border-bottom: 3px solid var(--brand);padding:14px;}
.topnav.responsive .menulabels{background-color: var(--white);transform: translate3d(0,0,0);height:100vh;}
.topnav .menulabels{width: 100%; height:0;display:block;float:none;transform: translate3d(-100%,0,0);transition:all 500ms;}
.column_menu{padding:0;}
.logobar {padding:5px 0 10px;overflow:hidden;}


.reglementbox {
width:100%;
}

.reglementbutton{
width:100%;
margin-top:15px;
text-align: center;
}

.fs_subtitle{font-size:20px;}

.displayPC{display:none;}
.section_space{padding-top: 40px;padding-bottom: 40px;}


.list--faq { width: 100%; }
.faq__question { padding: 20px 70px 20px 20px; }
.faq__answer { padding: 0 70px 20px 20px; }
.faq__question:after { right: 22px; }
.faq__question:before { right: 20px; }
.faq.on .faq__question:after { right: 18px; }
.faq.on .faq__question:before { right: 20px; }

.display_mobile{
display: inline-block;
z-index: 1;
position: relative;
}

.display_desktop{
display: none;
}

.hide_desktop{
display: inline-block !important;
}

.ranking_star{
height:18px;
}

.ranking p{
font-size: var(--fs_5);
}

.section_container_photo{
padding: 0 5px 20px;
}

.section_container_photo p{
text-align: center !important;
}


.photo_carousel{
max-height: 57vw;
max-width:100vw;

}

.slick-prev{
background: transparent !important;
height: 57vw !important;
width: 60px !important;
}


.slick-next{
background: transparent !important;
height: 57vw !important;
width: 60px !important;
}



.cta_buttons_header,
.offer_flex,
.price_row_flex,
.info_banner,
.testimonial_flex,
.cta_banner,
.month_row,
.contact_flex
{flex-direction: column;}

.calendar_legend{
    justify-content: flex-start;
}

.header_flex
{flex-direction: column-reverse;}

.cta_banner{
    padding: 40px;
    text-align: center;
}

.price_card_split {
width: 100%;
border-top: 1px solid rgba(255, 255, 255, 0.1);
border-left: 0px;
height: 1px;
}

.contact_form_flex,
.contact_phone_flex{
width: 100%;
box-sizing: border-box;
}

.offer_card_flex,
.month_card {
box-sizing: border-box;
}

.cta_buttons_header{
align-items: stretch;
}

.section_new{
    padding: 60px 0;
}




.hugemarginbottom{
margin-bottom: 40px;
}


.cta_button_primary_L,
.cta_button_primary_contrast_L,
.cta_button_secondary_L,
.cta_button_secondary_L_light{
    font-size: var(--fs_4);
    width: 100%;
    box-sizing: border-box;
    padding: 14px 0px 14px 22px;
}

.cta_button_primary_L:hover,
.cta_button_primary_contrast_L:hover,
.cta_button_secondary_L_light:hover,
.cta_button_secondary_L:hover,
.cta_button_primary_L:active,
.cta_button_primary_contrast_L:active,
.cta_button_secondary_L_light:active,
.cta_button_secondary_L:active{
    padding-left: 0;
    padding-right: 11px;
}


.cta_container_flex{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}



.cta_button_primary_M,
.cta_button_primary_contrast_M,
.cta_button_secondary_dark_M{
    padding: 14px 30px;
    font-size: var(--fs_4);
}


.cta_buttons{
    flex-direction: column;
    gap: 12px;
    width: 100%;
}






.mobile_full_width{ width: 100%;}

.info_banner{text-align: center;padding:20px;}

.price_flex{margin: 50px 0px 20px;}

.header_flex {margin-bottom: 20px;margin-top:20px;}


.section_photos{
margin:0;
}


.section_new_footer{
padding: 20px 0;
}

.footer_flex{
flex-direction: column;
gap: 20px;
}

.leftmobile {
text-align: left;
}

.button_menu{
    border-radius: 0px;
    margin: 0;
}

.section_text_flex{
    padding: 20px;
}

.section_imagetext_flex{
flex-direction: column;
}

.section_imagetext_flex img{
width:100%;
height: auto;
}

.section_imagetext_flex{
text-align: center;
}



}