.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

body {
  color: #333;
  font-family: Metropolis, sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 30px;
}

h3 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-family: Tj evolette a, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
}

p {
  color: #30302f;
  margin-bottom: 10px;
}

.wrapper {
  height: 100%;
  background-image: linear-gradient(#fff, rgba(255, 255, 255, 0) 50%), url('../images/Red-team-color.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 140px;
  padding-bottom: 160px;
  display: flex;
  position: relative;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.hero {
  z-index: 501;
  height: auto;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.color-background {
  width: 100%;
  height: 100%;
  opacity: 0;
  background-image: url('../images/Red-Team-NB.jpg');
  background-position: 50%;
  background-size: cover;
  position: absolute;
}

.body {
  font-family: Metropolis, sans-serif;
  font-weight: 400;
}

.button-red {
  z-index: 10;
  background-color: #30302f;
  border: 1px solid #30302f;
  border-radius: 8px;
  margin-top: 15px;
  padding-left: 35px;
  padding-right: 35px;
  transition: border-color .2s cubic-bezier(.55, .085, .68, .53), color .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53);
  position: relative;
}

.button-red:hover {
  color: #fff;
  background-color: #ee2d38;
  border-color: #ee2d38;
}

.button-red.small {
  background-color: #ee2d38;
  background-image: url('../images/Red-Team--Plan-de-travail-1_1.svg');
  background-position: 75px;
  background-repeat: no-repeat;
  background-size: 12px;
  border-color: #ee2d38;
  margin-left: 9px;
  padding: 5px 25px 5px 20px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53), border-color .2s cubic-bezier(.55, .085, .68, .53);
}

.button-red.small:hover {
  background-color: #30302f;
  border-color: #30302f;
}

.button-red.small.more {
  background-image: none;
  margin-top: 0;
  padding-right: 20px;
}

.button-red.small.more.center {
  width: 110px;
  color: #ee2d38;
  text-align: center;
  background-color: #fff;
  border-color: #fff;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53), border-color .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
}

.button-red.small.more.center:hover {
  background-color: rgba(255, 255, 255, .9);
  border-color: rgba(255, 255, 255, .9);
  transform: translate(0, -3px);
}

.button-red.small.more.center.fs {
  width: 150px;
  color: #fff;
  background-color: #ee2d38;
  border-color: #ee2d38;
  margin-bottom: 24px;
  transition: color .2s cubic-bezier(.55, .085, .68, .53), transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53), border-color .2s cubic-bezier(.55, .085, .68, .53);
}

.button-red.small.more.center.fs:hover {
  color: #000;
  background-color: #fff;
  border-color: #fff;
}

.button-red.small.more.center.fs.w--current {
  width: 240px;
}

.block-right {
  z-index: 500;
  width: 60%;
  background-color: #ee2d38;
  padding: 30px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
  transform: translate(100%);
}

.paragraph {
  color: #fff;
  font-weight: 300;
}

.paragraph.dark {
  color: #30302f;
}

.paragraph.small {
  margin-bottom: 5px;
  font-size: 13px;
  line-height: 22px;
}

