@charset "UTF-8";
/*

//COPYRIGHT 2023 - JACOBY B.//

COLOR : BLUE : #1b92c3 ou 4cc0e7
COLOR : RED : #ff0000 ou e70000


// Table of contents //

  00. CUSTOM ENDOBIKE
	01.	GOOGLE FONTS
	02.	BODY
	03.	CUSTOM CLASSES
	04. FORM ELEMENTS
	05.	SECTIONS
	06.	HTML TAGS
	07.	LINKS
	08.	MODAL
	09.	PAGINATION
	10. PRELOADER
	11.	TRANSITION OVERLAY
	12.	SANDWICH BUTTON
	13.	SCROLL DOWN
	14.	NAVIGATION MENU
	15.	HEADER
	16.	SOCIAL MEDIA
	17.	NAVBAR
	18.	SLIDER
	19.	PAGE HEADER
	20.	VIDEO BG
	21.	WORKS
	22.	FEATURES CONTENT
	23.	LISTING CONTENT
	24.	FULL MEDIA CONTENT
	25.	INTRODUCTION
	26. OUR TEAM
	27.	NEWS
	28.	SAY HELLO
	29.	LOGOS
	30.	FOOTER
	31.	RESPONSIVE TABLET FIXES
	32. REPSONSIVE MOBILE FIXES



*/
@import url("https://fonts.googleapis.com/css?family=Dancing+Script|Fjalla+One|Poppins:400,600,800&subset=latin-ext");
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Koulen&family=Lato&family=Nunito&family=Playfair+Display:ital@1&family=Prata&family=Raleway:ital,wght@1,100&family=Roboto&family=Roboto+Condensed&family=Teko&display=swap');

/* BODY */

@font-face {
  /*  font-family: Race Sport;
  src: url(../fonts/Race\ Sport.ttf); */
  /*font-weight: bold;*/

  /*  font-family: Incompleeta;
  src: url(../fonts/IncompleetaRegular.ttf); */

  font-family: Bebas Neue;
  src: url(../fonts/BebasNeue-Regular.ttf);

}

/* TODO: Mettre à jour les variables des couleur */

:root {
  /*   --blue: red;
  --red: #eeb81b; */

  --color01: #7a8862;
  --color02: #8b3f1a;
  --darkgrey: #2b2b2b;

}

* {
  outline: none !important;
}


body {
  margin: 0;
  padding: 0;
  font-family: "Poppins", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
  font-size: 17px;
  color: var(--darkgrey);

}

/*REVIEW: COOKIES CONSENT*/
/******************COOKIES CONSENT*******************/

/* @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap");

.wrapper_cookies {
  position: fixed;
  bottom: 50px;
  right: -370px;
  max-width: 345px;
width: 100%;
  background: #fff;
  border-radius: 8px;
  padding: 15px 25px 22px;
  transition: right 0.3s ease;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}
.wrapper_cookies.show {
  right: 20px;
}
.wrapper_cookies header {
  display: flex;
  align-items: center;
  column-gap: 15px;
}
header i {
  color: #4070f4;
  font-size: 32px;
}
header h2 {
  color: #4070f4;
  font-weight: 500;
}
.wrapper_cookies .data {
  margin-top: 16px;
}
.wrapper_cookies .data p {
  color: #333;
  font-size: 16px;
}
.data_cookies p a {
  color: #4070f4;
  text-decoration: none;
}
.data_cookies p a:hover {
  text-decoration: underline;
}
.wrapper_cookies .buttons_cookies {
  margin-top: 16px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.buttons_cookies .button_cookies {
  border: none;
  color: #fff;
  padding: 8px 0;
  border-radius: 4px;
  background: #4070f4;
  cursor: pointer;
  width: calc(100% / 2 - 10px);
  transition: all 0.2s ease;
}
.buttons_cookies #acceptBtn:hover {
  background-color: #034bf1;
}
#declineBtn {
  border: 2px solid #4070f4;
  background-color: #fff;
  color: #4070f4;
}
#declineBtn:hover {
  background-color: #4070f4;
  color: #fff;
}
 */

.cookie-consent {
  position: fixed;
  align-items: center;
  bottom: 0;
  left: 0;
  width: 100%;
  border-radius: 15px 15px 0px 0px;
  background-color: #f0f0f0;
  padding: 10px;
  text-align: center;
  border-top: 1px solid #ddd;
  box-shadow: #2b2b2b;
  display: none;
  /* Caché par défaut */
  z-index: 9999 !important;
}

.cookie-consent button {
  background-color: var(--color01);
  color: white;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
  border-radius: 10px;
  margin: 0 5px;
  /* Ajout d'un peu d'espace entre les boutons */
}

.cookie-consent button:hover {
  background-color: white;
  color: black;
}

#declineCookies {
  background-color: var(--color02);
  /* Rouge pour le bouton "Ne pas accepter" */
}

#declineCookies:hover {
  background-color: white
    /* Rouge foncé au survol */

}




/******************END COOKIES CONSENT*******************/

/******************MODAL PARKING*******************/
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
}

.modal-content {
  background-color: rgba(255, 255, 255, 0.8);
  margin: 15% auto;
  padding: 20px;
  border: 4px solid white;
  border-radius: 20px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  z-index: 1000;
  width: 40%;
}

.close {
  color: black;
  float: right;
  font-size: 30px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: red;
  text-decoration: none;
  cursor: pointer;
}

#myModal {
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.p_parking_modal {
  font-family: Bebas Neue;
  font-size: 35px;
  text-align: center;
  color: black;
}

.p_parking_modal_sub {
  font-family: Bebas Neue;
  font-size: 20px;
  text-align: center;
  color: black;
}

/* From Uiverse.io by barisdogansutcu */
.btn_modal {
  padding: 16px 40px;
  border-radius: 50px;
  cursor: pointer;
  border: 0;
  background-color: var(--color01);
  box-shadow: rgb(0 0 0 / 5%) 0 0 8px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-size: 15px;
  transition: all 0.5s ease;
}


.btn_modal:hover {
  letter-spacing: 3px;
  /*background-color: hsl(261deg 80% 48%);*/
  color: var(--color02);
  /*box-shadow: rgb(93 24 220) 0px 7px 29px 0px;*/
}


/*.btn_modal:active {
  letter-spacing: 3px;
  background-color: hsl(261deg 80% 48%);
  color: hsl(0, 0%, 100%);
  box-shadow: rgb(93 24 220) 0px 0px 0px 0px;
  transform: translateY(10px);
  transition: 100ms;
}*/


/******************END MODAL PARKING*******************/


/*********************************************/
/* OVERLAY CONNECT */

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  backdrop-filter: 10px;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.overlay iframe {
  width: 80%;
  height: 80%;
  border: none;
  border-radius: 10px;
}

.close-btn {
  position: absolute;
  top: 40px;
  right: 40px;
  font-size: 4em;
  font-weight: 800;
  background-color: transparent;
  color: var(--color01);
  border: none;
  padding: 10px 10px;
  cursor: pointer;
  border-radius: 15px;
}

.close-btn:hover {
  color: white;
}

/* END OVERLAY CONNECT */
/*********************************************/





/* IMAGE MASK */
.img-mask-content img {
  mask: url(../images/svg/masque.svg);
  mask-type: alpha;
  mask-size: contain;
  mask-repeat: no-repeat;

  -webkit-mask: url(../images/svg/masque.svg);
  -webkit-mask-type: alpha;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
}

/* REVIEW: Bouton*/
.btn {

  font-family: "Fjalla One", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: #fff;
  background-color: var(--color01);
  padding: 10px 30px;
  /*10px 30px*/
  margin-right: 15px;
  border: solid 1px rgba(255, 255, 255, 0.6);
  box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
  border-radius: 50px;
  transition: 600ms;
  transform: translateY(0);
  display: flex;
  /*flex*/
  flex-direction: row;
  align-items: center;
  cursor: pointer;
}



.btn_trail {

  font-family: "Fjalla One", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: var(--color01);
  background-color: white;
  padding: 10px 30px;
  /*10px 30px*/
  margin-left: 0px;
  /*15px*/
  border: solid 1px rgba(255, 255, 255, 0.6);
  box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
  border-radius: 50px;
  transition: 600ms;
  transform: translateY(0);
  display: flex;
  flex-direction: flex;
  align-items: center;
  cursor: pointer;
}

.btn_trail:hover {

  color: var(--color02);
}



.btn_empty {

  font-family: "Fjalla One", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: black;
  /*white*/
  background-color: white;
  /*var(--color01)*/
  padding: 10px 30px;
  /*10px 30px*/
  margin-left: 0px;
  /*15px*/
  margin-right: 15px;
  border: solid 2px rgba(255, 255, 255, 1);
  box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
  border-radius: 50px;
  transition: 600ms;
  transform: translateY(0);
  display: flex;
  flex-direction: flex;
  align-items: center;
  cursor: pointer;
  text-decoration: none;
}

.btn_empty:hover {

  background-color: var(--color01);
  /*white*/
  color: black;

}


.btn_regles {

  font-family: "Fjalla One", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: white;
  background-color: var(--color02);
  padding: 10px 30px;
  /*10px 30px*/
  margin-left: 0px;
  /*15px*/
  border: solid 2px rgba(255, 255, 255, 1);
  box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
  border-radius: 50px;
  transition: 600ms;
  transform: translateY(0);
  display: flex;
  flex-direction: flex;
  align-items: center;
  cursor: pointer;
  text-decoration: none;
}

.btn_regles:hover {

  background-color: white;
  color: black;
  border: solid 2px var(--color02);

}


