@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline; }

[hidden] {
  display: none !important; }

ul {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 0; }

h1,
h2,
h3,
h4 {
  margin: 0;
  font-weight: normal; }

p {
  margin: 0; }

button {
  padding: 0;
  overflow: visible;
  color: inherit;
  background: none;
  border: 0;
  text-align: left;
  line-height: 0;
  cursor: pointer; }

a {
  color: currentColor;
  text-decoration: none; }

img {
  max-width: initial; }

input {
  background: none;
  border: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  -webkit-appearance: none; }
  input:focus {
    outline: none; }

select {
  border: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }
  select::-ms-expand {
    display: none; }

.no-list-styles {
  margin: 0;
  padding: 0;
  list-style: none; }

:focus {
  outline: 0; }

@font-face {
  font-family: "GeistMono-Black";
  src: url("../fonts/build/GeistMono-Black.woff2") format("woff2"), url("../fonts/build/GeistMono-Black.woff") format("woff");
  font-style: normal;
  font-weight: 800; }

@font-face {
  font-family: "GeistMono-Bold";
  src: url("../fonts/build/GeistMono-Bold.woff2") format("woff2"), url("../fonts/build/GeistMono-Bold.woff") format("woff");
  font-style: normal;
  font-weight: 700; }

@font-face {
  font-family: "GeistMono-Light";
  src: url("../fonts/build/GeistMono-Light.woff2") format("woff2"), url("../fonts/build/GeistMono-Light.woff") format("woff");
  font-style: normal;
  font-weight: 300; }

@font-face {
  font-family: "GeistMono-Medium";
  src: url("../fonts/build/GeistMono-Medium.woff2") format("woff2"), url("../fonts/build/GeistMono-Medium.woff") format("woff");
  font-style: normal;
  font-weight: normal; }

@font-face {
  font-family: "GeistMono-Regular";
  src: url("../fonts/build/GeistMono-Regular.woff2") format("woff2"), url("../fonts/build/GeistMono-Regular.woff") format("woff");
  font-style: normal;
  font-weight: regular; }

@font-face {
  font-family: "GeistMono-SemiBold";
  src: url("../fonts/build/GeistMono-SemiBold.woff2") format("woff2"), url("../fonts/build/GeistMono-SemiBold.woff") format("woff");
  font-style: normal;
  font-weight: 700; }

@font-face {
  font-family: "GeistMono-Thin";
  src: url("../fonts/build/GeistMono-Thin.woff2") format("woff2"), url("../fonts/build/GeistMono-Thin.woff") format("woff");
  font-style: normal;
  font-weight: 100; }

@font-face {
  font-family: "GeistMono-UltraBlack";
  src: url("../fonts/build/GeistMono-UltraBlack.woff2") format("woff2"), url("../fonts/build/GeistMono-UltraBlack.woff") format("woff");
  font-style: normal;
  font-weight: 900; }

@font-face {
  font-family: "GeistMono-UltraLight";
  src: url("../fonts/build/GeistMono-UltraLight.woff2") format("woff2"), url("../fonts/build/GeistMono-UltraLight.woff") format("woff");
  font-style: normal;
  font-weight: 200; }

@-webkit-keyframes rotator {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg); } }

@-moz-keyframes rotator {
  0% {
    -moz-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(270deg);
    transform: rotate(270deg); } }

@-o-keyframes rotator {
  0% {
    -o-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -o-transform: rotate(270deg);
    transform: rotate(270deg); } }

@keyframes rotator {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg); } }

@-webkit-keyframes dash {
  0% {
    stroke-dashoffset: 280; }
  50% {
    stroke-dashoffset: 75;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg); }
  100% {
    stroke-dashoffset: 280;
    -webkit-transform: rotate(450deg);
    transform: rotate(450deg); } }

@-moz-keyframes dash {
  0% {
    stroke-dashoffset: 280; }
  50% {
    stroke-dashoffset: 75;
    -moz-transform: rotate(135deg);
    transform: rotate(135deg); }
  100% {
    stroke-dashoffset: 280;
    -moz-transform: rotate(450deg);
    transform: rotate(450deg); } }

@-o-keyframes dash {
  0% {
    stroke-dashoffset: 280; }
  50% {
    stroke-dashoffset: 75;
    -o-transform: rotate(135deg);
    transform: rotate(135deg); }
  100% {
    stroke-dashoffset: 280;
    -o-transform: rotate(450deg);
    transform: rotate(450deg); } }

@keyframes dash {
  0% {
    stroke-dashoffset: 280; }
  50% {
    stroke-dashoffset: 75;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg); }
  100% {
    stroke-dashoffset: 280;
    -webkit-transform: rotate(450deg);
    -moz-transform: rotate(450deg);
    -o-transform: rotate(450deg);
    transform: rotate(450deg); } }

