/*
Theme Name: Activital
Author: Kevin Furet
Author URI: https://www.kevinfuret.com/
Version: 1.0
Text Domain: activital
*/

/* ========================================================================== */
/* fonts
/* ========================================================================== */
@font-face {
  font-family: 'NationalPark';
  src: url('fonts/NationalPark-Regular.woff2') format('woff2'),
      url('fonts/NationalPark-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Motherlands';
  src: url('fonts/Motherlands-Regular.woff2') format('woff2'),
      url('fonts/Motherlands-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


/* ========================================================================== */
/* A (more) Modern CSS Reset | september 2023 | Andy Bell */
/* ========================================================================== */

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS */
body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin-block-end: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}

/* Set core body defaults */
body {
  min-height: 100vh;
  line-height: 1.5;
}

/* Set shorter line heights on headings and interactive elements */
h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

/* Balance text wrapping on headings */
h1, h2,
h3, h4 {
  text-wrap: balance;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input, button,
textarea, select {
  font-family: inherit;
  font-size: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}
















/* ========================================================================== */
/* STYLES
/* ========================================================================== */
html{
  /* font-size:100%; */
}
body{
  font-family: 'NationalPark';
  font-size:19.2px; font-size:1.2rem;
  /* line-height: 1.2;  */
  color:#150524;
  text-align: left;
  background-color: white;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}
h1, h2, h3{
  font-family: 'Motherlands';
  margin: 0;
  font-weight: 500;
  line-height: 1;
}
p{
  line-height: 1.2;
  margin: 0;
}
a,
a::after,
a::before{
  transition: all .3s;	
  text-decoration:none;
  outline:none;
}
a:active, a:focus {
  background-color: transparent;
}
/* a:visited{
  color: inherit;
  color: #150524;
} */
/* ul,ol{
  line-height: 1.4;
} */
/* img{
  max-width: 100%;
  display: block;
} */




h1 {
  font-size: 2.8rem;
}
h2{
  font-size: 2.6rem;
}
h2.min{
  font-size: 2.4rem;
}
@media screen and (min-width: 900px){
  h1 {
    font-size:3.2rem;
  }
  h2{
    font-size: 3rem;
  }

}
@media screen and (min-width: 1100px){
  h1 {
    font-size:3.6rem;
  }
  h2{
    font-size: 3.4rem;
  }
  h2.min{
    font-size: 3.2rem;
  }
}
@media screen and (min-width: 1200px){
  h1 {
    font-size:4rem;
  }
  h2{
    font-size: 3.8rem;
  }

}
@media screen and (min-width: 1400px){
  h1 {
    font-size:4.4rem;
  }
  h2{
    font-size: 4.2rem;
  }



}


/* ========================================================================== */
/* BOUTONS
/* ========================================================================== */
.abtn{
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.abtn.min{
  padding: 8px 20px;
  font-size: .9rem;
  line-height: 1;
}
.abtn.max{
  padding: 12px 25px;
  font-size: 1.2rem;
  line-height: 1.2;
}
@media screen and (min-width: 1200px){
.abtn.min{
  /* padding: 12px 25px; */
  font-size: 1.1rem;
}
.abtn.max{
  font-size: 1.3rem;
  letter-spacing: 3px;
}
}
.terre{
  color: white;
  background-color: transparent;
  border: 1px solid white;
}
.terre:hover{
  color: #619B6B;
  background-color: white;
}
.eau,
.feu{
  color: white;
  background-color: #E8AA14;
  border: 1px solid transparent;
}
.eau:hover{
  background-color: #619B6B;
}
.feu:hover{
  color: #E8AA14;
  background-color: white;
}
.air{
  color: #619B6B;
  background-color: white;
  border: 1px solid #619B6B;
}
.air:hover{
  color: white;
  background-color: #150524;
  border: 1px solid #150524; 
}
.mer{
  color: #E8AA14;
  background-color: white;
  border: 1px solid white;
}
.mer:hover{
  color: white;
  background-color: #E8AA14;
}

.vacances{
  color: #619B6B;
  background-color: white;
  border: 1px solid #619B6B; 
}
.vacances:hover{
  color: white;
  background-color: #619B6B;
  border: 1px solid white;
}





/* ========================================================================== */
/* GRILLE
/* ========================================================================== */
.container,
.largecontainer{
padding-left: 20px;
padding-right: 20px;
margin-left: auto;
margin-right: auto;
}
*[class*="fl-row"]{
display: flex;
flex-direction: row;
}
.fl-row-ctr{
justify-content: center;
align-items: center;
}
.fl-row-ctr-h{
justify-content: center;
}
.fl-row-ctr-v{
align-items: center;
}
*[class*="fl-col"]{
display: flex;
flex-direction: column;
}
.fl-col-ctr{
justify-content: center;
align-items: center;
}
.fl-col-ctr-v{
justify-content: center;
}
.fl-col-ctr-h{
align-items: center;
}
@media screen and (min-width: 768px){
.container{
  padding: unset;
  width: 600px;
}
*[class*="fl-s"]{
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 60px !important;
}
.fl-s-1-2 > *{
  width: calc(50% - 30px);
}
}
@media screen and (min-width: 900px){
.container{
  width: 800px;
}
*[class*="fl-m"]{
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.fl-m-1-2 > *{
  width: calc(50% - 40px);
}
.fl-m-1-3 > *{
  width: calc(33.33% - 40px);
} 
.fl-m-1-3 > *:last-child:nth-child(3n+2){
  margin-right: auto;
} 
}
@media screen and (min-width: 1100px){
.container{
  width: 1000px;
}
}
@media screen and (min-width: 1200px){
.container{
  width: 1100px;
}
.fl-l-1-4 > *{
  width: calc(25% - 60px);
}
.fl-l-1-4 > *:last-child:nth-child(4n-2),
.fl-l-1-4 > *:last-child:nth-child(4n+3){
  margin-right: auto;
} 
}
@media screen and (min-width: 1500px){
.container{
  width: 1200px;
}
}


/* ========================================================================== */
/* SVG
/* ========================================================================== */
svg.icon{
  display: block;
}
svg.icon.logo{
  width: 120px;
  height: 36px;
  fill: white;
}
svg.icon.logo:hover{
  fill: #150524;
}
svg.icon.vacaf{
  width:60px;
  height:41px;
  flex: 0 0 auto;
  fill: white;
}
svg.icon.webcam{
  width:100px;
  height:86px;
}
svg.icon.webcam text{
  fill: white;
  transition: all .3s;
}
svg.icon.webcam circle,
svg.icon.webcam path{
  stroke: white;
  transition: all .3s;
}
a.title__webcam:hover svg text{
  fill: #150524;
}
a.title__webcam:hover svg circle,
a.title__webcam:hover svg path{
  stroke: #150524;
}



svg.icon.info{
  width:20px;
  height:20px;
  flex: 0 0 auto;
  fill:none;
  stroke: white;
}

svg.icon.activite{
  width:60px;
  height:46px;
}
svg.icon.hebergement{
  width:80px;
  height:45px;
}
svg.icon.sejour{
  width:74px;
  height:45px;
}
svg.icon.activite,
svg.icon.hebergement,
svg.icon.sejour{
  fill:#E8AA14;
}


svg.cabanetape{
  width:40px;
  height: 39px;
}
svg.cabine{
  width:40px;
  height: 33px;
}
svg.tente{
  width:40px;
  height: 34px;
}
svg.chalet{
  width:40px;
  height: 40px;
}
svg.collectif{
  width:40px;
  height: 38px;
}
svg.tipi{
  width:40px;
  height: 37px;
}
svg.vigie{
  width:40px;
  height: 36px;
}
svg.cabanetape,
svg.cabine,
svg.tente,
svg.chalet,
svg.collectif,
svg.tipi,
svg.vigie{
  fill: none;
  stroke: #E8AA14;
}






svg.animaux, 
svg.pmr, 
svg.douche{
  fill: none;
  stroke: #E8AA14;
  width: 40px;
  height: 40px;
}








@media screen and (min-width: 900px){
  svg.icon.webcam{
    width:120px;
    height:103px;
  }
}
@media screen and (min-width: 1100px){
  svg.icon.webcam{
    width:140px;
    height:120px;
  }
  svg.icon.activite{
    width:80px;
    height:62px;
  }
  svg.icon.hebergement{
    width:110px;
    height:62px;
  }
  svg.icon.sejour{
    width:102px;
    height:62px;
  }
}
@media screen and (min-width: 1400px){
  svg.icon.logo{
    width: 150px;
    height: 45px;
  }
  svg.icon.vacaf{
  width:70px;
  height:48px;
  }
  svg.icon.webcam{
    width:140px;
    height:120px;
  }
}
@media screen and (min-width: 1500px){
  svg.icon.logo{
    width: 150px;
    height: 45px;
  }
}



/* ========================================================================== */
/* NAVIGATION
/* ========================================================================== */
header#header{
  background-color: #E8AA14;
}
.home header#header{
  position: absolute;
  z-index: 999;
  width: 100%;
  background-color: transparent;
}
.header__menu {
  gap: 20px;
  padding: 20px;
}
.header__nav,
.header__contact{
	display: none;
}
.header__logo {
	margin-right: auto;
}
nav ul{
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 15px;
}
nav ul li a{
  text-transform: uppercase;
  letter-spacing: 1px; 
  display: block;
  color: white;
}

/* ========================================================================== */
/* NAVIGATION TELEPHONE
/* ========================================================================== */
.header__mobilemenu {
  position: absolute;
	opacity: 0;
  height: 0;
  visibility: hidden;
}
.header__burger{
  cursor: pointer;
  width: 40px;
  height: 40px;
  display: block;
}
.header__burger .burger{
  position: relative;
  background-color: white;
  height: 2px;
  width: 30px;
  z-index: 2;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);	
  top:50%;
}
.header__burger .burger::after, 
.header__burger .burger::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-8px);
  display: block;
  width: 30px;
  height: 2px;
  background-color: white;
}
.header__burger .burger::after {
  transform: translateY(8px);
}
.header__burger.active .burger {
  transform: rotate(180deg);
  background-color: transparent;
}
.header__burger.active .burger::before {
  transform: translateY(0) rotate(-45deg);
}
.header__burger.active .burger::after {
  transform: translateY(0) rotate(45deg);
}
