/* 
.btn:hover{
  
  transition : 100ms;
  padding: 10px 30px;
  transform : translateY(-0px);
  background-color: var(--color01);
  color: white;
  border: solid 1px white;
  text-decoration: none;

  } */


.cloth-icon {
  width: 24px;
}

/* CUSTOM HTML ELEMENTS */
img {
  max-width: 100%;
}

/* CUSTOM ELEMENTS */
.overflow {
  overflow: hidden !important;
}

/* SHIRT ICON */
.icon-park--clothes-crew-neck {
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("../images/connect.svg");
  /*   opacity: 60%; */
}

.icon-park--clothes-crew-neck :hover {
  width: 1.8em;
  height: 1.8em;
}

@keyframes zoom-shirt {
  100% {
    transform: rotate(3deg);
  }
}


/* LINKS */
a {
  color: #0e0e0e;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

a:hover {
  color: var(--darkgrey);
}

a:active {
  color: var(--darkgrey);
}

/* SECTIONS */
section {
  overflow: hidden;
}


.lire_plus {
  color: var(--color01);
  margin-left: 10px;
}

.highlight_txt {
  color: var(--color02);
}


/* BACKGROUND DIV FULL IMAGE */
.divbackimage {
  /* background-image:url("/images/map-findus.jpg");*/
  background-repeat: no-repeat;
  background-size: contain;
}

/* CUSTOM CONTAINER */
@media (min-width: 1280px) {
  .container {
    max-width: 1260px;
  }
}

@media (min-width: 1170px) {
  .container {
    max-width: 1100px;
  }
}

/* ODOMETER */
.odometer {
  line-height: 1;
}

.odometer.odometer-auto-theme .odometer-digit,
.odometer.odometer-theme-car .odometer-digit {
  padding: 0;
}

.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner,
.odometer.odometer-theme-car .odometer-digit .odometer-digit-inner {
  left: 0;
}

/* PAGINATION */
.pagination {
  display: block;
  text-align: center;
  margin-top: 50px;
}

.pagination a {
  display: inline-block;
  font-weight: 600;
  color: #0e0e0e;
  margin: 0 10px;
  font-size: 14px;
  /* border-bottom: 2px solid #0e0e0e; */
  padding-bottom: 2px;
}

.pagination a:hover {
  text-decoration: none;
  /* border-bottom: 2px solid var(--color01); */
}

/* PAGE LOADED */
.page-loaded {
  overflow: inherit;
}

.page-loaded .preloader {
  bottom: -100%;
  transition-delay: 0.55s;
}

.page-loaded .preloader .layer {
  bottom: -100%;
}

.page-loaded .preloader .inner {
  transform: translateY(30px);
  opacity: 0;
}

.page-loaded header {
  transform: scale(1);
  transition-delay: 0.6s;
}

.page-loaded .navbar {
  transform: translateY(0);
  transition-delay: 0.75s;
}

/* PRELOADER */
.preloader {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 11;
  overflow: hidden;
  background: var(--color01);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

.preloader .layer {
  width: 50%;
  /*25%*/
  height: 100%;
  position: absolute;
  bottom: 0;
  background: #000;
  z-index: 2;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

.preloader .layer:nth-child(1) {
  left: 0;
  transition-delay: 0.15s;
}

.preloader .layer:nth-child(2) {
  left: 25%;
  transition-delay: 0.2s;
}

.preloader .layer:nth-child(3) {
  left: 50%;
  transition-delay: 0.25s;
}

.preloader .layer:nth-child(4) {
  left: 75%;
  transition-delay: 0.3s;
}

.preloader .inner {
  margin: 0;
  position: relative;
  z-index: 3;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

.preloader figure {
  display: block;
  margin: 0;
}

.preloader figure img {
  height: 80px;
}

.preloader .typewriter {
  height: 26px;
  line-height: 26px;
  display: inline-block;
  transform: translateY(10px);
  color: #fff;
  font-family: "Fjalla One", sans-serif;
  font-size: 13px;
  text-transform: uppercase;
}

.preloader .typewriter #typewriter-text {
  float: left;
  margin-left: 5px;
  margin-top: -2px;
  margin-right: 3px;
}

.preloader .typewriter #typewriter-suffix {
  width: 2px;
  height: 22px;
  display: inline-block;
  background: var(--color01);
  text-indent: -1000px;
  overflow: hidden;
}

/* TRANSITION OVERLAY */
.transition-overlay {
  width: 100%;
  height: 0;
  position: fixed;
  /*background: #1b92c3;*/

  /* REVIEW: couleur transition */
  background: var(--color01);
  background: linear-gradient(90deg, rgba(var(--color01), 1) 0%, rgba(var(--color01), 1) 48%, rgb(0, 0, 39) 100%);

  left: 0;
  bottom: 0;
  z-index: 15;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

.transition-overlay .layer {
  width: 25%;
  height: 0;
  position: absolute;
  bottom: 0;
  background: #000;
  z-index: 2;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

.transition-overlay .layer:nth-child(1) {
  left: 0;
  transition-delay: 0.25s;
}

.transition-overlay .layer:nth-child(2) {
  left: 25%;
  transition-delay: 0.3s;
}

.transition-overlay .layer:nth-child(3) {
  left: 50%;
  transition-delay: 0.35s;
}

.transition-overlay .layer:nth-child(4) {
  left: 75%;
  transition-delay: 0.4s;
}

.transition-overlay.active {
  height: 100%;
}

.transition-overlay.active .layer {
  height: 100%;
}

/* EQUALIZER */
.equalizer {
  cursor: pointer;
  display: flex;
  flex-wrap: wrap;
}

.equalizer span {
  background: var(--color01);
  width: 1px;
  height: 1px;
  top: 50%;
  bottom: 0;
  left: 0%;
  transform: translateY(-50%);
  position: absolute;
  transition: height 0.2s linear;
}

.equalizer span:nth-child(1) {
  margin-left: 4px;
}

.equalizer span:nth-child(2) {
  margin-left: 8px;
}

.equalizer span:nth-child(4) {
  margin-left: 12px;
}

.equalizer span:nth-child(5) {
  margin-left: 16px;
}

.equalizer span:nth-child(6) {
  margin-left: 20px;
}

.equalizer.paused span {
  height: 1px !important;
}

/* NAVIGATION MENU */
.navigation-menu {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9;
  visibility: hidden;
}

.navigation-menu .bg-layers {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  position: absolute;
  left: 0;
  top: 0;
}

.navigation-menu .bg-layers * {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

.navigation-menu .bg-layers span {
  width: 0%;
  height: 100%;
  position: absolute;
  top: 0;
  transform: skewX(0);
  /* background: #0e0e0e; */
  background: #0e0e0e;
  /*couleur 1 fond menu*/
  /* background: url(/images/pattern-bg.svg); */
}

.navigation-menu .bg-layers span:nth-child(1) {
  left: 0;
}

.navigation-menu .bg-layers span:nth-child(1):before {
  content: "";
  width: 150%;
  height: 100%;
  background: #0e0e0e;
  /*couleur 2 fond menu*/
  position: absolute;
  left: -149%;
  top: 0;
}

.navigation-menu .bg-layers span:nth-child(2) {
  left: 25%;
}

.navigation-menu .bg-layers span:nth-child(3) {
  left: 50%;
}

.navigation-menu .bg-layers span:nth-child(4) {
  left: 75%;
}

.navigation-menu .bg-layers span:nth-child(4):before {
  content: "";
  width: 150%;
  height: 100%;
  background: #0e0e0e;
  position: absolute;
  right: -149%;
  top: 0;
}

.navigation-menu .inner {
  position: relative;
  z-index: 3;
  color: #fff;
  text-align: center;
  padding-top: 96px;
}

.navigation-menu .inner * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.navigation-menu .inner .menu {
  display: block;
  min-height: 130px;
  opacity: 0;
  transform: translateY(-30px);
}

.navigation-menu .inner .menu ul {
  display: block;
  margin-bottom: 50px;
  padding: 0;
  position: relative;
}

.navigation-menu .inner .menu ul li {
  display: inline-block;
  margin: 0 20px;
  padding: 0;
  list-style: none;
}

.navigation-menu .inner .menu ul li:hover ul {
  opacity: 1;
  visibility: visible;
}

.navigation-menu .inner .menu ul li:hover ul li ul {
  opacity: 0;
  visibility: hidden;
}

/* REVIEW: Menu principal */

.navigation-menu .inner .menu ul li a {
  display: inline-block;
  line-height: 1;
  /*1*/
  font-size: 4vw;
  /*3vw*/
  font-weight: 800;
  /*800*/
  color: #fff;
  padding-bottom: 8px;
  /*8px*/
  border-bottom: 5px solid transparent;
  font-family: Bebas Neue;
}

.navigation-menu .inner .menu ul li a:hover {
  padding-bottom: 3px;
  /*3px*/
  border-bottom: 5px solid var(--color01);
  text-decoration: none;
}

.navigation-menu .inner .menu ul li ul {
  width: 100%;
  min-height: inherit;
  position: absolute;
  left: 0;
  top: 70px;
  opacity: 0;
  visibility: hidden;
}

.navigation-menu .inner .menu ul li ul li {
  margin: 0 15px;
  /*15px*/
}

/* REVIEW: Sous-Menu principal */

.navigation-menu .inner .menu ul li ul li a {
  font-size: 2vw;
  /*2vw*/
  /*padding: 0;*/
  /* padding-top: 15px; /*15px*/
  padding-top: 20px;
  border-bottom: none;
}

.navigation-menu .inner .menu ul li ul li a:hover {
  padding: 0;
  border-bottom: none;
  color: var(--color01);
}

.navigation-menu .inner .menu ul li ul li:hover ul {
  opacity: 1;
  visibility: visible;
}

.navigation-menu .inner .menu ul li ul li ul {
  top: 55px;
  opacity: 0;
  visibility: hidden;
}

.navigation-menu .inner .menu ul li ul li ul li {
  margin: 0 20px;
  /*0 20px*/
}

.navigation-menu .inner .menu ul li ul li ul li a {
  font-size: 20px;
  /*20px*/
  font-weight: 600;
  /*600*/
}

.navigation-menu .inner blockquote {
  display: block;
  font-size: 2vw;
  font-family: "Fjalla One", sans-serif;
  text-transform: uppercase;
  color: var(--color01);
  opacity: 0;
  transition-delay: 0.5s;
  transform: translateY(30px);
}

.navigation-menu.active .bg-layers {
  visibility: visible;
}

.navigation-menu.active .bg-layers span {
  width: calc(25% + 1px);
  transform: skewX(45deg);
}

.navigation-menu.active .bg-layers span:nth-child(1) {
  width: calc(25% + 1px);
}

.navigation-menu.active .bg-layers span:nth-child(4) {
  width: calc(25% + 1px);
}

.navigation-menu.active .inner .menu {
  opacity: 1;
  transform: translateY(0);
}

.navigation-menu.active .inner blockquote {
  opacity: 1;
  transform: translateY(0);
}

.navigation-menu.active {
  visibility: visible;
}

.navigation-menu.active .inner .credit {
  color: rgba(255, 255, 255, 0.5);
  font-size: 12px;
  opacity: 1;
  transform: translateY(-30px);
}

.navigation-menu.active .inner .espace-reserve {
  color: white;
  font-size: 12px;
  opacity: 1;
  transform: translateY(-30px);
}


/* HAMBURGER */
.hamburger {
  /*display:flex;*/
  float: left;
  width: 40px;
  /*26*/
  height: 38px;
  /*18*/
  padding-left: 3px;
  padding-bottom: 1px;
  position: relative;
  font-size: 14px;
  margin-right: 20px;
  color: white;
  /* background:var(--color02); */
}

/* .hamburger * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
} */

/* .hamburger span {
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px; 
  background: var(--color02);
  z-index: 0;
}  */

.hamburger:hover {
  /* color:var(--color02); */
  color: white;
  text-decoration: none;
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}


/* .hamburger span:nth-child(1) {
  top: 4px;
  width: 100%; 
  background: var(--color02);
}
.hamburger span:nth-child(2) {
  top: 0px;
  background: transparent;
}

.hamburger span:nth-child(3) {
  width: 100%; 
  top: 12px;
  right: 0;
  left: auto;
  background: var(--color01);
} */

/* .hamburger span:before, .hamburger span:after {
  position: absolute;
  content: "";
  display: block;
  top: 4px;
  height: 100%;
  width: 0;
  right: 0;
  left: auto;
} */
/* .hamburger span:before {
  z-index: 1;
  background: transparent;
  transition: all 0.15s linear 0s;
}
.hamburger span:after {
  z-index: 2;

  transition: all 0.15s linear 0.3s;
}
.hamburger span:nth-child(2):before {
  transition-delay: 0.05s;
} */
/*.hamburger span:nth-child(3):before {
  transition-delay: 0.1s;
}*/
/* .hamburger span:nth-child(2):after {
  transition-delay: 0.15s;
} */
/*.hamburger span:nth-child(3):after {
  transition-delay: 0.2s;
}*/

/* .hamburger:hover span {
  width: 50% !important;
}

.hamburger:hover span:after, .hamburger:hover span:before {
  width: 50%;
  left: 0;
  right: auto;
}
.hamburger:hover span:after {
  z-index: 1;
  transition: all 0.15s linear 0s;
}
.hamburger:hover span:before {
  z-index: 2;
  transition: all 0.15s linear 0.3s;
} */

/*.hamburger:hover span:nth-child(2):after {
  transition-delay: 0.05s;
}
.hamburger:hover span:nth-child(3):after {
  transition-delay: 0.1s;
}
.hamburger:hover span:nth-child(2):before {
  transition-delay: 0.15s;
}
.hamburger:hover span:nth-child(3):before {
  transition-delay: 0.2s;
}*/

.hamburger.open {
  color: var(--color01);
  /*-webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);*/
}



/* .hamburger.open span:nth-child(1) {
  top: 4px;
  width: 50%;


.hamburger.open span:nth-child(2) {
  opacity: 0;
  left: -0px;
  background: transparent;
}

.hamburger.open span:nth-child(3) {
  top: 12px;
  width: 50%;
}  */


/* CUSTOM LINK */
.custom-link {
  display: block;
  transition: all 0.5s;
}

/* .custom-link * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
} */

.custom-link a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 14px;
  color: #0e0e0e;
}

.custom-link a:hover {
  text-decoration: none;
}

.custom-link b {
  font-weight: 600;
  display: inline-block;
  margin-left: 20px;
}

/* .custom-link .lines {
  width: 42px;
  height: 1px;
  float: left;
  overflow: hidden;
} */

.custom-link .lines span:nth-child(1) {
  width: 100%;
  height: 1px;
  float: right;
  background: #0e0e0e;
}

.custom-link .lines span:nth-child(2) {
  width: 0;
  height: 1px;
  float: left;
  background: #0e0e0e;
}

/* .custom-link:hover .lines {
  width: 62px;
  margin-left: 20px;
}

.custom-link:hover .lines span:nth-child(1) {
  width: 0;
}

.custom-link:hover .lines span:nth-child(2) {
  width: 100%;
  transition-delay: 0.2s;
} */

/* HEADER */
.header {
  width: 100%;
  height: 100vh;
  min-height: 660px;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  background: #0e0e0e;
}

.header .container {
  position: relative;
  z-index: 2;
}

.header .container .tagline {
  display: block;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 15px;
}

.header .container .tagline span {
  color: var(--color01);
  float: left;
  font-weight: 600;
  color: #fff;
}

.header .container .tagline span:after {
  content: "";
  width: 22px;
  height: 1px;
  float: right;
  margin: 10px;
  background: var(--color02);
}

.header .container .tagline h6 {
  float: left;
  font-family: "Fjalla One", sans-serif;
  opacity: 0;
  margin-top: 2px;
  margin-bottom: 0;

}

.header .container h1 {
  width: 100%;
  float: left;
  font-weight: 800;
  color: var(--color01);
  font-size: 10vw;
  line-height: 1;
  /*font-family: Race Sport;*/
}

.header .container .title_page {
  width: 100%;
  float: left;
  font-weight: 800;
  color: var(--color02);
  font-size: 10vw;
  line-height: 1;
  /*font-family: Race Sport;*/
}


.header .container h1 span {
  -webkit-text-stroke-width: 1px;
  transform: translateY(-35%);
  margin-left: 4%;
  display: flex;
  -webkit-text-stroke-color: white;
  color: transparent;
}


.header .container .slide-btn {
  float: left;
  /*left*/

}

.header .perspective {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}

.header .perspective canvas {
  min-height: 100%;
  width: auto !important;
  position: absolute;
  left: 0;
  top: 0;
}

.header .particles-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}

.header .particles-wrap .particles {
  width: 100%;
  height: calc(100% - 50px);
  position: absolute;
  left: 0;
  bottom: 0;
}

.header .video-bg {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}

.header .video-bg:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  /* background: url(../images/bg-lines.png) center; */
  z-index: 2;
}

.header .video-bg video {
  min-width: 100%;
  min-height: 100%;
  position: absolute;
  /* opacity: 0.1; */
}



/* FULL DIV IMAGE BACKGROUND */

.image-bg {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}

.image-bg:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  /*   background: url(../images/bg-noise.gif) center; */
  opacity: 0.04;
  z-index: 2;
}

.image-bg img {
  min-width: 100%;
  min-height: 100%;
  position: absolute;
  opacity: 0.8;
}

/* END - FULL DIV IMAGE BACKGROUND */




.page-header {
  width: 100%;
  height: 100vh;
  min-height: 660px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  position: relative;
  background: #0e0e0e;
}

.page-header .video-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
}