.color-white {
  color: #fff; }

.color-black {
  color: #000; }

.color-grey {
  color: #f4f6f1; }

.color-grey-text {
  color: #959595; }

.background-white {
  background-color: #fff; }

.background-black {
  background-color: #000; }

.background-bg-media {
  background-color: #2A2A2A; }

.background-black-opac {
  background-color: rgba(0, 0, 0, 0.4); }

.background-white-opac {
  background-color: rgba(255, 255, 255, 0.4); }

.background-grey {
  background-color: #f4f6f1; }

html {
  font-size: 15px;
  font-family: sans-serif; }

body {
  -webkit-font-smoothing: antialiased; }

em,
i {
  font-style: italic; }

.uppercase {
  text-transform: uppercase; }

.lowercase {
  text-transform: lowercase; }

.capitalize {
  text-transform: capitalize; }

.aligncenter {
  text-align: center; }

.alignleft {
  text-align: left; }

.alignright {
  text-align: right; }

.justify-text {
  text-align: justify; }

@media (min-width: 768px) {
  .aligncenter-md {
    text-align: center; } }

@media (min-width: 768px) {
  .alignleft-md {
    text-align: left; } }

@media (min-width: 768px) {
  .alignright-md {
    text-align: right; } }

@media (min-width: 768px) {
  .justify-text-md {
    text-align: justify; } }

.site-menu__item {
  font-family: "GeistMono-Black";
  font-size: 2.73rem;
  line-height: 1.2; }
  @media (min-width: 576px) {
    .site-menu__item {
      font-family: "GeistMono-Light";
      font-size: 1rem;
      line-height: 1.2; } }

.current-text {
  font-family: "GeistMono-Light";
  font-size: 1rem;
  line-height: 1.2; }
  .current-text--ub,
  .current-text h2 {
    font-family: "GeistMono-UltraBlack"; }
  .current-text--ul {
    font-family: "GeistMono-UltraLight";
    line-height: 1.26; }
    @media (min-width: 768px) {
      .current-text--ul {
        font-size: 1.2rem;
        line-height: 1.5; } }
  .current-text strong {
    font-family: "GeistMono-Black"; }
  .current-text em,
  .current-text i {
    font-style: italic; }
  .current-text--title {
    font-size: 1.06rem; }
  .current-text--entry {
    font-size: .93rem; }
  .current-text--bigger {
    font-family: "GeistMono-UltraLight";
    font-size: 1.2rem;
    line-height: 1.5; }
  .current-text p {
    margin-bottom: 1rem; }
    .current-text p:last-child {
      margin-bottom: 0; }

.title-1 {
  font-family: "GeistMono-Black";
  font-size: 1.8rem;
  line-height: 1;
  letter-spacing: 0.08rem; }
  .title-1--light {
    font-family: "GeistMono-Light"; }
  .title-1--smaller {
    font-size: 1rem;
    letter-spacing: 0rem; }
    @media (min-width: 576px) {
      .title-1--smaller {
        font-size: 1.6rem; } }

.title-2 {
  font-family: "GeistMono-Bold";
  font-size: 2.6667rem;
  line-height: 1.3;
  letter-spacing: 0.08rem; }
  .title-2--light {
    font-family: "GeistMono-Light"; }
  .title-2--showreels {
    font-size: 2rem;
    line-height: 1.2; }
    @media (min-width: 768px) {
      .title-2--showreels {
        font-size: 2.6667rem;
        line-height: 1.3; } }

.title-3 {
  font-family: "GeistMono-Bold";
  font-size: 1.4rem;
  line-height: 1.3;
  letter-spacing: 0.08rem; }

.waiting-page-title {
  font-family: "GeistMono-UltraLight";
  font-size: 1.5rem;
  text-transform: uppercase; }

.home-infos__about-text {
  font-family: "GeistMono-UltraLight";
  font-size: 1.6rem;
  line-height: 1.54; }
  @media (min-width: 1024px) {
    .home-infos__about-text {
      font-size: 2.35rem; } }

.about-intro-text {
  font-family: "GeistMono-UltraLight";
  font-size: 1.6rem;
  line-height: 1.54; }
  @media (min-width: 1024px) {
    .about-intro-text {
      font-size: 1.3333rem; } }

:root {
  --vh: 1vh;
  --modalHeight: 1vh; }

*, *:before, *:after {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%; }
  html.is-locked body {
    overflow: hidden; }
  html.fixed {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden; }
    html.fixed body  {
      width: 100%;
      max-height: 100%;
      height: 100%; }

body.fixed {
  overflow: hidden; }

.container {
  width: 100%; }

a {
  color: currentColor;
  text-decoration: none; }

.inline {
  display: inline; }

.block {
  display: block; }

.inline-block {
  display: inline-block; }

.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }

.flex-wrap {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.flex-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column; }

.align-start {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start; }

.align-center {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center; }

.align-end {
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end; }

.justify-start {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start; }

.justify-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

.justify-end {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end; }

.justify-between {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }

.img-container {
  position: relative;
  display: block;
  width: 100%;
  line-height: 0; }
  .img-container img {
    width: 100%;
    height: auto; }

.click-cancel {
  pointer-events: none; }

.fullheight {
  height: 100vh;
  height: -webkit-calc(var(--vh, 1vh) * 100);
  height: -moz-calc(var(--vh, 1vh) * 100);
  height: calc(var(--vh, 1vh) * 100);
  height: 100svh;
  max-height: 100%; }

.xs-row {
  margin-bottom: .5rem; }

.sm-row {
  margin-bottom: 1rem; }

.md-row {
  margin-bottom: 2rem; }

.lg-row {
  margin-bottom: 3rem; }

.xl-row {
  margin-bottom: 4rem; }

.xxl-row {
  margin-bottom: 5rem; }

.arrow svg {
  width: 1.5rem;
  height: 2.76rem; }

.vp__play-btn svg {
  width: 3rem;
  height: 3rem; }
  @media (min-width: 768px) {
    .vp__play-btn svg {
      width: 5rem;
      height: 5rem; } }

.vp__sound svg, .vp__fs svg {
  width: 100%;
  height: 100%; }

.vp--black svg {
  -webkit-filter: invert(1);
  filter: invert(1); }

.lazy-img {
  position: relative;
  display: block;
  line-height: 0; }
  .lazy-img svg {
    background: #f4f6f1;
    -webkit-transition: 0.3s linear opacity;
    -o-transition: 0.3s linear opacity;
    -moz-transition: 0.3s linear opacity;
    transition: 0.3s linear opacity; }
  .lazy-img img {
    opacity: 0;
    -webkit-transition: 0.3s linear opacity;
    -o-transition: 0.3s linear opacity;
    -moz-transition: 0.3s linear opacity;
    transition: 0.3s linear opacity;
    z-index: 1; }
  .lazy-img--regular {
    position: relative; }
    .lazy-img--regular svg {
      position: relative;
      width: 100%;
      height: 100%; }
    .lazy-img--regular img {
      position: absolute;
      top: 0;
      left: 0;
      width: -webkit-calc(100% + 1px);
      width: -moz-calc(100% + 1px);
      width: calc(100% + 1px);
      height: auto; }
  .lazy-img--natural-height {
    position: relative;
    width: auto; }
    .lazy-img--natural-height svg {
      position: relative;
      width: auto;
      height: 100%; }
    .lazy-img--natural-height img {
      position: absolute;
      top: 0;
      left: 0;
      width: auto;
      height: 100%; }
  .lazy-img--centered {
    width: 100%;
    height: 100%; }
    .lazy-img--centered > * {
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      max-height: 100%;
      max-width: 100%;
      width: auto;
      height: auto;
      -webkit-transform: translate3d(-50%, -50%, 0);
      -moz-transform: translate3d(-50%, -50%, 0);
      transform: translate3d(-50%, -50%, 0); }
  .lazy-img.loaded img {
    opacity: 1; }
  .lazy-img.loaded svg {
    opacity: 0; }

.lazy-bg {
  position: relative;
  background: #f4f6f1;
  width: 100%; }
  .lazy-bg__item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: 0s ease-out opacity;
    -o-transition: 0s ease-out opacity;
    -moz-transition: 0s ease-out opacity;
    transition: 0s ease-out opacity; }
    .lazy-bg__item.loaded {
      opacity: 1; }


.lazy-bg-intro {
  position: relative;
  background: #f4f6f1;
  width: 100%; }
  .lazy-bg__item-intro {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: 2s ease-out opacity;
    -o-transition: 2s ease-out opacity;
    -moz-transition: 2s ease-out opacity;
    transition: 2s ease-out opacity; }
    .lazy-bg__item-intro.loaded {
      opacity: 1; }


.vp {
  position: relative;
  line-height: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .vp video {
    -o-object-fit: fill;
    object-fit: fill; }
  .vp.lazy-bg {
    background-color: transparent; }
  .vp--cover {
    width: 100%;
    height: 100%; }
    .vp--cover video {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      height: 100%;
      width: 100%;
      -o-object-fit: cover;
      object-fit: cover; }
    .vp--cover .sizer {
      width: 100%;
      height: 100%; }
  .vp--natural-width {
    max-width: 100%;
    width: 100%; }
    .vp--natural-width .sizer {
      position: relative;
      display: block;
      width: 100%;
      max-width: 100%;
      height: auto; }
    .vp--natural-width video {
      position: absolute;
      top: 0;
      left: 0;
      width: -webkit-calc(100% + 1px);
      width: -moz-calc(100% + 1px);
      width: calc(100% + 1px);
      height: auto; }
  .vp--natural-height {
    width: 100%; }
    @media screen and (orientation: landscape) {
      .vp--natural-height {
        width: auto;
        height: 100%; } }
    .vp--natural-height video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: auto; }
      @media screen and (orientation: landscape) {
        .vp--natural-height video {
          width: auto;
          height: 100%; } }
  .vp--contain video {
    position: relative;
    width: 100%;
    height: 100%; }
  .vp.fullscreen-active {
    background: #000 !important; }
    .vp.fullscreen-active video {
      min-width: unset;
      min-height: unset; }
    .vp.fullscreen-active:not(.fullscreen-vertical) video {
      position: relative;
      width: 100%;
      height: auto;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
    .vp.fullscreen-active.fullscreen-vertical video {
      display: block;
      margin: auto;
      width: auto;
      height: 100vh; }
  .vp.paused .vp__play-btn {
    opacity: 1; }
  .vp.paused svg.vp__play-status-play {
    opacity: 1; }
  .vp.paused svg.vp__play-status-pause {
    opacity: 0; }
  .vp.playing .vp__play-btn {
    opacity: 0; }
  .vp.playing svg.vp__play-status-play {
    opacity: 0; }
  .vp.playing svg.vp__play-status-pause {
    opacity: 1; }
  .vp.playing svg {
    -webkit-transition: .3s all linear;
    -o-transition: .3s all linear;
    -moz-transition: .3s all linear;
    transition: .3s all linear;
    fill: #fff; }
  .vp.has-played video {
    opacity: 1; }

  .vp video {
    opacity: 0;
    /*
    -webkit-transition: 0s linear opacity;
    -o-transition: 0s linear opacity;
    -moz-transition: 0s linear opacity;
    transition: 0s linear opacity;
    */
     }

  .intro video {
    opacity: 0;
    -webkit-transition: 1s ease-out opacity;
    -o-transition: 1s ease-out opacity;
    -moz-transition: 1s ease-out opacity;
    transition: 1s ease-out opacity; }


  .hero video {
    opacity: 0;
    /*
    animation: fadeInVideoHero 0s ease-out 4s forwards;
    -webkit-transition: 0s ease-out opacity 1.2s;
    -o-transition: 0s ease-out opacity 1.2s;
    -moz-transition: 0s ease-out opacity 1.2s;
    transition: 0s ease-out opacity 1.2s;
    */
 }

  @keyframes fadeInVideoHero {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
}

  .vp__controls {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: 0.3s linear opacity;
    -o-transition: 0.3s linear opacity;
    -moz-transition: 0.3s linear opacity;
    transition: 0.3s linear opacity; }
  .vp__play-pause {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: 0.3s linear opacity;
    -o-transition: 0.3s linear opacity;
    -moz-transition: 0.3s linear opacity;
    transition: 0.3s linear opacity;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent; }
  .vp__bottom-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    background-color: rgba(244, 246, 241, 0.4);
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    -moz-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s; }
  .vp__button {
    display: block;
    position: relative;
    width: 1.5rem;
    height: 1.5rem;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px; }
    @media (min-width: 1024px) {
      .vp__button {
        width: 2.33rem;
        height: 2.33rem; } }
    .vp__button svg {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate3d(-50%, -50%, 0);
      -moz-transform: translate3d(-50%, -50%, 0);
      transform: translate3d(-50%, -50%, 0);
      width: .9rem;
      height: .9rem;
      fill: #000;
      -webkit-transition: all ease-in-out .3s;
      -o-transition: all ease-in-out .3s;
      -moz-transition: all ease-in-out .3s;
      transition: all ease-in-out .3s; }
      @media (min-width: 1024px) {
        .vp__button svg {
          width: 1.5rem;
          height: 1.5rem; } }
  .vp__play-status svg:last-child {
    opacity: 0; }
  .vp__fs {
    margin-right: .5rem; }
    .vp__fs svg {
      stroke: #fff; }
      .vp__fs svg:first-child {
        opacity: 0; }
  .vp.fullscreen-active .vp__fs svg:first-child {
    opacity: 1; }
  .vp.fullscreen-active .vp__fs svg:last-child {
    opacity: 0; }
  .vp__sound svg:first-child {
    opacity: 1; }
  .vp__sound svg:last-child {
    opacity: 0; }
  .vp__sound.active svg:first-child {
    opacity: 0; }
  .vp__sound.active svg:last-child {
    opacity: 1; }
  .vp__progress {
    position: relative;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0 .5rem;
    height: 4px;
    cursor: pointer; }
  .vp__progress-bar {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent; }
    .vp__progress-bar::-webkit-progress-bar {
      background: transparent;
      -webkit-border-radius: 1rem;
      border-radius: 1rem; }
    .vp__progress-bar::-webkit-progress-value {
      background: #2A2A2A;
      -webkit-border-radius: 1rem;
      border-radius: 1rem; }
    .vp__progress-bar::-moz-progress-bar {
      background: #2A2A2A;
      -moz-border-radius: 1rem;
      border-radius: 1rem; }
  .vp__seek {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2; }
  .vp input[type=range]::-webkit-slider-thumb {
    height: 2rem;
    width: 4rem;
    -webkit-border-radius: 1rem;
    border-radius: 1rem;
    cursor: pointer;
    -webkit-appearance: none; }
  .vp__buffer {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1rem;
    height: 1rem;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0); }
    .vp__buffer.invisible {
      display: none; }
    .vp__buffer-spinner svg {
      width: 1rem;
      height: 1rem;
      stroke: #fff;
      -webkit-animation: rotator 1.4s linear infinite;
      -moz-animation: rotator 1.4s linear infinite;
      -o-animation: rotator 1.4s linear infinite;
      animation: rotator 1.4s linear infinite; }
      @media (min-width: 1024px) {
        .vp__buffer-spinner svg {
          width: 2rem;
          height: 2rem; } }
    .vp__buffer-spinner .path {
      stroke-dasharray: 280;
      stroke-dashoffset: 0;
      -webkit-transform-origin: center;
      -moz-transform-origin: center;
      -ms-transform-origin: center;
      -o-transform-origin: center;
      transform-origin: center;
      stroke: #fff;
      -webkit-animation: dash 1.4s ease-in-out infinite;
      -moz-animation: dash 1.4s ease-in-out infinite;
      -o-animation: dash 1.4s ease-in-out infinite;
      animation: dash 1.4s ease-in-out infinite; }

.sizer--contain {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto; }
  @media (min-width: 1024px) {
    .sizer--contain {
      max-width: 70%; } }

.site-intro {
  z-index: 104; }

.menu-toggle,
.site-wt,
.site-heart,
.site-waiting-text,
.open-about {
  z-index: 103; }

.site-logo {
  z-index: 101; }

.page-title {
  z-index: 100; }

.site-header {
  z-index: 99; }

.vp {
  z-index: 1; }
  .vp video {
    z-index: 1; }
  .vp__play-pause {
    z-index: 2; }
  .vp__buffer {
    z-index: 3; }
  .vp__bottom-bar {
    z-index: 4; }
    .vp__bottom-bar .vp__bottom-bar {
      z-index: 2; }
    .vp__bottom-bar .vp__progress {
      z-index: 1; }

.grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: -webkit-calc(100% - (1.3333rem * 2));
  width: -moz-calc(100% - (1.3333rem * 2));
  width: calc(100% - (1.3333rem * 2));
  max-width: -webkit-calc(100% - (1.3333rem * 2));
  max-width: -moz-calc(100% - (1.3333rem * 2));
  max-width: calc(100% - (1.3333rem * 2));
  margin-left: auto;
  margin-right: auto; }
  @media (min-width: 768px) {
    .grid {
      width: -webkit-calc(100% - (2.66667rem * 2));
      width: -moz-calc(100% - (2.66667rem * 2));
      width: calc(100% - (2.66667rem * 2));
      max-width: -webkit-calc(100% - (2.66667rem * 2));
      max-width: -moz-calc(100% - (2.66667rem * 2));
      max-width: calc(100% - (2.66667rem * 2)); } }
  .grid .col {
    padding-right: 0.3333rem;
    padding-left: 0.3333rem; }
  @media (min-width: 1024px) {
    .grid--bigger-spacement {
      width: -webkit-calc(100% - 2.333rem * 2);
      width: -moz-calc(100% - 2.333rem * 2);
      width: calc(100% - 2.333rem * 2);
      max-width: -webkit-calc(100% - 2.333rem * 2);
      max-width: -moz-calc(100% - 2.333rem * 2);
      max-width: calc(100% - 2.333rem * 2); } }
  @media (min-width: 1024px) {
    .grid--bigger-spacement .col {
      padding-right: .5rem;
      padding-left: .5rem; } }
  .grid--no-padding {
    width: 100%;
    max-width: 100%; }
    .grid--no-padding .col {
      margin-bottom: -webkit-calc( 0.3333rem * 2);
      margin-bottom: -moz-calc( 0.3333rem * 2);
      margin-bottom: calc( 0.3333rem * 2); }
      .grid--no-padding .col.xxs-col-8 {
        padding-left: 0;
        padding-right: 0; }
      @media (min-width: 768px) {
        .grid--no-padding .col.md-col-4:first-child {
          padding-left: 0;
          padding-right: 0.3333rem; } }
      @media (min-width: 768px) {
        .grid--no-padding .col.md-col-4:last-child {
          padding-right: 0;
          padding-left: 0.3333rem; } }

.row {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 100%;
  max-width: 100%;
  margin: 0 auto; }

.col {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  max-width: 100%; }

@media (min-width: 0px) {
  .xxs-col-1 {
    width: 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .xxs-col-2 {
    width: 25%;
    max-width: 25%;
    min-width: 25%; }
  .xxs-col-3 {
    width: 37.5%;
    max-width: 37.5%;
    min-width: 37.5%; }
  .xxs-col-4 {
    width: 50%;
    max-width: 50%;
    min-width: 50%; }
  .xxs-col-5 {
    width: 62.5%;
    max-width: 62.5%;
    min-width: 62.5%; }
  .xxs-col-6 {
    width: 75%;
    max-width: 75%;
    min-width: 75%; }
  .xxs-col-7 {
    width: 87.5%;
    max-width: 87.5%;
    min-width: 87.5%; }
  .xxs-col-8 {
    width: 100%;
    max-width: 100%;
    min-width: 100%; } }

@media (min-width: 350px) {
  .xs-col-1 {
    width: 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .xs-col-2 {
    width: 25%;
    max-width: 25%;
    min-width: 25%; }
  .xs-col-3 {
    width: 37.5%;
    max-width: 37.5%;
    min-width: 37.5%; }
  .xs-col-4 {
    width: 50%;
    max-width: 50%;
    min-width: 50%; }
  .xs-col-5 {
    width: 62.5%;
    max-width: 62.5%;
    min-width: 62.5%; }
  .xs-col-6 {
    width: 75%;
    max-width: 75%;
    min-width: 75%; }
  .xs-col-7 {
    width: 87.5%;
    max-width: 87.5%;
    min-width: 87.5%; }
  .xs-col-8 {
    width: 100%;
    max-width: 100%;
    min-width: 100%; } }

@media (min-width: 576px) {
  .sm-col-1 {
    width: 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .sm-col-2 {
    width: 25%;
    max-width: 25%;
    min-width: 25%; }
  .sm-col-3 {
    width: 37.5%;
    max-width: 37.5%;
    min-width: 37.5%; }
  .sm-col-4 {
    width: 50%;
    max-width: 50%;
    min-width: 50%; }
  .sm-col-5 {
    width: 62.5%;
    max-width: 62.5%;
    min-width: 62.5%; }
  .sm-col-6 {
    width: 75%;
    max-width: 75%;
    min-width: 75%; }
  .sm-col-7 {
    width: 87.5%;
    max-width: 87.5%;
    min-width: 87.5%; }
  .sm-col-8 {
    width: 100%;
    max-width: 100%;
    min-width: 100%; } }

@media (min-width: 768px) {
  .md-col-1 {
    width: 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .md-col-2 {
    width: 25%;
    max-width: 25%;
    min-width: 25%; }
  .md-col-3 {
    width: 37.5%;
    max-width: 37.5%;
    min-width: 37.5%; }
  .md-col-4 {
    width: 50%;
    max-width: 50%;
    min-width: 50%; }
  .md-col-5 {
    width: 62.5%;
    max-width: 62.5%;
    min-width: 62.5%; }
  .md-col-6 {
    width: 75%;
    max-width: 75%;
    min-width: 75%; }
  .md-col-7 {
    width: 87.5%;
    max-width: 87.5%;
    min-width: 87.5%; }
  .md-col-8 {
    width: 100%;
    max-width: 100%;
    min-width: 100%; } }

@media (min-width: 1024px) {
  .lg-col-1 {
    width: 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .lg-col-2 {
    width: 25%;
    max-width: 25%;
    min-width: 25%; }
  .lg-col-3 {
    width: 37.5%;
    max-width: 37.5%;
    min-width: 37.5%; }
  .lg-col-4 {
    width: 50%;
    max-width: 50%;
    min-width: 50%; }
  .lg-col-5 {
    width: 62.5%;
    max-width: 62.5%;
    min-width: 62.5%; }
  .lg-col-6 {
    width: 75%;
    max-width: 75%;
    min-width: 75%; }
  .lg-col-7 {
    width: 87.5%;
    max-width: 87.5%;
    min-width: 87.5%; }
  .lg-col-8 {
    width: 100%;
    max-width: 100%;
    min-width: 100%; } }

@media (min-width: 1200px) {
  .xl-col-1 {
    width: 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .xl-col-2 {
    width: 25%;
    max-width: 25%;
    min-width: 25%; }
  .xl-col-3 {
    width: 37.5%;
    max-width: 37.5%;
    min-width: 37.5%; }
  .xl-col-4 {
    width: 50%;
    max-width: 50%;
    min-width: 50%; }
  .xl-col-5 {
    width: 62.5%;
    max-width: 62.5%;
    min-width: 62.5%; }
  .xl-col-6 {
    width: 75%;
    max-width: 75%;
    min-width: 75%; }
  .xl-col-7 {
    width: 87.5%;
    max-width: 87.5%;
    min-width: 87.5%; }
  .xl-col-8 {
    width: 100%;
    max-width: 100%;
    min-width: 100%; } }

@media (min-width: 1440px) {
  .xxl-col-1 {
    width: 12.5%;
    max-width: 12.5%;
    min-width: 12.5%; }
  .xxl-col-2 {
    width: 25%;
    max-width: 25%;
    min-width: 25%; }
  .xxl-col-3 {
    width: 37.5%;
    max-width: 37.5%;
    min-width: 37.5%; }
  .xxl-col-4 {
    width: 50%;
    max-width: 50%;
    min-width: 50%; }
  .xxl-col-5 {
    width: 62.5%;
    max-width: 62.5%;
    min-width: 62.5%; }
  .xxl-col-6 {
    width: 75%;
    max-width: 75%;
    min-width: 75%; }
  .xxl-col-7 {
    width: 87.5%;
    max-width: 87.5%;
    min-width: 87.5%; }
  .xxl-col-8 {
    width: 100%;
    max-width: 100%;
    min-width: 100%; } }

.header-offset {
  position: relative;
  padding-top: 4.333em; }
  @media (min-width: 768px) {
    .header-offset {
      padding-top: 6rem; } }

.spacing-top {
  margin-top: 5rem; }

body {
  min-height: 100vh;
  min-height: -webkit-calc(var(--vh, 1vh) * 100);
  min-height: -moz-calc(var(--vh, 1vh) * 100);
  min-height: calc(var(--vh, 1vh) * 100);
  min-height: 100svh;
  height: 100%;
  background-color: #f4f6f1;
  -webkit-transition: .3s linear all;
  -o-transition: .3s linear all;
  -moz-transition: .3s linear all;
  transition: .3s linear all; }
  body .site-main {
    -webkit-transition: .3s linear all;
    -o-transition: .3s linear all;
    -moz-transition: .3s linear all;
    transition: .3s linear all; }
  body .site-logo img:first-child {
    opacity: 1; }
  body .site-logo img:nth-child(2) {
    opacity: 0; }
  body .menu-toggle svg.burger {
    stroke: #000; }
  body .menu-toggle svg.close {
    fill: #000; }
  body.media-playing {
    background-color: #2A2A2A; }
    body.media-playing .site-header,
    body.media-playing .site-main {
      background-color: #2A2A2A; }
    body.media-playing .site-logo img:first-child {
      opacity: 0; }
    body.media-playing .site-logo img:nth-child(2) {
      opacity: 1; }
    body.media-playing .menu-toggle svg.burger {
      stroke: #fff; }
    body.media-playing .page-title {
      color: #fff; }
    body.media-playing .project-infos,
    body.media-playing .portrait-title {
      background-color: #2A2A2A;
      color: #fff; }
    body.media-playing .vp__bottom-bar {
      background-color: rgba(42, 42, 42, 0.8); }
    body.media-playing .vp__progress-bar::-webkit-progress-value {
      background: #f4f6f1; }
    body.media-playing .vp__progress-bar::-moz-progress-bar {
      background: #f4f6f1; }
    body.media-playing .vp svg {
      fill: #fff; }
    body.media-playing .site-waiting-text {
      color: #fff; }
  body.home-final .site-header, body.showreels .site-header {
    background-color: transparent; }
  body.home-final .site-logo img:first-child, body.showreels .site-logo img:first-child {
    opacity: 0; }
  body.home-final .site-logo img:nth-child(2), body.showreels .site-logo img:nth-child(2) {
    opacity: 1; }
  body.home-final .menu-toggle svg.burger, body.showreels .menu-toggle svg.burger {
    stroke: #fff; }
  body.home-final .page-title, body.showreels .page-title {
    color: #fff; }
  body.home-final .home-infos__arrow svg, body.showreels .home-infos__arrow svg {
    stroke: #fff; }
  body.home-final.infos-opened .site-logo img:first-child {
    opacity: 1; }
  body.home-final.infos-opened .site-logo img:nth-child(2) {
    opacity: 0; }
  body.home-final.infos-opened .menu-toggle svg.burger {
    stroke: #000; }

.site-intro {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  cursor: pointer;
  padding: 20vh 0;
  background-color: #f4f6f1;
  opacity: 1;
/*  -webkit-transition: 0.3s linear opacity;
  -o-transition: 0.3s linear opacity;
  -moz-transition: 0.3s linear opacity;
  transition: 0.3s linear opacity;
  */ 
  -webkit-transition: 0.2s ease-in opacity 1s;
  -o-transition: 0.2s ease-in opacity 1s;
  -moz-transition: 0.2s ease-in opacity 1s;
  transition: 0.2s ease-in opacity 1s; 
  }
  @media (orientation: landscape) {
    .site-intro {
      padding: 0 20vw; 
    }
  }


  .site-intro__inner {
    width: 100%;
    height: 100%;
    -webkit-mask-size: 300px;
    mask-size: 300px;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center; }
    @media (min-width: 1024px) {
      .site-intro__inner {
        -webkit-mask-size: 400px;
        mask-size: 400px; } }
    @media (min-width: 1200px) {
      .site-intro__inner {
        -webkit-mask-size: 500px;
        mask-size: 500px; } }
    @media (min-width: 1440px) {
      .site-intro__inner {
        -webkit-mask-size: 600px;
        mask-size: 600px; } }

  .site-intro__background-logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../img/intro-logo-transparent.png") no-repeat;
    -webkit-background-size: 300px auto;
    -moz-background-size: 300px auto;
    -o-background-size: 300px auto;
    background-size: 300px auto;
    background-position: center center;
    z-index: 2;
    opacity: 0;
    animation: fadeInSiteIntro 0.7s ease-out forwards 0.3s;
  }
  @keyframes fadeInSiteIntro {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
    @media (min-width: 1024px) {
      .site-intro__background-logo {
        -webkit-background-size: 400px auto;
        -moz-background-size: 400px auto;
        -o-background-size: 400px auto;
        background-size: 400px auto; } }
    @media (min-width: 1200px) {
      .site-intro__background-logo {
        -webkit-background-size: 500px auto;
        -moz-background-size: 500px auto;
        -o-background-size: 500px auto;
        background-size: 500px auto; } }
    @media (min-width: 1440px) {
      .site-intro__background-logo {
        -webkit-background-size: 600px auto;
        -moz-background-size: 600px auto;
        -o-background-size: 600px auto;
        background-size: 600px auto; } }


.waiting-page .header-offset {
  position: relative;
  padding-top: 8.5rem; }
  @media (min-width: 768px) {
    .waiting-page .header-offset {
      padding-top: 8rem; } }

.waiting-page .home-infos__inner {
  padding-top: 2rem; }
  @media (min-width: 768px) {
    .waiting-page .home-infos__inner {
      padding-top: 3rem; } }

.waiting-page .site-infos h2 {
  margin-bottom: .75rem; }
  @media (min-width: 768px) {
    .waiting-page .site-infos h2 {
      margin-bottom: 1.25rem; } }

.waiting-page .site-infos .col:first-child {
  display: none; }
  @media (min-width: 768px) {
    .waiting-page .site-infos .col:first-child {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex; } }

.waiting-page .site-infos .col:last-child .site-infos__part {
  margin-bottom: 1rem; }

.waiting-page .home-infos__arrow-container {
  background: #f4f6f1; }

.site-waiting-about {
  position: fixed;
  top: 3.5rem;
  right: 1.6667rem; }
  @media (min-width: 768px) {
    .site-waiting-about {
      right: auto;
      left: 3rem; } }

.site-waiting-logo {
  position: fixed;
  top: 1.3rem;
  left: 1.6667rem;
  width: 8rem; }
  @media (min-width: 768px) {
    .site-waiting-logo {
      display: none; } }

.site-waiting-text {
  position: fixed;
  top: -webkit-calc(1.6667rem + 4rem);
  top: -moz-calc(1.6667rem + 4rem);
  top: calc(1.6667rem + 4rem);
  left: 1.6667rem; }
  @media (min-width: 768px) {
    .site-waiting-text {
      display: none; } }

.waiting-news-website {
  position: absolute;
  font-family: "GeistMono-UltraLight";
  font-size: 1.2rem;
  text-align: right;
  text-transform: uppercase; }
  .waiting-news-website--xxs {
    top: 2rem;
    right: 1.6667rem;
    text-align: right; }
    @media (min-width: 768px) {
      .waiting-news-website--xxs {
        display: none; } }
  .waiting-news-website--md {
    display: none;
    position: fixed;
    top: 1.2rem;
    right: 3rem; }
    @media (min-width: 768px) {
      .waiting-news-website--md {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex; } }

.waiting-media {
  position: relative;
  padding-top: 100%;
  max-height: 100%;
  overflow: hidden; }
  @media (min-width: 768px) {
    .waiting-media {
      padding-top: 0;
      height: -webkit-calc(100vh - 4.333em);
      height: -moz-calc(100vh - 4.333em);
      height: calc(100vh - 4.333em);
      height: -webkit-calc(var(--vh, 1vh) * 100 - 4.333em);
      height: -moz-calc(var(--vh, 1vh) * 100 - 4.333em);
      height: calc(var(--vh, 1vh) * 100 - 4.333em); } }
  @media (min-width: 768px) and (min-width: 768px) {
    .waiting-media {
      height: -webkit-calc(100vh - 6rem);
      height: -moz-calc(100vh - 6rem);
      height: calc(100vh - 6rem);
      height: -webkit-calc(var(--vh, 1vh) * 100 - 8rem - 178.5px);
      height: -moz-calc(var(--vh, 1vh) * 100 - 8rem - 178.5px);
      height: calc(var(--vh, 1vh) * 100 - 8rem - 178.5px); } }
  .waiting-media .vp {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.about-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  height: -webkit-calc(var(--vh, 1vh) * 100);
  height: -moz-calc(var(--vh, 1vh) * 100);
  height: calc(var(--vh, 1vh) * 100);
  height: 100svh;
  max-height: 100%;
  opacity: 0;
  -webkit-transition: 0.3s linear opacity;
  -o-transition: 0.3s linear opacity;
  -moz-transition: 0.3s linear opacity;
  transition: 0.3s linear opacity;
  z-index: -1; }
  @media (min-width: 768px) {
    .about-modal {
      height: -webkit-calc(100vh - 178.5px);
      height: -moz-calc(100vh - 178.5px);
      height: calc(100vh - 178.5px);
      height: -webkit-calc(var(--vh, 1vh) * 100  - 178.5px);
      height: -moz-calc(var(--vh, 1vh) * 100  - 178.5px);
      height: calc(var(--vh, 1vh) * 100  - 178.5px);
      height: -webkit-calc(100svh - 178.5px);
      height: -moz-calc(100svh - 178.5px);
      height: calc(100svh - 178.5px); } }
  .about-modal__logo--xxs {
    position: fixed;
    top: 1.3rem;
    left: 1.6667rem;
    width: 8rem;
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    z-index: 2; }
    @media (min-width: 768px) {
      .about-modal__logo--xxs {
        display: none; } }
  .about-modal__logo--md {
    display: none;
    position: fixed;
    top: 1.3rem;
    left: 1.6667rem;
    -webkit-transition: 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
    transition: 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
    -o-transition: 0.3s linear background, -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
    -moz-transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background, -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
    transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background;
    transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1); }
    @media (min-width: 768px) {
      .about-modal__logo--md {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        top: 2.5rem;
        left: 3rem; } }
    .about-modal__logo--md img {
      position: absolute;
      top: 0;
      left: 0;
      height: 25px;
      width: auto;
      -webkit-transition: 0.3s linear opacity;
      -o-transition: 0.3s linear opacity;
      -moz-transition: 0.3s linear opacity;
      transition: 0.3s linear opacity; }
  .about-modal__inner {
    height: 100%;
    max-height: 100%;
    padding-top: 7rem;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    scrollbar-width: none; }
    .about-modal__inner::-webkit-scrollbar {
      display: none; }
    @media (min-width: 768px) {
      .about-modal__inner {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        align-items: center; } }
  @media (min-width: 768px) {
    .about-modal__text--xxs {
      display: none; } }
  .about-modal__text--md {
    display: none; }
    @media (min-width: 768px) {
      .about-modal__text--md {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex; } }
    .about-modal__text--md .col {
      margin-bottom: 0; }
      @media (min-width: 1024px) {
        .about-modal__text--md .col {
          padding: 0 3rem; } }
  .about-modal .about-modal__empty {
    display: none; }
    @media (min-width: 1024px) {
      .about-modal .about-modal__empty {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex; } }

.intro-logos {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: -webkit-calc(100% - 178.5px);
  height: -moz-calc(100% - 178.5px);
  height: calc(100% - 178.5px);
  z-index: 3;
  -webkit-transition: 0.3s linear all;
  -o-transition: 0.3s linear all;
  -moz-transition: 0.3s linear all;
  transition: 0.3s linear all; }
  @media (min-width: 768px) {
    .intro-logos {
      top: 8rem;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex; } }
  .intro-logos__item {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: clamp(280px, 33.3vw, 400px);
    width: 100%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    opacity: 0;
    -webkit-transition: 0.3s linear opacity;
    -o-transition: 0.3s linear opacity;
    -moz-transition: 0.3s linear opacity;
    transition: 0.3s linear opacity; }
    @media (min-width: 768px) {
      .intro-logos__item {
        max-width: clamp(400px, 33.3vw, 600px); } }
    @media (min-width: 1024px) {
      .intro-logos__item {
        max-width: clamp(500px, 33.3vw, 600px); } }
    .intro-logos__item:first-child {
      opacity: 1; }

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 4.333em;
  -webkit-transition: 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -o-transition: 0.3s linear background, -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -moz-transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background, -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background;
  transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1); }
  @media (min-width: 768px) {
    .site-header {
      height: 6rem; } }

.page-title {
  display: none;
  position: fixed;
  left: 0;
  top: 1.6667rem;
  width: 100%;
  font-size: 1rem;
  font-family: "GeistMono-Regular";
  text-align: center;
  color: #000;
  -webkit-transition: 0.3s linear filter, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear filter, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -o-transition: 0.3s linear filter, -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -moz-transition: 0.3s linear filter, transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear filter, transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear filter, transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1); }
  @media (min-width: 768px) {
    .page-title {
      top: 3rem;
      padding-right: -webkit-calc(14.33rem + 1rem);
      padding-right: -moz-calc(14.33rem + 1rem);
      padding-right: calc(14.33rem + 1rem);
      font-family: "GeistMono-Light";
      text-align: right; }
      .page-title a {
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%); } }

.site-logo {
  position: fixed;
  top: 1.3rem;
  left: 1.6667rem;
  -webkit-transition: 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -o-transition: 0.3s linear background, -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -moz-transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background, -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background;
  transition: transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), 0.3s linear background, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1); }
  @media (min-width: 768px) {
    .site-logo {
      top: 2.5rem;
      left: 3rem; } }
  .site-logo img {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: auto;
    -webkit-transition: 0.3s linear opacity;
    -o-transition: 0.3s linear opacity;
    -moz-transition: 0.3s linear opacity;
    transition: 0.3s linear opacity; }

.menu-toggle {
  position: fixed;
  top: 1.3rem;
  right: 1.6667rem;
  width: 1.33rem;
  height: 1.33rem;
  line-height: 0;
  -webkit-transition: 0.3s linear filter, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear filter, -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -o-transition: 0.3s linear filter, -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  -moz-transition: 0.3s linear filter, transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear filter, transform 1.5s cubic-bezier(0.35, 1, 0.45, 1);
  transition: 0.3s linear filter, transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -webkit-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -moz-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1), -o-transform 1.5s cubic-bezier(0.35, 1, 0.45, 1); }
  @media (min-width: 768px) {
    .menu-toggle {
      top: 1.6667rem;
      width: 1rem;
      height: 1rem; } }
  @media (min-width: 768px) {
    .menu-toggle {
      top: 3rem;
      right: 3rem; } }
  .menu-toggle svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: .3s linear all;
    -o-transition: .3s linear all;
    -moz-transition: .3s linear all;
    transition: .3s linear all; }
    .menu-toggle svg.burger {
      opacity: 1; }
    .menu-toggle svg.close {
      opacity: 0; }
  .menu-toggle.active .burger {
    opacity: 0; }
  .menu-toggle.active .close {
    opacity: 1; }

.site-menu {
  position: fixed;
  top: 0rem;
  right: 0;
  height: 100%;
  max-height: 100%;
  width: 100%;
  padding: 6rem 1.6667rem 0;
  -webkit-transform: translate3d(100%, 0, 0);
  -moz-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
  background-color: #f4f6f1;
  -webkit-transition: 0.3s ease-in transform, .3s linear background-color;
  -o-transition: 0.3s ease-in transform, .3s linear background-color;
  -moz-transition: 0.3s ease-in transform, .3s linear background-color;
  transition: 0.3s ease-in transform, .3s linear background-color; }
  .site-menu--active {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: 0.3s ease-out transform, .3s linear background-color;
    -o-transition: 0.3s ease-out transform, .3s linear background-color;
    -moz-transition: 0.3s ease-out transform, .3s linear background-color;
    transition: 0.3s ease-out transform, .3s linear background-color; }
  @media (min-width: 576px) {
    .site-menu {
      width: auto; } }
  @media (min-width: 768px) {
    .site-menu {
      padding: 8rem 3rem 0; } }
  .site-menu__list {
    height: 100%;
    max-height: 100%;
    padding-top: 3rem;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    scrollbar-width: none;
    z-index: 2; }
    .site-menu__list::-webkit-scrollbar {
      display: none; }
    @media (min-width: 576px) {
      .site-menu__list {
        padding-top: 0; } }
  .site-menu__item {
    margin-bottom: 3rem;
    color: #707070;
    -webkit-transition: 0.3s linear color;
    -o-transition: 0.3s linear color;
    -moz-transition: 0.3s linear color;
    transition: 0.3s linear color; }
    .site-menu__item--active {
      color: #000; }
    @media (min-width: 576px) {
      .site-menu__item {
        text-align: right;
        margin-bottom: 2rem; } }

.home-hero {
  height: 100vw;
  max-height: 100%;
   
  opacity: 0;
/*  transition: opacity 1.2s ease-in;*/
  animation: fadeInHomeHero 0.1s ease-in forwards 1.1s; /* Délai de 5 secondes avant l'affichage */
}

@keyframes fadeInHomeHero {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

  @media (orientation: landscape) {
    .home-hero {
      height: 100vh;
      height: -webkit-calc(var(--vh, 1vh) * 100);
      height: -moz-calc(var(--vh, 1vh) * 100);
      height: calc(var(--vh, 1vh) * 100);
      height: 100svh; } }

.home-infos {
  z-index: 3; }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    max-height: 100%;
    -webkit-transform: translate3d(0, -webkit-calc(100% - 5.6667rem), 0);
    -moz-transform: translate3d(0, -moz-calc(100% - 5.6667rem), 0);
    transform: translate3d(0, calc(100% - 5.6667rem), 0);
    -webkit-transition: 0.3s ease-in transform;
    -o-transition: 0.3s ease-in transform;
    -moz-transition: 0.3s ease-in transform;
    transition: 0.3s ease-in transform; } }
  .home-infos__inner {
    position: relative;
    height: 100%;
    max-height: 100%;
    padding-top: 3rem;
    background-color: #f4f6f1;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    scrollbar-width: none; }
    .home-infos__inner::-webkit-scrollbar {
      display: none; }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos__inner {
    height: -webkit-calc(100%);
    height: -moz-calc(100%);
    height: calc(100%);
    padding-top: 0; } }
  .home-infos__arrow-container {
    display: none; }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos__arrow-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    padding: 2.6rem 1rem; } }
  .home-infos__arrow {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg); }
    .home-infos__arrow svg {
      width: 1rem;
      height: .6667rem;
      stroke: #000; }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos__about {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; } }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos__about-inner {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center; } }
  .home-infos__about-text {
    margin-bottom: 5rem;
    width: 100%; }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos__about-text {
    width: 50%;
    min-width: 0;
    margin-bottom: 0;
    padding-bottom: 5rem; } }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos__about-text p {
    max-width: 30rem;
    width: 100%;
    margin-left: auto;
    margin-right: auto; } }
  .home-infos .site-infos {
    text-align: right; }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos .site-infos {
    width: 100%;
    text-align: left; } }
    .home-infos .site-infos h2 {
      margin-bottom: .6667rem; }
    .home-infos .site-infos__part {
      margin-bottom: 3rem; }

@media (min-width: 1024px) and (orientation: landscape) {
  .home-infos .site-infos__part {
    margin-bottom: 0; } }

@media (min-width: 1024px) and (orientation: landscape) {
  body.infos-opened .home-infos {
    -webkit-transition: 0.3s ease-out transform;
    -o-transition: 0.3s ease-out transform;
    -moz-transition: 0.3s ease-out transform;
    transition: 0.3s ease-out transform; } }

@media (min-width: 1024px) and (orientation: landscape) {
  body.infos-opened .home-infos__arrow-container {
    display: none; } }

.site-infos {
  position: relative; }

@media (min-width: 1024px) and (orientation: landscape) {
  .site-infos {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 2.6rem; } }

@media (min-width: 1024px) and (orientation: landscape) {
  .site-infos .col {
    width: auto;
    max-width: 100%;
    min-width: auto; } }
  .site-infos__part {
    margin-bottom: 2rem; }
  .site-infos__staff {
    position: relative; }
    .site-infos__staff-email {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0; }
    .site-infos__staff:hover .site-infos__staff-name {
      opacity: 0;
      z-index: -1; }
    .site-infos__staff:hover .site-infos__staff-email {
      opacity: 1; }
  .site-infos h2 {
    font-family: "GeistMono-UltraBlack";
    margin-bottom: 1.25rem; }
  .site-infos p {
    margin-bottom: 1.25rem; }

.layout .col {
  margin-bottom: 1.6667rem; }
  @media (min-width: 768px) {
    .layout .col {
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin-bottom: 1rem; } }
  .layout .col:first-child .layout__text {
    margin-bottom: 2.6667rem; }
    @media (min-width: 768px) {
      .layout .col:first-child .layout__text {
        margin-bottom: 0; } }

.layout .col.invert-order:first-child {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
  -moz-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2; }
  @media (min-width: 768px) {
    .layout .col.invert-order:first-child {
      -webkit-box-ordinal-group: 2;
      -webkit-order: 1;
      -moz-box-ordinal-group: 2;
      -ms-flex-order: 1;
      order: 1; } }
  .layout .col.invert-order:first-child .layout__text {
    margin-bottom: 0; }

.layout .col.invert-order:nth-child(2) {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -moz-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1; }
  @media (min-width: 768px) {
    .layout .col.invert-order:nth-child(2) {
      -webkit-box-ordinal-group: 3;
      -webkit-order: 2;
      -moz-box-ordinal-group: 3;
      -ms-flex-order: 2;
      order: 2; } }
  .layout .col.invert-order:nth-child(2) .layout__text {
    margin-bottom: 2.6667rem; }
    @media (min-width: 768px) {
      .layout .col.invert-order:nth-child(2) .layout__text {
        margin-bottom: 0; } }

.layout .xxs-col-4 {
  margin-bottom: 1rem; }
  .layout .xxs-col-4:nth-child(odd) {
    padding-right: .5rem; }
  .layout .xxs-col-4:nth-child(even) {
    padding-left: .5rem; }
  .layout .xxs-col-4 .layout__media {
    padding-top: 25vw; }
    @media (min-width: 768px) {
      .layout .xxs-col-4 .layout__media {
        height: 15vw;
        padding-top: 0; } }
  .layout .xxs-col-4:last-child {
    margin-bottom: 1.6667rem; }
    @media (min-width: 768px) {
      .layout .xxs-col-4:last-child {
        margin-bottom: 1rem; } }

.layout__media {
  position: relative;
  padding-top: 50vw;
  overflow: hidden; }
  @media (min-width: 768px) {
    .layout__media {
      height: 30vw;
      padding-top: 0; } }
  .layout__media:hover .layout__title {
    color: #2A2A2A; }
  .layout__media:hover .layout__cache {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: 0.3s ease-out transform;
    -o-transition: 0.3s ease-out transform;
    -moz-transition: 0.3s ease-out transform;
    transition: 0.3s ease-out transform; }

.layout__text {
  width: 100%; }
  @media (min-width: 768px) {
    .layout__text {
      -webkit-align-content: center;
      -ms-flex-line-pack: center;
      align-content: center;
      padding-top: 4.333rem;
      padding-bottom: 4.333rem; } }
  .layout__text h3 {
    font-family: "GeistMono-Black";
    font-size: 1.06rem;
    line-height: 1.2; }
    @media (min-width: 768px) {
      .layout__text h3 {
        font-size: 1.2rem; } }
  .layout__text h4 {
    width: 100%;
    font-family: "GeistMono-UltraLight";
    font-size: .93rem;
    line-height: 1.2;
    margin-bottom: .5rem; }
    @media (min-width: 768px) {
      .layout__text h4 {
        font-size: 1.2rem; } }
  .layout__text h3 {
    width: 100%; }
    .layout__text h3:first-child {
      margin-bottom: 1rem; }
  .layout__text p {
    width: 100%;
    margin-bottom: 1rem; }
    .layout__text p:last-child {
      margin-bottom: 0; }

.layout__title {
  position: relative;
  padding: 1.6667rem;
  -webkit-transition: 0.3s linear color;
  -o-transition: 0.3s linear color;
  -moz-transition: 0.3s linear color;
  transition: 0.3s linear color;
  z-index: 2; }
  @media (min-width: 768px) {
    .layout__title {
      padding: .8rem 1rem; } }

.layout .lazy-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: none !important;
  -o-transition: none !important;
  -moz-transition: none !important;
  transition: none !important; }

.layout__cache {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #f4f6f1;
  -webkit-transform: translate3d(0, 100%, 0);
  -moz-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
  -webkit-transition: 0.3s ease-in transform;
  -o-transition: 0.3s ease-in transform;
  -moz-transition: 0.3s ease-in transform;
  transition: 0.3s ease-in transform;
  z-index: 1; }

.touch .layout__bottom--no-touch {
  display: none; }

.touch .layout__bottom--touch {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex; }

.touch .layout__bottom .layout__title {
  padding: .8rem 0 0; }

.no-touch .layout__bottom--no-touch {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%; }

.no-touch .layout__bottom--touch {
  display: none; }

.main-media {
  position: relative;
  padding-top: 56.25%;
  max-height: 100%;
  overflow: hidden; }
  .main-media__sentinel {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    z-index: -1; }
  @media screen and (orientation: landscape) {
    .main-media {
      padding-top: 0;
      height: -webkit-calc(100vh - 4.333em - 5rem);
      height: -moz-calc(100vh - 4.333em - 5rem);
      height: calc(100vh - 4.333em - 5rem);
      height: -webkit-calc(var(--vh, 1vh) * 100 - 4.333em - 5rem);
      height: -moz-calc(var(--vh, 1vh) * 100 - 4.333em - 5rem);
      height: calc(var(--vh, 1vh) * 100 - 4.333em - 5rem); } }
  @media screen and (orientation: landscape) and (min-width: 768px) {
    .main-media {
      height: -webkit-calc(100vh - 6rem - 5rem);
      height: -moz-calc(100vh - 6rem - 5rem);
      height: calc(100vh - 6rem - 5rem);
      height: -webkit-calc(var(--vh, 1vh) * 100 - 6rem - 5rem);
      height: -moz-calc(var(--vh, 1vh) * 100 - 6rem - 5rem);
      height: calc(var(--vh, 1vh) * 100 - 6rem - 5rem); } }
  .main-media .vp {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.project-infos {
  width: 100%;
  background-color: #f4f6f1;
  color: #000;
  -webkit-transition: .3s linear all;
  -o-transition: .3s linear all;
  -moz-transition: .3s linear all;
  transition: .3s linear all;
  z-index: 1; }
  .project-infos__header {
    padding-top: 1.6667rem;
    padding-bottom: 1.6667rem; }
  .project-infos .title-1 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  .project-infos .landscape-title {
    display: none; }
    @media (orientation: landscape) {
      .project-infos .landscape-title {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex; } }
  .project-infos .scroll-to {
    display: none;
    margin-left: 1rem;
    width: 3rem; }
    @media (min-width: 768px) {
      .project-infos .scroll-to {
        display: block; } }
  .project-infos__content-inner {
    padding-top: 1.6667rem;
    padding-bottom: 1.6667rem; }
    @media (min-width: 768px) {
      .project-infos__content-inner {
        padding-top: 1.333rem; } }
  .project-infos__credits {
    margin-bottom: 3rem; }
    @media (min-width: 768px) {
      .project-infos__credits {
        margin-bottom: 0; } }
  .project-infos__credit {
    margin-bottom: 1.33rem; }
  .project-infos__text--fr {
    margin-bottom: 2rem; }
    @media (min-width: 768px) {
      .project-infos__text--fr {
        margin-bottom: 0; } }
  .project-infos__text--en {
    color: #959595; }
  .project-infos__menu {
    width: 100%;
    max-width: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center; }
    @media (min-width: 1024px) {
      .project-infos__menu {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        overflow: scroll;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: none;
        scrollbar-width: none;
        z-index: 2; }
        .project-infos__menu::-webkit-scrollbar {
          display: none; } }
  .project-infos__menu-item {
    margin-bottom: 1rem;
    color: #7B7B7B; }
    @media (min-width: 1024px) {
      .project-infos__menu-item {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 auto;
        -moz-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        margin-bottom: 0;
        margin-right: 2rem; } }
    .project-infos__menu-item:last-child {
      margin-right: 0; }
    .project-infos__menu-item--active {
      color: #fff; }
  .project-infos .layout {
    margin-top: 2.6667rem; }

.collapsible__section {
  display: none;
  overflow: hidden;
  -webkit-transition: height .4s ease-out;
  -o-transition: height .4s ease-out;
  -moz-transition: height .4s ease-out;
  transition: height .4s ease-out;
  height: auto;
  max-height: -webkit-calc(100vh - 6rem - 5rem);
  max-height: -moz-calc(100vh - 6rem - 5rem);
  max-height: calc(100vh - 6rem - 5rem);
  max-height: -webkit-calc(var(--vh, 1vh) * 100 - 6rem - 5rem);
  max-height: -moz-calc(var(--vh, 1vh) * 100 - 6rem - 5rem);
  max-height: calc(var(--vh, 1vh) * 100 - 6rem - 5rem);
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  .collapsible__section::-webkit-scrollbar {
    display: none; }

.showreel-menu {
  position: fixed;
  top: 8rem;
  height: -webkit-calc(100vh - 8rem);
  height: -moz-calc(100vh - 8rem);
  height: calc(100vh - 8rem);
  height: -webkit-calc(var(--vh, 1vh) * 100 - 8rem);
  height: -moz-calc(var(--vh, 1vh) * 100 - 8rem);
  height: calc(var(--vh, 1vh) * 100 - 8rem);
  max-height: 100%;
  left: 0;
  width: 100%;
  max-width: 100%;
  padding: 0 1.6667rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
  z-index: 2; }
  .showreel-menu::-webkit-scrollbar {
    display: none; }
  @media (min-width: 768px) {
    .showreel-menu {
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
      -moz-box-pack: start;
      -ms-flex-pack: start;
      justify-content: flex-start;
      -webkit-box-align: start;
      -webkit-align-items: flex-start;
      -moz-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      padding: 0 3rem;
      text-align: left; } }
  .showreel-menu__inner {
    width: 100%; }
  .showreel-menu__item {
    color: #B8B8B8;
    -webkit-transition: .3s linear all;
    -o-transition: .3s linear all;
    -moz-transition: .3s linear all;
    transition: .3s linear all; }
    .showreel-menu__item.active, .showreel-menu__item:hover {
      color: #fff; }

.about-text__content {
  margin-bottom: 5rem; }
  @media (min-width: 1024px) {
    .about-text__content {
      position: -webkit-sticky;
      position: sticky;
      top: -webkit-calc(6rem + 5rem);
      top: -moz-calc(6rem + 5rem);
      top: calc(6rem + 5rem); } }

.about-text__empty-col {
  display: none; }
  @media (min-width: 1024px) {
    .about-text__empty-col {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex; } }

.about-text .site-infos {
  margin-bottom: 0; }

body:not(.waiting-page) .home .header-offset {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: -webkit-calc(100vh);
  height: -moz-calc(100vh);
  height: calc(100vh);
  height: -webkit-calc(var(--vh, 1vh) * 100);
  height: -moz-calc(var(--vh, 1vh) * 100);
  height: calc(var(--vh, 1vh) * 100); }
  @media (min-width: 768px) {
    body:not(.waiting-page) .home .header-offset {
      height: -webkit-calc(100vh);
      height: -moz-calc(100vh);
      height: calc(100vh);
      height: -webkit-calc(var(--vh, 1vh) * 100);
      height: -moz-calc(var(--vh, 1vh) * 100);
      height: calc(var(--vh, 1vh) * 100); } }

.showreels-player {
  position: relative;
  overflow-y: scroll;
  -webkit-scroll-snap-type: y mandatory;
  -ms-scroll-snap-type: y mandatory;
  scroll-snap-type: y mandatory; }
  .showreels-player__item {
    position: relative;
    height: 100svw;
    scroll-snap-align: start; }
    @media (orientation: landscape) {
      .showreels-player__item {
        height: 100%; } }
  .showreels-player__item-title {
    position: absolute;
    bottom: 1.6667rem;
    left: 1.6667rem;
    z-index: 2; }
    @media (min-width: 768px) {
      .showreels-player__item-title {
        bottom: 3rem;
        left: 3rem; } }

.single-project .layout .grid {
  margin-bottom: 2.6667rem; }
  @media (min-width: 768px) {
    .single-project .layout .grid {
      margin-bottom: 0; } }

.single-project .project-infos__header {
  display: none; }
  @media (orientation: landscape) {
    .single-project .project-infos__header {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex; } }

.single-project .portrait-title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 3rem;
  margin-bottom: 1.6667rem; }
  @media (orientation: landscape) {
    .single-project .portrait-title {
      display: none; } }

.single-showreel {
  background-color: #2A2A2A; }
  .single-showreel .project-infos,
  .single-showreel .vp__bottom-bar {
    background-color: #2A2A2A; }
  .single-showreel .vp.paused .vp__button svg {
    fill: #fff; }