/* ========================================================================== */
/* NAVIGATION : RESPONSIVE
/* ========================================================================== */

@media screen and (min-width: 900px){
  .header__menu{
    justify-content: space-between;
    align-items: center;
  }
  .header__menu:hover{  
    background-color: #E8AA14;
  }
  .header__nav{
    display: block;
    font-size: 1rem;
  }
  .header__nav ul{
    gap: 20px;
  }
  .header__nav ul a{
    text-align: center;
    text-wrap: nowrap;
  }
  .header__nav li.current-menu-ancestor > a,
  .header__nav li.current-menu-item a,
  .header__nav li a:hover,
  .header__nav li a:focus{
    color: #150524;
  }
  .header__contact,
  .header__vacaf{
    align-self: center;
  }
  .header__burger,
  .header__mobilemenu {
    display: none;
  }
  .header__contact{
    display: block;
    padding: 12px 20px;
    background-color: white;
    color: #E8AA14;
    text-transform: uppercase;
    border-radius: 50px;
    letter-spacing: 1px;
    font-size: .9rem;
    line-height: 1;
  }
  .home .header__contact{
    background-color: #E8AA14;
    color: white;
  }
  .home .header__menu:hover .header__contact{
    background-color: white;
    color: #E8AA14;
  }
  .header__contact:hover{
    color: white !important;
    background-color: #150524 !important;
  }
  .header__nav li.menu-item-has-children {
      position: relative;
  }
  .header__nav li.menu-item-has-children ul.sub-menu {
    	transition: all .3s;
      position: absolute;
      z-index: 999;
      top: 100%;
      left: 50%;
      transform-origin: 50% 0;
      transform: translateX(-50%) scaleY(0);
      opacity: 0;
      gap: 10px;
      /* padding-top: 10px; */
      text-align: left;
      background-color: #E8AA14;
      padding: 20px 25px 15px;
  }
  .header__nav li.menu-item-has-children > a::after {
      content: "";
      position: absolute;
      height: 2px;
      background-color: #150524;
      width: 0;
      left: 50%;
      bottom: -5px;
      transform: translateX(-50%);
      transition: .3s all;
      z-index: 1000;
  }

  .header__nav li.menu-item-has-children:hover ul.sub-menu {
    transform: translateX(-50%) scaleY(1);
    opacity: 1;
  }
  .header__nav li.menu-item-has-children:hover>a::after {
    width: 100%;
  }

  
  .header__nav li.menu-item-has-children a {
    cursor: pointer;
  }
  
  li.menu-item-has-children ul.sub-menu a {
    text-transform: unset;
    letter-spacing: unset;
  }





}
@media screen and (min-width: 1100px){
  .header__menu{
    gap:40px;
    padding: 30px;    
  }
  .header__nav ul{
    gap: 30px;
  }
  .header__nav li.groups{
    margin: 0 20px;
  }
}
@media screen and (min-width: 1200px){
  .header__menu{
    padding: 40px;    
  }
  .header__nav li.groups{
    margin: 0 30px;
  }
  .header__contact{
    margin-left: 20px;
    font-size: 1.1rem;
  }
}
@media screen and (min-width: 1400px){
  .header__nav ul{
    gap: 40px;
  }
  .header__nav ul li a,
  .header__contact{
    font-size: 1.2rem;
  }
  .header__contact{
    padding: 12px 25px;
  }
}
@media screen and (min-width: 1500px){
  .header__menu{
    gap:60px;
  }
  .header__nav li.groups{
    margin: 0 40px;
  }
  .header__contact{
    margin-left: 30px;
  }
}