.page-header .video-bg:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  /*background: url(../images/bg-lines.png) center;*/
  z-index: 2;
}

.page-header .video-bg video {
  min-width: 100%;
  min-height: 100%;
  float: left;
  opacity: 0.5;
}

.page-header .container {
  position: relative;
  z-index: 3;
  padding: 0 10%;
}

.page-header .container h1 {
  font-weight: 800;
  font-size: 8vw;
  /*10vw*/
  color: white;
  line-height: 1;
  text-indent: -5px;
  /* font-family: Race Sport; */
  /* font-family: incompleeta; */
  font-family: Bebas Neue;
}

.page-header .container p {
  margin-bottom: 0;
  font-family: "Fjalla One", sans-serif;
  color: var(--color01);
  text-transform: uppercase;
  font-size: 2vw;
}

header {
  transform: scale(1.5);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

header .left-side {
  width: 50%;
  height: 60px;
  /*60px*/
  display: flex;
  flex-wrap: wrap;
  align-content: flex-end;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateX(-50%) translateY(-50%) rotate(-90deg);
  /*rotate(-90deg)*/
  margin-left: 30px;
  z-index: 3;
}

header .fa-facebook-square {
  transform: rotate(90deg);
}

header .fa-youtube {
  transform: rotate(90deg);
}

header .fa-instagram {
  transform: rotate(90deg);
}



header .left-side ul {
  margin: 0 auto;
  padding: 0;
}

header .left-side ul li {
  display: inline-block;
  /*inline-block*/
  margin: 0 10px;
  padding: 0;
  list-style: none;
}

header .left-side ul li a {
  font-size: 22px;
  /*14px*/
  color: #fff;
  font-family: "Fjalla One", sans-serif;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
  padding-bottom: 6px;
  border-bottom: 2px solid transparent;
}

header .left-side ul li a:hover {
  padding-bottom: 1px;
  border-bottom: 2px solid #fff;
  text-decoration: none;
  color: var(--color02);
}

/******* START SWIPE*******/
header .swipe {
  position: absolute;
  left: 10px;
  /*0*/
  bottom: 120px;
  /*0*/
  z-index: 3;
}

header .swipe small {
  width: 98px;
  display: inline-block;
  transform: rotate(0deg);
  /*-90deg*/
  margin-bottom: 5px;
  /*50px*/
  margin-left: 10px;
  /*add*/
  color: #fff;
  font-family: "Fjalla One", sans-serif;
}

header .swipe span {
  display: block;
  height: 10px;
  position: relative;
  transform: translateX(-1px);
  transform: rotate(90deg);
  /*add*/
}

header .swipe span::before {
  -webkit-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  -moz-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  -o-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
}

header .swipe span::before {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -0.5px;
  width: 1px;
  height: 70px;
  background: #fff;
  content: "";
}

/******* END SCROLL DOWN*******/

/******* START SCROLL DOWN*******/
header .scroll-down {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3;
}

header .scroll-down small {
  width: 98px;
  display: inline-block;
  transform: rotate(-90deg);
  margin-bottom: 50px;
  color: #fff;
  font-family: "Fjalla One", sans-serif;
}

header .scroll-down span {
  display: block;
  height: 50px;
  position: relative;
  transform: translateX(-1px);
}

header .scroll-down span::before {
  -webkit-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  -moz-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  -o-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
}

header .scroll-down span::before {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -0.5px;
  width: 1px;
  height: 70px;
  background: #fff;
  content: "";
}

/******* END SCROLL DOWN*******/

@keyframes expand {
  0% {
    width: 0;
    /* Départ : aucun largeur */
  }

  100% {
    width: 100%;
    /* La ligne s'étend jusqu'à l'extérieur */
  }
}


header .sound {
  position: absolute;
  right: 40px;
  bottom: 40px;
  z-index: 3;
}

header .sound span {
  float: left;
  color: #fff;
  font-size: 14px;
  margin-right: 10px;
  font-family: "Fjalla One", sans-serif;
}

header .sound .equalizer {
  float: left;
}

header .sound .equalizer .holder {
  width: 23px;
  height: 20px;
  position: relative;
}

/* NAVBAR */
.navbar {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  padding: 20px 40px;
  color: #fff;
  font-family: "Fjalla One", sans-serif;
  font-size: 14px;
  /*14px*/
  z-index: 10;
  transform: translateY(-130%);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}

.navbar a {
  color: #fff;
  /*fff*/
}

.navbar .left {
  width: 30%;
  margin-left: 0;
}

.navbar .left a {
  background: var(--color02);
  position: relative;
  padding: 6px;
  /* -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out; */
  /* border-bottom: 2px solid transparent; */
}

.navbar .left a:hover {
  padding-bottom: 0px;
  border-bottom: 0px solid #fff;
  text-decoration: none;
}

.navbar .logo {
  margin: 0 auto;
}

.navbar .logo a {
  float: left;
}

.navbar .logo a img {
  height: 120px;
  /*80px*/
}

.navbar .right {
  width: 30%;
  margin-right: 0;
  display: flex;
  justify-content: flex-end;
}

.navbar .right ul {
  margin-left: auto;
  margin-bottom: 0;
  padding: 0;
}

.navbar .right ul li {
  display: inline-block;
  margin-left: 15px;
  padding: 0;
}

.navbar .right ul li a {
  position: relative;
  padding-bottom: 6px;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
  border-bottom: 2px solid transparent;
}

.navbar .right ul li img:hover {
  padding-bottom: 5px;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  /* border-bottom: 2px solid red; */
  background-color: var(--color02);
  /* text-decoration: none; */
}

.navbar .right .hamburger-menu {
  margin-right: 0;
  margin-left: 60px;
}

.navbar .right .hamburger-menu .hamburger {
  float: right;
  margin-top: 1px;
}

.navbar .right .hamburger-menu b {
  display: inline-block;
  /*  display: flex;*/
  font-weight: 400;
  /* font-size:18px; */
  margin-right: 15px;
}


/* SLIDE BTN */
.slide-btn {
  display: flex;
  /*block*/
  transition: all 0.5s;
  padding-left: 0px;
  /*30px*/
}

.slide-btn a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 14px;
  color: #fff;
}