.paragraph.white._70 {
  width: 70%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.wrapper-overflow {
  overflow: hidden;
}

.h1-red-team {
  color: #fff;
  margin-top: 0;
  margin-bottom: 18px;
  font-family: Tj evolette a, sans-serif;
  font-size: 34px;
}

.paragraph-2 {
  color: #000;
  text-align: center;
  margin-top: 5px;
  font-weight: 300;
}

.paragraph-2.right {
  color: #000;
  text-align: right;
  margin-top: 10px;
}

.paragraph-2.right.marge {
  margin-top: 25px;
}

.paragraph-2.right.marge.white {
  width: 70%;
  color: #fff;
  text-align: center;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
}

.paragraph-2.left {
  color: #000;
  text-align: left;
}

.paragraph-2.left.center {
  text-align: center;
}

.red {
  color: #ee2d38;
}

.psl {
  padding-top: 8rem;
  padding-bottom: 8rem;
  position: relative;
}

.container-image-psl {
  width: 430px;
  height: 430px;
  float: right;
  position: relative;
}

.columns {
  align-items: center;
  display: flex;
}

._1, ._2, ._3, ._4, ._5, ._6, ._7, ._8 {
  opacity: 0;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.container-text-spl {
  width: 100%;
}

.section-video {
  background-color: #f9f9f9;
  justify-content: center;
  align-items: center;
  padding-top: 100px;
  padding-bottom: 100px;
  display: flex;
  overflow: hidden;
}

.video {
  margin-left: auto;
  margin-right: auto;
}

.wrapper-video {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 2px 2px 20px rgba(48, 48, 47, .55);
}

.section-book {
  background-color: #f9f9f9;
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
  overflow: hidden;
}

.wrapper-text-book {
  width: 100%;
  text-align: right;
  flex-direction: column;
  align-items: flex-end;
  padding-top: 40px;
  padding-bottom: 100px;
  padding-right: 0;
  display: flex;
  position: relative;
}

.wrapper-text-book.align-left {
  text-align: left;
  align-items: flex-start;
}

.column-2 {
  padding-left: 0;
  padding-right: 0;
  position: static;
}

.column-2.margin {
  padding-right: 70px;
}

.column-flex-center {
  align-items: flex-end;
  display: flex;
}

.column-flex-center.real-nenuphar, .column-flex-center.ascenseur {
  align-items: center;
}

.text-span {
  color: #ee2d38;
  font-size: 25px;
}

.column-3 {
  justify-content: flex-end;
  display: flex;
}

.book {
  width: 50%;
  height: 100%;
  object-fit: cover;
  object-position: 0% 50%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.avatar {
  height: 320px;
  margin-bottom: 30px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.col-avatar {
  margin-top: 40px;
}

.h2-title-book {
  color: #30302f;
  font-family: Tj evolette a, sans-serif;
  font-size: 30px;
  line-height: 32px;
}

.h2-title-book.greyer {
  color: #6d6d6d;
}

.h2-title-book.greyer.small {
  color: #6d6d6d;
  text-align: center;
  margin-top: 0;
  font-size: 23px;
  line-height: 26px;
}

.h2-title-book.centre.slidetext {
  text-align: left;
  margin-top: 0;
  margin-bottom: 30px;
}

.h2-title-book.white-chanson {
  color: #fff;
}

.credit-schuiten {
  color: #fff;
  text-align: center;
  font-size: 11px;
  font-style: italic;
  line-height: 15px;
}

.credit-schuiten.dark {
  color: #30302f;
  margin-top: 10px;
}

.credit-schuiten.dark.vr {
  color: #6d6d6d;
  margin-bottom: 15px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 50%;
  right: auto;
  transform: translate(-50%);
}

.credit-schuiten.dark.vr.pn {
  margin: 30px auto 0;
  position: relative;
  left: 0%;
  transform: none;
}

.credit-schuiten.dark.vr.red {
  color: #f9f9f9;
}

.credit-schuiten.dark.vr.white {
  color: #fff;
  position: relative;
}

.credit-schuiten.dark.vr.relative {
  margin-top: 30px;
  margin-bottom: 0;
  position: relative;
}

.columns-2 {
  width: 100%;
  height: 100%;
  align-items: center;
  display: flex;
}

.mini-title {
  font-family: Tj evolette a, sans-serif;
}

.mini-title.red {
  color: #ee2d38;
}

.column-5 {
  padding-right: 70px;
}

.column-6 {
  height: 100%;
  flex-direction: column;
  justify-content: center;
  display: flex;
}

.column-flex-center-real {
  align-items: center;
  display: flex;
}

.column-flex-center-real.padding {
  padding-bottom: 50px;
}

.background-video {
  z-index: 100;
  width: 250px;
  height: 330px;
  margin-left: auto;
  margin-right: auto;
}

.slider {
  width: 100%;
  height: 370px;
  background-color: rgba(0, 0, 0, 0);
}

.slide-nav {
  display: none;
}

.slide {
  width: 100%;
  height: 100%;
}

.mask {
  width: 100%;
}

.lightbox-link {
  width: 100%;
  height: 330px;
}

.image-3 {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.arrow {
  color: #30302f;
  font-size: 14px;
}

.column-flex {
  flex-direction: column;
  justify-content: center;
  padding-right: 10px;
  display: flex;
}

.play {
  width: 40px;
  height: 40px;
  background-color: #ee2d38;
  background-image: url('../images/Red-Team--Plan-de-travail-1.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 40%;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  bottom: auto;
  left: 50%;
  right: auto;
  transform: translate(-50%, -50%);
}

.wrapper-lightbox {
  width: 100%;
  height: 100%;
  position: relative;
}

.section-cta {
  background-color: #ee2d38;
  background-image: url('../images/Red-Team--Plan-de-travail-1_3.svg'), linear-gradient(#dc0f2c, #ee2d38);
  background-position: 0 0, 0 0;
  background-size: 150px, auto;
  padding-top: 100px;
  padding-bottom: 100px;
}

.section-cta.black {
  background-color: #1b1b1b;
  background-image: linear-gradient(rgba(27, 27, 27, .74), rgba(27, 27, 27, .74)), url('../images/Red-Team--Plan-de-travail-1_3.svg');
  background-position: 0 0, 0 0;
  background-size: auto, 150px;
  justify-content: center;
  display: flex;
}

.instagram {
  z-index: 9999999;
  width: 50px;
  height: 50px;
  background-color: #dc0f2c;
  background-image: url('../images/instagram.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 26px 26px;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  position: fixed;
  top: auto;
  bottom: 40px;
  left: auto;
  right: 0%;
}

.vr-section {
  width: 100%;
  min-height: 180px;
  background-color: #f3f3f3;
  border-radius: 8px;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;
  padding: 30px;
  display: flex;
  position: relative;
}

.vr-section.premiere {
  margin-top: 50px;
  margin-bottom: 100px;
}

.cr-logo {
  width: 50px;
  height: 50px;
  margin: 15px 10px 8px 15px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.text-span-2 {
  color: #ee2d38;
  font-size: 12px;
  line-height: 30px;
}

.pnation-lightbox {
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  display: block;
}

.play-button {
  width: 30px;
  height: 30px;
  background-color: #ee2d38;
  background-image: url('../images/Red-Team--Plan-de-travail-1.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 40%;
  border-radius: 50%;
  margin: 20px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.pnation-card {
  width: 100%;
  min-height: 180px;
  background-color: #f3f3f3;
  border-radius: 8px;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  margin: 30px auto 0;
  padding: 30px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
  position: relative;
  box-shadow: 2px 2px 20px rgba(48, 48, 47, .15);
}

.pnation-card:hover {
  background-color: #f9f9f9;
}

.wrapper-text-ville-nenuphar {
  text-align: right;
  flex-direction: column;
  align-items: flex-end;
  padding-bottom: 35px;
  display: flex;
  position: relative;
}

.lightbox-vr {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
}

.lightbox-vr:hover {
  transform: translate(0, -3px);
}

.section-lagos {
  text-align: center;
  flex-direction: column;
  align-items: center;
  padding-top: 50px;
  display: flex;
}

.text-span-3, .text-span-4 {
  color: #ee2d38;
}

.image-card-light {
  width: 100%;
  min-height: 180px;
  background-color: #f3f3f3;
  border-radius: 8px;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  margin: 30px auto 25px;
  padding: 0;
  display: flex;
  position: relative;
  box-shadow: 2px 2px 20px rgba(48, 48, 47, .15);
}

.image-card-light-2 {
  width: 100%;
  height: 180px;
  object-fit: cover;
  background-color: #f3f3f3;
  border-radius: 8px;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 0;
  padding: 0;
  display: flex;
  position: relative;
}

.section-carnets {
  text-align: center;
  background-color: #f9f9f9;
  flex-direction: column;
  align-items: center;
  padding-top: 80px;
  padding-bottom: 80px;
  display: flex;
}

.lightbox-link-4 {
  text-decoration: none;
}

.text-span-5 {
  color: #ee2d38;
}

.book-2 {
  width: 50%;
  height: 100%;
  object-fit: cover;
  object-position: 0% 50%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.column-flex-articles {
  align-items: flex-start;
  display: flex;
}

.column-flex-cartes {
  align-items: center;
  display: flex;
}

.book-nenuphar {
  height: 100%;
  object-fit: cover;
}

.book-ascenseur {
  padding-left: 40px;
}

.musique {
  width: 60%;
  color: #fff;
  text-align: center;
  background-color: #ee2d38;
  background-image: url('../images/Red-Team--Plan-de-travail-1_3.svg');
  background-position: 0 0;
  background-size: auto;
  border-radius: 8px;
  margin-left: auto;
  margin-right: auto;
  padding: 40px;
  text-decoration: none;
  transition: box-shadow .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
  box-shadow: 2px 2px 10px rgba(48, 48, 47, .6);
}

.musique:hover {
  box-shadow: 7px 7px 20px rgba(48, 48, 47, .36);
}

.div-block-4 {
  width: 50px;
  height: 50px;
  background-color: #fff;
  background-image: url('../images/5fd0ad6ff788d611165c5057_Red-Team--Plan-de-travail-1.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 50%;
  border-radius: 50%;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
}

.wrapper-musique {
  background-image: url('../images/Logo---Triangle-rouge.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
}

.bold-text-2 {
  color: #ee2d38;
}

.image-card-pirate {
  width: 100%;
  height: 220px;
  object-fit: cover;
  object-position: 50% 0%;
  background-color: #f3f3f3;
  border-radius: 8px;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 0;
  padding: 0;
  display: flex;
  position: relative;
}

.bold-text-3 {
  color: #30302f;
  font-weight: 400;
  text-decoration: none;
}

.link-6 {
  text-decoration: none;
}

.section {
  padding-top: 6rem;
  padding-bottom: 6rem;
  position: relative;
  overflow: hidden;
}

.section.black {
  min-height: 100vh;
  justify-content: center;
  align-items: center;
  padding-top: 140px;
  padding-bottom: 140px;
  display: flex;
  position: relative;
  overflow: hidden;
}

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

.section.black-gradient {
  min-height: 100vh;
  background-color: #070a13;
  background-image: linear-gradient(rgba(255, 255, 255, 0) 65%, #070a13), linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5)), radial-gradient(circle, #1d1211, #322726 50%, #070a13);
  justify-content: center;
  align-items: center;
  padding-top: 140px;
  padding-bottom: 140px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.section.black-gradient.decouvrir {
  background-image: linear-gradient(rgba(0, 0, 0, 0) 65%, #070a13), linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5)), radial-gradient(circle, #1d1211, #322726 50%, #070a13);
  padding-top: 160px;
  display: block;
}

.section.black-gradient.mentions {
  padding-top: 180px;
}

.section.no-padding-top {
  padding-top: 0;
}

.section.smoke {
  background-image: url('../images/smoke-2.png');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: auto;
}

.section.soldat-du-futur-section {
  background-image: url('../images/BG-grey.jpg'), url('../images/tente-1.jpg');
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat, no-repeat;
  background-size: 56%, 40%;
}

.section.safe-sphere-section {
  text-align: center;
  background-image: url('../images/tente-1.png');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 30%;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 0;
  display: flex;
}

.section.no-overflow {
  overflow: visible;
}

.section.verification-individus {
  background-image: url('../images/tente-1.png');
  background-position: 0 300px;
  background-repeat: no-repeat;
  background-size: 30%;
}

.section.hyperoverflow {
  padding-top: 80px;
}

.section.first {
  padding-top: 80px;
  padding-bottom: 0;
}

.section.first-s0 {
  padding-top: 180px;
  padding-bottom: 100px;
}

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

.section.carte {
  height: 450px;
  align-items: center;
  display: flex;
}

.section.grey {
  background-color: #f9f9f9;
}

.section.chimiquier {
  height: 450px;
  align-items: center;
  display: flex;
}

.section.chronique {
  padding-top: 150px;
}

.section.black {
  min-height: 100vh;
  background-color: #070a13;
  justify-content: center;
  align-items: center;
  padding-top: 140px;
  padding-bottom: 140px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.section.black-s2 {
  min-height: 100vh;
  justify-content: center;
  align-items: center;
  padding-top: 140px;
  padding-bottom: 140px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.section.first-s02 {
  color: #e6e7e8;
  background-color: #071c1d;
  flex-direction: column;
  align-items: center;
  padding-top: 10rem;
  padding-bottom: 8rem;
  display: flex;
}

.section.no-padding {
  padding-top: 0;
  padding-bottom: 0;
}

.section.no-padding.metagram {
  background-color: #1a1107;
  background-image: url('../images/Ville-souterraine.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.section.no-margin-bottom {
  padding-bottom: 0;
}

.section.dark-ecosysteme {
  color: #fff;
  background-color: #071c1d;
}

.section.no-margin-top {
  padding-top: 0;
}

.section.prefooter {
  background-color: #070a13;
  border-bottom: 1px solid rgba(255, 255, 255, .15);
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.section.grey-dark {
  min-height: 85vh;
  background-color: #e7e7e7;
}

.section.first-s02-2 {
  color: #e6e7e8;
  background-color: #1a1107;
  flex-direction: column;
  align-items: center;
  padding-top: 10rem;
  padding-bottom: 8rem;
  display: flex;
}

.section.first-s03 {
  color: #e6e7e8;
  background-color: #071c1d;
  background-image: radial-gradient(circle, #0f172a 17%, #060d1f);
  flex-direction: column;
  align-items: center;
  padding-top: 10rem;
  padding-bottom: 8rem;
  display: flex;
}

.section.dark-grey {
  color: #fff;
  background-color: #1c2435;
  overflow: visible;
}

.section.dark-grey.no-padding.black {
  background-color: #010101;
}

.section.dark-grey.more-adding-top {
  padding-top: 8rem;
}

.section.light-grey {
  color: #fff;
  background-color: #20293d;
  overflow: visible;
}

.section.light-grey.lighter {
  background-color: #232e47;
}

.section.no-padding-top {
  padding-top: 0;
}

.section.no-padding-top.no-overflow-hidden {
  overflow: visible;
}

.section.no-padding.city {
  height: auto;
  padding-top: 0%;
}

.section.more-padding {
  padding-top: 9rem;
  padding-bottom: 9rem;
}

.section.s03-inner {
  color: #e6e7e8;
  background-color: #071c1d;
  background-image: radial-gradient(circle, #0f172a 17%, #060d1f);
  flex-direction: column;
  align-items: center;
  padding-top: 6rem;
  padding-bottom: 6rem;
  display: flex;
}

.soldier-1-home {
  height: 90%;
  position: absolute;
  top: 16%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.soldier-1-home.link {
  height: 140%;
  position: fixed;
  top: 74%;
  transform: translate(0, -50%);
}

.soldier-2-home {
  z-index: 1;
  height: 60%;
  opacity: .7;
  position: absolute;
  top: 24%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.soldier-3-home {
  height: 40%;
  position: absolute;
  top: 19%;
  bottom: auto;
  left: auto;
  right: 15%;
}

.soldier-3-home.link2 {
  width: 20%;
  height: auto;
  position: fixed;
  top: 50%;
  bottom: 0%;
  left: auto;
  right: 0%;
  transform: translate(0, -50%);
}

.soldier-4-home {
  height: 34%;
  position: absolute;
  top: 41%;
  bottom: auto;
  left: 31%;
  right: auto;
}

.triangle-home {
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.navbar-main {
  z-index: 999;
  height: 80px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.navbar-main.dropshadow {
  z-index: 999;
  background-color: rgba(0, 0, 0, 0);
  position: absolute;
}

.triangle-home-2 {
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.container {
  z-index: 10;
  width: 100%;
  max-width: 960px;
  min-height: 20px;
  justify-content: space-between;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
}

.container.center {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  display: flex;
}

.container.padding-inside {
  padding-left: 70px;
  padding-right: 70px;
}

.container.contpadding {
  padding-top: 80px;
  padding-bottom: 80px;
}

.container.not-relative {
  position: static;
}

.container.center-vertical {
  flex-direction: column;
  display: flex;
}

.container.center-vertical.zindex {
  z-index: 30;
}

.container.absolute-cont {
  text-align: left;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.container.metagram {
  max-width: 100%;
  background-color: rgba(0, 0, 0, .28);
}

.container.margin-top {
  margin-top: 6rem;
}

.navbar-menu {
  width: 100%;
  height: 80px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.menu-link {
  color: #fff;
  margin-right: 40px;
  font-size: 14px;
  font-weight: 300;
  line-height: 14px;
  text-decoration: none;
  transition: color .2s cubic-bezier(.55, .085, .68, .53);
}

.menu-link:hover {
  color: rgba(255, 255, 255, .8);
}

.menu-link.w--current {
  color: #dc0f2c;
}

.menu-link.dark {
  color: #000;
}

.menu-saison {
  align-items: center;
  display: flex;
}

.dropdown-toggle {
  color: #fff;
  background-color: #dc0f2c;
  padding: 13px 18px;
  font-family: Tj evolette a, sans-serif;
  display: flex;
}

.saison-1-dropdown {
  margin-left: 10px;
  margin-right: 10px;
  font-size: 14px;
  line-height: 14px;
}

.dropdown-saison {
  color: #fff;
  background-color: #81091a;
  justify-content: flex-end;
  padding-top: 13px;
  padding-bottom: 13px;
  padding-right: 32px;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.dropdown-saison:hover {
  background-color: #630412;
}

.dropdown-saison.w--current {
  color: #fff;
}

.border-red {
  width: 50%;
  height: .5px;
  opacity: .5;
  background-color: #dc0f2c;
  position: absolute;
  bottom: 1px;
  left: 0%;
  right: 0%;
}

.menu-home {
  z-index: 1;
  width: 80px;
  height: 80px;
  background-color: #fff;
  background-image: url('../images/5fc53369267f1cbd63307143_redteamlogo.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 80%;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.menu-home:hover {
  background-color: #e6e7e8;
}

.menu-home.inner {
  background-color: rgba(0, 0, 0, 0);
  margin-right: 30px;
  position: relative;
}

.overlay-noir {
  z-index: 2;
  background-image: linear-gradient(rgba(7, 10, 19, 0) 60%, #070a13);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.footer-red-team {
  z-index: 10;
  height: 80px;
  background-color: #070a13;
  border-top: 1px solid rgba(255, 255, 255, .1);
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.footer-red-team.absolute {
  background-color: rgba(0, 0, 0, 0);
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.menu-footer {
  color: #fff;
  font-size: 14px;
  line-height: 20px;
  text-decoration: none;
  transition: opacity .2s cubic-bezier(.55, .085, .68, .53);
}

.menu-footer:hover, .menu-footer.w--current {
  opacity: .8;
}

.border-red-bottom {
  z-index: 10;
  width: 25%;
  height: .5px;
  opacity: .5;
  background-color: #dc0f2c;
  position: absolute;
  top: auto;
  bottom: 130px;
  left: auto;
  right: 0%;
}

.menu-footer-legal {
  color: #fff;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 5px;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  text-decoration: none;
}

.wrapper-content-lightbox-home {
  z-index: 500;
  width: 27%;
  filter: grayscale();
  margin-left: auto;
  margin-right: auto;
}

.wrapper-menu-footer {
  align-items: center;
  display: flex;
}

.wrapper-menu-footer.darkone {
  justify-content: space-between;
  margin-top: 25px;
}

.voir-le-trailer {
  margin-top: 10px;
  font-size: 16px;
  line-height: 19px;
  text-decoration: none;
}

.play-button-trailer {
  width: 50px;
  height: 40px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.wrapper-home-all {
  z-index: 40;
  width: 100%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.not-the-trailer {
  width: 27%;
  margin-left: 25px;
  margin-right: 25px;
}

.wrapper-call-to-action-home {
  width: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  top: -35px;
}

.wrapper-call-to-action-home.nvx-pirates {
  margin-top: 25px;
  top: 0;
}

.wrapper-call-to-action-home.cxenter {
  justify-content: center;
}

.call-to-action-box {
  width: 310px;
}

.call-to-action-box.margin {
  margin-left: 30px;
  margin-right: 30px;
}

.h2-home {
  color: #fff;
  text-align: center;
  padding-left: 0;
  padding-right: 0;
  font-family: Tj evolette a, sans-serif;
  font-size: 16px;
  line-height: 19px;
}

.cta-home {
  width: 100%;
  color: #000;
  text-align: center;
  background-color: #ffd02f;
  margin-top: 15px;
  font-family: Tj evolette a, sans-serif;
  font-size: 18px;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-home:hover {
  background-color: rgba(255, 208, 47, .8);
  transform: translate(0, -3px);
}

.cta-home.blue {
  color: #fff;
  background-color: #1a4dff;
}

.cta-home.blue:hover {
  background-color: rgba(26, 77, 255, .8);
}

.cta-home.blue.insta {
  width: auto;
  font-size: 14px;
  line-height: 14px;
}

.cta-home.blue.insta.youtube {
  background-color: #dc0f2c;
}

.cta-home.inpage {
  width: auto;
  padding-left: 30px;
  padding-right: 30px;
}

.cta-home.inpage-blue {
  width: auto;
  color: #fff;
  background-color: #1a4dff;
  padding-left: 30px;
  padding-right: 30px;
}

.cta-home.red {
  color: #fff;
  background-color: #dc0f2c;
}

.cta-home.white {
  color: #dc0f2c;
  background-color: #fff;
}

.cta-home.white.opac {
  color: #f9f9f9;
  background-color: rgba(0, 0, 0, 0);
  background-image: linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  border: .5px solid #fff;
}

.cta-home.white.opac.web {
  background-image: url('../images/iconmonstr-globe-1.svg'), linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  background-position: 10%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: auto 40%, auto;
}

.cta-home.white.opac.youtube {
  background-image: url('../images/iconmonstr-youtube-6.svg'), linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  background-position: 10%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: auto 40%, auto;
}

.cta-home.white.opac.livre {
  background-image: url('../images/iconmonstr-book-16-48.png'), linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  background-position: 10%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: auto 40%, auto;
}

.cta-home.green {
  color: #fff;
  background-color: #00df84;
}

.cta-home.green:hover {
  background-color: rgba(0, 223, 132, .8);
}

.cta-home.green.small-en {
  font-size: 14px;
}

.cta-home.orange {
  width: 100%;
  color: #fff;
  background-color: #ffb13d;
}

.cta-home.orange:hover {
  background-color: rgba(255, 177, 61, .8);
}

.cta-home.orange.small-en {
  font-size: 14px;
}

.cta-home.pink {
  color: #000;
  background-color: #d09ac4;
}

.cta-home.pink:hover {
  background-color: rgba(208, 154, 196, .8);
}

.cta-home.purple {
  width: 100%;
  color: #fff;
  background-color: #8f00ff;
}

.cta-home.purple:hover {
  background-color: rgba(143, 0, 255, .8);
}

.wrapper-footer {
  justify-content: space-between;
  display: flex;
}

.heading-2-about {
  color: #fff;
  margin-top: 0;
  font-family: Tj evolette a, sans-serif;
  font-size: 16px;
  line-height: 24px;
}

.paragraphe.white {
  color: #fff;
}

.paragraphe.white.margin-bottom {
  margin-bottom: 40px;
}

.cta-red {
  width: 380px;
  color: #fff;
  background-color: #dc0f2c;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 20px;
  text-decoration: none;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.cta-red:hover {
  background-color: rgba(220, 15, 44, .8);
  transform: translate(0, -3px);
}

.cta-text-red {
  margin-left: 5px;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 23px;
}

.image-red-team {
  height: 460px;
  margin-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.wrapper-image-about {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.wrapper-text-abour {
  padding-left: 45px;
}

.columns-3 {
  align-items: center;
  display: flex;
}

.cta-more-info {
  color: #fff;
  text-align: center;
  margin-top: 15px;
  font-size: 11px;
  line-height: 18px;
}

.cta-red-404 {
  color: #fff;
  background-color: #dc0f2c;
  justify-content: center;
  margin-top: 25px;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 30px;
  text-decoration: none;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.cta-red-404:hover {
  background-color: rgba(220, 15, 44, .8);
  transform: translate(0, -3px);
}

.h2-s1 {
  width: 70%;
  color: #333;
  margin-bottom: 30px;
  font-family: Tj evolette a, sans-serif;
  font-size: 60px;
  line-height: 66px;
}

.h2-s1._100 {
  width: 100%;
}

.h2-s1._100.boxtile {
  width: auto;
}

.h2-s1._100.no-margin {
  margin-bottom: 0;
}

.h2-s1.full {
  width: 90%;
}

.h2-s1.full._100 {
  width: 100%;
  margin-bottom: 0;
}

.h2-s1.full.white {
  text-align: center;
}

.h2-s1.center-title {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.h2-s1.white {
  color: #fff;
}

.h2-s1.white.center {
  text-align: center;
}

.h2-s1.centersmall {
  width: 100%;
}

.h2-s1.no-margin-bottom {
  margin-bottom: 0;
}

.wrapper-section-roll {
  padding-top: 80px;
  padding-bottom: 80px;
  display: block;
  position: relative;
}

.wrapper-section-roll.padding {
  z-index: 2;
  padding-left: 70px;
}

.tank-image-article {
  width: 800px;
  height: 100%;
  background-image: linear-gradient(rgba(255, 255, 255, 0), #fff), url('../images/Tank.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-attachment: scroll, scroll;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.tank-overflow {
  width: 45%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
  overflow: hidden;
}

.column-no-padding {
  padding-left: 0;
  padding-right: 0;
}

.wrapper-nav-inner-left {
  align-items: center;
  display: flex;
}

.cta-arrow-text {
  margin-left: 10px;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  text-decoration: underline;
}

.cta-arrow-text.blue {
  color: #1a4dff;
}

.cta-arrow-text.white {
  color: #f9f9f9;
  color: #f9f9f9;
}

.cta-arrow-text.light {
  color: #fff;
}

.arrow-cta {
  width: 150px;
  height: 30px;
  color: #000;
  align-items: center;
  margin-top: 30px;
  padding-left: 30px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.arrow-cta.full {
  width: 250px;
}

.arrow-cta.full.armvie {
  width: auto;
  margin-top: 0;
  margin-right: 30px;
}

.arrow-cta.full.netam {
  width: auto;
  margin-top: 0;
  margin-bottom: 20px;
}

.arrow-cta.full.fren {
  width: 312px;
}

.arrow-cta.cartes {
  width: auto;
}

.arrow-cta-image {
  width: 30px;
  height: 30px;
  opacity: 1;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.arrow-cta-image.blue {
  opacity: 0;
}

.date {
  margin-right: 5px;
}

.wrapper-chronologie {
  margin-bottom: 45px;
}

.boat-article {
  z-index: 1;
  width: 50%;
  height: 100%;
  background-image: linear-gradient(#fff, rgba(255, 255, 255, 0)), url('../images/image.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-attachment: scroll, scroll;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.s1-h4 {
  width: 70%;
  margin-top: 30px;
  margin-bottom: 15px;
}

.missile {
  width: 60%;
  position: absolute;
  top: 4%;
  bottom: auto;
  left: 1%;
  right: auto;
}

.wrapper-bouclier-defensif {
  z-index: 2;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 80px;
  padding-bottom: 80px;
  display: flex;
  position: relative;
}

.paragraphe-70 {
  width: 80%;
}

.bouclier-overflow {
  width: 50%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 50%;
  right: 0%;
  overflow: hidden;
  transform: translate(-50%);
}

.bouclier-image-article {
  width: 100%;
  height: 100%;
  background-image: url('../images/img.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: scroll;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.overflow-white-bouclier {
  z-index: 1;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, .65) 30%, rgba(255, 255, 255, .9));
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.planes {
  width: 100px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 23%;
  right: auto;
}

.triangle {
  width: 200px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.triangle.opadoown {
  width: auto;
  height: 60%;
  opacity: .3;
  top: 16%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.missile-bouclier-defensif {
  width: 350px;
  position: absolute;
  top: -150px;
  bottom: auto;
  left: auto;
  right: 0%;
}

.triangle-small {
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.wrapper-hyperforteresse {
  height: 95vh;
  margin-top: 50px;
  position: relative;
}

.wrapper-animation-hyper {
  z-index: 1;
  position: relative;
}

.scenario-2, .scenario-3, .scenario-4, .scenario-5 {
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.wrapper-modal-hyper {
  z-index: 5;
  width: 400px;
  height: 150px;
  position: absolute;
  top: 100px;
  bottom: auto;
  left: auto;
  right: 100px;
}

.scenario-2-modal, .scenario-3-modal, .scenario-4-modal, .scenario-5-modal {
  position: absolute;
}

.wrapper-box-control {
  z-index: 10;
  width: 237px;
  background-color: #fff;
  flex-direction: column;
  padding: 30px;
  position: absolute;
  top: 100px;
  left: 100px;
  box-shadow: 2px 2px 10px rgba(48, 48, 47, .15);
}

.titre-box-hyperforteresse {
  font-family: Tj evolette a, sans-serif;
  font-size: 18px;
  line-height: 26px;
}

.titre-box-hyperforteresse.ruse {
  margin-bottom: 10px;
}

.titre-box-hyperforteresse.margin-bottom {
  margin-bottom: .5rem;
}

.bouton-attaque {
  width: 100%;
  color: #070a13;
  text-align: center;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #070a13;
  margin-top: 15px;
  padding-top: 13px;
  padding-bottom: 13px;
  font-family: Tj evolette a, sans-serif;
  font-size: 13px;
  line-height: 13px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53), border-color .2s cubic-bezier(.55, .085, .68, .53), color .2s cubic-bezier(.55, .085, .68, .53);
}

.bouton-attaque:hover, .bouton-attaque:focus {
  color: #fff;
  background-color: #dc0f2c;
  border-color: #dc0f2c;
}

.bouton-defense {
  width: 100%;
  color: #fff;
  text-align: center;
  background-color: #1a4dff;
  border: 1px solid #1a4dff;
  margin-top: 30px;
  padding-top: 13px;
  padding-bottom: 13px;
  font-family: Tj evolette a, sans-serif;
  font-size: 13px;
  line-height: 13px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53), color .2s cubic-bezier(.55, .085, .68, .53), border-color .2s cubic-bezier(.55, .085, .68, .53);
}

.bouton-defense:hover {
  color: #070a13;
  background-color: rgba(0, 0, 0, 0);
  border-color: #070a13;
}

.scenario-6 {
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.scenario-6-modal {
  position: absolute;
}

.wrapper-asernal-defense {
  z-index: 99999;
  opacity: 0;
  background-color: rgba(7, 10, 19, .9);
  padding-top: 100px;
  display: none;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.wrapper-detail-defense {
  width: 960px;
  height: 80%;
  color: #fff;
  background-color: #070a13;
  border-radius: 14px;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 45px 45px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: scroll;
}

.h4-s1.white {
  color: #fff;
  font-family: Tj evolette a, sans-serif;
  font-size: 24px;
  line-height: 24px;
}

.container-detail-defense {
  border-bottom: 1px solid rgba(255, 255, 255, .3);
  margin-top: 35px;
  padding-bottom: 35px;
}

.icones-armes-defense {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.icones-armes-defense.smaller {
  width: 40%;
}

.columns-armes-defense {
  align-items: center;
  display: flex;
}

.close-overlay-defense {
  position: absolute;
  top: 8%;
  bottom: auto;
  left: auto;
  right: 50px;
}

.wrapper-arrow-cta {
  position: relative;
}

.arriw-cta {
  position: absolute;
  top: 27px;
  bottom: auto;
  left: -18px;
  right: auto;
}

.wrapper-soldat-du-futur-article {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.visage-robot {
  height: 100%;
  opacity: 0;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
  transform: translate(-40px);
}

.soldat-futur-1 {
  height: 65%;
  opacity: 0;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
  transform: translate(40px);
}

.soldat-futur-2 {
  height: 35%;
  opacity: 0;
  position: absolute;
  top: auto;
  bottom: 5%;
  left: auto;
  right: 13%;
  transform: translate(40px);
}

.soldat-du-futur {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.wrapper-soldat-du-futur-more {
  position: relative;
}

.soldat-du-futur-wrapper {
  z-index: 5;
  width: 370px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.bubble-inside {
  width: 15px;
  height: 15px;
  float: right;
  background-color: #ee2d38;
  border-radius: 50%;
  position: relative;
}

.bubble-soldier {
  z-index: 5;
  width: 25px;
  height: 25px;
  float: right;
  background-color: rgba(238, 45, 56, .5);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 15.5%;
  bottom: 0%;
  left: 10%;
  right: auto;
}

.bubble-soldier.armement {
  top: 36%;
  bottom: auto;
  left: auto;
  right: 38%;
}

.bubble-soldier.visiere {
  top: 6%;
  bottom: auto;
  left: auto;
  right: 33%;
}

.bubble-soldier.casque {
  top: 3%;
  bottom: auto;
  left: auto;
  right: 45%;
}

.bubble-soldier.equipement {
  top: 24.5%;
  left: 47%;
}

.bubble-soldier.com {
  top: 46%;
  bottom: auto;
  left: auto;
  right: 21%;
}

.bubble-soldier.tenue {
  top: auto;
  bottom: 37%;
  left: 30%;
  right: auto;
}

.bubble-soldier.capeurs {
  top: 56%;
  bottom: auto;
  left: auto;
  right: 29%;
}

.spec-solider {
  background-color: #ee2d38;
  margin-top: 15px;
  margin-bottom: 10px;
  padding: 7px 5px 5px;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  display: inline-block;
}

.box-info-soldier-gantelet {
  z-index: 5;
  width: 300px;
  color: #fff;
  background-color: #2e3139;
  padding: 20px;
  display: block;
  position: absolute;
  top: 200px;
  bottom: auto;
  left: 0%;
  right: auto;
  box-shadow: 1px 1px 15px rgba(46, 49, 57, .35);
}

.box-info-soldier-visiere-casque, .box-info-soldier-coms {
  z-index: 5;
  width: 300px;
  color: #fff;
  background-color: #2e3139;
  padding: 20px;
  display: block;
  position: absolute;
  top: 200px;
  bottom: auto;
  left: auto;
  right: 0%;
  box-shadow: 1px 1px 15px rgba(46, 49, 57, .35);
}

.box-info-soldier-equipements, .box-info-soldier-capteurs {
  z-index: 5;
  width: 300px;
  color: #fff;
  background-color: #2e3139;
  padding: 20px;
  display: block;
  position: absolute;
  top: 200px;
  bottom: auto;
  left: 0%;
  right: auto;
  box-shadow: 1px 1px 15px rgba(46, 49, 57, .35);
}

.box-info-soldier-armement {
  z-index: 5;
  width: 300px;
  color: #fff;
  background-color: #2e3139;
  padding: 20px;
  display: block;
  position: absolute;
  top: 200px;
  bottom: auto;
  left: auto;
  right: 0%;
  box-shadow: 1px 1px 15px rgba(46, 49, 57, .35);
}

.box-info-soldier-casque {
  z-index: 5;
  width: 300px;
  color: #fff;
  background-color: #2e3139;
  padding: 20px;
  display: block;
  position: absolute;
  top: 200px;
  bottom: auto;
  left: 0%;
  right: auto;
  box-shadow: 1px 1px 15px rgba(46, 49, 57, .35);
}

.box-info-soldier-tenue {
  z-index: 5;
  width: 300px;
  color: #fff;
  background-color: #2e3139;
  padding: 20px;
  display: block;
  position: absolute;
  top: 200px;
  bottom: auto;
  left: auto;
  right: 0%;
  box-shadow: 1px 1px 15px rgba(46, 49, 57, .35);
}

.triangle-small-left {
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.line-red-left {
  width: 30%;
  height: 1px;
  background-color: #dc0f2c;
  position: absolute;
  top: 50%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.line-red-right {
  width: 20%;
  height: 1px;
  background-color: #dc0f2c;
  position: absolute;
  top: 27%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.wrapper-voir-equipement {
  z-index: 5;
  width: 30%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.survolez {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.arriw-cta-survol {
  width: 17px;
  margin-left: 20px;
  position: absolute;
  top: 20%;
  bottom: auto;
  left: -30px;
  right: auto;
}

.wrapper-cta-other-center {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.pero1 {
  width: 230px;
  position: absolute;
  top: 59%;
  bottom: auto;
  left: auto;
  right: 5%;
}

.pero2 {
  width: 230px;
  position: absolute;
  top: 10%;
  bottom: auto;
  left: auto;
  right: 3%;
}

.corbo1 {
  width: 80px;
  position: absolute;
  top: 3%;
  bottom: auto;
  left: 15%;
  right: auto;
}

.corbo2 {
  width: 120px;
  position: absolute;
  top: 34%;
  bottom: auto;
  left: 5%;
  right: auto;
}

.suivez-nous {
  color: #fff;
  text-align: center;
  background-color: #070a13;
  background-image: url('../images/Rectangle-40.png'), url('../images/Rectangle-41.png'), radial-gradient(circle, rgba(255, 255, 255, .15), #070a13);
  background-position: 0 100%, 100% 100%, 0 0;
  background-repeat: no-repeat, no-repeat, repeat;
  background-size: contain, contain, auto;
  padding: 60px;
}

.h3-s1 {
  margin-top: 0;
  margin-bottom: 30px;
  font-size: 40px;
  line-height: 40px;
}

.footer-dark {
  color: #fff;
  background-color: #070a13;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.menu-link-footer {
  color: #fff;
  margin-right: 0;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  text-decoration: none;
  transition: color .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
}

.menu-link-footer:hover {
  color: #ee2d38;
}

.menu-link-footer.w--current {
  color: #dc0f2c;
}

.titre-footer {
  margin-bottom: 20px;
  font-family: Tj evolette a, sans-serif;
}

.logo-footer-dark {
  height: 100px;
  padding-right: 30px;
}

.wrapper-container-footer {
  border-bottom: 1px solid rgba(255, 255, 255, .15);
  padding-bottom: 30px;
}

.balkanisation-image-article {
  width: 100%;
  height: 100%;
  background-image: url('../images/Balkanisation.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: scroll;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.flag-france {
  z-index: 50;
  width: 20%;
  position: absolute;
  top: 0;
  bottom: auto;
  left: 0%;
  right: auto;
}

.corbeau1 {
  z-index: 5;
  width: 80px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 30%;
  right: auto;
}

.corbeau2 {
  z-index: 5;
  width: 60px;
  position: absolute;
  top: auto;
  bottom: 11%;
  left: 39%;
  right: auto;
}

.choisissez-commu {
  color: #6a7284;
  margin-top: 50px;
  font-family: Tj evolette a, sans-serif;
}

.tab-safe-sphere {
  width: 100%;
  margin-top: 20px;
}

.tab-menu-safe-sphere {
  margin-bottom: 50px;
}

.tab-link-safe {
  color: #0f172a;
  background-color: rgba(0, 0, 0, 0);
  border: 3px solid rgba(0, 0, 0, 0);
  margin-left: 20px;
  margin-right: 20px;
  font-size: 20px;
  font-weight: 600;
  transition: border-color .2s cubic-bezier(.55, .085, .68, .53), color .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.tab-link-safe:hover {
  color: #fff;
  background-color: #070a13;
  border-bottom-color: #ffd02f;
  border-right-color: #ffd02f;
}

.tab-link-safe.w--current {
  color: #fff;
  background-color: #0f172a;
  border-bottom: 3px solid #ffd02f;
  border-right: 3px solid #ffd02f;
}

.triangle-jaune-small {
  z-index: 5;
  width: 10%;
  height: auto;
  position: absolute;
  top: 12%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.triangle-jaune-small.smaller {
  width: 7%;
}

.triangle-jaune-small.opadown {
  opacity: .3;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.triangle-jaune-small.tracteur {
  width: 18%;
  top: auto;
  bottom: -15%;
  left: auto;
  right: 0%;
}

.perroquet-safe {
  width: 180px;
  position: absolute;
  top: 7%;
  bottom: auto;
  left: auto;
  right: 14%;
}

.box-safe-sphere {
  z-index: 5;
  text-align: left;
  background-color: #0f172a;
  padding: 25px 50px;
  position: relative;
  top: -110px;
}

.sous-titre-safe-sphere {
  color: #fff;
  font-size: 20px;
  font-weight: 600;
}

.sous-titre-safe-sphere.dark {
  color: #070a13;
}

.wrapper-text-safe-sphere.left {
  padding-top: 15px;
}

.box-yellow {
  height: 100%;
  background-color: #ffd02f;
  padding: 15px;
}

.columns-4 {
  align-items: stretch;
  display: flex;
}

.column-7, .column-8 {
  flex: 1;
  align-self: stretch;
}

.triangle-jaune-left {
  z-index: 9;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.virus-overflow {
  width: 45%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
  overflow: hidden;
}

.virus-image-article {
  width: 800px;
  height: 100%;
  background-image: linear-gradient(#fff, rgba(255, 255, 255, 0)), url('../images/Virus.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-attachment: scroll, scroll;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.wrapper-headline-line {
  align-items: center;
  margin-bottom: 20px;
  display: flex;
}

.yellow-line {
  width: 1px;
  height: 8px;
  background-color: #ffd02f;
  margin-left: 15px;
}

.sous-titre-fakenews {
  font-size: 24px;
  font-weight: 600;
}

.fake-1 {
  z-index: 100;
  width: 50%;
  opacity: 0;
  display: none;
  position: absolute;
  top: -10%;
  left: 5%;
}

.fake-2 {
  z-index: 101;
  width: 50%;
  opacity: 0;
  display: none;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 5%;
}

.fake-3 {
  z-index: 102;
  width: 50%;
  opacity: 0;
  display: none;
  position: absolute;
  top: 50%;
  left: 12%;
}

.fake-4 {
  z-index: 103;
  width: 50%;
  opacity: 0;
  display: none;
  position: absolute;
  top: 30%;
  left: 35%;
}

.wrapper-card-id {
  margin-top: 65px;
}

.wrapper-new-card {
  margin-bottom: 30px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.gif-rotate {
  width: 23%;
  position: absolute;
  top: 24%;
  left: 12%;
}

.faq-p {
  width: 100%;
  border-bottom: 1px solid rgba(0, 0, 0, .2);
  overflow: hidden;
}

.faq {
  width: 100%;
  height: 35px;
  color: #000;
  white-space: break-spaces;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0 10px 0 0;
  font-size: 16px;
  display: flex;
}

.toggle-text {
  z-index: 2;
  position: relative;
}

.faq-body {
  width: 100%;
  background-color: #fff;
  border-top: 1px solid #fff;
  display: block;
  position: relative;
}

.faq-body.w--open {
  background-color: rgba(0, 0, 0, 0);
}

.faq-body-cont {
  font-size: 16px;
  font-weight: 300;
  line-height: 32px;
}

.faq-answer {
  margin-bottom: 10px;
}

.bold-id {
  color: #2e3139;
}

.triangle-jaune-left-small {
  z-index: 15;
  width: 8%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.image-robot-generation {
  width: 60%;
  background-image: url('../images/Rectangle-46.jpg');
  background-position: 100%;
  background-size: cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.wrapper-zindex {
  z-index: 1;
  position: relative;
}

.decouvrer-hyper {
  width: 20%;
  position: absolute;
  top: 50px;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.decouvrez-hyper-2 {
  width: 13%;
  position: absolute;
  top: 25%;
  bottom: auto;
  left: 5%;
  right: auto;
}

.wrapper-forces-robotiques {
  margin-top: 45px;
}

.wrapper-anim-robot {
  width: 300px;
  height: 654px;
  background-color: #0f172a;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.robot-1 {
  width: 100%;
  height: 100%;
}

.overlay-blue {
  z-index: 1;
  height: 100%;
  background-image: linear-gradient(rgba(15, 23, 42, 0) 50%, #0f172a);
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 30px;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: hidden;
}

.voir-fiche-technique {
  color: #070a13;
  background-color: #ffd02f;
  padding: 12px 20px;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53), color .2s cubic-bezier(.55, .085, .68, .53);
}

.voir-fiche-technique:hover {
  color: #fff;
  background-color: rgba(255, 208, 47, .2);
  transform: translate(0, -3px);
}

.fiche-technique {
  background-color: rgba(15, 23, 42, .8);
  padding: 20px;
  display: block;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.anne-mise-en-service {
  color: #fff;
  margin-bottom: 15px;
  font-family: Tj evolette a, sans-serif;
  font-size: 13px;
  line-height: 21px;
}

.h5-s1 {
  color: #0f172a;
  background-color: #ffd02f;
  margin-bottom: 20px;
  padding: 3px;
  font-family: Tj evolette a, sans-serif;
  font-size: 22px;
  line-height: 26px;
  display: inline-block;
}

.close-bouton {
  width: 30px;
  position: absolute;
  top: 10px;
  bottom: auto;
  left: auto;
  right: 10px;
}

.link-red {
  color: #ee2d38;
}

.arrow-cta-video {
  width: auto;
  height: 30px;
  color: #000;
  align-items: center;
  margin-top: 30px;
  margin-right: 15px;
  padding-left: 30px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.arrow-cta-video.hiden {
  display: none;
}

.div-block-5 {
  align-items: center;
  display: flex;
}

.lightbox-reportage-hyperforteresse {
  width: 100%;
  height: 450px;
  background-color: #070a13;
  background-image: radial-gradient(circle, rgba(7, 10, 19, .6), #070a13), url('../images/Reportage-hyperforteresse.jpg');
  background-position: 0 0, 50% 100%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-reportage-hyperforteresse:hover {
  background-image: radial-gradient(circle, rgba(7, 10, 19, .6), #070a13), url('../images/Reportage-hyperforteresse.jpg');
  background-position: 0 0, 50% 100%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
}

.wrapper-video-top {
  background-image: linear-gradient(rgba(255, 255, 255, 0), #fff), linear-gradient(rgba(255, 255, 255, .8), rgba(255, 255, 255, .8));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 20px;
  display: flex;
}

.play-button-ba {
  z-index: 5;
  width: 60px;
  height: 60px;
  margin-left: auto;
  margin-right: auto;
  transition: opacity .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
  position: relative;
}

.play-button-ba:hover {
  opacity: .8;
}

.lightbox-bandeau {
  width: 100%;
  height: 450px;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.traignle-transprency {
  z-index: 5;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.lightbox-reportage-ruse {
  width: 100%;
  height: 450px;
  background-color: #070a13;
  background-image: radial-gradient(circle, rgba(7, 10, 19, .6), #070a13), url('../images/Pub-safe-sphere.jpg');
  background-position: 0 0, 50% 100%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-reportage-ruse:hover {
  background-image: radial-gradient(circle, rgba(7, 10, 19, .6), #070a13), url('../images/Pub-safe-sphere.jpg');
  background-position: 0 0, 50% 100%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
}

.h1-s1 {
  color: #333;
  font-family: Tj evolette a, sans-serif;
  font-size: 72px;
  line-height: 90px;
}

.h1-s1.center._70-title {
  width: 70%;
  text-align: center;
  margin-top: 40px;
  margin-bottom: 30px;
  font-size: 62px;
  line-height: 70px;
}

.label-video {
  z-index: 50;
  color: #fff;
  background-color: #ee2d38;
  margin: 30px;
  padding: 7px 5px 5px;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  display: inline-block;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.label-video.blue {
  background-color: #1a4dff;
}

.label-video.yellow {
  color: #0f172a;
  background-color: #ffd02f;
}

.traisngle-low-opa {
  z-index: 140;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.preloader {
  z-index: 2147483647;
  width: 100vw;
  height: 100vh;
  background-color: #070a13;
  display: none;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lottie-loader {
  width: 100vw;
  height: 100vh;
  position: relative;
}

.wrapper-text-carte-identite {
  padding-top: 15px;
  padding-left: 15px;
  padding-right: 15px;
}

.premier-implant-wrapper {
  width: 70%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.implant-red {
  z-index: 3;
  opacity: 1;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.implant-cerveau {
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.overlay-blanc-implant {
  z-index: 2;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(rgba(255, 255, 255, .86), #fff);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.triangle-jaune-small-2 {
  z-index: 100;
  width: 10%;
  height: auto;
  position: absolute;
  top: 50px;
  bottom: auto;
  left: auto;
  right: 0%;
}

.lottie-losange {
  z-index: 2;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.paragraphe-50 {
  width: 50%;
  text-align: center;
}

.paragraphe-50.white {
  color: #ebebeb;
}

.wrapper-rights {
  display: flex;
}

.menu-mobile, .menu-mobile-wrapper {
  display: none;
}

.h3-title-team-2 {
  color: #fff;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Tj evolette a, sans-serif;
  font-size: 17px;
  line-height: 23px;
}

.red-2 {
  color: #ee2d38;
}

.wrapper-team {
  margin-top: 200px;
}

.paragraph.center {
  text-align: center;
}

.column-trailer {
  width: 100%;
  height: 100%;
  align-items: center;
  display: flex;
}

.lightbox-realite-virtuelle {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  display: block;
}

.site-wrapper-s0 {
  padding-top: 80px;
  overflow: hidden;
}

.columns-7 {
  width: 100%;
}

.lightbox-carte {
  width: 50%;
  height: 450px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.lightbox-link-5 {
  height: 450px;
  padding-left: 70px;
  position: relative;
}

.overlay-blanc {
  background-color: rgba(255, 255, 255, .65);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.pargraphe-70 {
  width: 70%;
  margin-bottom: 50px;
}

.image-carte {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.columns-8 {
  width: 100%;
}

.column-flex-chimiquier {
  align-items: center;
  display: flex;
}

.image-chimiquier {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.lightbox-chimiquier {
  width: 50%;
  height: 450px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.wrapper-typeform {
  margin-top: 100px;
  position: relative;
}

.absolute-typeform {
  z-index: 500;
  width: 175px;
  height: 60px;
  background-color: #ee2d38;
  display: none;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 89px;
}

.video-quels-futurs {
  margin-top: 100px;
}

.utility-page-wrap {
  width: 100vw;
  height: 100vh;
  max-height: 100%;
  max-width: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
}

.utility-page-content {
  width: 260px;
  text-align: center;
  flex-direction: column;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.play-butoon-after {
  width: 70px;
  height: 70px;
  opacity: 0;
  margin-left: auto;
  margin-right: auto;
  display: none;
  position: absolute;
}

.columns-9 {
  align-items: flex-end;
  display: flex;
}

.wrapper-cta-both {
  align-items: flex-start;
  margin-top: 30px;
  display: flex;
}

.container-small {
  z-index: 100;
  width: 350px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.logo-medias {
  width: 150px;
  margin-bottom: 25px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.wrapper-bouton-social {
  margin-bottom: 50px;
}

.wrapper-men {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.interstitiel {
  z-index: 999999999;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: rgba(0, 0, 0, .75);
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.interstitiel-modal {
  width: 100%;
}

.wrapper-interstitiel {
  width: 65%;
  position: relative;
}

.close-modal {
  width: 40px;
  height: 40px;
  background-image: url('../images/Plan-de-travail-1.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: -20px;
  left: auto;
  right: -20px;
}

.social-link-footer {
  width: 30px;
  height: 30px;
  margin-left: 15px;
  transition: opacity .2s cubic-bezier(.55, .085, .68, .53);
}

.social-link-footer:hover {
  opacity: .8;
}

.social-link-wrapper {
  justify-content: flex-end;
  display: flex;
}

.background-home-page {
  background-image: radial-gradient(circle, rgba(0, 0, 0, .69), #000), url('../images/Groupe-Opex-drone-batterie-1.jpg');
  background-position: 0 0, 0 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
}

.overlay-noir-2 {
  z-index: 2;
  background-image: linear-gradient(rgba(7, 10, 19, 0) 60%, #070a13);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.h2-home-2 {
  color: #fff;
  text-align: center;
  font-family: Tj evolette a, sans-serif;
  font-size: 16px;
  line-height: 19px;
}

.border-red-bottom-2 {
  z-index: 10;
  width: 25%;
  height: .5px;
  opacity: .5;
  background-color: #dc0f2c;
  position: absolute;
  top: auto;
  bottom: 130px;
  left: auto;
  right: 0%;
}

.cta-home-2 {
  width: 100%;
  color: #000;
  text-align: center;
  background-color: #ffd02f;
  margin-top: 15px;
  font-family: Tj evolette a, sans-serif;
  font-size: 18px;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-home-2:hover {
  background-color: rgba(255, 208, 47, .8);
  transform: translate(0, -3px);
}

.cta-home-2.blue {
  color: #fff;
  background-color: #1a4dff;
}

.cta-home-2.blue:hover {
  background-color: rgba(26, 77, 255, .8);
}

.arrow-cta-video-2 {
  width: auto;
  height: 30px;
  color: #000;
  align-items: center;
  margin-top: 30px;
  margin-right: 15px;
  padding-left: 30px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.lightbox-home-2 {
  width: 100%;
  height: 290px;
  background-image: url('../images/Thumb.jpg');
  background-position: 50% 35%;
  background-repeat: no-repeat;
  background-size: 100%;
  background-attachment: fixed;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.voir-le-trailer-wrapper-2 {
  width: 200px;
  height: 200px;
  color: #fff;
  flex-direction: column-reverse;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  display: flex;
  position: relative;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.lightbox-home-3 {
  width: 100%;
  height: 290px;
  background-image: url('../images/img_2.jpg');
  background-position: 50% 35%;
  background-repeat: no-repeat;
  background-size: 100%;
  background-attachment: fixed;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.h1-s2 {
  color: #333;
  font-family: Tj evolette a, sans-serif;
  font-size: 72px;
  line-height: 90px;
}

.h1-s2.center._70-title {
  width: 70%;
  color: #fff;
  text-align: center;
  margin-top: 40px;
  margin-bottom: 30px;
  font-size: 62px;
  line-height: 70px;
}

.h1-s2.center._100-title {
  width: 100%;
  color: #fff;
  text-align: center;
  margin-top: 1rem;
  margin-bottom: 30px;
  font-size: 62px;
  line-height: 70px;
}

.arrow-cta-video-s02 {
  width: auto;
  height: 30px;
  color: #fff;
  align-items: center;
  margin-top: 30px;
  margin-right: 15px;
  padding-left: 30px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.smoke-hero {
  z-index: 2;
  width: 50%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.plant-hero {
  width: 14%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.plant-hero-2 {
  z-index: 12;
  width: 19%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.personnage-hero {
  z-index: 11;
  height: 80%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 5%;
}

.wrapper-section-roll-invert {
  padding-top: 80px;
  padding-bottom: 80px;
  position: relative;
}

.manifestation-overflow {
  width: 70%;
  height: 100%;
  background-image: linear-gradient(to right, #fff 10%, rgba(255, 255, 255, 0) 56%), url('../images/Manifestations.jpg');
  background-position: 0 0, 100%;
  background-size: auto, cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
  overflow: hidden;
}

.h2-s2 {
  width: 70%;
  color: #333;
  margin-bottom: 30px;
  font-family: Tj evolette a, sans-serif;
  font-size: 60px;
  line-height: 66px;
}

.h2-s2._100 {
  width: 100%;
  font-size: 43px;
  line-height: 60px;
}

.h2-s2._100.white {
  margin-top: 0;
  margin-bottom: 2.5rem;
  display: flex;
}

.h2-s2._100.white.center {
  text-align: center;
  display: block;
}

.h2-s2._100.white.center.zindex {
  z-index: 2;
  position: relative;
}

.h2-s2._100.white.right, .h2-s2._100.white.left {
  justify-content: flex-end;
  margin-bottom: .5rem;
  font-size: 33px;
  line-height: 40px;
}

.h2-s2._100.white.small {
  font-size: 35px;
}

.h2-s2._100.no-margin-top {
  margin-top: 0;
}

.h2-s2._100.light {
  color: #fff;
}

.h2-s2._100.light.z-index-30 {
  z-index: 30;
  position: relative;
}

.h2-s2.white {
  color: #fff;
}

.h2-s2.white.center {
  text-align: center;
}

.wrapper-col {
  width: 100%;
  justify-content: space-between;
  display: flex;
}

.wrapper-col.vertical-flex {
  flex-direction: column;
  align-items: center;
}

.wrapper-col.margin-top {
  margin-top: 4rem;
}

.wrapper-col.margins-inner {
  opacity: 1;
  padding: 1rem;
  display: flex;
}

.wrapper-col.margins-inner.flex-virus {
  display: flex;
}

.wrapper-col.horizontal-center {
  align-items: center;
}

.wrapper-col.horizontal-center.relative {
  position: relative;
}

.wrapper-col.align-right {
  justify-content: flex-end;
}

.col-6 {
  width: 49%;
}

.wrapper-paragraph-small {
  width: 74%;
}

.h3-s2 {
  font-family: Metropolis, sans-serif;
  font-weight: 600;
}

.h3-s2.white {
  color: #fff;
  margin-top: 0;
  margin-bottom: 1rem;
}

.h3-s2.different {
  width: 60%;
}

.arrow-cta-lire-article-s02 {
  width: auto;
  height: 30px;
  color: #000;
  align-items: center;
  margin-top: 30px;
  margin-right: 15px;
  padding-left: 30px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.arrow-cta-lire-article-s02.z-index-30 {
  z-index: 30;
}

.arrow-cta-lire-article-s02.small-margin-top {
  margin-top: 15px;
}

.col-11 {
  width: 91.5%;
  min-height: 20px;
}

.col-12 {
  width: 100%;
  min-height: 20px;
}

.col-4 {
  width: 32%;
  min-height: 20px;
}

.col-5 {
  width: 40.5%;
  min-height: 20px;
}

.col-3 {
  width: 23.5%;
  min-height: 20px;
}

.col-3.ihm {
  display: block;
}

.col-1 {
  width: 6.5%;
  min-height: 20px;
}

.col-8 {
  width: 66%;
  min-height: 20px;
}

.col-2 {
  width: 15%;
  min-height: 20px;
}

.col-7 {
  width: 57.5%;
  min-height: 20px;
}

.card-virus {
  height: 100%;
  text-align: left;
  background-color: #061c1d;
  border-radius: 32px;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.video-virus {
  z-index: 1;
  width: 100%;
  height: 15rem;
  border-top-left-radius: 32px;
  border-top-right-radius: 32px;
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.paragraph-mini-grey {
  color: #cdcdcd;
  margin-bottom: 0;
  font-size: 11px;
  line-height: 19px;
  display: block;
}

.paragraph-mini-grey.green {
  color: #00df84;
}

.h3-s2-small {
  color: #fff;
  margin-top: 10px;
  margin-bottom: 0;
  font-family: Metropolis, sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 20px;
}

.overlay-virus {
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to top, #061c1d, rgba(255, 255, 255, 0) 32%);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.wrap-text-virus {
  z-index: 5;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background-image: linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 16px;
  margin-top: 13rem;
  position: relative;
  overflow: hidden;
}

.wrap-text-virus.absolute {
  z-index: 4;
  opacity: 0;
  margin-top: 0;
  display: block;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.divider-virus {
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, .6);
}

.bold-virus {
  color: #fff;
  font-weight: 500;
}

.date-virus {
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background-image: linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 30px;
  padding: .4rem 1rem;
  line-height: 16px;
  display: inline-block;
  position: absolute;
  top: 1rem;
  bottom: auto;
  left: auto;
  right: 1rem;
}

.wrap-cta-tech {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
}

.button-tech {
  width: 80%;
  text-align: center;
  background-color: #00df84;
  flex: 0 auto;
  padding-left: 0;
  padding-right: 0;
  font-family: Tj evolette a, sans-serif;
  font-size: 9px;
  line-height: 13px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
}

.button-tech:hover {
  background-color: rgba(0, 223, 132, .8);
}

.wrap-move-virus {
  width: 100%;
  min-height: 470px;
  flex-wrap: nowrap;
  display: flex;
  position: relative;
}

.revenir {
  align-items: center;
  margin-top: 1rem;
  text-decoration: none;
  display: flex;
}

.arrow-revenir {
  width: 12px;
  margin-right: 5px;
}

.wrap-text-virus-2 {
  z-index: 5;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background-image: linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 16px;
  margin-top: 13rem;
  display: block;
  position: relative;
  overflow: hidden;
}

.wrap-text-virus-22 {
  z-index: 5;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background-image: linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 16px;
  margin-top: 13rem;
  position: relative;
  overflow: hidden;
}

.wrap-text-virus-22.absolute {
  z-index: 4;
  opacity: 0;
  margin-top: 0;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.wrap-text-virus-3, .wrap-text-virus-33 {
  z-index: 5;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background-image: linear-gradient(to right, rgba(255, 255, 255, .1), rgba(255, 255, 255, .2));
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 16px;
  margin-top: 13rem;
  position: relative;
  overflow: hidden;
}

.wrap-text-virus-33.absolute {
  z-index: 4;
  opacity: 0;
  margin-top: 0;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-reportage-biotech {
  width: 100%;
  height: 100%;
  background-color: #070a13;
  background-image: linear-gradient(rgba(7, 10, 19, 0) 62%, #071c1d), url('../images/img_1.jpg');
  background-position: 0 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-bandeau-biotech {
  width: 100%;
  height: 550px;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.serpent {
  width: 20%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.tabs-ecosysteme {
  flex-direction: column-reverse;
  display: flex;
}

.interface-pic {
  border-radius: 20px;
}

.progess-bar-gree {
  width: 25%;
  height: 15px;
  background-color: #00df84;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.paragraph-white {
  color: #fff;
  display: block;
}

.paragraph-white.no-margin-bottom {
  margin-bottom: 0;
}

.col-5-5 {
  width: 45%;
}

.tabs-menu-ecosysteme {
  margin-top: 4rem;
  display: flex;
}

.tab-ecosystem {
  width: 25%;
  color: #fff;
  background-color: rgba(0, 0, 0, 0);
  border-top: 7px solid #044734;
  justify-content: center;
  align-items: center;
  text-decoration: underline;
  transition: border-color .2s cubic-bezier(.55, .085, .68, .53), color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.tab-ecosystem:hover {
  color: #00df84;
  border-top-color: #00df84;
}

.tab-ecosystem.w--current {
  color: #00df84;
  background-color: rgba(0, 0, 0, 0);
  border-top-color: #00df84;
}

.text-tabs {
  font-family: Tj evolette a, sans-serif;
  font-size: 15px;
  line-height: 15px;
}

.sapin-overflow {
  width: 70%;
  height: 100%;
  background-image: linear-gradient(to right, #fff 10%, rgba(255, 255, 255, 0) 56%), url('../images/Rectangle-48.jpg');
  background-position: 0 0, 100%;
  background-size: auto, cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
  overflow: hidden;
}

.mouche-1 {
  width: 60px;
  position: absolute;
  top: 6%;
  bottom: auto;
  left: auto;
  right: -3%;
}

.mouche-2 {
  width: 60px;
  position: absolute;
  top: 43%;
  bottom: auto;
  left: auto;
  right: -8%;
}

.branche {
  width: 30%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: -9%;
}

.detail-infection {
  z-index: 5;
  width: auto;
  max-width: 50%;
  background-color: #fff;
  padding: 2rem;
  position: absolute;
  top: 10%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.detail-infection.grey {
  color: #fff;
  background-color: #3d465e;
  top: 7%;
}

.detail-infection.relative {
  position: relative;
}

.infection-video {
  width: 100%;
  padding-top: 100%;
}

.wrap-story, .div-relative {
  position: relative;
}

.lezard {
  width: 20%;
  position: absolute;
  bottom: 19%;
  right: 12%;
}

.lights {
  z-index: 1;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.light-dark {
  z-index: 2;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.screen {
  width: 9.6%;
  position: absolute;
  top: 16.2%;
  bottom: 0%;
  left: auto;
  right: 28.5%;
}

.insecte {
  width: 15%;
  position: absolute;
  top: auto;
  bottom: 47%;
  left: auto;
  right: 39%;
}

.circle-1 {
  width: 10%;
  position: absolute;
  top: 43%;
  bottom: auto;
  left: 30%;
  right: auto;
}

.circle-2 {
  width: 8%;
  position: absolute;
  top: 33%;
  bottom: auto;
  left: 45%;
  right: auto;
}

.ondes {
  width: 35%;
  position: absolute;
  top: 9%;
  bottom: 0;
  left: auto;
  right: 41%;
}

.infos-ondes {
  width: 27%;
  position: absolute;
  top: 25.5%;
  bottom: auto;
  left: 23%;
  right: auto;
}

.elements-1 {
  width: 5%;
  position: absolute;
  top: 10%;
  bottom: auto;
  left: auto;
  right: 45%;
}

.elements-2 {
  width: 4%;
  position: absolute;
  top: 13%;
  bottom: auto;
  left: auto;
  right: 42.5%;
}

.elements-3 {
  width: 6%;
  position: absolute;
  top: 25%;
  bottom: auto;
  left: auto;
  right: 42.5%;
}

.green-bar-top {
  height: 15px;
  background-color: #00df84;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.green-bar-bottom {
  height: 15px;
  background-color: #00df84;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.green-bar-left {
  z-index: 20;
  width: 15px;
  height: 0%;
  background-color: #00df84;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.green-bar-right {
  z-index: 20;
  width: 15px;
  height: 0%;
  background-color: #00df84;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.cta-bandeau {
  color: #fff;
  text-align: center;
  background-color: #070a13;
  flex-direction: column;
  align-items: center;
  padding: 4rem 2rem 4.5rem;
  display: flex;
  position: relative;
}

.cta-bandeau.greyish {
  background-color: #3d465e;
}

.cta-bandeau.dark {
  background-color: #080a13;
  overflow: hidden;
}

.moustique-bandeua {
  width: 22%;
  position: absolute;
  top: auto;
  bottom: -18%;
  left: 0%;
  right: auto;
}

.fougeres {
  z-index: 2;
  width: 25%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.soldat-bandeau {
  height: 100%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 4%;
}

.overlay-black-bandeau {
  z-index: 4;
  width: 25%;
  height: 30%;
  background-image: linear-gradient(358deg, #070a13, rgba(255, 255, 255, 0));
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.cta-bandeau-link {
  width: 40%;
  color: #fff;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  transition: color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.cta-bandeau-link:hover {
  color: #ffc46c;
}

.title-follow {
  color: #fff;
  margin-bottom: 1rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 40px;
  line-height: 60px;
}

.cta-green {
  background-color: #00df84;
  margin-top: 1.5rem;
  padding: 1rem 3rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-green:hover {
  background-color: rgba(0, 223, 132, .8);
}

.branche-bandeau {
  height: 90%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.oeuf {
  height: 46%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 10%;
  right: auto;
}

.fleurs {
  width: 24%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 22%;
}

.desinfect {
  height: 70%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.overlay-black-radial {
  z-index: 3;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0) 15%, #070a13);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.pub-overlay {
  z-index: 9999;
  width: 100%;
  height: 100%;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  background-color: rgba(32, 32, 32, .4);
  justify-content: center;
  align-items: center;
  display: none;
  position: fixed;
}

.bandeau-ad {
  background-color: #fff;
  justify-content: space-between;
  display: flex;
}

.girl {
  width: 30%;
}

.girl-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 0% 50%;
}

.text-girl {
  width: 70%;
  padding-top: 2.9rem;
  padding-bottom: 2.9rem;
  padding-right: 6rem;
}

.titre-ad {
  color: #0f172a;
  margin-bottom: .5rem;
  font-size: 38px;
  font-weight: 700;
  line-height: 41px;
}

.span-text-green {
  color: #357509;
}

.wrap-cta-add {
  align-items: center;
  margin-top: 1.5rem;
  display: flex;
}

.cta-green-add {
  background-color: #357509;
  margin-right: 1rem;
  padding: 1rem 3rem;
  font-family: Metropolis, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 14px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
}

.cta-green-add:hover {
  background-color: rgba(53, 117, 9, .8);
}

.paragraph-mini-grey-dark {
  color: #4e4e4e;
  margin-bottom: 0;
  font-size: 11px;
  line-height: 19px;
  display: block;
}

.open-modal {
  height: 1px;
  background-color: rgba(0, 0, 0, 0);
}

.close {
  width: 40px;
  height: 40px;
  background-image: url('../images/Group_1.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 40%;
  display: block;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.navbar-product {
  z-index: 999;
  height: 80px;
  background-color: #fff;
  position: relative;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.retour-sur-le-site {
  color: #fff;
  background-color: #dc0f2c;
  justify-content: center;
  padding: 10px 20px;
  text-decoration: none;
  transition: transform .2s cubic-bezier(.55, .085, .68, .53), background-color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.retour-sur-le-site:hover {
  background-color: rgba(220, 15, 44, .8);
  transform: translate(0, -3px);
}

.product-div {
  z-index: 5;
  background-color: #fff;
  padding: 2rem;
  position: relative;
}

.tabs-invert {
  flex-direction: column-reverse;
  display: flex;
}

.tab-product {
  width: 23%;
  border: 1px solid #f9f9f9;
  padding: 0;
  transition: border-color .2s cubic-bezier(.55, .085, .68, .53);
}

.tab-product:hover {
  border-color: #00df84;
}

.tab-product.w--current {
  border: 1px solid #00df84;
}

.tabs-menu {
  justify-content: space-between;
  margin-top: 1rem;
  display: flex;
}

.footer-reduce {
  background-color: #070a13;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.h1-product {
  margin-top: 0;
  margin-bottom: 5px;
  font-family: Tj evolette a, sans-serif;
  font-size: 32px;
  line-height: 38px;
}

.paragraph-strong {
  margin-bottom: 0;
  font-weight: 500;
  line-height: 27px;
}

.col-5-7 {
  width: 47.5%;
}

.span-green {
  color: #00df84;
}

.paragraph-middle-grey-dark {
  color: #4e4e4e;
  margin-bottom: 0;
  margin-left: .5rem;
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
}

.div-flex-horizontal {
  align-items: center;
  margin-bottom: .5rem;
  display: flex;
}

.div-flex-horizontal.margin-top {
  margin-top: 1rem;
}

.div-flex-horizontal.margin-top.no-margin-bottom {
  margin-bottom: 0;
}

.caracteristiques {
  color: #565656;
  margin-top: .5rem;
  font-size: 14px;
  font-weight: 500;
  line-height: 27px;
  display: inline-block;
}

.modal-caracteristiques {
  background-color: #070a13;
  border-radius: 7px;
  padding: 1rem;
  display: none;
  position: absolute;
  top: 50px;
  bottom: auto;
  left: 30%;
  right: auto;
}

.list-cara {
  color: #fff;
  margin-bottom: 0;
  padding-left: 15px;
  font-size: 10px;
  line-height: 15px;
}

.divider {
  width: 100%;
  height: 1px;
  background-color: #d9d9d9;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.divider.more {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.paragraph-medium {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 300;
  line-height: 25px;
}

.cta-info-product {
  color: #00df84;
  border: 1px solid #94a3b8;
  border-radius: 8px;
  margin-right: .5rem;
  padding: .5rem 1rem;
  font-size: 16px;
  line-height: 18px;
  display: inline-block;
}

.cta-acheter {
  background-color: #00df84;
  border: 1px solid #00df84;
  border-radius: 8px;
  padding: .5rem 1rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 12px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53), color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-acheter:hover {
  color: #00df84;
  background-color: rgba(0, 0, 0, 0);
}

.cta-acheter.line {
  color: #000;
  background-color: rgba(0, 0, 0, 0);
  border-color: #000;
  margin-left: 1rem;
}

.cta-acheter.line:hover {
  color: #fff;
  background-color: #000;
}

.grenouille {
  width: 20%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.fougere-2 {
  width: 25%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.wrapper-section-roll-invert-sapin {
  padding-top: 80px;
  padding-bottom: 80px;
  position: relative;
}

.wrap-sapin-relative {
  width: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.wrap-zindex {
  z-index: 50;
  width: 100%;
  position: relative;
}

.personnage-hero-2 {
  z-index: 11;
  width: 250px;
  height: 66%;
  background-image: linear-gradient(rgba(26, 17, 7, .5), rgba(26, 17, 7, .5)), url('../images/Soldat-1.png');
  background-position: 0 0, 50% 100%;
  background-repeat: repeat, no-repeat;
  background-size: auto, contain;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 7%;
}

.plant-hero-3 {
  z-index: 12;
  width: 27%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 10%;
}

.plant-hero-4 {
  z-index: 1;
  height: 70%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.nuit-carbonique-overflow {
  width: 70%;
  height: 100%;
  background-image: linear-gradient(to right, #fff 10%, rgba(255, 255, 255, 0) 56%), url('../images/Rectangle-48_1.jpg');
  background-position: 0 0, 100%;
  background-size: auto, cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
  overflow: hidden;
}

.panneau {
  height: 70%;
  position: absolute;
  top: auto;
  bottom: -1%;
  left: auto;
  right: -3%;
}

.pangolin {
  width: 30%;
  position: absolute;
  top: auto;
  bottom: -11%;
  left: auto;
  right: 15%;
}

.progess-bar-orange {
  width: 25%;
  height: 15px;
  background-color: #ff9e3d;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-priorite-ecologique {
  width: 100%;
  height: 100%;
  background-color: #070a13;
  background-image: url('../images/Group-105.jpg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: cover;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-priorite-ecologique.en-lightbox-reflexes {
  background-image: url('../images/Group-105.webp');
}

.pile-enfant {
  z-index: 5;
  width: 25%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.image-reflexes {
  width: 100%;
  height: 100%;
  opacity: 0;
  object-fit: cover;
  position: absolute;
}

.cta-not-link {
  z-index: 20;
  position: relative;
}

.cta-not-link.cta-yellow {
  color: #000;
  background-color: #ffb13d;
  padding: 1rem 3rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-not-link.cta-yellow:hover {
  background-color: rgba(255, 177, 61, .8);
}

.cta-not-link.cta-yellow.voir {
  width: 80%;
  cursor: pointer;
  margin-top: 3rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

.lightbox-bandeau-reflexes-energetiques {
  width: 100%;
  height: 550px;
  justify-content: center;
  align-items: center;
  margin-top: 2rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.metagram {
  background-color: rgba(234, 238, 241, .07);
  flex-direction: column;
  justify-content: space-between;
  display: flex;
  position: relative;
}

.feed {
  height: 500px;
  padding: 1rem 1.5rem;
  overflow: scroll;
}

.feed-box {
  border-radius: 20px;
  margin-bottom: 1rem;
}

.wrap-text-metagram {
  padding-top: 8rem;
}

.wrap-hermel {
  height: 100%;
  background-color: #f5f5f5;
  padding: 2rem;
}

.h2-hermel {
  color: #0f172a;
  margin-top: 2rem;
  margin-bottom: 1rem;
}

.logo-hermel {
  width: 40%;
}

.key-title {
  color: #ffb13d;
  font-weight: 600;
}

.h3-missions {
  color: #0f172a;
  font-family: Metropolis, sans-serif;
  font-size: 16px;
  line-height: 27px;
}

.paragraph-small {
  font-size: 14px;
  line-height: 21px;
}

.parent-3d {
  height: 100%;
  position: relative;
  overflow: hidden;
}

.recto {
  z-index: 2;
  height: 100%;
  text-align: center;
  background-image: url('../images/Group-118.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex-direction: column;
  justify-content: space-between;
  padding: 3rem 2rem;
  display: flex;
  position: relative;
  transform: perspective(2000px);
}

.verso {
  z-index: 20;
  height: 100%;
  text-align: center;
  background-image: url('../images/Plan-de-travail-1-1_1.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 3rem 2rem;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  transform: translate(0, 100%);
}

.hermel-logo-white {
  width: 51%;
  margin-bottom: 1.5rem;
}

.progess-bar-yello {
  width: 25%;
  height: 15px;
  background-color: #ffb13d;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-reportage-energies {
  width: 100%;
  height: 100%;
  background-color: #070a13;
  background-image: linear-gradient(rgba(7, 10, 19, 0) 62%, #071c1d), url('../images/img_2.jpg');
  background-position: 0 0, 50% 100%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.cta-bandeau-link-large {
  width: 60%;
  color: #fff;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  transition: color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.cta-bandeau-link-large:hover {
  color: #00df84;
}

.plant-bandeau {
  width: 16%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.cta-yellow {
  background-color: #ffb13d;
  margin-top: 1.5rem;
  padding: 1rem 3rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-yellow:hover {
  background-color: rgba(255, 177, 61, .8);
}

.charger {
  height: 60%;
  position: absolute;
  top: 28%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.masque {
  width: 11%;
  position: absolute;
  top: auto;
  bottom: -5%;
  left: 16%;
  right: auto;
}

.coleoptere {
  width: 20%;
  position: absolute;
  top: auto;
  bottom: -7%;
  left: auto;
  right: 19%;
}

.wrap-explications {
  -webkit-text-fill-color: inherit;
  background-color: #1b1107;
  background-clip: border-box;
  border-radius: 16px;
  margin-top: 3rem;
  padding-bottom: 2rem;
  padding-left: 2rem;
  padding-right: 2rem;
  position: relative;
}

.wrap-explications.hiden-mobile {
  min-height: 400px;
  background-image: url('../images/Group-125.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 12rem;
}

.wrap-explications.show-mobile {
  display: none;
}

.h3-skintech {
  color: #fff;
  margin-top: 0;
  display: block;
}

.video-skintech {
  height: 100%;
  border-radius: 16px;
}

.wrap-casque {
  display: block;
}

.wrap-chaussures, .wrap-bandes, .wrap-sac, .wrap-armure {
  padding-bottom: 2rem;
  padding-left: 2rem;
  padding-right: 2rem;
  display: none;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.orange-bar-top {
  height: 15px;
  background-color: #ffb13d;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.orange-bar-bottom {
  height: 15px;
  background-color: #ffb13d;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.orange-bar-left {
  z-index: 20;
  width: 15px;
  height: 0%;
  background-color: #ffb13d;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.orange-bar-right {
  z-index: 20;
  width: 15px;
  height: 0%;
  background-color: #ffb13d;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.perso-1 {
  height: 76%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 17%;
  right: auto;
}

.perso-2 {
  height: 76%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 47%;
  right: auto;
}

.image-product {
  width: 100%;
}

.moustique-bouge {
  z-index: 15;
  width: 22%;
  position: absolute;
  top: 11%;
  bottom: auto;
  left: 11%;
  right: auto;
}

.box-1 {
  z-index: 30;
  width: 18%;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #fff;
  background-color: rgba(255, 255, 255, .3);
  border: 1px solid #fff;
  border-radius: 19px;
  padding: 2rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 18px;
  line-height: 28px;
  position: absolute;
  top: 19%;
  bottom: auto;
  left: 8%;
  right: auto;
}

.box-2 {
  z-index: 30;
  width: 23%;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #fff;
  background-color: rgba(255, 255, 255, .3);
  border: 1px solid #fff;
  border-radius: 19px;
  padding: 2rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 18px;
  line-height: 28px;
  position: absolute;
  top: auto;
  bottom: 65%;
  left: auto;
  right: 4%;
}

.col-2-5 {
  width: 17%;
  min-height: 20px;
}

.mail {
  color: #fff;
  text-align: center;
  margin-top: 15px;
  font-weight: 600;
  transition: color .2s cubic-bezier(.55, .085, .68, .53);
  display: block;
}

.mail:hover {
  color: #ee2d38;
}

.back {
  width: 35px;
  position: absolute;
  top: 2rem;
  bottom: auto;
  left: 2rem;
  right: auto;
  transform: rotate(180deg);
}

.bloc-explicatif {
  width: 41%;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  text-align: right;
  background-color: rgba(0, 0, 0, .5);
  border: 1px solid #fff;
  border-radius: 16px;
  padding: 2rem;
  position: absolute;
  top: 10%;
  bottom: auto;
  left: auto;
  right: 6%;
}

.paragrpah-white {
  color: #fff;
}

.bloc-explicati-ecosysteme {
  width: 41%;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  text-align: right;
  background-color: rgba(0, 0, 0, .5);
  border: 1px solid #fff;
  border-radius: 16px;
  padding: 2rem;
  position: absolute;
  top: 10%;
  bottom: auto;
  left: auto;
  right: 6%;
}

.arrow-cta-eng {
  width: 180px;
  height: 30px;
  color: #000;
  align-items: center;
  margin-top: 30px;
  padding-left: 30px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.menu-link-language-selector {
  color: #fff;
  font-size: 14px;
  font-weight: 300;
  line-height: 14px;
  text-decoration: none;
  transition: color .2s cubic-bezier(.55, .085, .68, .53);
}

.menu-link-language-selector:hover {
  color: rgba(255, 255, 255, .8);
}

.menu-link-language-selector.w--current {
  color: #dc0f2c;
}

.menu-link-language-selector.dark {
  color: #000;
}

.icon {
  color: #fff;
  font-size: 12px;
}

.dropdown-toggle-2 {
  padding: 10px 40px 10px 10px;
}

.dropdown-list {
  color: #000;
}

.dropdown-list.w--open {
  color: #fff;
  background-color: #000;
}

.dropdown-link {
  color: #fff;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 14px;
  line-height: 14px;
}

.dropdown-link.w--current {
  color: #ee2d38;
}

.span-italique {
  font-style: italic;
}

.paragraph-4 {
  display: block;
}

.background-home-page-s3 {
  background-image: url('../images/Homepage--1440---100-vh.webp');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
}

.ship-hero {
  z-index: 12;
  width: 15%;
  position: absolute;
  top: auto;
  bottom: 47%;
  left: auto;
  right: 11%;
}

.personne-hero-2 {
  z-index: 3;
  width: 28%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.personnage-hero-3 {
  z-index: 3;
  height: 43%;
  position: absolute;
  top: auto;
  bottom: -1%;
  left: auto;
  right: 0%;
}

.planet-hero {
  z-index: 1;
  width: 20%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.overlay-s03-dark {
  z-index: 2;
  background-image: radial-gradient(circle, rgba(6, 13, 31, 0), #060d1f 88%);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.paragraph-light {
  color: #fff;
}

.paragraph-light.z-index-30 {
  z-index: 30;
  position: relative;
}

.paragraph-light.small {
  font-size: 14px;
  line-height: 1.6;
}

.space-overflow {
  width: 70%;
  height: 100%;
  background-image: linear-gradient(to right, #1c2435 10%, rgba(28, 36, 53, 0) 56%), url('../images/Rectangle-48.webp');
  background-position: 0 0, 100%;
  background-size: auto, cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
  overflow: hidden;
}

.flotte {
  z-index: 30;
  width: 24%;
  position: absolute;
  top: auto;
  bottom: -5%;
  left: auto;
  right: 3%;
}

.overflow-hidden {
  overflow: hidden;
}

.spaceship-travel {
  z-index: 5;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.consortium-overflow {
  width: 70%;
  height: 100%;
  background-image: linear-gradient(to right, #1c2435 15%, rgba(28, 36, 53, 0) 62%);
  background-position: 0 0;
  background-size: auto;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
  overflow: hidden;
}

.flag-1 {
  z-index: 30;
  width: 40%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.repu-overflow {
  z-index: 11;
  width: 50%;
  height: 87%;
  background-image: linear-gradient(to right, rgba(28, 36, 53, 0), #1c2435 90%), url('../images/Rectangle-48_1.webp');
  background-position: 0 0, 0%;
  background-size: auto, cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
  overflow: hidden;
}

.no {
  height: 0;
}

.col-z-index {
  z-index: 12;
}

.container-2 {
  width: 100%;
  max-width: 960px;
  min-height: 20px;
  justify-content: space-between;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
}

.flag-2 {
  z-index: 30;
  width: 25%;
  position: absolute;
  top: 51%;
  bottom: auto;
  left: 27%;
  right: auto;
}

.wrap-anim-people {
  width: 100%;
  perspective: 1000px;
  color: #000;
  object-fit: fill;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.people {
  z-index: 5;
  transform-style: preserve-3d;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  transform: translate3d(0, 0, 2px);
}

.planet {
  z-index: 6;
  width: 100%;
  height: auto;
  object-fit: fill;
  transform-style: preserve-3d;
  position: absolute;
  bottom: auto;
  right: auto;
  transform: translate3d(0, 0, 5px);
}

.consortium-video {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.consortium-wrap-video {
  width: 770px;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.sky {
  z-index: 1;
  transform-style: preserve-3d;
  position: relative;
  transform: translate3d(0, 0, 3px);
}

.big-sky {
  z-index: 2;
  transform-style: preserve-3d;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  transform: translate3d(0, 0, 4px);
}

.container-sticky {
  width: 100%;
  height: 6000px;
}

.wrapper-col.center-vertical {
  justify-content: center;
}

.col-10 {
  width: 95%;
}

.card-morceaux {
  height: 400px;
  background-image: radial-gradient(circle, #3f4553 50%, #20293d);
  border-radius: 16px;
  margin-bottom: 1.5rem;
  padding: 2px;
  position: relative;
  overflow: hidden;
}

.lottie-morceau {
  z-index: 3;
  width: 100%;
  height: 100%;
  position: relative;
}

.card-overlay {
  z-index: 2;
  width: 100%;
  height: 100%;
  background-color: #1c2435;
  border-radius: 16px;
  position: relative;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.image-conflictualite {
  width: 100%;
}

.lottie-robot {
  z-index: 3;
  width: 100%;
  height: 100%;
  position: relative;
  top: -4rem;
}

.overlay-text-card {
  z-index: 5;
  background-image: linear-gradient(rgba(15, 23, 42, 0), #0f172a 65%);
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 1.5rem;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lottie-robot-2 {
  z-index: 3;
  width: 100%;
  height: 100%;
  position: relative;
  top: 1.8rem;
}

.progess-bar-pink {
  width: 25%;
  height: 15px;
  background-color: #d09ac4;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-reportage-space {
  width: 100%;
  height: 100%;
  background-color: #070a13;
  background-image: linear-gradient(rgba(28, 36, 53, 0), #1c2435), url('../images/thumbnail.webp');
  background-position: 0 0, 50% 30%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.asteroide-debrits {
  z-index: 5;
  width: 25%;
  position: absolute;
  top: -14%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.cargo {
  z-index: 5;
  width: 55%;
  position: absolute;
  top: 50%;
  bottom: 0%;
  left: auto;
  right: 0%;
  transform: translate(0, -50%);
}

.cta-pink {
  background-color: #d09ac4;
  margin-top: 1.5rem;
  padding: 1rem 3rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-pink:hover {
  background-color: rgba(208, 154, 196, .8);
}

.spaceship-small {
  width: 15%;
  position: absolute;
  top: 6%;
  bottom: auto;
  left: auto;
  right: -3%;
}

.soldier-1 {
  z-index: 1;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.soldier-2 {
  height: 60%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 6%;
  right: auto;
}

.cta-bandeau-link-large-pink {
  width: 60%;
  color: #fff;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  transition: color .2s cubic-bezier(.55, .085, .68, .53);
  display: flex;
}

.cta-bandeau-link-large-pink:hover {
  color: #d09ac4;
}

.girl-hydre {
  height: 100%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.woman-hydre {
  width: 28%;
  position: absolute;
  top: auto;
  bottom: -1%;
  left: 0%;
  right: auto;
}

.girl-2 {
  z-index: 12;
  height: 28%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 22%;
}

.overlay-s03-purple {
  z-index: 2;
  background-image: radial-gradient(circle, rgba(18, 2, 43, 0), #12022b 88%);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.brain-hero {
  z-index: 1;
  width: 27%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 6%;
  right: 0%;
}

.personnage-hero-4 {
  z-index: 3;
  height: 55%;
  position: absolute;
  top: auto;
  bottom: -1%;
  left: auto;
  right: 0%;
}

.nei-cun-overflow {
  z-index: 11;
  width: 55%;
  height: 75%;
  background-image: url('../images/dud3.webp');
  background-position: 0%;
  background-size: cover;
  position: absolute;
  top: 50%;
  bottom: 0%;
  left: 0%;
  right: auto;
  overflow: hidden;
  transform: translate(0, -50%);
}

.girl-maweshu {
  height: 100%;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.column-horizontal {
  align-items: center;
  display: flex;
}

.progess-bar-purple {
  width: 25%;
  height: 15px;
  background-color: #8f00ff;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-reportage-hydre {
  width: 100%;
  height: 100%;
  background-color: #070a13;
  background-image: linear-gradient(rgba(10, 12, 18, 0) 62%, #0a0c12);
  background-position: 0 0;
  background-repeat: repeat;
  background-size: auto;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.liquide-army {
  width: 55%;
  height: 75%;
  position: absolute;
  top: 12%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.population-mili-image {
  width: 100%;
  height: 100%;
  background-image: url('../images/Rectangle-49.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: scroll;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.city {
  z-index: 5;
  width: 100%;
  height: 670px;
  position: relative;
}

.city-middle-building {
  z-index: 6;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.building-middle-show {
  z-index: 7;
  width: 10%;
  height: 30%;
  text-decoration: none;
  position: absolute;
  top: 28%;
  bottom: auto;
  left: 47.5%;
  right: auto;
}

.city-left-buidling {
  z-index: 6;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.building-left-show {
  z-index: 7;
  width: 7%;
  height: 11%;
  position: absolute;
  top: 53%;
  bottom: auto;
  left: 16.5%;
  right: auto;
}

.city-right-buidling {
  z-index: 6;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.building-right-show {
  z-index: 7;
  width: 7%;
  height: 10%;
  position: absolute;
  top: 69%;
  bottom: auto;
  left: 72%;
  right: auto;
}

.city-top-buidling {
  z-index: 6;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.building-top-show {
  z-index: 7;
  width: 7%;
  height: 10%;
  position: absolute;
  top: 17%;
  bottom: auto;
  left: 69%;
  right: auto;
}

.city-bottom-buidling {
  z-index: 6;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.building-bottom-show {
  z-index: 7;
  width: 11%;
  height: 14%;
  position: absolute;
  top: 72%;
  bottom: auto;
  left: 38%;
  right: auto;
}

.card-building-middle {
  width: 380px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, .5);
  border: 1px solid #fff;
  border-radius: 10px;
  margin-top: 2.5rem;
  margin-left: 2.5rem;
  padding: 1.5rem;
  font-size: 15px;
  line-height: 1.4;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.paragraph-no-margin-bottom {
  margin-bottom: 0;
}

.paragraph-no-margin-bottom.bold {
  margin-bottom: .5rem;
  font-weight: 700;
}

.wrap-card-infos-building {
  z-index: 12;
  width: 40%;
  height: 40%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.card-building-top, .card-building-bottom, .card-building-left, .card-building-right {
  width: 380px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, .5);
  border: 1px solid #fff;
  border-radius: 10px;
  margin-top: 2.5rem;
  margin-left: 2.5rem;
  padding: 1.5rem;
  font-size: 15px;
  line-height: 1.4;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.wrap-overlay-nuclear {
  width: 50%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.nuclear {
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.overlay-blue-gradient {
  background-image: linear-gradient(97deg, #1c2435 11%, rgba(32, 41, 61, 0)), linear-gradient(rgba(28, 36, 53, 0), #1c2435 89%);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.image-conflictualite-2 {
  width: 100%;
}

.card-building-default {
  width: 380px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, .5);
  border: 1px solid #fff;
  border-radius: 10px;
  margin-top: 2.5rem;
  margin-left: 2.5rem;
  padding: 1.5rem;
  font-size: 15px;
  line-height: 1.4;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.chat-bot {
  z-index: 999;
  width: 300px;
  background-color: #12022c;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  margin-right: 2rem;
  padding: 3.5rem 1.5rem 1.5rem;
  position: fixed;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
  transform: translate(0, 100%);
}

.chat-feed {
  height: 210px;
  grid-row-gap: 1.5rem;
  background-color: #2c2040;
  border-radius: 4px;
  padding: 1.5rem;
  font-size: 13px;
  line-height: 1.2;
}

.discuss {
  grid-column-gap: 1rem;
  color: #d1d5db;
  align-items: flex-start;
  margin-bottom: 1.5rem;
  display: flex;
}

.discuss.answer-1, .discuss.answer-2, .discuss.answer-3, .discuss.answer-4, .discuss.answer-5, .discuss.answer-6, .discuss.answer-7 {
  display: none;
}

.discuss.default {
  display: flex;
}

.pic-chat {
  width: 30px;
}

.chat-field-wrap {
  padding-top: 1.5rem;
}

.chat-box {
  min-height: 40px;
  background-color: #2c2040;
  background-image: url('../images/Icon.svg');
  background-position: 92%;
  background-repeat: no-repeat;
  background-size: auto;
  border-radius: 4px;
  display: flex;
  position: relative;
}

.message-1 {
  color: #d1d5db;
  padding: 1rem 40px 1rem 1rem;
  font-size: 13px;
  line-height: 1.2;
  text-decoration: none;
  display: block;
}

.message-2, .message-3 {
  color: #d1d5db;
  padding: 1rem 40px 1rem 1rem;
  font-size: 13px;
  line-height: 1.2;
  text-decoration: none;
  display: none;
}

.close-chatbox {
  width: 30px;
  height: 30px;
  background-image: url('../images/Group-156.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 50%;
  position: absolute;
  top: 1rem;
  bottom: auto;
  left: auto;
  right: .5rem;
}

.lottie-chat {
  width: 25px;
  display: none;
  position: relative;
  left: -3px;
}

.expired {
  opacity: .8;
  color: #9c9bae;
  font-size: 11px;
  line-height: 20px;
  position: absolute;
  top: 1.3rem;
  bottom: auto;
  left: 1.5rem;
  right: auto;
}

.visage {
  z-index: 10;
  width: 20%;
  position: absolute;
  top: auto;
  bottom: 24%;
  left: auto;
  right: 0%;
}

.space-fly {
  width: 25%;
  height: auto;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.space-moon-fly {
  width: 28%;
  position: absolute;
  top: auto;
  bottom: -15%;
  left: -12%;
  right: auto;
}

.space-fly-2 {
  width: 22%;
  height: auto;
  position: absolute;
  top: auto;
  bottom: 65%;
  left: auto;
  right: 0%;
}

.cta-purple {
  background-color: #8f00ff;
  margin-top: 1.5rem;
  padding: 1rem 3rem;
  font-family: Tj evolette a, sans-serif;
  font-size: 14px;
  line-height: 14px;
  transition: background-color .2s cubic-bezier(.55, .085, .68, .53);
}

.cta-purple:hover {
  background-color: rgba(143, 0, 255, .8);
}

.block {
  color: #fff;
  background-color: rgba(255, 255, 255, .45);
  border-radius: 4px;
  padding: 5px 20px;
  font-weight: 500;
  text-decoration: none;
}

.video-bd {
  z-index: 99;
  padding-top: 69%;
}

.video-border {
  background-color: #f9f9f9;
  border: 1px solid #30302f;
  border-radius: 8px;
  padding-top: .6rem;
  padding-bottom: .6rem;
  overflow: hidden;
}

.explosion {
  width: 25%;
  position: absolute;
  top: -1%;
  bottom: auto;
  left: auto;
  right: 4%;
}

.fire {
  width: 30%;
  position: absolute;
  top: auto;
  bottom: 6%;
  left: 0%;
  right: auto;
  transform: rotate(-180deg);
}

.truck {
  width: 100%;
  opacity: .1;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.nei-cun-appear {
  width: 100%;
  height: 100%;
  opacity: 0;
  object-fit: cover;
  object-position: 0% 50%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.overflow-neicun {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 50%, #fff 90%);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.lightbox-reportage-hydra {
  width: 100%;
  height: 100%;
  background-color: #070a13;
  background-image: linear-gradient(rgba(10, 12, 18, 0) 62%, #0a0c12), url('../images/thumbnail2.webp');
  background-position: 0 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.soldier-12 {
  z-index: 1;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

html.w-mod-js [data-ix="ia-window"] {
  opacity: 0;
  transform: translate(100%);
}

html.w-mod-js [data-ix="team-image-appear"] {
  opacity: 0;
  transform: translate(-20px);
}

html.w-mod-js [data-ix="team-image-appear-invert"] {
  opacity: 0;
  transform: translate(20px);
}

html.w-mod-js [data-ix="text-team-appear"] {
  opacity: 0;
}

@media screen and (min-width: 1280px) {
  .pnation-card.pnation {
    width: 90%;
  }

  .container, .container.center-vertical.zindex {
    max-width: 1200px;
  }

  .image-red-team {
    height: 480px;
  }

  .cta-more-info {
    font-size: 12px;
  }

  .h2-s1._100.no-margin {
    margin-bottom: 5px;
  }

  .wrapper-detail-defense {
    width: 1020px;
  }

  .box-safe-sphere {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .sous-titre-fakenews {
    padding-right: 50px;
  }

  .wrapper-text-carte-identite {
    padding-left: 22px;
    padding-right: 22px;
  }

  .h2-s2._100 {
    font-size: 50px;
  }

  .detail-infection {
    max-width: 51%;
    top: 12%;
  }

  .detail-infection.grey {
    top: 16%;
  }

  .div-relative {
    position: relative;
  }

  .lezard {
    z-index: 1;
    width: 20%;
    position: absolute;
    top: auto;
    bottom: 19%;
    left: auto;
    right: 12%;
  }

  .lights {
    z-index: 1;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .light-dark {
    z-index: 2;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .screen {
    width: 9.6%;
    position: absolute;
    bottom: auto;
    left: auto;
  }

  .desinfect {
    height: 80%;
  }

  .personnage-hero-2 {
    width: 250px;
    object-fit: contain;
    background-image: linear-gradient(rgba(26, 17, 7, .5), rgba(26, 17, 7, .5)), url('../images/Soldat-1.png');
    background-position: 0 0, 50% 100%;
    background-repeat: repeat, no-repeat;
    background-size: auto, contain;
  }

  .container-2 {
    max-width: 1200px;
  }

  .flag-2 {
    top: 49%;
  }

  .consortium-wrap-video {
    width: 970px;
  }

  .woman-hydre, .space-moon-fly {
    width: 22%;
  }
}

@media screen and (min-width: 1440px) {
  body {
    font-size: 18px;
    line-height: 32px;
  }

  .wrapper {
    padding-top: 160px;
    padding-bottom: 180px;
  }

  .paragraph.small {
    font-size: 16px;
  }

  .psl {
    padding-top: 240px;
  }

  .section-video, .section-book {
    padding-top: 120px;
    padding-bottom: 120px;
  }

  .h2-title-book.centre.slidetext {
    margin-top: 0;
    margin-bottom: 30px;
  }

  .section-cta {
    padding-top: 120px;
    padding-bottom: 120px;
  }

  .vr-section {
    margin-bottom: 0;
  }

  .vr-section.premiere {
    margin-bottom: 120px;
  }

  .section.black-gradient.decouvrir {
    padding-top: 180px;
  }

  .section.black-gradient.mentions {
    padding-top: 200px;
  }

  .section.first-s0 {
    padding-top: 200px;
    padding-bottom: 120px;
  }

  .section.chronique {
    padding-top: 175px;
  }

  .container.center-vertical.zindex {
    max-width: 1130px;
  }

  .menu-link, .saison-1-dropdown, .dropdown-saison {
    font-size: 16px;
    line-height: 16px;
  }

  .menu-footer, .menu-footer-legal {
    font-size: 15px;
    line-height: 18px;
  }

  .call-to-action-box {
    width: 330px;
  }

  .h2-home {
    font-size: 18px;
    line-height: 23px;
  }

  .cta-home {
    padding-top: 14px;
    padding-bottom: 14px;
    font-size: 22px;
  }

  .cta-home.green, .cta-home.orange, .cta-home.pink, .cta-home.purple {
    font-size: 18px;
  }

  .heading-2-about {
    font-size: 18px;
    line-height: 26px;
  }

  .cta-red {
    width: 420px;
  }

  .image-red-team {
    height: 520px;
  }

  .cta-more-info {
    font-size: 13px;
  }

  .h2-s1 {
    font-size: 70px;
    line-height: 82px;
  }

  .h2-s1.no-margin-bottom {
    margin-bottom: 0;
  }

  .cta-arrow-text {
    font-size: 16px;
    line-height: 16px;
  }

  .arrow-cta {
    width: 160px;
  }

  .arrow-cta.full {
    width: 280px;
  }

  .s1-h4 {
    font-size: 20px;
    line-height: 27px;
  }

  .wrapper-box-control {
    width: 300px;
  }

  .titre-box-hyperforteresse {
    font-size: 20px;
    line-height: 28px;
  }

  .bouton-attaque, .bouton-defense {
    font-size: 15px;
    line-height: 15px;
  }

  .wrapper-detail-defense {
    width: 1200px;
  }

  .h4-s1.white {
    font-size: 26px;
    line-height: 26px;
  }

  .spec-solider {
    font-size: 16px;
    line-height: 16px;
  }

  .menu-link-footer {
    font-size: 16px;
    line-height: 22px;
  }

  .faq, .faq-answer {
    font-size: 18px;
  }

  .wrapper-anim-robot {
    width: 352px;
    height: 767px;
    justify-content: flex-start;
    display: flex;
  }

  .fiche-technique {
    padding: 35px;
  }

  .anne-mise-en-service {
    font-size: 16px;
  }

  .h5-s1 {
    font-size: 25px;
  }

  .arrow-cta-video {
    width: auto;
  }

  .label-video {
    font-size: 16px;
    line-height: 16px;
  }

  .wrapper-text-carte-identite {
    padding-left: 25px;
    padding-right: 25px;
  }

  .wrapper-team {
    margin-top: 240px;
  }

  .wrapper-typeform, .video-quels-futurs {
    margin-top: 120px;
  }

  .h2-home-2 {
    font-size: 18px;
    line-height: 23px;
  }

  .cta-home-2 {
    padding-top: 14px;
    padding-bottom: 14px;
    font-size: 22px;
  }

  .arrow-cta-video-2, .arrow-cta-video-s02 {
    width: auto;
  }

  .h2-s2 {
    font-size: 70px;
    line-height: 82px;
  }

  .arrow-cta-lire-article-s02 {
    width: auto;
  }

  .date-virus {
    padding-top: .6rem;
    padding-bottom: .6rem;
  }

  .sapin-overflow {
    background-image: linear-gradient(to right, #fff 10%, rgba(255, 255, 255, 0) 56%), url('../images/Rectangle-48.jpg');
  }

  .detail-infection {
    max-width: 43%;
    top: 19%;
  }

  .detail-infection.grey {
    top: 13%;
  }

  .div-flex-horizontal {
    margin-bottom: 1.5rem;
  }

  .div-flex-horizontal.margin-top.no-margin-bottom {
    margin-top: 2rem;
  }

  .divider {
    margin-top: 2rem;
    margin-bottom: 2rem;
  }

  .divider.more {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .panneau {
    height: 80%;
  }

  .pangolin {
    width: 23%;
  }

  .lightbox-priorite-ecologique {
    background-position: 50%;
  }

  .h2-hermel {
    margin-top: 3rem;
  }

  .paragraph-small {
    font-size: 16px;
    line-height: 24px;
  }

  .recto, .verso {
    padding-right: 2rem;
  }

  .wrap-explications.hiden-mobile {
    min-height: 450px;
  }

  .bloc-explicatif {
    width: 33%;
  }

  .bloc-explicati-ecosysteme {
    width: 30%;
  }

  .arrow-cta-eng {
    width: 200px;
  }

  .menu-link-language-selector {
    font-size: 16px;
    line-height: 16px;
  }

  .ship-hero {
    bottom: 56%;
  }

  .paragraph-light.small {
    font-size: 16px;
  }

  .flag-2 {
    width: 26%;
    top: 44.5%;
    bottom: auto;
    left: 26%;
    right: auto;
  }

  .city {
    height: 800px;
  }

  .building-middle-show {
    font-size: 16px;
  }
}

@media screen and (min-width: 1920px) {
  body {
    font-size: 20px;
    line-height: 31px;
  }

  .button-red.small.more.center.fs {
    width: 170px;
  }

  .section.soldat-du-futur-section {
    background-image: url('../images/tente-1.jpg'), url('../images/BG-grey.jpg');
    background-position: 0 100%, 100% 100%;
    background-repeat: no-repeat, no-repeat;
    background-size: 45%, 54%;
  }

  .section.first {
    padding-top: 100px;
  }

  .navbar-main.dropshadow {
    height: 100px;
    align-items: center;
    display: flex;
  }

  .menu-link {
    font-size: 18px;
    line-height: 18px;
  }

  .dropdown-toggle {
    font-size: 22px;
    line-height: 22px;
  }

  .dropdown-toggle.w--open {
    font-size: 22px;
  }

  .saison-1-dropdown, .dropdown-saison {
    font-size: 20px;
    line-height: 20px;
  }

  .menu-footer, .menu-footer-legal {
    font-size: 17px;
    line-height: 17px;
  }

  .voir-le-trailer {
    font-size: 20px;
    line-height: 26px;
  }

  .wrapper-call-to-action-home {
    top: 0;
  }

  .call-to-action-box {
    width: 420px;
  }

  .h2-home {
    padding-left: 6rem;
    padding-right: 6rem;
    font-size: 20px;
    line-height: 26px;
  }

  .cta-home.blue, .cta-home.green, .cta-home.orange, .cta-home.pink, .cta-home.purple {
    font-size: 22px;
    line-height: 35px;
  }

  .heading-2-about, .paragraphe.white {
    font-size: 18px;
    line-height: 28px;
  }

  .cta-red {
    width: 510px;
    justify-content: center;
  }

  .image-red-team {
    height: 720px;
  }

  .cta-more-info {
    font-size: 14px;
  }

  .cta-red-404 {
    justify-content: center;
  }

  .h2-s1 {
    width: 60%;
  }

  .wrapper-detail-defense {
    width: 1400px;
  }

  .soldat-du-futur-wrapper {
    width: 440px;
  }

  .bubble-soldier {
    top: 49%;
    left: 49.5%;
  }

  .menu-link-footer {
    margin-bottom: 8px;
    font-size: 16px;
    line-height: 16px;
  }

  .titre-footer {
    font-size: 22px;
    line-height: 33px;
  }

  .faq {
    font-size: 20px;
  }

  .faq-answer {
    font-size: 20px;
    line-height: 31px;
  }

  .lightbox-reportage-hyperforteresse, .lightbox-bandeau, .lightbox-reportage-ruse {
    background-color: #000;
  }

  .h1-s1.center._70-title {
    width: 50%;
  }

  .wrapper-text-carte-identite {
    padding-left: 30px;
    padding-right: 30px;
  }

  .h2-home-2 {
    padding-left: 12px;
    padding-right: 12px;
    font-size: 20px;
    line-height: 26px;
  }

  .cta-home-2.blue {
    font-size: 22px;
    line-height: 35px;
  }

  .lightbox-home-2, .lightbox-home-3 {
    height: 390px;
  }

  .h1-s2.center._70-title {
    width: 50%;
  }

  .h2-s2 {
    width: 60%;
  }

  .wrap-move-virus {
    min-height: 460px;
  }

  .lightbox-reportage-biotech {
    background-color: #000;
  }

  .lightbox-bandeau-biotech {
    height: 780px;
    background-color: #000;
  }

  .detail-infection {
    max-width: 50%;
    top: 28%;
  }

  .retour-sur-le-site {
    justify-content: center;
  }

  .col-5-7.center-vertical {
    flex-direction: column;
    justify-content: center;
    display: flex;
  }

  .panneau {
    height: 87%;
  }

  .pangolin {
    bottom: -15%;
  }

  .lightbox-priorite-ecologique {
    background-color: #000;
  }

  .pile-enfant {
    width: 19%;
    left: 5%;
  }

  .lightbox-bandeau-reflexes-energetiques {
    height: 650px;
    background-color: #000;
  }

  .lightbox-reportage-energies {
    background-color: #000;
  }

  .wrap-explications.hiden-mobile {
    min-height: 470px;
  }

  .bloc-explicatif {
    width: 26%;
  }

  .bloc-explicati-ecosysteme {
    width: 24%;
  }

  .menu-link-language-selector {
    font-size: 18px;
    line-height: 18px;
  }

  .flag-2 {
    top: 32.5%;
  }

  .lightbox-reportage-space, .lightbox-reportage-hydre {
    background-color: #000;
  }

  .city {
    height: 910px;
    object-fit: cover;
  }

  .city-middle-building, .city-left-buidling, .city-right-buidling {
    object-fit: cover;
  }

  .building-right-show {
    top: 73%;
  }

  .city-top-buidling {
    object-fit: cover;
  }

  .building-top-show {
    top: 11%;
  }

  .city-bottom-buidling {
    object-fit: cover;
  }

  .building-bottom-show {
    top: 78%;
  }

  .card-building-middle, .card-building-top, .card-building-bottom, .card-building-left, .card-building-right, .card-building-default {
    font-size: 20px;
  }

  .lightbox-reportage-hydra {
    background-color: #000;
  }
}

@media screen and (max-width: 991px) {
  .wrapper {
    padding-top: 100px;
    padding-bottom: 160px;
  }

  .hero {
    height: auto;
  }

  .block-right {
    width: 80%;
  }

  .psl {
    padding-top: 160px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .container-image-psl {
    width: 350px;
    height: 350px;
  }

  .container-text-spl {
    width: 100%;
  }

  .section-video {
    padding-bottom: 50px;
    padding-left: 40px;
    padding-right: 40px;
  }

  .wrapper-video {
    width: 100%;
    margin-bottom: 40px;
  }

  .section-book {
    padding-left: 39px;
    padding-right: 39px;
  }

  .wrapper-text-book {
    width: 100%;
    padding: 0;
  }

  .column-flex-center {
    align-items: flex-end;
  }

  .avatar {
    height: 200px;
  }

  .h2-title-book {
    font-size: 27px;
  }

  .h2-title-book.greyer.small {
    font-size: 16px;
  }

  .column-5 {
    justify-content: flex-end;
    display: flex;
  }

  .column-flex-center-real {
    align-items: center;
  }

  .column-flex-center-real.padding {
    padding-top: 15px;
  }

  .column-flex-center-real.padding.bataille {
    flex-direction: column;
  }

  .background-video {
    width: 200px;
    height: 270px;
  }

  .lightbox-link {
    height: 270px;
  }

  .column-flex {
    justify-content: flex-end;
    display: flex;
  }

  .section-cta {
    padding-left: 40px;
    padding-right: 40px;
  }

  .vr-section.premiere {
    margin-bottom: 80px;
  }

  .wrapper-text-ville-nenuphar {
    width: 100%;
    padding-top: 40px;
    padding-bottom: 50px;
  }

  .book-2 {
    width: 100%;
    position: relative;
  }

  .column-flex-articles {
    flex-direction: column-reverse;
    align-items: flex-start;
  }

  .column-flex-cartes {
    align-items: center;
  }

  .section {
    padding: 80px 40px;
  }

  .section.black-gradient.decouvrir {
    padding-top: 100px;
  }

  .section.black-gradient.mentions {
    padding-top: 140px;
  }

  .section.smoke {
    padding-top: 80px;
  }

  .section.first {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .section.first-s0 {
    padding: 140px 40px 80px;
  }

  .section.chimiquier {
    height: auto;
    flex-direction: column;
  }

  .section.chronique {
    padding-top: 100px;
  }

  .section.first-s02 {
    padding-top: 5rem;
    padding-left: 0;
    padding-right: 0;
  }

  .section.no-padding.story, .section.no-margin-bottom.tutos, .section.no-margin-bottom.no-padding.no-overflow {
    padding-left: 0;
    padding-right: 0;
  }

  .section.first-s02-2, .section.first-s03 {
    padding-top: 5rem;
    padding-left: 0;
    padding-right: 0;
  }

  .section.dark-grey.no-padding.black {
    min-height: 50vh;
    background-image: linear-gradient(rgba(1, 1, 1, .9), rgba(1, 1, 1, .9)), url('../images/moon_image04_v3.webp');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, 270%;
  }

  .section.dark-grey.more-adding-top {
    padding-top: 4rem;
  }

  .section.no-padding.city {
    height: 480px;
    position: relative;
  }

  .section.s03-inner {
    padding-top: 5rem;
    padding-left: 0;
    padding-right: 0;
  }

  .soldier-1-home {
    height: 60%;
  }

  .soldier-2-home {
    height: 40%;
  }

  .soldier-3-home {
    height: 20%;
  }

  .soldier-4-home {
    height: 30%;
    left: 31%;
  }

  .navbar-main {
    display: none;
  }

  .container {
    width: 100%;
  }

  .container.center {
    align-items: center;
  }

  .container.padding-inside {
    padding-left: 30px;
    padding-right: 30px;
  }

  .container.center-vertical.zindex {
    z-index: 30;
  }

  .navbar-menu {
    height: auto;
    flex-direction: column;
    align-items: flex-end;
    padding-left: 20px;
    padding-right: 20px;
  }

  .menu-link {
    color: #000;
    margin-top: 16px;
    margin-bottom: 16px;
    margin-right: 0;
  }

  .menu-link:hover {
    color: #000;
  }

  .menu-saison {
    flex-direction: column;
    align-items: flex-end;
  }

  .dropdown-toggle {
    margin-top: 16px;
  }

  .dropdownlist {
    position: relative;
  }

  .menu-home.inner, .menu-home.inner.w--current {
    margin-right: 0;
  }

  .footer-red-team {
    padding-left: 40px;
    padding-right: 40px;
  }

  .footer-red-team.absolute {
    position: relative;
  }

  .wrapper-content-lightbox-home {
    width: 250px;
    height: 310px;
    transition: filter .2s cubic-bezier(.55, .085, .68, .53);
  }

  .wrapper-content-lightbox-home:hover {
    filter: none;
  }

  .not-the-trailer {
    width: 0;
  }

  .wrapper-call-to-action-home {
    top: 0;
  }

  .cta-red {
    width: 100%;
  }

  .cta-red-404 {
    width: auto;
  }

  .h2-s1.white.center {
    width: 100%;
  }

  .tank-overflow {
    width: 65%;
  }

  .wrapper-nav-inner-left {
    flex-direction: column;
    align-items: flex-end;
  }

  .wrapper-chronologie {
    margin-bottom: 25px;
  }

  .wrapper-hyperforteresse {
    height: auto;
  }

  .wrapper-modal-hyper {
    width: 280px;
    height: 130px;
    top: 230px;
    bottom: auto;
    left: -20px;
    right: auto;
  }

  .wrapper-box-control {
    width: 100%;
    margin-bottom: 20px;
    padding: 20px 10px;
    position: relative;
    top: 0;
    left: 0;
  }

  .titre-box-hyperforteresse.padding10 {
    padding-left: 10px;
  }

  .bouton-attaque {
    text-align: center;
    flex: 1;
    justify-content: center;
    align-items: center;
    margin-top: 0;
    margin-left: 10px;
    margin-right: 10px;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 12px;
    line-height: 15px;
    display: flex;
  }

  .bouton-attaque.first {
    margin-left: 0;
    margin-right: 0;
  }

  .bouton-defense {
    width: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    font-size: 12px;
    line-height: 12px;
    display: flex;
  }

  .scenario-6 {
    height: 100%;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .wrapper-asernal-defense {
    opacity: 0;
    display: none;
  }

  .wrapper-detail-defense {
    width: 90%;
  }

  .wrapper-arrow-cta {
    flex: 1;
    justify-content: center;
    margin-left: 10px;
    margin-right: 10px;
    display: flex;
  }

  .arriw-cta {
    display: none;
  }

  .visage-robot {
    height: 65%;
    opacity: 0;
  }

  .soldat-futur-1 {
    height: 50%;
    opacity: 0;
  }

  .soldat-futur-2 {
    height: 23%;
    opacity: 0;
    right: 16%;
  }

  .wrapper-soldat-du-futur-more {
    font-size: 14px;
    line-height: 24px;
  }

  .soldat-du-futur-wrapper {
    width: 290px;
  }

  .bubble-soldier {
    top: 33.5%;
    left: 26%;
  }

  .box-info-soldier-gantelet, .box-info-soldier-visiere-casque, .box-info-soldier-coms, .box-info-soldier-equipements, .box-info-soldier-capteurs, .box-info-soldier-armement, .box-info-soldier-casque, .box-info-soldier-tenue {
    width: 200px;
    top: 100px;
  }

  .wrapper-voir-equipement {
    width: 100%;
    position: relative;
  }

  .arriw-cta-survol {
    display: none;
  }

  .pero1 {
    width: 140px;
  }

  .pero2 {
    width: 160px;
    top: 4%;
  }

  .corbo1 {
    width: 50px;
    top: 0%;
  }

  .corbo2 {
    width: 80px;
    top: 67%;
  }

  .suivez-nous {
    background-image: linear-gradient(rgba(7, 10, 19, .8), rgba(7, 10, 19, .8)), url('../images/Rectangle-40.png'), url('../images/Rectangle-41.png'), radial-gradient(circle, rgba(255, 255, 255, .15), #070a13);
    background-position: 0 0, 0 100%, 100% 100%, 0 0;
    background-repeat: repeat, no-repeat, no-repeat, repeat;
    background-size: auto, contain, contain, auto;
  }

  .h3-s1 {
    font-size: 35px;
    line-height: 39px;
  }

  .footer-dark {
    padding-left: 40px;
    padding-right: 40px;
  }

  .menu-link-footer {
    margin-right: 0;
  }

  .titre-footer {
    margin-bottom: 10px;
  }

  .logo-footer-dark {
    height: 60px;
  }

  .corbeau1 {
    top: auto;
    bottom: 0%;
    left: auto;
    right: 44%;
  }

  .corbeau2 {
    top: auto;
    bottom: 19%;
    left: auto;
    right: 18%;
  }

  .perroquet-safe {
    width: 140px;
    right: 12%;
  }

  .box-safe-sphere {
    z-index: 20;
    padding-left: 25px;
    padding-right: 25px;
    top: -60px;
  }

  .fake-1, .fake-2 {
    opacity: 0;
    display: none;
  }

  .fake-3 {
    opacity: 0;
    display: none;
    top: 19%;
  }

  .fake-4 {
    opacity: 0;
    display: none;
  }

  .wrapper-anim-robot {
    margin-top: 50px;
  }

  .wrapper-bouton-attaque {
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 15px;
    display: flex;
  }

  .lightbox-reportage-hyperforteresse {
    height: 400px;
  }

  .wrapper-video-top {
    height: auto;
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .lightbox-bandeau {
    height: 400px;
  }

  .h1-s1 {
    text-align: center;
  }

  .preloader {
    z-index: 2147483647;
  }

  .implant-red, .implant-cerveau {
    top: 50%;
    transform: translate(0, -50%);
  }

  .columns-5 {
    flex-direction: column;
    align-items: center;
    display: flex;
  }

  .menu-mobile {
    display: block;
  }

  .menu-burger-wrapper {
    z-index: 99991;
    width: 40px;
    height: 40px;
    background-color: #dc0f2c;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    margin-right: 60px;
    padding: 0;
    display: flex;
    position: fixed;
    top: 0%;
    bottom: auto;
    left: auto;
    right: 0%;
    box-shadow: 1px 1px 5px rgba(105, 104, 113, .1);
  }

  .menu-lottie {
    width: 65%;
    height: 65%;
  }

  .menu-mobile-wrapper {
    z-index: 9999;
    width: 100%;
    background-color: #fff;
    flex-direction: column;
    align-items: flex-end;
    padding: 90px 60px 60px;
    display: flex;
    position: fixed;
    top: 0%;
    bottom: auto;
    left: auto;
    right: 0%;
    transform: translate(0%, -100%);
  }

  .wrapper-team {
    margin-top: 160px;
  }

  .column-trailer {
    flex-direction: column;
  }

  .image-6 {
    width: 430px;
  }

  .column-flex-chimiquier {
    flex-direction: column;
    align-items: center;
  }

  .image-chimiquier {
    position: static;
  }

  .lightbox-chimiquier {
    width: 100%;
    height: 250px;
    position: relative;
  }

  .wrapper-typeform {
    margin-top: 80px;
  }

  .video-quels-futurs {
    margin-top: 160px;
  }

  .columns-9 {
    display: block;
  }

  .wrapper-interstitiel {
    width: 80%;
  }

  .lightbox-home-2, .lightbox-home-3 {
    background-size: cover;
    background-attachment: scroll;
  }

  .h1-s2 {
    text-align: center;
  }

  .plant-hero-2 {
    width: 30%;
  }

  .personnage-hero {
    width: 30%;
    height: auto;
    right: -3%;
  }

  .h2-s2._100 {
    font-size: 44px;
    line-height: 51px;
  }

  .h2-s2._100.white.center {
    padding-left: 0;
  }

  .h2-s2._100.white.left {
    text-align: left;
    justify-content: flex-start;
  }

  .h2-s2._100.white.small {
    padding-left: 30px;
  }

  .h2-s2._100.white.se {
    padding-left: 30px;
    padding-right: 30px;
    font-size: 25px;
    line-height: 30px;
  }

  .h2-s2._100.special {
    font-size: 32px;
    line-height: 36px;
  }

  .h2-s2.white.center {
    width: 100%;
  }

  .wrapper-col.margin-top.tablet-flex-virus {
    flex-direction: column;
    align-items: center;
  }

  .wrapper-col.horizontal-center.relative.flex-infection {
    flex-direction: column-reverse;
  }

  .wrapper-col.vertical-product {
    flex-direction: column;
  }

  .col-12 {
    width: 48.5%;
  }

  .col-12.virusses {
    width: 100%;
  }

  .col-4 {
    width: 31.5%;
  }

  .col-4._100-tablet-special {
    width: 50%;
  }

  .col-4.hiden-tablet {
    display: none;
  }

  .col-4._50-tablet {
    width: 49%;
  }

  .col-5 {
    width: 40%;
  }

  .col-5.armure {
    width: 47%;
  }

  .col-3 {
    width: 23%;
  }

  .col-3.hiden-tablet {
    display: none;
  }

  .col-3.ihm {
    width: 35%;
  }

  .col-3._50-tablet {
    width: 49%;
  }

  .col-1 {
    width: 6%;
  }

  .col-1.hiden-tablet {
    display: none;
  }

  .col-8.infection {
    width: 100%;
  }

  .col-2 {
    width: 14.5%;
  }

  .col-7 {
    width: 57%;
  }

  .card-virus {
    margin-bottom: 2rem;
  }

  .lightbox-bandeau-biotech {
    height: 400px;
  }

  .col-5-5.ihm {
    width: 60%;
  }

  .text-tabs {
    font-size: 13px;
  }

  .detail-infection {
    width: 90%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: -40px;
  }

  .detail-infection.grey {
    bottom: 4rem;
  }

  .detail-infection.relative {
    width: 60%;
    top: -11px;
    right: -15%;
  }

  .infection-video {
    padding-top: 80%;
  }

  .soldat-bandeau {
    height: 90%;
    right: 1%;
  }

  .cta-bandeau-link {
    width: 55%;
  }

  .branche-bandeau {
    height: 70%;
  }

  .oeuf {
    height: 35%;
    left: 13%;
  }

  .fleurs {
    width: 26%;
  }

  .desinfect {
    width: 22%;
    height: auto;
  }

  .pub-overlay {
    display: none;
  }

  .girl {
    width: 30%;
  }

  .girl-img {
    object-position: 50% 50%;
  }

  .text-girl {
    width: 66%;
  }

  .titre-ad {
    font-size: 34px;
  }

  .wrap-cta-add {
    flex-direction: column;
    align-items: flex-start;
  }

  .cta-green-add {
    margin-bottom: .6rem;
  }

  .footer-reduce {
    padding-left: 40px;
    padding-right: 40px;
  }

  .col-5-7 {
    width: 100%;
  }

  .col-5-7.center-vertical {
    margin-top: 2rem;
  }

  .personnage-hero-2 {
    width: 26%;
    right: -3%;
  }

  .plant-hero-3 {
    width: 30%;
  }

  .pangolin {
    width: 48%;
  }

  .lightbox-bandeau-reflexes-energetiques {
    height: 400px;
  }

  .wrap-text-metagram {
    padding-left: 3rem;
  }

  .recto {
    justify-content: center;
    padding: 0;
  }

  .verso {
    padding: 2rem 1rem;
  }

  .hermel-logo-white {
    margin-bottom: .5rem;
  }

  .cta-bandeau-link-large {
    width: 80%;
  }

  .charger {
    height: 70%;
  }

  .masque {
    left: 28%;
  }

  .coleoptere {
    width: 26%;
  }

  .wrap-explications.hiden-mobile {
    min-height: auto;
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  .box-1 {
    padding: 1rem;
    font-size: 12px;
    line-height: 23px;
  }

  .box-2 {
    width: 30%;
    padding: 1rem;
    font-size: 12px;
    line-height: 23px;
    bottom: 64%;
  }

  .col-2-5 {
    width: 23%;
  }

  .paragraph-3 {
    line-height: 20px;
  }

  .bloc-explicati-ecosysteme {
    width: 70%;
    text-align: left;
    top: 10%;
    bottom: auto;
    left: 6%;
    right: auto;
  }

  .menu-link-language-selector {
    color: #000;
    margin-top: 16px;
    margin-bottom: 16px;
    margin-right: 0;
  }

  .menu-link-language-selector:hover, .icon {
    color: #000;
  }

  .dropdown-toggle-2 {
    padding-top: 0;
    padding-bottom: 0;
  }

  .dropdown-list.w--open {
    color: #000;
    background-color: rgba(0, 0, 0, 0);
    position: relative;
  }

  .dropdown-link {
    color: #000;
  }

  .dropdown-3 {
    margin-left: 0;
    margin-right: 0;
  }

  .background-home-page-s3 {
    background-position: 10%;
  }

  .ship-hero {
    width: 30%;
  }

  .personnage-hero-3 {
    width: 30%;
    height: auto;
    right: -3%;
  }

  .container-2 {
    width: 100%;
  }

  .flag-2 {
    width: 30%;
    top: auto;
    bottom: 13%;
    left: 5%;
    right: auto;
  }

  .wrap-anim-people {
    top: 8rem;
  }

  .container-sticky {
    height: 3000px;
    padding-top: 8rem;
  }

  .col-10 {
    width: 100%;
  }

  .image-conflictualite.no-padding {
    padding-top: 0%;
  }

  .spaceship-small {
    width: 26%;
  }

  .soldier-1 {
    height: 70%;
  }

  .soldier-2 {
    height: 35%;
    left: 13%;
  }

  .cta-bandeau-link-large-pink {
    width: 80%;
  }

  .girl-hydre {
    height: 90%;
    right: 1%;
  }

  .girl-2 {
    right: 14%;
  }

  .personnage-hero-4 {
    width: 30%;
    height: auto;
    right: -3%;
  }

  .city {
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .city-middle-building, .city-left-buidling {
    object-fit: cover;
  }

  .building-left-show {
    left: 15%;
  }

  .city-right-buidling {
    object-fit: cover;
  }

  .building-right-show {
    top: 68%;
    left: 73%;
  }

  .city-top-buidling, .city-bottom-buidling {
    object-fit: cover;
  }

  .card-building-middle {
    width: 300px;
    margin-top: 1rem;
    margin-left: 1rem;
    padding: 1rem;
    font-size: 14px;
  }

  .card-building-top {
    width: 300px;
    margin-top: 1rem;
    margin-left: 1rem;
    padding: 1.1rem;
    font-size: 14px;
  }

  .card-building-bottom, .card-building-left, .card-building-right, .card-building-default {
    width: 300px;
    margin-top: 1rem;
    margin-left: 1rem;
    padding: 1rem;
    font-size: 14px;
  }

  .space-fly, .space-fly-2 {
    height: 90%;
    right: 1%;
  }

  .video-bd {
    height: 470px;
    padding-top: 0%;
  }

  .video-border {
    padding: .6rem;
  }

  .fire {
    bottom: 9%;
  }

  .soldier-12 {
    height: 70%;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: auto;
  }
}

@media screen and (max-width: 767px) {
  body {
    font-size: 15px;
    line-height: 27px;
  }

  .wrapper {
    padding-top: 60px;
  }

  .block-right {
    width: 100%;
    padding: 15px;
  }

  .paragraph-2.left.center {
    margin-bottom: 5px;
  }

  .paragraph-2.left.centre {
    text-align: center;
  }

  .psl {
    padding-top: 120px;
    padding-bottom: 60px;
  }

  .container-image-psl {
    width: 300px;
    height: 300px;
    float: left;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
  }

  .columns {
    flex-direction: column;
  }

  .column {
    justify-content: center;
  }

  .section-video {
    padding: 80px 20px 10px;
  }

  .section-book {
    padding: 80px 20px;
  }

  .wrapper-text-book {
    margin-top: 40px;
  }

  .column-2 {
    justify-content: flex-end;
    display: flex;
  }

  .column-2.margin {
    flex-direction: column;
    align-items: flex-start;
    padding-top: 0;
    padding-left: 0;
    padding-right: 50px;
  }

  .column-flex-center {
    flex-direction: column;
  }

  .column-flex-center.real-nenuphar, .column-flex-center.ascenseur {
    flex-direction: column-reverse;
  }

  .book {
    width: 100%;
    height: 280px;
    display: block;
    position: relative;
    overflow: visible;
  }

  .avatar {
    height: 360px;
    margin-top: 33px;
  }

  .h2-title-book {
    text-align: right;
  }

  .h2-title-book.centre, .h2-title-book.centre.slidetext, .h2-title-book.white-chanson {
    text-align: center;
  }

  .columns-2 {
    flex-direction: column;
  }

  .column-5 {
    padding-right: 10px;
  }

  .column-6 {
    text-align: center;
    align-items: center;
    padding-top: 20px;
  }

  .column-flex-center-real {
    flex-direction: column;
  }

  .background-video {
    height: 265px;
    margin-left: auto;
  }

  .slider {
    height: auto;
    margin-top: 50px;
  }

  .column-flex {
    align-items: center;
    padding-right: 10px;
  }

  .section-cta {
    padding: 80px 20px;
  }

  .vr-section.premiere {
    margin-bottom: 60px;
  }

  .wrapper-text-ville-nenuphar {
    padding: 20px 40px 40px;
  }

  .lightbox-vr {
    margin-bottom: 25px;
  }

  .section-lagos {
    padding-top: 20px;
  }

  .image-card-light {
    margin-top: 20px;
  }

  .section-carnets {
    padding-bottom: 40px;
  }

  .book-2 {
    width: 100%;
    height: auto;
    display: block;
  }

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

  .column-flex-cartes {
    flex-direction: row;
  }

  .book-nenuphar {
    width: 100%;
    height: auto;
    display: block;
  }

  .book-ascenseur {
    height: 290px;
    margin-top: 44px;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }

  .musique {
    padding: 20px;
  }

  .wrapper-musique {
    padding-top: 50px;
    padding-bottom: 0;
  }

  .section {
    padding: 60px 20px;
  }

  .section.black-gradient.mentions {
    padding-top: 120px;
  }

  .section.smoke {
    padding-top: 60px;
  }

  .section.soldat-du-futur-section {
    background-size: contain;
  }

  .section.hyperoverflow {
    overflow: visible;
  }

  .section.first-s0 {
    padding-top: 120px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .section.carte {
    height: 290px;
  }

  .section.chronique {
    padding-top: 80px;
  }

  .section.dark-grey.no-padding.black {
    background-image: linear-gradient(rgba(1, 1, 1, .9), rgba(1, 1, 1, .9)), url('../images/moon_image04_v3.webp');
    background-size: auto, 470%;
  }

  .section.no-padding.city {
    height: 400px;
    overflow: visible;
  }

  .section.s03-inner {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .section.more-padding-bottom-mobile {
    padding-bottom: 4rem;
  }

  .soldier-1-home {
    height: 60%;
    left: -10%;
  }

  .soldier-4-home {
    display: none;
    top: 55%;
    left: 23%;
  }

  .container.contpadding {
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 20px;
  }

  .menu-saison {
    flex-direction: column;
  }

  .dropdown-toggle {
    margin-top: 10px;
    margin-bottom: 20px;
  }

  .dropdown-toggle.w--open {
    margin-bottom: 0;
  }

  .menu-footer.legal {
    margin-top: .5rem;
  }

  .wrapper-menu-footer.darkone {
    flex-wrap: wrap;
    padding-left: 10px;
    padding-right: 10px;
  }

  .voir-le-trailer {
    font-size: 15px;
    line-height: 18px;
  }

  .not-the-trailer {
    width: 0;
  }

  .wrapper-call-to-action-home.cxenter {
    grid-row-gap: 1rem;
    flex-direction: column;
  }

  .call-to-action-box.margin {
    margin-left: 0;
    margin-right: 0;
  }

  .h2-home {
    font-size: 15px;
    line-height: 18px;
  }

  .cta-home {
    width: 90%;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    font-size: 18px;
    display: block;
  }

  .cta-red {
    width: 190px;
  }

  .wrapper-image-about {
    flex-direction: row;
  }

  .wrapper-text-abour {
    margin-bottom: 30px;
    padding-left: 0;
  }

  .columns-3 {
    flex-direction: column-reverse;
  }

  .wrapper-cta-about {
    flex-direction: column;
    display: flex;
  }

  .h2-s1 {
    width: 90%;
    margin-bottom: 20px;
    font-size: 55px;
    line-height: 62px;
  }

  .h2-s1._100 {
    font-size: 44px;
  }

  .h2-s1.full._100 {
    text-align: center;
  }

  .h2-s1.full._100.np {
    text-align: right;
  }

  .h2-s1.white.centerteam {
    text-align: center;
  }

  .h2-s1.centersmall {
    width: 100%;
  }

  .wrapper-section-roll {
    padding-bottom: 0;
  }

  .wrapper-section-roll.padding {
    padding-left: 50px;
  }

  .wrapper-section-roll.mini-padding-top {
    padding-top: 30px;
  }

  .boat-article {
    background-image: linear-gradient(rgba(255, 255, 255, .8), rgba(255, 255, 255, .8) 70%, rgba(255, 255, 255, 0)), url('../images/image.jpg');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, scroll;
  }

  .wrapper-hyperforteresse {
    margin-top: 30px;
  }

  .wrapper-modal-hyper {
    width: 360px;
    height: 120px;
    margin-top: 20px;
    position: absolute;
    top: auto;
    bottom: -75px;
    left: 0%;
    right: auto;
  }

  .bouton-attaque {
    margin-top: 10px;
    margin-left: 5px;
    margin-right: 5px;
    padding: 10px;
  }

  .h4-s1.white {
    font-size: 19px;
    line-height: 25px;
  }

  .icones-armes-defense {
    width: 60px;
    margin-bottom: 15px;
    margin-left: 0;
    margin-right: 0;
  }

  .icones-armes-defense.smaller {
    width: 40px;
  }

  .columns-armes-defense {
    flex-direction: column;
    align-items: flex-start;
  }

  .visage-robot {
    height: 55%;
    opacity: 0;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: auto;
  }

  .soldat-futur-1 {
    height: 40%;
    opacity: 0;
  }

  .soldat-futur-2 {
    height: 20%;
    opacity: 0;
    bottom: 3%;
    right: 21%;
  }

  .soldat-du-futur-wrapper {
    z-index: 500;
    width: 50%;
    margin-top: 20px;
    margin-left: 0;
    margin-right: 0;
  }

  .bubble-soldier {
    left: 33%;
  }

  .box-info-soldier-gantelet, .box-info-soldier-visiere-casque, .box-info-soldier-coms, .box-info-soldier-equipements, .box-info-soldier-capteurs, .box-info-soldier-armement, .box-info-soldier-casque, .box-info-soldier-tenue {
    width: 45%;
    top: 50px;
    bottom: auto;
    left: auto;
    right: 0%;
  }

  .pero1 {
    width: 110px;
    top: 71%;
    right: 12%;
  }

  .pero2 {
    width: 120px;
    top: 7%;
  }

  .corbo2 {
    top: 63%;
    left: 12%;
  }

  .footer-dark {
    padding-top: 2rem;
    padding-left: 20px;
    padding-right: 20px;
  }

  .titre-footer {
    margin-top: 1rem;
  }

  .corbeau1 {
    right: 23%;
  }

  .corbeau2 {
    left: 84%;
    right: 0%;
  }

  .perroquet-safe {
    width: 110px;
    top: 10%;
  }

  .virus-overflow {
    width: 100%;
    height: 40%;
  }

  .virus-image-article {
    background-image: linear-gradient(rgba(255, 255, 255, .5), #fff), url('../images/Virus.jpg');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, scroll;
  }

  .sous-titre-fakenews {
    margin-bottom: 25px;
    font-size: 21px;
    line-height: 26px;
  }

  .fake-1 {
    top: 0%;
  }

  .fake-2 {
    top: 15%;
  }

  .fake-3 {
    top: 27%;
  }

  .fake-4 {
    top: 47%;
  }

  .faq {
    font-size: 15px;
  }

  .faq-answer {
    font-size: 15px;
    line-height: 27px;
  }

  .image-robot-generation {
    width: 100%;
    height: 250px;
    background-image: linear-gradient(rgba(255, 255, 255, .5), #fff), url('../images/Rectangle-46.jpg');
    background-position: 0 0, 50% 0;
    background-size: auto, cover;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .decouvrer-hyper {
    top: 66%;
  }

  .decouvrez-hyper-2 {
    top: 3%;
  }

  .wrapper-video-top {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .lightbox-reportage-ruse {
    height: 400px;
  }

  .h1-s1 {
    text-align: center;
    font-size: 62px;
    line-height: 80px;
  }

  .h1-s1.center._70-title {
    width: 90%;
  }

  .preloader {
    z-index: 999999999;
  }

  .lottie-loader {
    z-index: 9999;
  }

  .lottie-losange {
    z-index: 999999;
  }

  .column-12 {
    padding-left: 0;
    padding-right: 0;
  }

  .link-block-2 {
    margin-top: 2rem;
  }

  .paragraphe-50 {
    width: 70%;
  }

  .menu-mobile {
    z-index: 999;
    display: block;
    position: relative;
  }

  .menu-burger-wrapper {
    z-index: 99;
    background-color: #dc0f2c;
    background-image: none;
    margin-top: 22px;
    margin-right: 40px;
  }

  .menu-mobile-wrapper {
    z-index: 98;
    background-image: none;
    padding-bottom: 30px;
    padding-left: 40px;
    padding-right: 40px;
  }

  .wrapper-team {
    margin-top: 120px;
  }

  .column-trailer {
    flex-direction: column;
  }

  .image-6 {
    object-fit: fill;
    object-position: 50% 50%;
  }

  .lightbox-realite-virtuelle {
    width: 100%;
  }

  .lightbox-carte {
    height: 290px;
  }

  .lightbox-link-5 {
    padding-left: 0;
  }

  .column-flex-chimiquier {
    flex-direction: row;
  }

  .wrapper-typeform {
    margin-top: 60px;
  }

  .video-quels-futurs {
    margin-top: 120px;
  }

  .wrapper-interstitiel {
    width: 90%;
  }

  .social-link-footer {
    margin-left: 0;
    margin-right: 1rem;
  }

  .social-link-wrapper {
    justify-content: flex-start;
    margin-top: 2rem;
  }

  .h2-home-2 {
    font-size: 15px;
    line-height: 18px;
  }

  .cta-home-2 {
    width: 90%;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    font-size: 18px;
    display: block;
  }

  .h1-s2 {
    text-align: center;
    font-size: 62px;
    line-height: 80px;
  }

  .h1-s2.center._70-title {
    width: 90%;
    font-size: 58px;
    line-height: 66px;
  }

  .h1-s2.center._100-title {
    width: 90%;
  }

  .wrapper-section-roll-invert {
    padding-top: 2rem;
    padding-bottom: 0;
  }

  .manifestation-overflow {
    width: 100%;
    height: 250px;
    position: relative;
  }

  .h2-s2 {
    width: 90%;
    margin-bottom: 20px;
    font-size: 55px;
    line-height: 62px;
  }

  .h2-s2._100 {
    font-size: 44px;
  }

  .h2-s2._100.white {
    padding-left: 2rem;
    font-size: 30px;
  }

  .h2-s2._100.white.center {
    margin-bottom: 2rem;
  }

  .h2-s2._100.white.left {
    text-align: left;
    justify-content: flex-start;
    padding-left: 0;
  }

  .h2-s2._100.white.small {
    padding-right: 30px;
    font-size: 25px;
    line-height: 30px;
  }

  .wrapper-col.footer {
    flex-wrap: wrap;
  }

  .wrapper-col.hermel, .wrapper-col.enskin {
    flex-direction: column;
  }

  .wrapper-col.mobile.feed-meta {
    flex-direction: column;
    padding-top: 6rem;
  }

  .col-6._100-enskin, .wrapper-paragraph-small {
    width: 100%;
  }

  .h3-s2.different {
    width: 70%;
  }

  .col-11 {
    width: 48%;
  }

  .col-11.portrait-100 {
    width: 100%;
  }

  .col-12 {
    width: 48%;
  }

  .col-12.virusses {
    width: 100%;
  }

  .col-4 {
    width: 48%;
  }

  .col-4._100-tablet-special {
    width: 80%;
  }

  .col-4._50-tablet.feddmeta {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
  }

  .col-5 {
    width: 48%;
  }

  .col-5.armure, .col-5.hermel {
    width: 100%;
  }

  .col-3 {
    width: 48%;
  }

  .col-3._50-tablet.feddmeta {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
  }

  .col-1, .col-8, .col-2, .col-7 {
    width: 48%;
  }

  .col-7.hermel {
    width: 100%;
  }

  .button-tech {
    width: 90%;
  }

  .lightbox-reportage-biotech {
    height: 400px;
  }

  .progess-bar-gree {
    height: 10px;
  }

  .paragraph-white.armu {
    margin-bottom: 0;
    font-size: 12px;
    line-height: 22px;
  }

  .tabs-menu-ecosysteme {
    margin-top: 2rem;
  }

  .tab-ecosystem {
    padding-left: 0;
    padding-right: 0;
  }

  .text-tabs {
    font-size: 11px;
  }

  .sapin-overflow {
    width: 100%;
    height: 250px;
    position: relative;
  }

  .mouche-2 {
    top: 35%;
    right: 23%;
  }

  .branche {
    display: block;
  }

  .green-bar-top, .green-bar-bottom {
    height: 10px;
  }

  .green-bar-left, .green-bar-right {
    width: 10px;
  }

  .moustique-bandeua {
    bottom: 8%;
  }

  .soldat-bandeau {
    width: 20%;
    height: auto;
  }

  .cta-bandeau-link {
    width: 80%;
  }

  .title-follow {
    font-size: 30px;
    line-height: 51px;
  }

  .branche-bandeau {
    height: 50%;
  }

  .oeuf {
    height: 30%;
    left: 20%;
  }

  .fleurs {
    right: 31%;
  }

  .desinfect {
    width: 25%;
  }

  .bandeau-ad {
    width: 90%;
    flex-direction: column;
    margin-left: auto;
    margin-right: auto;
    position: relative;
  }

  .girl {
    width: 100%;
  }

  .girl-img {
    height: 250px;
  }

  .text-girl {
    width: 100%;
    padding: 2rem;
  }

  .wrapper-section-roll-invert-sapin {
    padding-top: 2rem;
    padding-bottom: 0;
    position: static;
  }

  .wrap-sapin-relative {
    position: relative;
  }

  .personnage-hero-2 {
    width: 24%;
  }

  .plant-hero-4 {
    height: 50%;
  }

  .nuit-carbonique-overflow {
    width: 100%;
    height: 250px;
    background-image: url('../images/Rectangle-48_1.jpg');
    background-position: 100%;
    background-size: cover;
    position: relative;
  }

  .panneau, .pangolin {
    display: none;
  }

  .progess-bar-orange {
    height: 10px;
  }

  .lightbox-priorite-ecologique {
    height: 400px;
  }

  .wrap-text-metagram {
    padding-top: 3rem;
    padding-bottom: 6rem;
  }

  .parent-3d {
    width: 80%;
    margin-top: 3rem;
    margin-left: auto;
    margin-right: auto;
  }

  .recto {
    padding: 3rem;
  }

  .hermel-logo-white {
    width: auto;
    height: 33px;
  }

  .progess-bar-yello {
    height: 10px;
  }

  .lightbox-reportage-energies {
    height: 400px;
  }

  .cta-bandeau-link-large {
    width: 100%;
  }

  .charger {
    height: 40%;
    top: 45%;
  }

  .masque {
    width: 12%;
    object-fit: contain;
    left: 20%;
  }

  .coleoptere {
    right: 31%;
  }

  .wrap-explications.hiden-mobile {
    display: none;
  }

  .wrap-explications.show-mobile {
    width: 85%;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
    padding: 1rem;
    display: block;
    position: absolute;
    top: 4%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .h3-skintech {
    margin-bottom: 5px;
    font-size: 18px;
    line-height: 24px;
  }

  .video-skintech {
    width: 80%;
    height: 740px;
    margin-top: 2rem;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: visible;
  }

  .wrap-chaussures, .wrap-bandes, .wrap-sac, .wrap-armure {
    padding: 0;
    position: relative;
  }

  .orange-bar-top, .orange-bar-bottom {
    height: 10px;
  }

  .orange-bar-left, .orange-bar-right {
    width: 10px;
  }

  .box-1 {
    width: 30%;
    top: 6%;
  }

  .box-2 {
    width: 47%;
    bottom: 76%;
  }

  .image-7 {
    height: 390px;
    object-fit: contain;
  }

  .col-2-5 {
    width: 48%;
  }

  .paragraph-3 {
    margin-top: 1rem;
  }

  .bloc-explicatif {
    width: 50%;
  }

  .bloc-explicati-ecosysteme {
    width: 67%;
    text-align: left;
  }

  .space-overflow {
    width: 100%;
    height: 250px;
    position: relative;
  }

  .spaceship-travel, .consortium-overflow {
    width: 100%;
    height: 350px;
    position: relative;
  }

  .flag-1 {
    width: 30%;
    top: -47%;
    bottom: auto;
    left: auto;
    right: 0%;
  }

  .repu-overflow {
    width: 100%;
    height: 350px;
    position: relative;
  }

  .flag-2 {
    z-index: 16;
    width: 30%;
    top: 22%;
    bottom: auto;
    left: auto;
    right: 5%;
  }

  .consortium-video {
    position: relative;
  }

  .consortium-wrap-video {
    width: 100%;
  }

  .container-sticky {
    height: 2000px;
  }

  .wrapper-col.margin-top.morceaux {
    grid-row-gap: 3rem;
    flex-direction: column;
  }

  .col-4.morceaux-espace {
    width: 100%;
  }

  .progess-bar-pink {
    height: 10px;
  }

  .lightbox-reportage-space {
    height: 400px;
  }

  .cargo {
    width: 90%;
    margin-top: 2rem;
    position: relative;
    top: 0%;
    right: -29%;
    transform: none;
  }

  .spaceship-small {
    right: 31%;
  }

  .soldier-1 {
    height: 50%;
  }

  .soldier-2 {
    height: 30%;
    left: 20%;
  }

  .cta-bandeau-link-large-pink {
    width: 100%;
  }

  .girl-hydre {
    width: 20%;
    height: auto;
  }

  .nei-cun-overflow {
    width: 100%;
    height: 300px;
    position: relative;
    top: 0%;
    transform: none;
  }

  .progess-bar-purple {
    height: 10px;
  }

  .lightbox-reportage-hydre {
    height: 400px;
  }

  .building-middle-show {
    width: 14%;
    height: 35%;
    top: 28%;
    left: 46%;
  }

  .building-left-show {
    width: 11%;
    height: 15%;
    top: 50%;
    left: 9%;
  }

  .building-right-show {
    width: 12%;
    height: 14%;
    top: 66%;
    left: 74%;
  }

  .building-top-show {
    width: 11%;
    height: 15%;
    top: 15%;
    left: 71%;
  }

  .building-bottom-show {
    width: 15%;
    height: 17%;
    top: 69%;
    left: 35%;
  }

  .card-building-middle {
    width: 100%;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background-color: #f8f8f8;
    margin-top: 0;
    margin-left: 0;
  }

  .wrap-card-infos-building {
    width: 100%;
    position: relative;
    top: -3rem;
  }

  .card-building-top, .card-building-bottom, .card-building-left, .card-building-right {
    width: 100%;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background-color: #f8f8f8;
    margin-top: 0;
    margin-left: 0;
  }

  .wrap-overlay-nuclear {
    object-fit: cover;
    object-position: 0% 100%;
  }

  .nuclear {
    height: 100%;
    object-fit: cover;
    object-position: 0% 50%;
  }

  .card-building-default {
    width: 100%;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background-color: #f8f8f8;
    margin-top: 0;
    margin-left: 0;
  }

  .space-fly, .space-fly-2 {
    width: 20%;
    height: auto;
  }

  .video-bd {
    height: 360px;
    padding-top: 0%;
  }

  .lightbox-reportage-hydra {
    height: 400px;
  }

  .soldier-12 {
    height: 50%;
  }
}

@media screen and (max-width: 479px) {
  body {
    font-size: 14px;
    line-height: 24px;
  }

  .hero {
    height: 85vh;
  }

  .color-background {
    background-image: url('../images/mobile.jpg');
    background-position: 50%;
  }

  .block-right {
    width: 100%;
    padding: 20px;
  }

  .paragraph.small {
    font-size: 12px;
    line-height: 18px;
  }

  .paragraph.white._70 {
    width: 90%;
  }

  .h1-red-team {
    margin-top: 10px;
    font-size: 28px;
    line-height: 37px;
  }

  .paragraph-2 {
    margin-bottom: 50px;
    font-size: 12px;
    line-height: 18px;
  }

  .paragraph-2.right {
    margin-bottom: 15px;
  }

  .paragraph-2.right.marge.white {
    width: 100%;
  }

  .paragraph-2.left.centre {
    margin-bottom: 0;
  }

  .psl {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .container-image-psl {
    width: 220px;
    height: 220px;
  }

  .section-video {
    padding: 60px 10px 0;
  }

  .wrapper-video {
    width: 100%;
    margin-bottom: 0;
  }

  .section-book {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .wrapper-text-book {
    margin-top: 20px;
    padding: 0 0 35px;
  }

  .column-2 {
    align-items: flex-end;
  }

  .column-2.margin {
    padding-left: 20px;
    padding-right: 20px;
  }

  .column-2.margin.centerflex {
    align-items: center;
    padding-top: 20px;
  }

  .column-flex-center.real-nenuphar {
    flex-direction: column-reverse;
    margin-top: 50px;
  }

  .column-flex-center.ascenseur {
    flex-direction: column-reverse;
  }

  .text-span {
    font-size: 21px;
  }

  .text-span.slidetext {
    text-align: center;
    padding-left: 0;
    padding-right: 0;
    font-size: 10px;
    line-height: 10px;
  }

  .column-3 {
    padding-left: 0;
    padding-right: 0;
  }

  .book {
    width: 100%;
    height: auto;
    display: block;
  }

  .avatar {
    height: 300px;
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .h2-title-book {
    margin-top: 10px;
    font-size: 21px;
    line-height: 30px;
  }

  .h2-title-book.greyer.small {
    font-size: 20px;
  }

  .h2-title-book.centre.slidetext {
    padding-left: 0;
    padding-right: 0;
    font-size: 20px;
    line-height: 20px;
  }

  .column-flex-center-real.padding {
    padding-bottom: 0;
  }

  .slide {
    padding-left: 15px;
    padding-right: 15px;
  }

  .section-cta {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .section-cta.black {
    padding-left: 20px;
    padding-right: 20px;
  }

  .instagram {
    width: 40px;
    height: 40px;
    background-size: 20px;
  }

  .vr-section {
    width: 100%;
    min-height: 190px;
  }

  .pnation-card {
    min-height: 120px;
    margin-top: 20px;
  }

  .wrapper-text-ville-nenuphar {
    padding: 0 10px;
  }

  .lightbox-vr {
    margin-top: 20px;
  }

  .section-carnets {
    padding-top: 40px;
  }

  .book-2 {
    height: auto;
    margin-bottom: 15px;
    display: block;
  }

  .column-flex-cartes {
    flex-direction: column;
  }

  .book-nenuphar {
    width: 100%;
    height: 100%;
    display: block;
  }

  .book-ascenseur {
    width: 90%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }

  .musique {
    width: 80%;
  }

  .div-block-4 {
    width: 40px;
    height: 40px;
  }

  .wrapper-musique {
    padding-top: 0;
  }

  .section.black {
    align-items: flex-start;
    padding-top: 120px;
    padding-bottom: 40px;
    display: block;
  }

  .section.black._100vh {
    padding-top: 80px;
  }

  .section.black-gradient {
    align-items: flex-start;
    padding-top: 100px;
    padding-bottom: 60px;
    display: block;
  }

  .section.black-gradient.center-404 {
    align-items: center;
    display: flex;
  }

  .section.smoke {
    padding-top: 60px;
  }

  .section.safe-sphere-section {
    padding-left: 0;
    padding-right: 0;
  }

  .section.hyperoverflow {
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .section.afterhyper {
    padding-top: 80px;
  }

  .section.first-s0 {
    padding-top: 110px;
  }

  .section.carte {
    height: auto;
    flex-direction: column;
  }

  .section.black, .section.black-s2 {
    align-items: flex-start;
    padding-top: 120px;
    padding-bottom: 40px;
    display: block;
  }

  .section.no-padding.metagram {
    padding-left: 0;
    padding-right: 0;
  }

  .section.no-padding.city {
    height: 270px;
  }

  .section.more-padding {
    flex-direction: column-reverse;
    padding-top: 60px;
    padding-bottom: 60px;
    display: flex;
  }

  .soldier-1-home {
    height: 100%;
    top: 0%;
    bottom: auto;
    left: -40%;
    right: auto;
  }

  .soldier-2-home, .soldier-3-home {
    display: none;
  }

  .container {
    flex-direction: column-reverse;
    padding-left: 10px;
    padding-right: 10px;
  }

  .container.padding-inside.safe {
    padding-left: 0;
    padding-right: 0;
  }

  .container.center-robot {
    flex-direction: column;
    display: flex;
  }

  .container.not-relative.nopadding, .container.metagram {
    padding-left: 0;
    padding-right: 0;
  }

  .navbar-menu.prod {
    padding-left: 10px;
    padding-right: 20px;
  }

  .footer-red-team {
    height: auto;
    padding-top: 25px;
    padding-bottom: 25px;
    position: relative;
  }

  .menu-footer {
    margin-bottom: 10px;
  }

  .border-red-bottom {
    bottom: -20px;
  }

  .menu-footer-legal {
    font-size: 12px;
  }

  .wrapper-menu-footer.darkone {
    flex-direction: column;
    justify-content: center;
  }

  .not-the-trailer {
    width: 0%;
  }

  .wrapper-call-to-action-home {
    flex-direction: column;
    margin-top: 40px;
  }

  .call-to-action-box {
    width: 100%;
    margin-bottom: 40px;
  }

  .h2-home {
    padding-left: 25px;
    padding-right: 25px;
  }

  .cta-home {
    margin-top: 10px;
  }

  .cta-home.blue.insta {
    line-height: 20px;
  }

  .cta-home.white.opac {
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: 14px;
  }

  .wrapper-footer {
    flex-direction: column-reverse;
    align-items: center;
  }

  .cta-red {
    width: 100%;
  }

  .cta-text-red._404 {
    text-align: center;
  }

  .cta-text-red.prod {
    font-size: 11px;
  }

  .image-red-team {
    height: 330px;
    margin-top: 40px;
  }

  .wrapper-image-about {
    flex-direction: column-reverse;
  }

  .h2-s1 {
    width: 100%;
    font-size: 32px;
    line-height: 40px;
  }

  .h2-s1._100 {
    font-size: 29px;
  }

  .h2-s1.full {
    width: 100%;
  }

  .wrapper-section-roll {
    padding-top: 60px;
    padding-bottom: 0;
  }

  .wrapper-section-roll.padding {
    padding-left: 0;
  }

  .tank-image-article {
    width: 100%;
  }

  .tank-overflow {
    width: 100%;
    height: 220px;
  }

  .cta-arrow-text {
    line-height: 17px;
  }

  .cta-arrow-text.no-padding-left {
    margin-left: 0;
  }

  .arrow-cta {
    margin-top: 20px;
  }

  .arrow-cta.full {
    width: 170px;
  }

  .arrow-cta.full.armvie {
    margin-bottom: 15px;
  }

  .arrow-cta.cartes {
    width: 100%;
  }

  .date, .location {
    height: 20px;
  }

  .boat-article {
    width: 100%;
    height: 40%;
    background-image: linear-gradient(#fff, rgba(255, 255, 255, .8) 44%, rgba(255, 255, 255, 0)), url('../images/image.jpg');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, scroll;
  }

  .boat-article.gradient-boat {
    background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, .8) 44%, #fff), url('../images/image.jpg');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, scroll;
  }

  .s1-h4 {
    margin-top: 0;
  }

  .missile {
    z-index: 10;
    left: -200px;
  }

  .paragraphe-70 {
    width: 100%;
  }

  .planes {
    display: none;
  }

  .triangle {
    width: 10%;
  }

  .triangle-small {
    width: 15%;
  }

  .wrapper-modal-hyper {
    width: 100%;
    position: absolute;
    top: auto;
    bottom: -80px;
    left: 0%;
    right: 0%;
  }

  .wrapper-box-control {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
    padding-bottom: 15px;
    position: relative;
    top: 0;
    left: 0;
  }

  .titre-box-hyperforteresse {
    font-size: 16px;
    line-height: 23px;
  }

  .titre-box-hyperforteresse.padding10 {
    font-size: 15px;
    line-height: 21px;
  }

  .bouton-attaque {
    width: auto;
    flex: 1;
    margin: 0 2.5px 5px;
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 10px;
    line-height: 13px;
  }

  .bouton-defense {
    width: auto;
    flex: 1;
    margin: 0 2.5px 5px;
    padding: 8px 10px;
    font-size: 10px;
    line-height: 13px;
  }

  .scenario-6-modal {
    width: 100%;
  }

  .wrapper-detail-defense {
    padding: 10px 20px 20px;
  }

  .icones-armes-defense {
    width: 60px;
  }

  .wrapper-arrow-cta {
    width: 100%;
    flex: 1;
    margin-left: 2.5px;
    margin-right: 2.5px;
  }

  .visage-robot {
    height: 35%;
    opacity: 0;
  }

  .soldat-futur-1 {
    height: 30%;
    opacity: 0;
    right: 4%;
  }

  .soldat-futur-2 {
    height: 16%;
    opacity: 0;
    right: 25%;
  }

  .wrapper-soldat-du-futur-more {
    font-size: 12px;
    line-height: 18px;
  }

  .soldat-du-futur-wrapper {
    z-index: 500;
    width: 100%;
    left: -33%;
  }

  .bubble-soldier {
    z-index: 500;
    width: 35px;
    height: 35px;
    top: 43.5%;
    left: 42%;
  }

  .spec-solider {
    font-size: 11px;
    line-height: 11px;
  }

  .box-info-soldier-gantelet, .box-info-soldier-visiere-casque, .box-info-soldier-coms, .box-info-soldier-equipements, .box-info-soldier-capteurs, .box-info-soldier-armement, .box-info-soldier-casque, .box-info-soldier-tenue {
    width: 50%;
    padding: 15px;
    top: 0%;
    bottom: auto;
    left: auto;
    right: -20px;
  }

  .pero1 {
    width: 80px;
    top: 68%;
    right: 4%;
  }

  .pero2 {
    top: 1%;
  }

  .corbo1 {
    top: 4%;
    left: 17%;
  }

  .corbo2 {
    width: 60px;
    top: 85%;
    left: 4%;
  }

  .suivez-nous {
    padding: 30px;
  }

  .h3-s1 {
    font-size: 30px;
    line-height: 36px;
  }

  .footer-dark {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .menu-link-footer, .titre-footer {
    text-align: center;
  }

  .logo-footer-dark {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    display: block;
  }

  .corbeau1 {
    width: 60px;
  }

  .corbeau2 {
    width: 40px;
    bottom: 13%;
    left: 76%;
  }

  .tab-link-safe {
    text-align: center;
    margin-top: 5px;
    font-size: 17px;
    line-height: 20px;
  }

  .triangle-jaune-small.tracteur {
    width: 25%;
  }

  .box-safe-sphere {
    flex-direction: column;
    padding: 10px 15px 25px;
    display: flex;
    top: 0;
  }

  .sous-titre-safe-sphere {
    font-size: 15px;
    line-height: 20px;
  }

  .columns-4 {
    flex-direction: column;
  }

  .fake-1 {
    width: 70%;
  }

  .fake-2 {
    width: 70%;
    top: 19%;
  }

  .fake-3 {
    width: 70%;
    top: auto;
    bottom: 31%;
    left: 7%;
    right: auto;
  }

  .fake-4 {
    width: 70%;
    top: auto;
    bottom: 15%;
    left: auto;
    right: 8%;
  }

  .wrapper-new-card {
    margin-bottom: 10px;
  }

  .wrapper-new-card.number2 {
    margin-top: 50px;
  }

  .decouvrer-hyper {
    opacity: .2;
    top: 55%;
  }

  .wrapper-forces-robotiques {
    margin-top: 0;
  }

  .wrapper-anim-robot {
    width: 280px;
    height: 610px;
  }

  .wrapper-anim-robot.first-robot {
    margin-top: 24px;
  }

  .voir-fiche-technique {
    width: 80%;
    text-align: center;
    line-height: 20px;
  }

  .anne-mise-en-service {
    font-size: 12px;
    line-height: 18px;
  }

  .h5-s1 {
    font-size: 19px;
    line-height: 30px;
  }

  .image-5 {
    display: none;
  }

  .wrapper-bouton-attaque {
    flex-flow: wrap;
    margin-top: 10px;
  }

  .column-10 {
    padding-left: 0;
    padding-right: 0;
  }

  .arrow-cta-video {
    margin-top: 20px;
  }

  .lightbox-reportage-hyperforteresse, .lightbox-bandeau, .lightbox-reportage-ruse {
    height: 280px;
  }

  .h1-s1 {
    font-size: 34px;
    line-height: 45px;
  }

  .h1-s1.center._70-title {
    width: 100%;
    margin-top: 30px;
    font-size: 35px;
    line-height: 44px;
  }

  .label-video {
    font-size: 11px;
    line-height: 11px;
  }

  .label-video.blue {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding-left: 7px;
    padding-right: 7px;
    line-height: 13px;
    display: block;
    left: 50%;
    transform: translate(-50%);
  }

  .label-video.yellow {
    text-align: center;
    margin-left: 0;
    margin-right: 0;
    left: 50%;
    transform: translate(-50%);
  }

  .premier-implant-wrapper {
    width: 100%;
  }

  .implant-red, .implant-cerveau {
    top: 0%;
    bottom: auto;
    left: 30%;
    right: 0%;
    transform: none;
  }

  .link-block-2 {
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }

  .paragraphe-50 {
    width: 90%;
  }

  .wrapper-rights {
    margin-bottom: 5px;
  }

  .menu-burger-wrapper {
    margin-top: 20px;
    margin-right: 20px;
  }

  .menu-mobile-wrapper {
    background-image: none;
    padding-top: 90px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .h3-title-team-2 {
    margin-top: 1px;
    font-size: 13px;
    line-height: 20px;
  }

  .lightbox-realite-virtuelle {
    width: 90%;
  }

  .lightbox-carte {
    width: 100%;
    height: 200px;
    position: relative;
  }

  .lightbox-link-5 {
    height: 200px;
    margin-bottom: 20px;
  }

  .pargraphe-70 {
    width: 80%;
  }

  .column-flex-chimiquier, .wrapper-cta-both {
    flex-direction: column;
  }

  .container-small {
    width: 100%;
  }

  .logo-medias {
    width: 100px;
  }

  .wrapper-interstitiel {
    width: 80%;
  }

  .close-modal {
    width: 30px;
    height: 30px;
    top: -15px;
    right: -15px;
  }

  .social-link-footer {
    margin-left: 10px;
    margin-right: 10px;
  }

  .social-link-wrapper {
    justify-content: center;
    align-items: center;
    margin-top: 1.5rem;
  }

  .h2-home-2 {
    padding-left: 25px;
    padding-right: 25px;
  }

  .border-red-bottom-2 {
    bottom: -20px;
  }

  .cta-home-2 {
    margin-top: 10px;
  }

  .arrow-cta-video-2 {
    margin-top: 20px;
  }

  .h1-s2 {
    font-size: 34px;
    line-height: 45px;
  }

  .h1-s2.center._70-title, .h1-s2.center._100-title {
    width: 100%;
    margin-top: 30px;
    font-size: 30px;
    line-height: 39px;
  }

  .arrow-cta-video-s02 {
    margin-top: 20px;
  }

  .smoke-hero {
    width: 70%;
  }

  .plant-hero {
    width: 20%;
  }

  .plant-hero-2 {
    width: 40%;
  }

  .personnage-hero {
    width: 60%;
    opacity: .3;
    right: -20%;
  }

  .wrapper-section-roll-invert {
    padding-top: 30px;
    padding-bottom: 0;
  }

  .manifestation-overflow {
    height: 180px;
    background-image: url('../images/Manifestations.jpg');
    background-position: 100%;
    background-size: cover;
  }

  .h2-s2 {
    width: 100%;
    font-size: 32px;
    line-height: 40px;
  }

  .h2-s2._100 {
    font-size: 26px;
    line-height: 34px;
  }

  .h2-s2._100.white {
    padding-left: 1rem;
    font-size: 26px;
  }

  .h2-s2._100.white.right, .h2-s2._100.white.left {
    margin-bottom: .1rem;
    font-size: 19px;
  }

  .h2-s2._100.white.small, .h2-s2._100.white.se {
    margin-bottom: 2rem;
    font-size: 18px;
    line-height: 25px;
  }

  .h2-s2._100.light.smaller {
    font-size: 20px;
    line-height: 29px;
  }

  .h2-s2._100.special {
    margin-top: 0;
    font-size: 28px;
    line-height: 32px;
  }

  .wrapper-col.margins-inner.flex-virus, .wrapper-col.vertical-mobile {
    flex-direction: column;
  }

  .wrapper-col.mobile {
    flex-direction: column-reverse;
  }

  .wrapper-col.mobile.feed-meta {
    padding-top: 0;
  }

  .col-6.mobile-100 {
    width: 100%;
  }

  .h3-s2 {
    font-size: 18px;
    line-height: 23px;
  }

  .h3-s2.different {
    width: 100%;
  }

  .arrow-cta-lire-article-s02 {
    margin-top: 20px;
  }

  .col-11, .col-12, .col-4, .col-4._100-tablet-special, .col-4._50-tablet, .col-4._50-tablet.feddmeta, .col-5, .col-3 {
    width: 100%;
  }

  .col-3.ihm {
    width: 100%;
    padding-top: 2rem;
  }

  .col-3._50-tablet {
    width: 100%;
  }

  .col-3._50-tablet.feddmeta {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .col-1, .col-8, .col-2, .col-7 {
    width: 100%;
  }

  .button-tech {
    width: 100%;
    margin-top: 10px;
  }

  .lightbox-reportage-biotech, .lightbox-bandeau-biotech {
    height: 280px;
  }

  .col-5-5.ihm {
    width: 100%;
  }

  .tabs-menu-ecosysteme {
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .tab-ecosystem {
    width: 49%;
    background-color: rgba(0, 223, 132, .11);
    border-top-width: 0;
    flex: none;
    margin-bottom: 10px;
    text-decoration: none;
  }

  .tab-ecosystem.w--current {
    width: 49%;
    color: #fff;
    background-color: #00df84;
    text-decoration: none;
  }

  .sapin-overflow {
    background-image: url('../images/Rectangle-48.jpg');
    background-position: 100%;
    background-size: cover;
  }

  .detail-infection {
    width: 90%;
    bottom: 36px;
  }

  .detail-infection.grey {
    bottom: 2rem;
  }

  .detail-infection.relative {
    width: 100%;
    top: -19px;
    bottom: 0;
    right: 0%;
  }

  .detail-infection.army {
    top: 0;
  }

  .infection-video {
    height: 250px;
  }

  .cta-bandeau.greyish {
    padding-left: 0;
    padding-right: 0;
  }

  .moustique-bandeua {
    width: 30%;
    bottom: -9%;
    left: -7%;
  }

  .fougeres {
    width: 50%;
  }

  .soldat-bandeau {
    width: 40%;
    right: 0%;
  }

  .cta-bandeau-link {
    width: 90%;
  }

  .girl-img {
    height: 240px;
  }

  .titre-ad {
    font-size: 24px;
    line-height: 31px;
  }

  .cta-green-add {
    width: 100%;
    text-align: center;
    padding-left: 1.6rem;
    padding-right: 1.6rem;
  }

  .retour-sur-le-site {
    width: auto;
  }

  .product-div {
    padding: 1rem;
  }

  .footer-reduce {
    padding-left: 20px;
    padding-right: 20px;
  }

  .paragraph-middle-grey-dark {
    margin-bottom: 1rem;
    margin-left: 0;
  }

  .div-flex-horizontal {
    flex-direction: column;
    align-items: flex-start;
  }

  .div-flex-horizontal.margin-top {
    flex-direction: column;
  }

  .paragraph-medium {
    margin-top: 1rem;
  }

  .cta-info-product {
    margin-bottom: .5rem;
  }

  .cta-acheter {
    width: 100%;
    text-align: center;
  }

  .cta-acheter.line {
    margin-top: .5rem;
    margin-left: 0;
  }

  .wrapper-section-roll-invert-sapin {
    padding-top: 60px;
    padding-bottom: 0;
  }

  .wrap-zindex {
    padding-left: 20px;
    padding-right: 20px;
    position: relative;
  }

  .personnage-hero-2 {
    width: 60%;
    opacity: .3;
    right: -20%;
  }

  .plant-hero-3 {
    width: 40%;
  }

  .plant-hero-4 {
    width: 30%;
    height: auto;
  }

  .nuit-carbonique-overflow {
    height: 180px;
  }

  .lightbox-priorite-ecologique {
    height: 280px;
  }

  .pile-enfant {
    width: 30%;
  }

  .cta-not-link.cta-yellow.voir {
    width: 100%;
  }

  .lightbox-bandeau-reflexes-energetiques {
    height: 280px;
  }

  .feed {
    height: auto;
    padding-top: 2rem;
    overflow: visible;
  }

  .wrap-text-metagram {
    padding-top: 4rem;
    padding-bottom: 2rem;
    padding-left: 0;
  }

  .parent-3d {
    width: 100%;
    height: 690px;
  }

  .recto {
    padding: 2rem;
  }

  .verso {
    overflow: scroll;
  }

  .lightbox-reportage-energies {
    height: 280px;
  }

  .cta-bandeau-link-large {
    width: 100%;
    flex-direction: column-reverse;
  }

  .video-skintech {
    width: 100%;
    height: 550px;
  }

  .box-1 {
    width: 40%;
    font-size: 10px;
    line-height: 18px;
    top: -17%;
    left: 5%;
  }

  .box-2 {
    padding: 1rem;
    font-size: 10px;
    line-height: 18px;
    bottom: 86%;
  }

  .image-7 {
    height: auto;
  }

  .image-8 {
    margin-top: 1rem;
  }

  .col-2-5 {
    width: 100%;
    margin-bottom: 20px;
  }

  .back {
    width: 30px;
    top: 2.1rem;
    left: 1rem;
  }

  .bloc-explicatif {
    width: 60%;
    padding: 1rem;
    font-size: 11px;
    line-height: 15px;
    top: 9%;
    right: 3%;
  }

  .paragrpah-white {
    margin-bottom: 0;
  }

  .bloc-explicati-ecosysteme {
    width: 60%;
    padding: 1rem;
    font-size: 11px;
    line-height: 15px;
    top: 9%;
    right: 3%;
  }

  .arrow-cta-eng {
    margin-top: 20px;
  }

  .background-home-page-s3 {
    background-position: 0 0;
  }

  .ship-hero {
    width: 40%;
    bottom: 53%;
    right: -4%;
  }

  .personne-hero-2 {
    width: 30%;
  }

  .personnage-hero-3 {
    width: 60%;
    opacity: .3;
    right: -20%;
  }

  .planet-hero {
    width: 60%;
    left: -14%;
  }

  .space-overflow {
    height: 180px;
  }

  .spaceship-travel {
    height: 260px;
  }

  .consortium-overflow {
    height: 180px;
  }

  .flag-1 {
    top: -16%;
  }

  .repu-overflow {
    height: 240px;
  }

  .container-2 {
    flex-direction: column-reverse;
    padding-left: 10px;
    padding-right: 10px;
  }

  .flag-2 {
    top: 19%;
  }

  .container-sticky {
    height: 1500px;
  }

  .wrapper-col.margin-top.saboteurs {
    flex-direction: column;
  }

  .image-conflictualite {
    height: 210px;
    object-fit: cover;
  }

  .image-conflictualite.no-padding {
    height: 240px;
    object-position: 0% 0%;
  }

  .col-6._100-mobile {
    width: 100%;
  }

  .lightbox-reportage-space {
    height: 280px;
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, auto 100%;
  }

  .cargo {
    width: 95%;
    right: -23%;
  }

  .cta-bandeau-link-large-pink {
    width: 100%;
    flex-direction: column-reverse;
  }

  .girl-hydre {
    width: 40%;
    right: 0%;
  }

  .brain-hero {
    width: 70%;
    left: -18%;
  }

  .personnage-hero-4 {
    width: 60%;
    opacity: .3;
    right: -20%;
  }

  .nei-cun-overflow {
    height: 180px;
  }

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

  .lightbox-reportage-hydre {
    height: 280px;
  }

  .liquide-army {
    width: 100%;
    height: 180px;
    position: relative;
  }

  .building-middle-show {
    width: 17%;
    height: 38%;
    top: 26%;
    left: 45%;
  }

  .building-left-show {
    width: 15%;
    height: 19%;
    left: 1%;
  }

  .building-right-show {
    width: 14%;
    height: 17%;
    top: 64%;
    left: 79%;
  }

  .building-top-show {
    width: 15%;
    left: 74%;
  }

  .building-bottom-show {
    width: 18%;
    height: 21%;
    top: 68%;
    left: 32%;
  }

  .card-building-middle {
    width: 100%;
    font-size: 12px;
    position: relative;
  }

  .wrap-card-infos-building {
    position: relative;
    top: -4rem;
  }

  .card-building-top, .card-building-bottom, .card-building-left, .card-building-right {
    width: 100%;
    font-size: 12px;
  }

  .image-conflictualite-2 {
    height: 250px;
  }

  .card-building-default {
    width: 100%;
    font-size: 12px;
  }

  .chat-bot {
    width: 300px;
    margin-right: .5rem;
    transform: translate(0, 100%);
  }

  .space-fly, .space-fly-2 {
    width: 40%;
    right: 0%;
  }

  .video-bd {
    height: 180px;
  }

  .explosion {
    width: 50%;
    top: 2%;
    right: -8%;
  }

  .fire {
    width: 50%;
    bottom: 13%;
    left: -21%;
  }

  .lightbox-reportage-hydra {
    height: 280px;
  }

  .column-13 {
    height: 0;
  }
}


@font-face {
  font-family: 'Tj evolette a';
  src: url('../fonts/TJ-Evolette-A-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-Bold.otf') format('opentype'), url('../fonts/Metropolis-ExtraBold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-BlackItalic.otf') format('opentype');
  font-weight: 900;
  font-style: italic;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-ExtraBoldItalic.otf') format('opentype'), url('../fonts/Metropolis-BoldItalic.otf') format('opentype');
  font-weight: 700;
  font-style: italic;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-LightItalic.otf') format('opentype');
  font-weight: 300;
  font-style: italic;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-ExtraLight.otf') format('opentype');
  font-weight: 200;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-ExtraLightItalic.otf') format('opentype');
  font-weight: 200;
  font-style: italic;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-MediumItalic.otf') format('opentype');
  font-weight: 500;
  font-style: italic;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-RegularItalic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-SemiBold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-SemiBoldItalic.otf') format('opentype');
  font-weight: 600;
  font-style: italic;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-Thin.otf') format('opentype');
  font-weight: 100;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Metropolis';
  src: url('../fonts/Metropolis-ThinItalic.otf') format('opentype');
  font-weight: 100;
  font-style: italic;
  font-display: auto;
}