/* ========================================================================== */
/* EN-TETE
/* ========================================================================== */
main{
  overflow-x: hidden;
  padding-bottom: 240px;
}
main section{
  margin-bottom: 60px;
  position:relative;
  z-index: 1;
}
/* main section:first-child,
main section:last-child{
  margin-bottom: 0;
}
.archive main section:nth-child(2){
  margin-top: 60px;
} */
.home section{
  margin-bottom: 120px;
  gap: 40px;
}
.home section:first-child{
  margin-bottom: 20px;
}
.home section:last-child{
  margin-bottom: 0;
}
.home__title span.pretitle,
.page__title span.pretitle{
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 2px;
}
.page__title a:first-child{
  margin-bottom: 20px;
  align-self: center;
}
.page__title{
  color: white;
  gap: 10px;
  text-align: center;
  flex: 0 0 100%;
}
.page__title span.postitle{
  font-size: 1.1rem;
  letter-spacing: 1px;
}
.page__cover,
.gallery__cover,
.single__map__cover{
  display: none;
  position: absolute;
  z-index: -1;
  -webkit-clip-path: polygon(35% 0, 65% 0, 100% 70%, 85% 100%, 15% 100%, 0 70%);
  clip-path: polygon(35% 0, 65% 0, 100% 70%, 85% 100%, 15% 100%, 0 70%);
}
.page__header {
  position: relative;
  z-index: 1;
  background-color: #E8AA14;
  padding: 40px 0 20px;
}
.page__header__content{
  position: relative;
  min-width: 100%;

}
.page__break {
  position: absolute;
  right: -80px;
  bottom:-20px;
  width: 120px;
  height: 70px;
}
.page__break::after{
  content:'';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: -1px;
  background-color: white;
  z-index: -1;
  -webkit-clip-path: polygon(53% 0, 88% 14%, 100% 100%, 0 100%);
	clip-path: polygon(53% 0, 88% 14%, 100% 100%, 0 100%);
}
.page__break .icon {
  display: none;
}
.wp-singular.single .page__header{
  margin-bottom: 0;
}
.wp-singular.single .page__header::after{
  content: "";
  display: block;
  background-color: #E8AA14;
  z-index: -2;
  position: absolute;
  bottom: -57px;
  height: 57px;
  left: 0;
  right: 0;
}
@media screen and (min-width: 900px){
  .page__title a:first-child{
    align-self: flex-start;
  }
}

/* ========================================================================== */
/* EN-TETE : PAGE D'ACCUEIL
/* ========================================================================== */
.home__head{
  gap:0 !important;
  padding-top: 0 !important;
}
.home__title{
  position: absolute;
	transform: translate(-50%,-50%);	
	left: 50%;
	top:50%;
  z-index: 99;
  gap: 10px;
  text-align: center;
  color: white;
}
.title__webcam{
  display: block;
  position: absolute;
  bottom: -70px;
  right: 0;
}
.home__break{
  display: block;
  position: absolute;
  z-index: 1;
  bottom: -1px;
  width: 110px;
  height: 60px;
}
.home__break::after{
  display: block;
  content: '';
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  -webkit-clip-path: polygon(30% 0%, 70% 0%, 100% 100%, 0% 100%);
	clip-path: polygon(30% 0%, 70% 0%, 100% 100%, 0% 100%);
}
.home__break svg{
  display: block;
  content: '';
  position: absolute;
	transform: translate(-50%,-50%);	
	left: 50%;
	top:100%;
}





/* ========================================================================== */
/* EN-TETE : PAGE & ARCHIVES
/* ========================================================================== */
/* .single__headline {
  margin-bottom: 40px;
} */
.single__headline__content {
  position:relative;
  z-index: 1;
}







/* .headline__ticket{
  width: 100%;
} */
.headline__ticket .description{
  /* display: grid;
  grid-template-columns: [first] 50% [line2] 50% [end]; */

  gap: 10px 30px;
  font-size: 1.1rem;
  background-color: #619B6B;
  padding: 20px 0;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
}
.headline__ticket .desc {
  align-items: baseline;
  gap: 10px;
}
.headline__ticket .desc.price {
  width: 100%;
}

/* .headline__ticket .desc.price {
  grid-column-start: first;
  grid-column-end: line2;
  grid-row-start: 1;
  grid-row-end: 2;
} */
.headline__ticket .desc span:nth-child(2){
  color: white; 
  font-size: 1.3rem;
    line-height: 1;

  /* margin-left: 5px; */
}

.headline__ticket .information{
  background-color: #150524;
  padding: 10px;
  color: white;
  gap: 10px;
  font-size: 1rem;
}


.archive__categories{
  flex-wrap: wrap;
  gap: 10px;
}
.category,
.tag {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 1rem;
  line-height: 1;
  padding: 5px 10px;
  border-radius: 50px;
}
.category{
  border: 1px solid #150524;
  color: #150524;
}
.category.selected,
.category:hover,
.category.selected:hover{
  border-color:transparent;
  background-color: #E8AA14;
  color: white;
}