.slide-btn a:hover {
  text-decoration: none;
}

.slide-btn b {
  font-weight: 600;
  color: white;
}

.slide-btn .lines {
  width: 42px;
  height: 1px;
  float: left;
  overflow: hidden;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.slide-btn .lines span:nth-child(1) {
  width: 100%;
  height: 1x;
  float: right;
  background: #ffffff;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.slide-btn .lines span:nth-child(2) {
  width: 0;
  height: 1px;
  float: left;
  background: #ffffff;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.slide-btn:hover .lines {
  width: 62px;
  margin-left: 20px;

}

.slide-btn:hover .lines span:nth-child(1) {
  width: 0;
}

.slide-btn:hover .lines span:nth-child(2) {
  width: 100%;
  transition-delay: 0.2s;
}

.slide-btn .video-play-circle {
  stroke-dasharray: 315;
  stroke-dashoffset: 315;
  transition: stroke-dashoffset 0.5s;
}

.slide-btn svg {
  width: 50px;
  height: 50px;
  transition: transform 0.3s;
  margin-left: -25px;
  margin-right: 15px;
}

.slide-btn:hover .video-play-circle {
  stroke-dashoffset: 0;
}

/* SWIPER SLIDER */
.swiper-slider {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  color: #fff;
  overflow: hidden;
}

.swiper-slider .swiper-slide {
  display: block;
  overflow: hidden;
}

.swiper-slider .swiper-slide.swiper-slide-active .slide-inner {
  transform: scale(1);
}

.swiper-slider .swiper-slide.swiper-slide-active .slide-inner .container {
  transform: translateY(0);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  opacity: 1;
}

.swiper-slider .swiper-slide .slide-inner {
  width: 100%;
  height: 100%;
  transform: scale(0.8);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: column;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  transition-duration: 700ms;
  -webkit-transition-duration: 700ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);

  /* REVIEW: filtre image background */
  -webkit-filter: sepia(0%);
  filter: sepia(0%);
  /* 
  -webkit-filter: brightness(0.5);
  filter: brightness(0.5); */

  background-size: cover;
  background-position: center;
  position: relative;
}

.swiper-slider .swiper-slide .slide-inner:after {
  content: "";
  width: 100%;
  height: 100%;
  background: url(../images/bg-noise.gif);
  opacity: 0.04;
  position: absolute;
  left: 0;
  top: 0;
}

.swiper-slider .swiper-slide .slide-inner:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: url(../images/bg-lines.png) center;
  z-index: 1;
}

.swiper-slider .swiper-slide .slide-inner .container {
  transform: translateY(50px);
  opacity: 0;
  transition-delay: 0.15s !important;
  position: relative;
  z-index: 2;
}

.swiper-slider .swiper-slide .slide-inner .container .tagline {
  display: block;
  color: white;
  text-transform: uppercase;
  margin-bottom: 15px;
}

.swiper-slider .swiper-slide .slide-inner .container .tagline span {
  color: var(--color01);
  float: left;
  font-weight: 600;
  color: #ffffff;
}

.swiper-slider .swiper-slide .slide-inner .container .tagline span:after {
  content: "";
  width: 22px;
  height: 1px;
  float: right;
  margin: 10px;
  background: var(--color01);
}

.swiper-slider .swiper-slide .slide-inner .container .tagline h6 {
  float: left;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  /*0.5*/
  margin-top: 2px;
  margin-bottom: 0;
}

/*TITRE SLIDE*/
.swiper-slider .swiper-slide .slide-inner .container h1 {
  width: 100%;
  float: left;
  font-weight: 400;
  /*REVIEW couleur du titre*/
  color: white;
  /*var(--color01);*/
  font-size: 9vw;
  /*8vw*/
  line-height: 1;
  /* font-family: Race Sport; */
  /* font-family: Incompleeta; */
  font-family: Bebas Neue;
  letter-spacing: 2px;
  /*-10px*/
  z-index: 289 !important;
  margin-bottom: -20px;
}


.swiper-slider .swiper-slide .slide-inner .container h1 span {
  transform: translateY(-35%);
  margin-left: 4%;
  display: flex;
  font-size: 7vw;
  -webkit-text-stroke-color: white;
  /*  color: transparent; */
}

/* REVIEW: horaire et tarif */

.swiper-slider .swiper-slide .slide-inner .container .open_hours {
  font-family: Bebas Neue;
  color: black;
  transform: translateY(0%);
  margin-left: 4%;
  display: inline;
  /*flex*/
  /* position: relative; */
  font-size: 1.5vw;

  background-color: white;
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 8px;
  padding-bottom: 6px;
  /* Espacement autour du texte */
  border-radius: 22px;
  /*  color: transparent; */
}


/* REVIEW: Etat des pistes */
.status-bar {
  display: flex;
  align-items: center;
  border: 1px solid white;
  background-color: white;
  border-radius: 30px;
  padding: 5px;
  width: fit-content;
  margin-bottom: 30px;
  margin-left: 15px;

}


#status-indicator-01 {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-right: 10px;
  background-color: green;
}

#status-text-01 {
  font-size: 12px;
  text-transform: uppercase;
  color: black;
  margin-right: 10px;
}


#status-indicator-02 {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-right: 10px;
  background-color: green;
}

#status-text-02 {
  font-size: 12px;
  text-transform: uppercase;
  color: black;
  margin-right: 10px;
}

#status-indicator-03 {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-right: 10px;
  background-color: green;
}

#status-text-03 {
  font-size: 12px;
  text-transform: uppercase;
  color: black;
  margin-right: 10px;
}

#status-indicator-04 {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-right: 10px;
  background-color: green;
}

#status-text-04 {
  font-size: 12px;
  text-transform: uppercase;
  color: black;
  margin-right: 10px;
}


#status-indicator-05 {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-right: 10px;
  background-color: green;
}

#status-text-05 {
  font-size: 12px;
  text-transform: uppercase;
  color: black;
  margin-right: 10px;
}

/*END ETAT DES PISTES*/







/* REVIEW: Sous titre piste niveau de difficulté */
.swiper-slider .swiper-slide .slide-inner .container h1 .difficulty01 {
  color: var(--blue);
}

/*END TITRE SLIDE*/



/*SUB TITRE SLIDE*/

.swiper-slider .swiper-slide .slide-inner .container .title_page {
  width: 100%;
  float: left;
  font-weight: 800;
  color: white;
  font-size: 8vw;
  /*8vw*/
  line-height: 1;
  /* font-family: Race Sport; */
  /* font-family: Incompleeta; */
  font-family: Bebas Neue;
  letter-spacing: 2px;
  /*-10px*/
}


.swiper-slider .swiper-slide .slide-inner .container .sub_title_page {
  /*-webkit-text-stroke-width: 1px;*/
  transform: translateY(-35%);
  font-size: 4vw;
  margin-left: 4%;
  display: flex;
  color: var(--color01);
  -webkit-text-stroke-color: transparent;
  /* -webkit-text-stroke-color: var(--blue); */

}

/*END SUB TITRE SLIDE*/

.swiper-slider .swiper-slide .slide-inner .container .slide-btn {
  float: left;
}

.swiper-slider .swiper-pagination-bullets {
  width: 50px;
  left: auto;
  right: 40px;
  bottom: 50%;
  text-align: right;
  font-size: 14px;
  font-weight: 600;
  z-index: 2 !important;

}

.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet {
  width: 100%;
  height: auto;
  float: left;
  margin: 5px 0;
  background: none;
  position: relative;
  text-indent: 9999px;
  padding-right: 36px;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet:hover {
  opacity: 1;
}

.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
  text-indent: 0;
}

.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active:after {
  width: 67px;
  right: -45px;
}

.swiper-slider .swiper-pagination-bullets .swiper-pagination-bullet:after {
  content: "";
  width: 22px;
  height: 6px;
  /*Epaisseur de la ligne de slider 6px*/

  /* background: var(--color02); */
  background: white;
  position: absolute;
  top: 10px;
  right: 0;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

/* INTRO */
.intro {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  /*background-color: #ff0000;*/
  /*background-image:url(../images/mondraker.jpg);
  background-repeat: no-repeat;
  background-size: contain;*/
  background: url(../images/pattern-bg.svg);
}

.intro h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.intro h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 35%;
}

.intro h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  position: absolute;
  left: 0;
  top: -20%;
}

.intro h4 {
  margin-top: 5px;
  font-family: "Fjalla One", sans-serif;
  font-size: 25px;
  line-height: 40px;
  text-transform: uppercase;
  padding-right: 20%;
}

.intro p {
  margin-bottom: 30px;
  font-size: 20px;
  line-height: 37px;
}

.intro u {
  text-decoration: none;
  border-bottom: 3px dotted var(--color02);
  font-weight: 600;
}

.intro strong {
  font-weight: 600;
}

.intro .custom-link {
  transform: translateY(30px);
}



/* PROCESS */
.process {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 100px 0;
  position: relative;
  text-align: center;
}

.process h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
  position: relative;
}

.process h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
}

.process h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  transform: translateX(-50%);
  position: absolute;
  left: 50%;
  top: -50%;
}

.process span {
  width: 80px;
  height: 80px;
  line-height: 62px;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  border-radius: 50%;
  background: var(--color01);
  position: relative;
  border: 10px solid #e2fdf1;
  margin-top: 50px;
}

s .process span:before {
  content: "";
  width: 30vw;
  height: 2px;
  background: #e2fdf1;
  position: absolute;
  left: -30px;
  top: 30px;
  z-index: -1;
}

.process .col-md-3:last-child span:before {
  display: none;
}

.process figure {
  width: 100%;
  display: block;
  margin: 20px 0;
  background: #fff;
}

.process figure img {
  height: 90px;
}

.process h5 {
  font-weight: 600;
  font-size: 13px;
  margin-top: 20px;
  margin-bottom: 0;
}

/* SERVICES CONTENT BLOCK */
.services-content-block {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  background: #0e0e0e;
  color: #fff;
  position: relative;
}

.services-content-block .video-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  opacity: 0.2;
}

.services-content-block .video-bg video {
  min-width: 100%;
  min-height: 100%;
  float: left;
}

.services-content-block h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  font-size: 14px;
}

.services-content-block h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 35%;
}

.services-content-block .left {
  width: 100px;
  float: left;
  margin-top: -2px;
}

.services-content-block .right {
  width: calc(100% - 100px);
  float: left;
}

.services-content-block small {
  display: inline-block;
  font-family: "Fjalla One", sans-serif;
  color: var(--color01);
}

.services-content-block span {
  width: 50px;
  height: 1px;
  background: var(--color01);
  display: inline-block;
  margin: 5px 15px;
}

.services-content-block h4 {
  font-family: "Fjalla One", sans-serif;
  font-size: 17px;
  margin-bottom: 30px;
}

.services-content-block ul {
  padding-left: 20px;
  margin-bottom: 0;
}

.services-content-block ul li {
  line-height: 1.8;
}

/* WORKS */

/* REVIEW: Divider section */
.works {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  transition-delay: 0s !important;
  /*   transition: background 0.4s;
 */
  /*   background: url('../images/svg/section-div.svg') no-repeat;*/
  /* background: url('../images/svg/section-div.svg') no-repeat; */


}

.works h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.works h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 35%;
}

.works h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  position: absolute;
  left: 0;
  top: -20%;
}

/*REVIEW plan trailcenter hotspots */
.works .plan_trailcenter {

  /*   display: flex;
  flex-wrap: wrap;

  background-image: url("../images/trailcenterplan.jpg");
  background-size: cover; 
  background-position: center; 
  width: 100vw;
  height: 100vh;  */

  display: flex;
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 100%;

}

.plan img {
  top: 0;
  left: 0;
  width: 100%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

}


.works .hotspots {
  width: 100%;
  height: auto;
  display: flex;
  margin: 0;
  padding: 0;
}


.works .hotspots img {
  width: 100%;
  height: auto;
  display: flex;
  box-shadow: 0 0 8px 8px white inset;
}

.works .hotspot {
  position: absolute;
  width: 32px;
  height: 32px;
  padding-top: 6px;
  border: 3px solid rgb(255, 255, 255, 0.8);
  border-radius: 50%;
  animation: fader 2s ease infinite;
  transition: all 0.2s;
  text-align: center;
  text-decoration: none;
  font-weight: 100;
  font-family: sans-serif;
  color: #555;
}

.works .hotspot::after {
  content: "";
  width: 24px;
  height: 24px;
  background-color: #fff;
  border-radius: 50%;
  display: block;
  margin: -30px auto 10px 1px;
  transition: all 0.2s;
}

.works .hotspot:hover {
  border-color: lightseagreen !important;
  animation-play-state: paused;
  color: #fff;
}

.works .hotspot:hover::after {
  background-color: lightseagreen;
}


@keyframes fader {
  50% {
    border-color: rgb(255, 255, 255, 0.2);
    scale: 1.2;
  }

  100% {
    border-color: rgb(255, 255, 255, 0.8);
  }
}

#hs-a {
  top: 67%;
  left: 31%;
  background-color: var(--blue);
}

#hs-b {
  top: 32%;
  left: 44%;
}

#hs-c {
  top: 25%;
  left: 50%;
}















.works .project-box {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 75px 0;
}

.works .project-box * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.works .project-box:hover figure {
  transform: scale(0.95);
}

.works .project-box:hover figure img {
  transform: scale(1.15);
}

.works .project-box:last-child {
  padding-bottom: 0;
}

.works .project-box:nth-child(2n+2) .custom-link a {
  float: right;
}

.works .project-box:nth-child(2n+2) .content-box {
  order: 1;
  text-align: right;
  padding-left: 0;
  padding-right: 5%;
}

.works .project-box:nth-child(2n+2) .content-box h3 span {
  margin-left: 0;
  margin-right: -7vw;
  -webkit-text-stroke: white 1px;
}

.works .project-box:nth-child(2n+2) figure {
  order: 2;
}

.works .project-box figure {
  width: 55%;
  margin: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid transparent;
}

.works .project-box figure img {
  width: 100%;
}

.works .project-box .content-box {
  width: 45%;
  padding-left: 5%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 2;
}

.works .project-box .content-box .inner {
  margin: 0;
}

.works .project-box .content-box .inner small {
  display: block;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}


/*REVIEW : titre piste*/

.works .project-box .content-box .inner h3 {
  font-size: 2vw;
  font-weight: 800;
  margin-bottom: 10vh;
  line-height: 1;
}