/* ========================================================================== */
/* EN-TETE : RESPONSIVE
/* ========================================================================== */
@media screen and (min-width: 768px){
  /* main section,{
    margin-bottom: 80px;
  }
  .archive main section:nth-child(2){
    margin-top: 80px;
  } */
  .title__webcam{
    bottom: -40px;
    right: -40px;
  }
  .home__break{
    width: 110px;
    height: 60px;
  }
  /* .single__headline::after{
    height:48px;
  } */
  .page__header__content{
    min-width: unset;
  }
  .gallery__cover{
    display: block;
  }
  .headline__ticket,
  .page__title{
    margin-right: auto;
  }
  .page__title{
    max-width: 500px;
    text-align: left;
  }
  .page__break {
    right: 0;
  }
  .page__break .icon {
    position: absolute;
    left: 55%;
    top: 100%;
    transform: translate(-50%,-50%);	
    display: block;
  }
  

  .headline__ticket .description{
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 40px ;
    padding: 20px;
  }
  .headline__ticket .desc {
    flex-direction: column;
    gap: 0;
    justify-content: space-between;

  }


  .headline__ticket .description a:last-child,
   .headline__ticket .description button:last-child{
    align-self: center;
    margin-left: auto;
    cursor: pointer;
  }
  .headline__ticket .desc span:nth-child(2){
    font-size: 1.8rem;
    display: block;
    margin-left: 0
  }
  .headline__ticket .desc span:nth-child(2) span{
    font-size: 1.2rem;
  }
  .headline__ticket .desc.price {
    width: auto;
  }
  .headline__ticket .desc.price span:nth-child(2) {
    display: flex;
    flex-direction: column;
  }
  .single-activities .headline__ticket .desc.price span:nth-child(2) {
    flex-direction: row;
    align-items: baseline;
  }

}
@media screen and (min-width: 900px){
  .home__title{
    max-width: 600px;
  }
  .page__cover{
    display: block;
    transform-origin: 50% 0;
    top: 0;
    right: 0;
    transform: rotate(10deg) translate(60%, -20%);
  }

  .headline__ticket{
    max-width: 600px;
  }


}
@media screen and (min-width: 1100px){
  .home section{
    gap: 60px;
    margin-bottom: 160px;
  }
  .home__title span.pretitle,
  .page__title span.pretitle{
    font-size: 1.3rem;
    letter-spacing: 3px;
  }
  .page__title span.postitle{
    font-size: 1.3rem;
  }
  .title__webcam .webcam__anim::after{
    width: 70px;
    height: 70px;
  }  
  .title__webcam{
    bottom: -60px;
    right: -40px;
  }

  .home__break{
    width: 130px;
    height: 70px;
  }
  .headline__ticket,
  .page__title{
    max-width: 700px;
  }
  .headline__ticket .desc.price span:nth-child(2) {
    flex-direction: row;
    align-items: baseline;
  }
  .page__cover{
    transform: rotate(10deg) translate(20%, -10%);
  }
  .page__break {
    width: 150px;
    height: 90px;
  }
  .archive__categories{
    gap: 30px;
  }
  .category,
  .tag {
    padding: 8px 12px;
  }

}
@media screen and (min-width: 1200px){
  .page__header {
    padding: 60px 0 40px;
  }
  .page__break {
    bottom: -40px;
  }
  .home section{
    gap: 80px;
  }
  .home__break{
    width: 150px;
    height: 80px;
  }
  .headline__ticket{
    max-width: 800px;
  }
  .headline__ticket .description{
    padding: 30px;
  }
  .headline__ticket .desc span:nth-child(2){
    font-size: 2.4rem;
  }
  .headline__ticket .desc span:nth-child(2) span{
    font-size: 1.6rem;
  }



}
@media screen and (min-width: 1400px){
  main section{
    margin-bottom: 100px;
  }
  .home__title{
    max-width: 900px;
  }
  .home__break{
    width: 180px;
    height: 90px;
  }
  .home section{
    margin-bottom: 200px;
  }
  .page__cover{
    transform: rotate(10deg) translate(50%, -15%);
  }


}
@media screen and (min-width: 1500px){

  .page__cover{
    transform: rotate(10deg) translate(40%, 0%);
  }


}

/* ========================================================================== */
/* ARTICLES.entry-content
/* ========================================================================== */
article.entry-content > *:first-child{
margin-top: 0 !important;
}
article.entry-content > *:last-child{
margin-bottom: 0 !important;
}
article.entry-content{
max-width: 600px;
display: flex;
flex-direction: column;
font-size: 1.3rem;
}
article.entry-content > *{
line-height: 1.4;
}
article.entry-content a{
  text-decoration: underline;
  color: #E8AA14;
}
article.entry-content a:hover{
  color: #E8AA14;
}
article.entry-content p{
  margin-top: 20px;
}
article.entry-content .wp-block-heading + p{
margin-top: 0;
}
article.entry-content .wp-block-heading{
  font-family: "Motherlands";
  text-transform: none;
  text-align: left;
  color: #E8AA14;
  line-height: 1;
}
article.entry-content h2.wp-block-heading{
  margin: 80px 0 20px;
  font-size: 2.4rem;
  color: #E8AA14;
}
article.entry-content h3.wp-block-heading{
  margin: 60px 0 20px;
  color: #E8AA14;
}
article.entry-content h2.wp-block-heading + h3.wp-block-heading{
  margin: 40px 0 20px;
}
.pages__categories{
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 40px;
}
@media screen and (min-width: 900px){

  article.entry-content,
  .pages__categories{
    max-width: 600px;
  }
  article.entry-content h2.wp-block-heading{
    margin: 140px 0 20px;
  }

}
@media screen and (min-width: 1100px){
  article.entry-content h2.wp-block-heading{
    font-size: 3rem;
  }
  .pages__categories{
    gap: 10px 30px;
    margin-bottom: 60px;
  }

}





@media screen and (min-width: 1200px){

  article.entry-content,
  .pages__categories{
    max-width: 700px;
  }


}

/* ========================================================================== */
/* CONTENUS GENERAL
/* ========================================================================== */
.subtitle h2{
  color: #E8AA14;
  margin-top: 20px;
  text-align: center;
  gap: 10px;
}
.subtitle h2 span:first-child{
  font-family: 'NationalPark';
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 1.2rem;
}
.grid{
  gap: 40px;
  width: 100%;
}
.grid .title{
  font-size: 2rem;
}
.tag.tag1{
  color: white;
  background-color: #619B6B;
  border: 1px solid transparent;
}
.tag.tag2 {
  color: #619B6B;
  border: 1px solid #619B6B;
}
.tag.tag3 {
  color: #E8AA14;
  border: 1px solid transparent;
  background-color: white;
}
.tag.tag4 {
  color: #E8AA14;
  border: 1px solid #E8AA14;
  background-color: transparent;
}
.tag.tag5 {
  color: white;
  background-color: #E8AA14;
}
.single__prog,
.single__info{
  gap: 30px;
}
.prog__day,
.info__list{
  align-items: flex-start;
  gap: 10px;
}
.day__txt{
  gap: 10px;
  padding-left: 15px;
  margin: 0;
  line-height: 1.4;
}
.list__txt  {
  gap: 5px;
  padding-left: 15px;
  margin: 0;
  line-height: 1.2;
}
.day__txt li::marker,
.list__txt li::marker {
  content:'›  ';
  display: inline-block;
  color: #619B6B;
}

@media screen and (min-width: 900px){
  .subtitle h2 span:first-child{
    font-size: 1.4rem;
    letter-spacing: 3px;
  }
}
@media screen and (min-width: 1100px){
  .subtitle h2{
    margin-top: 40px;
  }
  .grid .title{
    font-size: 2.5rem;
  }
}
@media screen and (min-width: 1400px){
  .subtitle h2 span:first-child{
    font-size: 1.6rem;
  }
}











/* ========================================================================== */
/* ACTIVITES, SEJOURS, MATERIEL, HEBERGEMENT
/* ========================================================================== */