.works .project-box .content-box .inner h3 span {
  display: block;
  font-size: 5vw;
  /*8vw*/
  color: var(--color01);
  margin-left: -7vw;
  /*-7vw*/
  -webkit-text-stroke: 1px white;
}

/* WORKS SINGLE */
.works-single {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
}

.works-single h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.works-single h2 {
  margin-bottom: 50px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 35%;
}

.works-single h4 {
  margin-top: 5px;
  font-family: "Fjalla One", sans-serif;
  font-size: 25px;
  line-height: 40px;
  text-transform: uppercase;
  padding-right: 20%;
}

.works-single .text-desc {
  margin-bottom: 50px;
}

.works-single h5 {
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  text-transform: uppercase;
  font-size: 20px;
  margin-top: 10px;
}

.works-single h3 {
  font-size: 60px;
  font-weight: 800;
  margin-top: 80px;
  color: var(--color01);
  text-align: center;
  text-transform: uppercase;
  font-family: "Fjalla One", sans-serif;
}

.works-single .gpx {
  font-size: 20px;
  font-weight: 600;
  text-align: center;
}


.works-single p {
  margin-bottom: 30px;
  font-size: 20px;
  line-height: 37px;
}

.works-single iframe {
  float: left;
  margin-bottom: 30px;
  background: #0e0e0e;
}

.works-single figure {
  width: 100%;
  display: block;
  margin-bottom: 30px;
}

.works-single figure img {
  width: 100%;
}

/* TEAM */
.team {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  background: var(--color01);
  position: relative;
}

.team h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.team h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
}

.team h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  position: absolute;
  left: 0;
  top: -20%;
}

.team figure {
  width: 100%;
  display: block;
  margin-bottom: 0;
}

.team figure img {
  width: 100%;
  display: block;
  margin-bottom: 10px;
}

.team figure figcaption {
  width: 100%;
  display: block;
}

.team figure figcaption small {
  opacity: 0.6;
  font-size: 11px;
  display: block;
  margin-bottom: 5px;
}

.team figure figcaption h4 {
  font-family: "Fjalla One", sans-serif;
  font-size: 16px;
  text-transform: uppercase;
  margin-bottom: 0;
}

/* WORK WITH US */
.work-with-us {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  background: var(--color01);
  position: relative;
  /* background-image:url(../images/mondraker.jpg);
  background-repeat: no-repeat;
  background-size: contain;*/
}

.work-with-us:before {
  content: "";
  width: 100%;
  height: 100%;
  /*  background: url(../images/bg-noise.gif);  */
  opacity: 0.04;
  position: absolute;
  left: 0;
  top: 0;
}


.work-with-us:after {
  content: "";
  width: 100%;
  height: 15%;
  position: absolute;
  left: 0;
  bottom: 0;
  /* background: url(../images/bg-lines.png) center; */
  /*  background: url('../images/svg/section-div.svg') no-repeat center; */

  /*   background: url(../images/bg-lines.png) center; */
  z-index: 1;
}


section .work-with-us img {
  width: 100%;
}


.work-with-us .container {
  position: relative;
  z-index: 2;
}

.work-with-us h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  font-size: 14px;
}

.work-with-us h2 {
  margin-bottom: 30px;
  /*60px*/
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 5%;
  /*35%*/
}

.work-with-us h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  position: absolute;
  left: 0;
  top: -20%;
}

.work-with-us h4 {
  margin-top: 5px;
  font-family: "Fjalla One", sans-serif;
  font-size: 24px;
  line-height: 40px;
  font-weight: 100;
  /*text-transform: uppercase;*/
  padding-right: 20%;
  margin-bottom: 40px;
  color: white;
}

/* AWARDS  */
.awards {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 100px 0;
  text-align: center;
  border-bottom: 1px solid #eee;
}

.awards figure {
  display: block;
  margin: 0;
}

.awards figure img {
  height: 60px;
}

.awards h5 {
  font-weight: 600;
  font-size: 15px;
}

.awards .odometer {
  font-family: "Fjalla One", sans-serif;
  font-size: 40px;
}

/* CLIENTS */
.clients {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  background: url(../images/pattern-bg.svg);
}

.clients h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.clients h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
}

.clients h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  position: absolute;
  left: 0;
  top: -20%;
}

.clients h4 {
  margin-top: 5px;
  margin-bottom: 40px;
  font-family: "Fjalla One", sans-serif;
  font-size: 25px;
  line-height: 40px;
  text-transform: uppercase;
  padding-right: 20%;
}

.clients ul {
  width: 100%;
  float: left;
  margin: 0;
  margin-top: 90px;
  padding: 0;
}

.clients ul * {
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.clients ul li {
  width: 25%;
  float: left;
  margin: 0;
  padding: 10px;
  list-style: none;
  position: relative;
}

.clients ul li img {
  opacity: 1;
  background: #fff;
  border: 1px solid #eee;
  padding: 15px;
}

.clients ul li small {
  width: 100%;
  height: 50px;
  line-height: 50px;
  position: absolute;
  left: 0;
  top: 50%;
  text-align: center;
  font-size: 600;
  opacity: 0;
  font-family: "Fjalla One", sans-serif;
  font-size: 22px;
}

.clients ul li:hover small {
  margin-top: -25px;
  opacity: 1;
}

.clients ul li:hover img {
  opacity: 0.05;
  transform: scale(1.2);
}

/* NEWS */
.news {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 100px 0;
}

.news .post {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 50px 0;
}

.news .post.single-post {
  padding-left: 10%;
  padding-right: 10%;
  flex-direction: column;
}

.news .post.single-post .post-content .inner .post-title {
  font-size: 66px;
}

.news .post.single-post .post-image {
  margin-bottom: 30px;
  display: block;
}

.news .post:nth-child(2n+2) .post-image {
  order: 2;
}

.news .post:nth-child(2n+2) .post-content {
  padding-left: 0;
}

.news .post .post-image {
  flex: 1;
  margin: 0;
}

.news .post .post-image img {
  width: 100%;
}

.news .post .post-content {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  padding: 0 50px;
}

.news .post .post-content .inner {
  width: 100%;
}

.news .post .post-content .inner .social-share {
  width: 100%;
  float: left;
  padding: 0 !important;
  margin-bottom: 40px;
}

.news .post .post-content .inner .social-share li {
  float: left;
  margin-right: 5px;
  padding: 0;
  list-style: none;
  text-align: center;
}

.news .post .post-content .inner .social-share li.facebook a {
  background: var(--color01);
}

.news .post .post-content .inner .social-share li.twitter a {
  background: var(--color01);
}

.news .post .post-content .inner .social-share li.google-plus a {
  background: var(--color01);
}

.news .post .post-content .inner .social-share li.linkedin a {
  background: var(--color01);
}

.news .post .post-content .inner .social-share li.youtube a {
  background: var(--color01);
}

.news .post .post-content .inner .social-share li a {
  width: 44px;
  height: 44px;
  line-height: 44px;
  float: left;
  background: var(--color02);
  color: #fff;
  border: none;
  border-radius: 0;
}

.news .post .post-content .inner .post-date {
  display: block;
  font-size: 14px;
  opacity: 0.5;
  font-family: "Fjalla One", sans-serif;
}

.news .post .post-content .inner .post-title {
  display: block;
  font-size: 40px;
  font-weight: 800;
  margin-bottom: 30px;
}

.news .post .post-content .inner .post-title a {
  display: block;
  color: #0e0e0e;
}

.news .post .post-content .inner .post-title a:hover {
  color: var(--color01);
  text-decoration: none;
}

.news .post .post-content .inner .post-author {
  display: block;
  font-family: "Fjalla One", sans-serif;
  text-transform: uppercase;
  margin-bottom: 30px;
}

.news .post .post-content .inner .post-author img {
  width: 50px;
  display: inline-block;
  border-radius: 50%;
  margin-right: 10px;
}

.news .post .post-content .inner .post-text {
  display: block;
  line-height: 30px;
  margin-bottom: 0;
}

.news .post .post-content .inner h6 {
  font-size: 23px;
  margin-bottom: 30px;
  line-height: 1.5;
}

.news .post .post-content .inner blockquote {
  display: block;
  padding: 40px;
  margin-bottom: 40px;
  background: var(--color01);
  font-family: "Fjalla One", sans-serif;
  position: relative;
}

.news .post .post-content .inner blockquote:before {
  content: "";
  font-family: fontawesome;
  font-size: 90px;
  position: absolute;
  left: 40px;
  top: 0;
  opacity: 0.1;
}

.news .post .post-content .inner blockquote h5 {
  font-weight: 800;
  font-family: Poppins;
  margin: 0;
}

.news .post .post-content .inner ul {
  padding-left: 20px;
}

.news .post .post-content .inner ul li {
  line-height: 1.9;
}

.news .post .post-content .inner p {
  display: block;
  line-height: 30px;
}

.news .post .post-content .inner p:last-child {
  margin-bottom: 0;
}


/* HELLO TRAILCENTER*/
.hello_trailcenter {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
  background-color: var(--color01);
}

.hello_trailcenter h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.hello_trailcenter h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 70px;
  /*60px*/
  line-height: 1.2;
  padding-right: 35%;
  color: white;
}

.hello_trailcenter h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  position: absolute;
  left: 0;
  top: -20%;
}

.hello_trailcenter address {
  display: block;
  margin-bottom: 100px;
}

.hello_trailcenter address b {
  display: block;
  margin-bottom: 10px;
}








/* HELLO */
.hello {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
}

.hello h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.hello h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 35%;
}

.hello h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  position: absolute;
  left: 0;
  top: -20%;
}

.hello address {
  display: block;
  margin-bottom: 100px;
}

.hello address b {
  display: block;
  margin-bottom: 10px;
}

.hello #success,
.hello #error {
  display: none;
  float: left;
}

.hello #contact {
  width: 100%;
  display: flex;
  margin-left: -100px;
  padding: 40px 20px;
  background: #fff;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
}

.hello #contact .form-group:last-child {
  margin-bottom: 0;
}

.hello #contact label {
  display: block;
  font-size: 14px;
  font-weight: 600;
}

.hello #contact label.error {
  color: var(--color02);
  margin-top: 7px;
  margin-bottom: 0;
}

.hello #contact div.error {
  background: var(--color02);
  color: #fff;
  border-radius: 0;
  border: none;
}

.hello #contact input[type=text] {
  width: 100%;
  height: 50px;
  background: #fff;
  border: 1px solid #eee;
  padding: 0 20px;
}

.hello #contact textarea {
  width: 100%;
  height: 150px;
  background: #fff;
  border: 1px solid #eee;
  padding: 20px;
}

.hello #contact button[type=submit] {
  height: 50px;
  padding: 0 40px;
  font-size: 14px;
  font-weight: 600;
  color: white;
  background: var(--color01);
  border: none;
}

/* DIRECTION */
.direction {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 150px 0;
}

.direction h6 {
  display: block;
  line-height: 1;
  margin-bottom: 20px;
  font-family: "Fjalla One", sans-serif;
  opacity: 0.5;
  font-size: 14px;
}

.direction h2 {
  margin-bottom: 60px;
  font-weight: 800;
  font-size: 60px;
  line-height: 1.2;
  padding-right: 35%;
}

.direction h2:before {
  content: attr(data-text);
  font-size: 20vw;
  opacity: 0.05;
  z-index: -1;
  position: absolute;
  left: 0;
  top: -20%;
}

.direction figure {
  width: 100%;
  display: block;
  margin: 0;
  position: relative;
}

.direction figure img {
  width: 100%;
}

.direction figure figcaption {
  width: 40%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.7);
}

.direction figure figcaption .inner {
  width: 100%;
  padding: 40px;
  color: #fff;
}

.direction figure figcaption .inner .custom-link {
  margin-top: 40px;
}

.direction figure figcaption .inner .custom-link a {
  color: #fff;
}

.direction figure figcaption .inner .custom-link .lines span {
  background: #fff;
}

.direction figure figcaption .inner h5 {
  font-family: "Fjalla One", sans-serif;
  font-size: 26px;
  margin-bottom: 20px;
}

.direction figure figcaption .inner b {
  font-weight: 600;
}

.direction figure figcaption .inner p {
  font-size: 14px;
}

.direction figure figcaption .inner ul {
  display: block;
  margin: 0;
  padding: 0;
}

.direction figure figcaption .inner ul li {
  display: block;
  margin: 15px 0;
  padding: 0;
  list-style: none;
}


/* REVIEW: SKILLS */
.skill {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 300px;
  display: block;
  padding-bottom: 50px;
}

.skill h3 {
  font-size: 1vw;
  font-weight: 100;
  text-align: left;
  padding-top: 10px;
  margin-top: 10px;
  color: black;
}

.skill .bar {
  /* padding-top: 9px; */
  background: white;
  display: block;
  height: 10px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  /*border-radius: 10px;*/
  overflow: hidden;
  /* box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); */
  transition: all 0.35s cubic-bezier(.25, .8, .25, 1);
}

.skill .bar span {
  height: 10px;
  float: left;
  background: linear-gradient(135deg, rgba(0, 50, 34, 1)0%, rgba(0, 0, 39)100%);
}


/* PISTE 01 */
/*BAR numero piste + bar*/
.skill .bar1A {
  width: 10%;
}

.skill .bar1B {
  width: 0%;
}

.skill .bar1C {
  width: 5%;
}

.skill .bar1D {
  width: 90%;
}



/* PISTE 02 */
/*BAR numero piste + bar*/
.skill .bar2A {
  width: 40%;
}

.skill .bar2B {
  width: 15%;
}

.skill .bar2C {
  width: 10%;
}

.skill .bar2D {
  width: 30%;
}


/* PISTE 03 */
/*BAR numero piste + bar*/
.skill .bar3A {
  width: 0%;
}

.skill .bar3B {
  width: 0%;
}

.skill .bar3C {
  width: 40%;
}

.skill .bar3D {
  width: 90%;
}


/* PISTE 04 */
/*BAR numero piste + bar*/
.skill .bar4A {
  width: 20%;
}

.skill .bar4B {
  width: 5%;
}

.skill .bar4C {
  width: 10%;
}

.skill .bar4D {
  width: 20%;
}


.regles_piste {
  margin-top: 20px;
  margin-bottom: 50px;
}


/*LOGO STRAVA ET TEXTE*/
.strava {
  padding-right: 100px;
}

.strava p {
  font-size: 18px;
  line-height: 25px;
}


.strava_texte {
  height: 18px;
  margin-left: 5px;
}

/*END SKILL*/

/* FOOTER */
.footer {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  padding: 100px 0;
  background: #0e0e0e;
  color: #fff;
}

.footer .footer-quote {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 80px;
}

.footer .footer-quote img {
  height: 120px;
  /*60px*/
  display: block;
  margin-bottom: 20px;
}

.footer .footer-quote h2 {
  font-size: 3vw;
  font-weight: 800;
  margin-bottom: 0;
  color: var(--color01);
}

.footer .footer-contact {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 80px;
}

.footer .footer-contact address {
  margin-bottom: 0;
}

.footer .footer-contact address a {
  color: #fff;
  text-decoration: underline;
}




/*REVIEW Site map */
.footer .footer-contact h6 {
  font-family: "Fjalla One", sans-serif;
  text-transform: uppercase;
  color: var(--color01);
  font-size: 1rem;
}

.footer .footer-contact ul {
  list-style: none;
  padding-left: 0;
}

.footer .footer-contact ul a {
  list-style: none;
  padding-left: 0;
  font-size: 1rem;
  font-weight: 100;
  font-family: "Fjalla One", sans-serif;
  text-transform: uppercase;
  color: white;
  text-decoration: none;
  letter-spacing: 1px;
  font-weight: lighter;
}

.footer .footer-contact ul li {
  list-style: none;
  padding-left: 0;
  line-height: 28px;
  font-weight: lighter;
}





.footer .footer-bottom {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.footer .footer-bottom h5 {
  margin-bottom: 10px;
  font-family: "Fjalla One", sans-serif;
  text-transform: uppercase;
  color: var(--color01);
}



.footer .footer-bottom ul {
  display: block;
  margin: 0;
  padding: 0;
}

.footer .footer-bottom ul li {
  display: inline-block;
  margin: 0;
  margin-right: 20px;
  padding: 0;
  list-style: none;
}

.footer .footer-bottom ul li:last-child {
  margin-right: 0;
}

.footer .footer-bottom ul li a {
  position: relative;
  color: #fff;
  font-size: 26px;
  /*14px*/
  font-weight: 600;
  padding-bottom: 6px;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -ms-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
  border-bottom: 2px solid transparent;
}

.footer .footer-bottom ul li a:hover {
  padding-bottom: 1px;
  border-bottom: 2px solid #fff;
  text-decoration: none;
  color: var(--color02);
}

/* MEDIUM FIXES */
@media only screen and (max-width: 1199px),
only screen and (max-device-width: 1199px) {
  .swiper-slider .swiper-slide .slide-inner {
    padding: 0 10%;
  }

  .intro h4 {
    padding-right: 0;
  }

  .work-with-us h2 {
    padding-right: 0;
  }

  .work-with-us h4 {
    padding-right: 0;
  }

  .works-single h2 {
    padding-right: 0;
  }

  .direction h2 {
    padding-right: 0;
  }

  .clients h4 {
    padding-right: 0;
  }

  .news .post {
    flex-direction: column;
  }

  .news .post .post-image {
    margin-bottom: 30px;
  }

  .direction figure figcaption {
    width: 50%;
  }

  .hello h2 {
    padding-right: 0;
  }
}

/* RESPONSIVE TABLET FIXES */
@media only screen and (max-width: 991px),
only screen and (max-device-width: 991px) {
  header {
    min-height: inherit;
  }

  .image-bg img {}

  .swiper-slider .swiper-slide .slide-inner .container h1 {
    font-size: 8vw;
    /*12vw*/
  }

  .intro {
    padding: 80px 0;
  }

  .intro h2 {
    padding-right: 0;
    margin-bottom: 50px;
  }

  .intro .custom-link {
    transform: translateY(0);
  }

  .process {
    padding: 80px 0;
  }

  .process h2 {
    margin-bottom: 0;
  }

  .services-content-block {
    padding: 80px 0;
  }

  .services-content-block h2 {
    padding-right: 0;
  }

  .services-content-block .left {
    width: 100%;
    margin-bottom: 20px;
  }

  .services-content-block .right {
    width: 100%;
  }

  .team {
    padding: 80px 0;
  }

  .team figure {
    margin: 15px 0;
  }

  .direction {
    padding: 80px 0;
  }

  .direction figure figcaption {
    width: 100%;
  }

  .works {
    padding: 80px 0;
  }

  .works h2 {
    padding-right: 0;
    margin-bottom: 50px;
  }

  .works .project-box {
    padding: 35px 0;
  }

  .work-with-us {
    padding: 80px 0;
  }

  .works-single {
    padding: 80px 0;
  }

  .news {
    padding: 30px 0;
    padding-bottom: 80px;
  }

  .news .post.single-post {
    padding-left: 0;
    padding-right: 0;
  }

  .news .post.single-post .post-content .inner .post-title {
    font-size: 44px;
  }

  .news .post:nth-child(2n+2) .post-image {
    order: 0;
  }

  .news .post:nth-child(2n+2) .post-content {
    padding: 0 50px;
  }

  .awards {
    padding: 80px 0;
  }

  .clients {
    padding: 80px 0;
  }

  .hello {
    padding: 80px 0;
  }

  .hello #contact {
    margin-left: 0;
    box-shadow: none;
  }

  .footer .footer-quote h2 {
    font-size: 6vw;
  }
}