.activity,
.trip,
.material,
.house{
  background-color: #E8AA14;
  display: block;
}
.activity__cover,
.trip__cover,
.material__cover,
.house__cover{
  position: relative;
  z-index: 1;
	transition: all .3s;
}
.activity__cover::after,
.trip__cover::after,
.material__cover::after,
.house__cover::after{
  position: absolute;
  z-index: -1;
  content: "";
  display: block;
  background-color: white;
  top: 0;
  left: 0;
  right: 0;
  bottom: 50px;
}
.trip__cover::after{
  bottom: 75px;
}
.activity__cover img,
.material__cover img{
  transition: clip-path .3s;
  clip-path: polygon(30px 0, calc(100% - 100px) 0, 100% calc(100% - 50px), calc(100% - 30px) 100%, 0 100%, 0 50px);
}
.trip__cover img{
  transition: clip-path .3s;
  clip-path: polygon(0 0, calc(100% - 100px) 0, 100% calc(100% - 75px), calc(100% - 30px) 100%, 0 100%);
}
.house__cover img{
  transition: clip-path .3s;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 75px), 100% 100%, 0 100%);
}
.material__content{
  gap: 10px;
}
.activity__content,
.trip__content,
.material__content,
.house__content{
  position: relative;
  padding: 20px;
  align-items: flex-start;
}
.activity__content .title,
.trip__content .title,
.material__content .title,
.house__content .title{
  color: white;
}
.activity__content .description,
.trip__content .description,
.house__content .description{
  margin: 5px 0 10px;
  font-size: 1.1rem;
  color: #150524;
}
.activity__content .desc span:nth-child(2),
.trip__content .desc span:nth-child(2),
.house__content .desc span:nth-child(2){
  font-size: 1.3rem;
  margin-left: 10px;
}
.activity:hover .activity__cover img{
  clip-path: polygon(30px 0, 100% 0, 100% calc(100% - 50px), calc(100% - 30px) 100%, 0 100%, 0 50px);
}
.trip:hover .trip__cover img{
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 75px), calc(100% - 30px) 100%, 0 100%);
}
.house:hover .house__cover img{
  clip-path: polygon(0 0, calc(100% - 100px) 0, 100% calc(100% - 75px), 100% 100%, 0 100%);
}
.activity:hover,
.trip:hover,
.house:hover{
  background-color: #619B6B;
}
.activity:hover .description,
.trip:hover .description,
.house:hover .description{
  color: white;
}
.activity:hover .abtn,
.trip:hover .abtn,
.house:hover .abtn{
  margin-left: 10px;
  color: #619B6B;
  background-color: white;
}






.single__material__content,
.single__livings__content{
  align-items: flex-start;
  gap: 20px;
}
.single__material .grid,
.single__livings__content .grid{
  align-items: stretch;
}

.living{
  padding: 40px;
  border: 1px solid #619B6B;
  gap: 20px;
  justify-content:center;
}
.living__content{
  text-align: center;
  gap: 10px;
  color: #619B6B;
}

@media screen and (min-width: 768px){
  .trip__content,
  .activity__content,
  .house__content{
    flex: 1 1 auto
  }
  .trip__content a,
  .activity__content a,
  .house__content a{
    margin-top: auto;
  }
}
@media screen and (min-width: 1100px){
  .activity__content .description,
  .trip__content .description,
  .house__content .description{
    flex-direction: row;
    width: 100%;
    margin: 10px 0 20px;
  }
  .trip__content .description,
  .house__content .description{
    gap: 40px;
  }
  .activity__content .description .desc > span,
  .trip__content .description .desc > span,
  .house__content .description .desc > span{
    display: block;
    margin: 0;
    line-height: 1.2;
  }
  .activity__content .desc span:nth-child(2),
  .trip__content .desc span:nth-child(2),
  .house__content .desc span:nth-child(2) {
    font-size: 1.6rem;
  }
  .house__content .desc span:nth-child(2) span {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 1200px){
  .activity__content .description,
  .trip__content .description,
  .house__content .description{
    margin: 10px 0 20px;
  }
  .trip__content .description,
  .house__content .description{
    gap: 60px;
  }
}
@media screen and (min-width: 1400px){
  .activity__content,
  .trip__content,
  .house__content{
    padding: 30px;
  }
}



/* ========================================================================== */
/* PICTOGRAMMES (DOUCHES, PMR, ANIMAUX)
/* ========================================================================== */
.single__pictograms{
  gap: 20px;
  flex-wrap: wrap;
}
.pictogram__item{
  gap: 10px;
  justify-content: start;
}
.picto__icon{
  position: relative;
  padding: 5px;
  border-radius: 40px;
  overflow: hidden;
  flex: 0 0 auto;
}
.picto__desc{
  text-transform: uppercase;
  font-size: 1rem;
  line-height: 1;
  text-align: left;
}
.picto__icon::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid #150524;
    border-radius: 70px;
    z-index: 10;
}
.pictogram__item.animals.no .picto__icon::before,
.pictogram__item.mobility.no .picto__icon::before {
    content: '';
    display: block;
    position: absolute;
    width: 49px;
    height: 2px;
    background-color: #150524;
    transform: rotate(-45deg);
    top: 50%;
    left: 2px;
    z-index: 20;
}



.house .pictograms{
  /* position: absolute; */
  z-index: 10;
  gap: 10px;
  /* margin: 10px; */
  margin-bottom: 20px;

}
.house .pictograms .picto__icon{
  /* background-color: white; */
}
.house .pictograms .picto__icon .icon{
  fill: none !important;
    stroke: white !important;
stroke-width:5;
}

@media screen and (min-width: 768px){
  .single__pictograms{
    justify-content: flex-start;
    gap: 40px;
  }
}
@media screen and (min-width: 1200px){
  .single__pictograms{
    gap: 80px;
  }
}





/* ========================================================================== */
/* CARTES
/* ========================================================================== */
.archive__map,
.single__map{
  background-color: #FAF7F2;
  padding-top: 20px;
  padding-left: 20px;
}
.archive__map{
  display: none;
}
.archive .house.timed{
  animation: 3s timed 1s ease;
}
.map__map{
  position: relative;
}
.map__map svg{
  display: block;
}
.single__map__content{
  gap: 20px;
  position: relative;
}
.single__map__content .map__map{
  justify-content: flex-end;
}
.single__map__content svg{
  max-width: 500px;  
}

.archive__map svg g[id^="housing-"] path{
  stroke: #150524;
  fill: #619B6B;
}
.single__map svg g[id^="housing-"] path{
  stroke: #F7F2EA;
  fill: #F7F2EA;
}
.single__map svg g[id^="housing-vigie"] path,
.single__map svg g[id^="housing-cabine"] path{
  stroke: #619B6B;
}
svg g[id^="housing-"] path[fill="none"]{
  stroke: transparent;
  fill:transparent;
}
.archive svg g.showOverlay path,
.archive svg g[id^="housing-"] path{
  cursor: pointer;
  transition: all .3s ease;
}
.archive svg g.showOverlay path,
.archive svg g[id^="housing-"]:hover path{
  fill: white;
  stroke: #150524;
}
.archive svg g.showOverlay path[fill="none"],
.archive svg g[id^="housing-"]:hover path[fill="none"]{
  fill: #E8AA14;
  stroke: transparent;
}
.single svg g.selected path{
  fill: white;
  stroke: #150524;
}
.single svg g.selected path[fill="none"]{
  fill: #E8AA14;
  stroke: transparent;
  animation: 3s opacity ease-in-out infinite;
}