/* RESPONSIVE MOBILE FIXES */
@media only screen and (max-width: 767px),
only screen and (max-device-width: 767px) {

  .overlay iframe {
    width: 100%;
    height: 100%;
    /* border: none;
    border-radius: 10px; */
  }

  .close-btn {
    top: 10px;
    right: 10px;

  }

  .container {
    padding: 0 30px;
  }

  .image-bg img {
    max-width: 100%;
  }

  .page-header .video-bg:before {
    display: none;
  }

  header .scroll-down {
    left: -10px;
    /*-10px*/
  }

  header .swipe {
    left: 20px;
    /*-10px*/
  }

  header .sound {
    right: 30px;
    bottom: 30px;
  }

  .header {
    min-height: inherit;
  }

  .page-header {
    min-height: inherit;
  }

  .page-header .container h1 {
    font-size: 15vw;
  }

  .navigation-menu.active .bg-layers span {
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(1) {
    left: -50%;
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(2) {
    left: 0;
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(3) {
    left: 50%;
    width: 50%;
  }

  .navigation-menu.active .bg-layers span:nth-child(4) {
    left: 100%;
    width: 50%;
  }

  .navigation-menu .inner .menu ul li {
    display: block;
    margin-bottom: 20px;

  }

  .navigation-menu .inner .menu ul li a {
    font-size: 9vw;
    /*9vw*/
    padding-bottom: 2px;
  }

  .navigation-menu .inner .menu ul li a:hover {
    /* padding-bottom: 2px; */
  }

  .navigation-menu .inner .menu ul li ul {
    position: static;

    display: none;
    visibility: visible;
    opacity: 1;
    margin-top: 20px;
    /*40px*/
    margin-bottom: 0;
  }

  .navigation-menu .inner .menu ul li ul li {
    padding: 5px 0;
  }

  .navigation-menu .inner .menu ul li ul li a {
    font-size: 20px;
  }

  .navigation-menu .inner .menu ul li:hover ul {
    /*  display: block; */
    display: flex;
  }

  .navigation-menu .inner blockquote {
    display: none;
  }

  .navbar {
    padding: 20px 30px;
  }

  .navbar .right ul {
    display: none;
  }

  .navbar .right .hamburger-menu {
    margin-left: auto;
    /*auto*/
  }

  header .left-side {
    display: none;
  }

  .header .container h1 {
    font-size: 20vw;
  }

  .header .container h1 span {
    margin-left: 0;
    transform: translateY(0);
  }

  .header .container .slide-btn {
    padding-left: 0;
  }

  .swiper-slider .swiper-slide .slide-inner {
    padding: 0;
  }

  .swiper-slider .swiper-pagination-bullets {
    display: none;
  }

  .swiper-slider .swiper-slide .slide-inner:before {
    display: none;
  }


  .status-bar {
    margin-left: 0px;
  }



  .swiper-slider .swiper-slide .slide-inner .container .open_hours {
    font-family: Bebas Neue;
    color: black;
    transform: translateY(0%);
    margin-left: 0%;
    display: inline;
    /*flex*/
    /* position: relative; */
    font-size: 3vw;

    background-color: white;
    /* Jaune */
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 8px;
    padding-bottom: 6px;
    /* Espacement autour du texte */
    border-radius: 40px;
    /*  color: transparent; */
  }


  /*REVIEW: Image background pour mobile*/

  .swiper-slider .swiper-slide .slide-inner {
    /* background-image: url("images/bg-trail-mob.jpg"); */
    background-color: red;
    background-image: url(attr(data-background="images/featured01.jpg"));
  }

  .swiper-slider .swiper-slide .slide-inner .container h1 {
    font-size: 15vw;
    /*20vw*/
    letter-spacing: 1px;
    margin-bottom: 15px;

  }

  .swiper-slider .swiper-slide .slide-inner .container h1 span {
    margin-left: 0;
    transform: translateY(0);
  }


  .swiper-slider .swiper-slide .slide-inner .container .slide-btn {
    padding-left: 0;
  }

  .awards {
    padding: 40px 0;
    padding-bottom: 0;
  }

  .awards .odometer {
    margin-bottom: 40px;
  }

  .works-single h2 {
    font-size: 24px;
    /*32*/
    margin-bottom: 20px;
  }

  .works-single h3 {
    font-size: 20px;
  }

  .works-single h4 {
    margin-bottom: 20px;
  }

  .works-single p {
    font-size: 18px;
    line-height: 30px;
  }

  .hello h2 {
    font-size: 24px;
    /*32*/
    margin-bottom: 20px;
  }

  .hello address {
    margin-bottom: 20px;
  }

  .hello iframe {
    height: 400px !important;
  }

  .hello #contact {
    width: auto;
    margin-top: 40px;
    padding: 0;
    margin-left: -15px;
  }

  .team h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .intro h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .intro h4 {
    margin-bottom: 20px;
  }

  .intro p {
    font-size: 18px;
    line-height: 30px;
  }

  .services-content-block h2 {
    font-size: 32px;
    margin-bottom: 60px;
  }

  .direction h2 {
    font-size: 32px;
    margin-bottom: 40px;
  }

  .direction figure figcaption {
    width: 100%;
    position: static;
    display: block;
  }

  .works h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .works .project-box {
    flex-direction: column;
  }

  .works .project-box figure {
    width: 100%;
    margin-bottom: 20px;
  }

  .works .project-box:nth-child(2n+2) figure {
    order: 0;
  }

  .works .project-box:nth-child(2n+2) .content-box {
    text-align: left;
  }

  .works .project-box:nth-child(2n+2) .custom-link a {
    float: left;
  }

  .works .project-box .content-box {
    width: 100%;
    padding-left: 0;
  }

  .works .project-box .content-box .inner small {
    margin-bottom: 5px;
  }

  /*REVIEW: taille sous titre niveau couleur*/
  .works .project-box .content-box .inner h3 {
    margin-bottom: 30px;
    font-size: 6vw;
  }


  .works .project-box .content-box .inner h3 span {
    margin-left: 0;
    font-size: 12vw;

  }

  .services-content-block .col-md-4:nth-child(3) {
    margin: 40px 0;
  }

  .work-with-us h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .clients h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .clients ul {
    margin-left: -10px;
    margin-right: -10px;
    margin-top: 40px;
    width: auto;
  }

  .clients ul li {
    width: 50%;
  }

  .news .pagination {
    margin-top: 0;
    text-align: left;
  }

  .news .pagination a {
    margin-left: 0;
    margin-right: 20px;
  }

  .news .post .post-content {
    padding: 0;
  }

  .news .post:nth-child(2n+2) .post-content {
    padding: 0;
  }

  .footer {
    padding: 80px 0;
  }

  .footer .footer-quote img {
    margin-bottom: 40px;
  }

  .footer .footer-quote {
    margin-bottom: 40px;
  }

  .footer .footer-quote h2 {
    font-size: 8vw;
  }

  .footer .footer-contact {
    margin-bottom: 40px;
  }

  .footer .footer-contact address {
    margin-bottom: 30px;
  }

  .footer .footer-bottom ul li {
    margin-right: 15px;
  }


  .hello_trailcenter h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  /******************MODAL PARKING*******************/
  .modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.4);



  }

  .modal-content {
    background-color: rgba(255, 255, 255, 0.8);
    margin: 40% auto;
    width: 90%;
    padding: 20px;
    border: 4px solid white;
    border-radius: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    z-index: 1000;

  }

  .close {
    color: black;
    float: right;
    font-size: 30px;
    font-weight: bold;
  }

  .close:hover,
  .close:focus {
    color: white;
    text-decoration: none;
    cursor: pointer;
  }

  #myModal {
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
  }

  .p_parking_modal {
    font-family: Bebas Neue;
    font-size: 35px;
    text-align: center;
    color: black;
  }

  .p_parking_modal_sub {
    font-family: Bebas Neue;
    font-size: 20px;
    text-align: center;
    color: black;
  }

  /* From Uiverse.io by barisdogansutcu */
  .btn_modal {
    padding: 16px 40px;
    border-radius: 50px;
    cursor: pointer;
    border: 0;
    background-color: var(--color01);
    box-shadow: rgb(0 0 0 / 5%) 0 0 8px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-size: 15px;
    transition: all 0.5s ease;
  }


  .btn_modal:hover {
    letter-spacing: 3px;
    /*background-color: hsl(261deg 80% 48%);*/
    color: white;
    /*var(--color02);*/
    /*box-shadow: rgb(93 24 220) 0px 7px 29px 0px;*/
  }


  .btn_modal:active {
    letter-spacing: 3px;
    background-color: hsl(261deg 80% 48%);
    color: hsl(0, 0%, 100%);
    box-shadow: rgb(93 24 220) 0px 0px 0px 0px;
    transform: translateY(10px);
    transition: 100ms;
  }


  /******************END MODAL PARKING*******************/

  /******************END DON*******************/
  /*# sourceMappingURL=style.css.map */