@media screen and (min-width: 768px){
  .single__map__cover{
    display: block;
    top:75%;
    left: 0;
    transform: rotate(-10deg) translate(-25%, -50%);
  }
}
@media screen and (min-width: 900px){
  .archive__map{
    display: block;
  }
  .archive__map__content{
    display: flex;
    align-items: center;
    gap: 40px;
  }
  .archive .map__list{
    width: 40%;
    flex-wrap: wrap;
    justify-content: flex-start;
    column-gap: 10px;
    row-gap: 10px;
  }
  .archive .thehousemap{
    gap: 10px;
    align-items: center;
    padding: 8px 12px 10px;
    border: 1px solid #619B6B;
    border-radius: 50px;
    cursor: pointer;
    color: #619B6B;
    /* font-size: 1.4rem; */
    /* font-family: 'Motherlands'; */
    line-height: 1;
    text-transform: uppercase;
  }
  .archive .map__map{
    flex-grow: 1;
    justify-content: flex-end;
  }
  .thehousemap:hover,
  .thehousemap.active{
    background-color: #E8AA14;
    border-color:#E8AA14;
    color: white;
  }
  .single__map{
    width: 800px;
    margin-left: auto;
    margin-right: auto;
  }
  .single .map__title{
    width: calc(40% - 40px);
  }

}
@media screen and (min-width: 1100px){
  .single__map{
    width: 1000px;
  }
  .single__map__content svg{
    max-width: 600px;  
  }
  .single__map__cover{
    top:75%;
  }
  .thehousing .thehousing__title{
    font-size: 2rem;
  }
}
@media screen and (min-width: 1200px){
  .archive__map,
  .single__map{
    width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 40px;
    padding-left: 40px;
  }
  .archive .thehousemap{
    padding: 10px 15px 12px;
  }
  .archive .map__list {
      width: 30%;
  }
}
@media screen and (min-width: 1400px){
  .map__map svg{
    max-width: 700px;
  }
  .archive__map .thehousing{
    padding-top: 15px;
    padding-bottom: 15px;
  }
}

@media screen and (min-width: 1500px){
  .archive__map,
  .single__map{
    width: 1200px;
  }

}




















/* ========================================================================== */
/* PAGE D'ACCUEIL : HEBERGEMENTS
/* ========================================================================== */
.home__housings{
  background-color: #FAF7F2;
  padding-top: 40px;
  padding-bottom: 40px;
}
.home__housings__content{
  position: relative;
  gap: 40px;
}
.home__housings .housings__cover{
  display: none;
}
.home__housings .grid{
  gap: 0;
  position: relative;
}
.home__housings .housings__list{
  row-gap: 0 !important;
  column-gap: 40px !important;
  width: 100%;
}
.thehousing{
  cursor: pointer;
  border-bottom: 1px solid #F6E4BB;
  position: relative;
  gap: 20px;
  align-items: center;
  padding:10px;
  justify-content: stretch;
}
.thehousing:last-child{
  border-bottom: none;
}
.thehousing .thehousing__icon{
  flex:0 0 auto;
}
.thehousing .thehousing__title{
  color: #E8AA14;
  font-size: 1.9rem;
}
.thehousing .thehousing__capacity{
  color: #150524;
  display: none;
  font-size: 1.3rem;
  margin-left: auto;
}
.thehousing:hover{
  background-color: #619B6B;
}
.thehousing:hover .thehousing__icon{
  stroke:white;
}
.thehousing:hover .thehousing__title,
.thehousing:hover .thehousing__capacity{
  color:white;
}
@media screen and (min-width: 768px){
  .thehousing{
  border-bottom: unset;
  width: calc(50% - 20px);
  }
  .thehousing::before{
    content:'';
    display: block;
    height: 1px;
    width: 100%;
    background-color: #F6E4BB;
    position: absolute;
    top: 0;
    left: 0;
  }
  .thehousing:nth-child(even)::before{
    content:'';
    display: block;
    height: 1px;
    width: calc(100% + 60px);
    background-color: #F6E4BB;
    position: absolute;
    top: 0;
    left: -60px;
    right: 0;
  }
  .thehousing:nth-child(-n+2)::before{
    display: none;
  }
}
@media screen and (min-width: 900px){
  .thehousing{
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .home__housings .housings__cover{
    position: absolute;
    display: block;
    opacity: 0;
    z-index: -1;
    top: 0;
    right: 0;
    -webkit-clip-path: polygon(35% 0, 65% 0, 100% 70%, 85% 100%, 15% 100%, 0 70%);
    clip-path: polygon(35% 0, 65% 0, 100% 70%, 85% 100%, 15% 100%, 0 70%);
    transform: rotate(10deg) translate(50%, -30%);
  }
  .home__housings .housings__cover:first-child{
    opacity: 100%;
  }
  .home__housings .housings__cover.showOverlay{
    opacity: 100%;
  }
}
@media screen and (min-width: 1100px){
  .home__housings{
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .home__housings__content{
    gap: 60px;
  }


  .thehousing .thehousing__title{
    font-size: 2.5rem;
  }
  .thehousing .thehousing__icon{
    width: 50px;
    height: 50px;
  }
}
@media screen and (min-width: 1200px){
  .home__housings{
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .home__housings__content{
    gap: 80px;
  }

}




/* ========================================================================== */
/* PAGE D'ACCUEIL : LIEUX DE VIE
/* ========================================================================== */

.home__livings{
  background-color: #619B6B;
  padding: 0 20px;
  gap: 40px !important;
}
.home__livings picture{
  position: relative;
}

.home__livings picture:last-of-type{
  order:4;
}
.home__livings picture::after{
  position: absolute;
  content: "";
  display: block;
  background-color: white;
  z-index: -1;
  right: -20px;
  left: -20px;
}
.home__livings picture:first-of-type:after{
  top: 0;
  bottom: 50%;
}
.home__livings picture:last-of-type:after{
  top: 50%;
  bottom: 0;
}
.home__livings h2{
  color:white;
  margin-top: 0;
}
@media screen and (min-width: 768px){
  .home__livings{
    padding: 40px;
  }
  .home__livings picture{
    position: absolute;
    top: 50%;
    z-index: -10;
    max-width: 300px;
  }
  .home__livings picture:first-of-type{
    left: 0;
    transform: translate(-75%,-50%);
  }
  .home__livings picture:last-of-type{
    right: 0;
    transform: translate(+75%,-50%);

  }
  .home__livings picture::after{
    content: unset;
  }
}

@media screen and (min-width: 900px){
  .home__livings picture:first-of-type{
    transform: translate(-60%,-50%);
  }
  .home__livings picture:last-of-type{
    transform: translate(+60%,-50%);
  }
}
@media screen and (min-width: 1100px){
  .home__livings{
    padding: 60px;
  }
  .home__livings picture{
    max-width: 400px;
  }
  .home__livings picture:first-of-type{
    transform: translate(-50%,-50%);
  }
  .home__livings picture:last-of-type{
    transform: translate(+50%,-50%);
  }
}




/* ========================================================================== */
/* PAGE SEJOURS : HEBERGEMENT
/* ========================================================================== */
.single__triphouse__content,
.badge{
  position: relative;
  z-index: 1;
}
.single__triphouse__content{
  background-color: #619B6B;
}
.badge{
    display: block;
    position: absolute;
    z-index: 1;
}
.badge::after{
  content:'';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 70px;
}
.badge .icon{
  width: 70px;
  height: 70px;
}
.triphouse__badge.badge{
  left: 0;
  top: 20px;
  transform: rotate(-10deg) translateX(-50%);
  padding: 20px;
}
.triphouse__badge.badge::after{
  border: 3px solid #E8AA14;
  padding: 10px;
}
/* .triphouse__badge.badge .icon{
  width: 70px;
  height: 70px;
} */
.house__content .badge{
  right: 10px;
  top: -50px;
  transform: rotate(-10deg) ;
  padding: 15px;
}
.house__content .badge::after{
  border: 2px solid #E8AA14;

}
.house__content .badge .icon{
  width: 40px;
  height: 40px;
}


.triphouse__txt{
  padding: 20px;
  color: white;
  align-items: flex-start;
}
.triphouse__txt span{
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 2px;
}
.triphouse__txt h2{
    margin: 10px 0 20px;
}
.triphouse__txt a{
    margin-top: 20px;
}
@media screen and (min-width: 768px){
  .single__triphouse__content{
    flex-direction: row;
  }
  .triphouse__cover{
    /* width: 50%; */
    max-width: 50%;
  }
  .triphouse__txt{
    width: 50%;
    padding: 40px;
    justify-content: center;
    flex: 1 1 auto;
  }
}
@media screen and (min-width: 900px){
  /* .triphouse__cover{
    width: 30%;
  }
  .triphouse__txt{
    width: 70%;
  } */
}
@media screen and (min-width: 1100px){
  /* .triphouse__cover{
    width: 40%;
  }
  .triphouse__txt{
    width: 60%;
  } */
  .triphouse__txt span{
    font-size: 1.3rem;
    letter-spacing: 3px;
  }
  .triphouse__txt a{
     margin-top: 40px;
  }
}
@media screen and (min-width: 1400px){
  .house__content .badge{
    top: -70px;
  }
  .house__content .badge::after{
    border-width: 3px;
  }
  .house__content .badge .icon{
    width: 60px;
    height: 60px;
  }
}
/* ========================================================================== */
/* CERTIFICATION
/* ========================================================================== */

.single__certification{
  background-color: #E8AA14;
  padding: 40px;
  gap: 40px;
  color: white;
  text-align: center;
}
.single__certification .certification__text{
  gap: 10px;
}


/* ========================================================================== */
/* GALERIES
/* ========================================================================== */
.single__button a{
  margin-top: 20px;
}
.single__gallery,
.single__gallery__content {
  position:relative;
  z-index: 1;
}
.gallery__cover{
  left: 0;
  top: 0;
  transform: rotate(-10deg) translate(-40%, -60%);
}
.gallery__grid{
  gap: 20px !important;
}
.gallery__grid .thumbnail{
  cursor: pointer;
}

.gallery__grid picture{
  position: relative;
    transition: all .3s;

}
.gallery__grid picture::before{
  content: "";
  display: block;
  position: absolute;
  z-index: 10;
  background-color: #E8AA14;
  opacity: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: all .3s;
}
.gallery__grid picture:hover::before{
opacity:.5;
}
@media screen and (min-width: 768px){
  .gallery__grid.fl-s-1-2 > * {
    width: calc(50% - 10px);
  }
}
@media screen and (min-width: 900px){
  .gallery__grid.fl-m-1-3 > * {
    width: calc(33.33% - 14px);
  }
  .gallery__cover{
    transform: rotate(-10deg) translate(-20%, -60%);
  }
}
@media screen and (min-width: 1100px){
  .gallery__grid.fl-l-1-4 > * {
      width: calc(25% - 15px);
  }
}
@media screen and (min-width: 1400px){
  .gallery__cover{
    transform: rotate(-10deg) translate(-60%, -60%);
  }
}


/* ========================================================================== */
/* SPONSORS
/* ========================================================================== */
.home__sponsors h2{
  color: #150524;
}
.home__sponsors .grid{
  flex-wrap: wrap;
      align-items: center;
    row-gap: 0;
}



/* ========================================================================== */
/* PIED DE PAGE
/* ========================================================================== */
svg.icon.activital,
svg.icon.instagram,
svg.icon.facebook{
  fill: white;
}
svg.icon.activital:hover,
svg.icon.instagram:hover,
svg.icon.facebook:hover{
  fill: #150524;
}
svg.icon.activital{
  width: 150px;
  height: 45px;
}
svg.icon.instagram,
svg.icon.facebook{
  width: 40px;
  height: 40px;
}
footer{
  background-color: #619B6B;
  padding-bottom: 20px;
  /* margin-top: 240px; */
}
.footer__contact{
  gap: 20px;
}
.contact__name{
  z-index: 1;
  color:white;
  position: relative;
  gap: 10px;
}
.contact__name .socials{
  gap: 10px;
}
.contact__name .carte{
  position: absolute;
  z-index: -2;
  right: -20px;
  top: 0;
  width: 250px;
  height: 250px;
  transform:  translate(0,-200px);
}
.contact__name::after{
  display: block;
  content: '';
  position: absolute;
  z-index: -1;
  width: 350px;
  height: 415px;
  top: 50%;
  left: -20px;
  background-color: #E8AA14;
  -webkit-clip-path: polygon(30% 0, 100% 35%, 100% 65%, 30% 100%, 0 85%, 0 15%);
  clip-path: polygon(30% 0, 100% 35%, 100% 65%, 30% 100%, 0 85%, 0 15%);
  transform:  translate(0,-50%);
}
.contact__infos{
  background-color: white;
  z-index: 1;
  padding: 40px;
  gap: 40px;
}
.contact__infos .title{
  gap: 5px;
  color: #E8AA14;
  text-transform: uppercase;
  font-size: 1.2rem;
  line-height: 1.2;
}
.contact__activities,
.contact__housings{
    gap: 10px;
}
.contact__infos a.min{
  font-size: 1.1rem;
  text-transform: unset;
}
.footer__legals{
  margin: 30px 0;
}
.footer__legals,
.footer__copyrights{
  font-size: 1.1rem;
  color: white;
}
.footer__legals a,
.footer__copyrights a{
  color: white;
}
.footer__legals a:hover,
.footer__copyrights a:hover{
  color: #150524;
}
.footer__legals ul{
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer__copyrights{
  justify-content: space-between;
  border-top: 1px solid white;
  padding-top: 20px;
  font-size: .9rem;
}
@media screen and (min-width: 768px){
  .contact__name .carte{
    right: 0;
    transform:  translate(0,-125px);
  }
  .contact__infos{
    flex-direction: row;
    justify-content: center;
    gap: 60px;
  }
  .footer__legals ul,
  .footer__copyrights{
    flex-direction: row;
  }
  .footer__legals ul{
    justify-content: center;
    gap: 40px;
  }
}
@media screen and (min-width: 1100px){
  .footer__contact{
    flex:0 0 100%;
    position: relative;
    background-color: white;
    flex-direction: row;
    padding: 0 30px 30px 0;
  }
  .footer__contact::before,
  .footer__contact::after{
    content: "";
    display: block;
    position: absolute;
    -webkit-clip-path: polygon(0 0, 0% 100%, 100% 0);
    clip-path: polygon(0 0, 0% 100%, 100% 0);
    background-color: white;
    z-index: 1;
  }
  .footer__contact::before{
    left: 0;
    bottom: -29px;
    width: 100%;
    height: 30px;
  }
  .footer__contact::after{
    right: -100px;
    width: 100px;
    top: -1px;
    bottom: 0;
  }
  .contact__name{
    margin-right: auto;
    gap: 20px;
  }
  .contact__name .carte {
      right: -125px;
      top: 0;
      transform: translate(0,-150px);
  }
  .contact__infos{
    padding: 0;
    justify-content: space-between;
  }
  .contact__activities,
  .contact__housings {
    align-items: flex-start;
  }
  .contact__infos .title{
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    font-size: 1rem;
    letter-spacing: 2px;
  }
  .contact__infos .title span:last-child{
    font-size: 1.3rem;
  }
  .footer__legals{
    margin: 40px 0 30px;
  }
}
@media screen and (min-width: 1200px){
  .contact__infos{
    gap: 100px;
  }
  .contact__name .carte {
      right: -200px;
      transform: translate(0,-115px);
  }
  .contact__infos a.min{
    padding: 12px 25px;
  }
}


/* ========================================================================== */
/* NAVIGATION TELEPHONE (SUITE)
/* ========================================================================== */

.header__mobilemenu {
  z-index: 900;
  width: 100%;
	transition: height .3s, opacity .3s;
  background-color: #E8AA14;
}
.header__mobilenav{
  height: 100%;
  padding: 0 20px;
}
.header__mobilenav ul{
  gap: 20px;
  align-items: flex-start;
}
.header__mobilenav li.groups{
  margin: 30px 0;
}
.header__mobilenav li.contact a{
  background-color: white;
  color: #E8AA14;
  font-size: 1.2rem;
  padding: 8px 20px 10px;
}

.header__mobilenav li.menu-item-has-children{
  display: flex;
  flex-direction: column;
}
.header__mobilenav li.menu-item-has-children > a{
  color: #704E2E;
}
.header__mobilenav li.menu-item-has-children ul.sub-menu{
  display: flex;
  flex-direction: column;
  gap:5px;
  margin-left:10px;
}
.header__mobilenav li.menu-item-has-children ul.sub-menu a::before{
    content:'›';
    display: inline-block;
    color: #704E2E;
    margin-right: 5px;  
}



.header__mobilenav li.current-menu-item a,
.header__mobilenav li a:hover,
.header__mobilenav li a:focus{
  color: #150524;
}
.navopened .header__mobilemenu{
  height: calc(100dvh - 81px);
  opacity: 1;
  visibility: visible;
}
.navopened .header__menu{
  background-color: #E8AA14;
}
.navopened .header__vacaf{
  opacity: 0;
}





/* ========================================================================== */
/* ANIMATIONS
/* ========================================================================== */
.trans {
	transition: all .3s;
}
.title__webcam .webcam__anim{
  position: relative;
}
.title__webcam .webcam__anim::after{
  content: '';
  display: block;
  position: absolute;
  z-index: -1;
  background-color: #E8AA14;
	left: 50%;
	top:50%;
  border-radius: 50% 50%;
  width: 50px;
  height: 50px;
  animation: bounce-in 2s ease infinite;
}
@keyframes bounce-in {
  0% {
    opacity: 0;
    transform: translate(-50%,-50%) scale(.3);
  }
  80% { 
    opacity:1; 
    transform: translate(-50%,-50%) scale(1.2); 
  }
  100% {
    opacity: 0;
    transform: translate(-50%,-50%) scale(.3);
  }
}
@keyframes opacity {
  0% {
    opacity: 0;
  }
  25% { 
    opacity:1; 
  }
  50% { 
    opacity:0; 
  }
  75% { 
    opacity:1; 
  }
  100% { 
    opacity:0; 
  }
}
@keyframes timed {
  0% {
    background-color: #619B6B;
  }
  10% { 
    background-color: #E8AA14;
  }
  20% { 
    background-color: #619B6B;
  }
  30% { 
    background-color: #E8AA14;
  }
  40% { 
    background-color: #619B6B;
  }
  50% { 
    background-color: #E8AA14;
  }
  60% { 
    background-color: #619B6B;
  }
  70% { 
    background-color: #E8AA14;
  }
  80% { 
    background-color: #619B6B;
  }
  90% { 
    background-color: #E8AA14;
  }
  100% { 
    background-color: #619B6B;
  }
}

@media screen and (min-width: 1200px){
  .title__webcam .webcam__anim::after{
    width: 70px;
    height: 70px;
  }


}





/* div#guidap-popups {
    position: fixed;
    top: 103px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;    Modifier ce nombre jusqu'à ce que la popup GUIDAP passe au-dessus du menu (ex.: 999999)
} */
.gdp-scoped-ui .modal.is-active {
    display: flex;
    /* z-index: 9999; */
}

.gdp-scoped-ui .modal .modal-background {
    background-color: #E8AA14;
    opacity: .7;
}
.gdp-scoped-ui .modal.is-full-screen > .animation-content {
    width: 100%;
    height: 100%;
    max-height: 100vh;
    margin: 0;
    background-color: #F1F3F5;
}
@media screen and (min-width: 900px){

  .gdp-scoped-ui .modal.is-full-screen > .animation-content {
      border-radius: 20px;
      height: 80%;
      width: 90%;
  }
}







.gdp-scoped-ui .container {
  background-image: none !important;
}