/* feuile de styles  */
@charset "UTF-8";
/*
Theme Name: Astraga
Theme URI:
Author: Astraga
Author URI: https://wordpress.org/
Description: Astraga agence digitale
*/

/* -- GENERAL --------------------------------------------------------------- */
* {
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
}

:root {
  --violet: #6c63fc;
  --bleu: #1495cc;
  --bleuclair: #E9E8FE;
  --roseclair: #F9E3E7;
  --peach: #FFF3E1;
  --noir: #000000;
  --blanc: #FFFFFF;
  --grisclair: #f7f7f7;
  --grismed: #dfdfdf;
  --gris: #7c7c7c;
  --audit: #f8e2e5
}

html {
  scroll-behavior: smooth;
}

.aos-init {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 0.6s, transform 0.6s;
}

.aos-animate {
  opacity: 1;
  transform: translateY(0);
}


/* -- FONT ------------------------------------------------------------------ */
@font-face {
  font-family: "Apercu-Light";
  src: url("fonts/ApercuLight.eot"); /* IE9 Compat Modes */
  src: url("fonts/ApercuLight.eot?#iefix") format("embedded-opentype"),
    /* Open Type Font */ url("fonts/ApercuLight.svg") format("svg"),
    /* Legacy iOS */ url("fonts/ApercuLight.ttf") format("truetype"),
    /* Safari, Android, iOS */ url("fonts/ApercuLight.woff") format("woff"),
    /* Modern Browsers */ url("fonts/ApercuLight.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-font-smoothing: subpixel-antialiased;
}

@font-face {
  font-family: "Apercu-Bold";
  src: url("fonts/ApercuBold.eot"); /* IE9 Compat Modes */
  src: url("fonts/ApercuBold.eot?#iefix") format("embedded-opentype"),
    /* Open Type Font */ url("fonts/ApercuBold.svg") format("svg"),
    /* Legacy iOS */ url("fonts/ApercuBold.ttf") format("truetype"),
    /* Safari, Android, iOS */ url("fonts/ApercuBold.woff") format("woff"),
    /* Modern Browsers */ url("fonts/ApercuBold.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-font-smoothing: subpixel-antialiased;
}

@font-face {
  font-family: "Apercu-Medium";
  src: url("fonts/ApercuMedium.eot"); /* IE9 Compat Modes */
  src: url("fonts/ApercuMedium.eot?#iefix") format("embedded-opentype"),
    /* Open Type Font */ url("fonts/ApercuMedium.svg") format("svg"),
    /* Legacy iOS */ url("fonts/ApercuMedium.ttf") format("truetype"),
    /* Safari, Android, iOS */ url("fonts/ApercuMedium.woff") format("woff"),
    /* Modern Browsers */ url("fonts/ApercuMedium.woff2") format("woff2"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-font-smoothing: subpixel-antialiased;
}


.has-noir-background-color {
  background-color: var(--noir);
  color: var(--blanc);
}

.has-violet-background-color {
  background-color: var(--violet);
  color: var(--blanc);
}

.has-bleu-background-color {
  background-color: var(--bleu);
  color: var(--blanc);
}

.has-gris-background-color {
  background-color: var(--gris);
}

.has-grisclair-background-color {
  background-color: var(--grisclair);
}

.has-grismed-background-color {
  background-color: var(--grismed);
}

.has-violet-color {
  color: var(--violet);
}

.has-bleu-color {
  color: var(--bleu);
}

.has-gris-color {
  color: var(--gris);
}

.has-blanc-color {
  color: var(--blanc);
}

.has-noir-color {
  color: var(--noir);
}

html {
  background-color: #ffffff;
  font-family: 'Apercu-Light', sans-serif;
  -webkit-font-smoothing: antialiased;
}

body {
  margin: 0;
  font-size: 1rem;
  text-align: center;
  cursor: none;
  color: var(--noir);
  font-family: 'Apercu-Light', sans-serif;
}

a {
  cursor: none;
}

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

.text-bold {
  font-family: "Apercu-Medium";
}

#custom-cursor {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--violet);
  position: fixed;
  pointer-events: none;
  z-index: 9999;
  transition: width 0.3s, height 0.3s;
  transform: translate(-50%, -50%);
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4 {
  text-align: left;
  line-height: 110%;
  font-family: 'Apercu-Bold', sans-serif;
}

h5, .h5,
h6, .h6 {
  text-align: left;
  font-family: 'Apercu-Light', sans-serif;
}

h2, .h2 {
  font-size: 1.5rem;
}
@media screen and (min-width:768px){
  h2, .h2 {
    font-size: 2.2rem;
  }
}



.mt-0 {
  margin-top: 0;
}

img {
  vertical-align: middle;
  height: auto;
}

strong {
  font-family: 'Apercu-bold', sans-serif;
}

.alignfull {
  margin: 0 calc(50% - 50vw);
  max-width: 100vw;
  width: 100vw;
}

.alignfull.has-background {
  padding: 3rem calc(-50% - -50vw) 3rem calc(-50% - -50vw) !important;
}

.alignwide {
  margin: 0 calc(25% - 25vw);
}

.has-small-font-size {
  font-size: 0.8rem !important;
}

.has-medium-font-size {
  font-size: 1.25rem !important;
}

.has-large-font-size {
  font-size: 1.5rem !important;
}

.has-x-large-font-size {
  font-size: 1.85rem !important;
}

/*BUTTONS*/

.btn {
  display: inline-block;
  padding: 1rem 2rem;
  border-radius: 30px;
  font-weight: 500;
  font-size: 1.1rem;
  font-family: "Apercu-Medium";
}

.btn-primary, .frm_forms .frm_submit .frm_button_submit,
.frm_style_style-form-services.with_frm_style .frm_submit .frm_button_submit {
  background: var(--violet);
  color: #FFFFFF;
  border: solid 1px var(--violet);
  border-radius: 30px;
  padding: 1rem 2rem;
  font-family: "Apercu-Medium";
}

.btn-primary:hover, .frm_forms .frm_submit .frm_button_submit:hover,
.frm_style_style-form-services.with_frm_style .frm_submit .frm_button_submit:hover {
  background: transparent;
  color: var(--violet);
}

.btn-o, .wp-block-button__link.has-violet-color.has-blanc-background-color {
  border: solid 1px var(--violet);
  background: transparent;
  color: #000000;
  border-radius: 30px;
  padding: 1rem 2rem;
  display: inline-block;
}

.btn-o:hover, .wp-block-button__link.has-violet-color.has-blanc-background-color:hover {
  background: var(--violet);
  color: #FFFFFF;
}

.marge-laterale {
  margin-left: 10%;
  margin-right: 10%;
}

/* -- HAUT -- */
.inner {
  padding-left: calc(3% + 1rem);
  padding-right: calc(3% + 1rem);
  position: relative;
  z-index: 2;
}

@media screen and (min-width: 1200px) {
  .inner {
    padding-left: calc(7.5% + 1rem);
    padding-right: calc(7.5% + 1rem);
  }
}

.cover {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.fullwidth {
  background-position: center;
  background-size: 130% auto;
  background-repeat: no-repeat;
}

.haut {
  padding-top: 2rem;
  padding-bottom: 1rem;
  background-color: #f7f7f7;
}
#single_ref .haut{
  padding-top: 5rem;
}
@media screen and (min-width:1200px){
  #single_ref .haut{
    padding-top: 8rem;
  }
}


.haut h1 span {
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  font-family: 'Apercu-Medium', sans-serif;
  font-size: 0.7rem;
  text-transform: uppercase;
}

.haut h5 span {
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  font-family: 'Apercu-Medium', sans-serif;
  font-size: 0.7rem;
  text-transform: uppercase;
}

.haut .tiret {
  width: 3rem;
  height: 1px;
  background-color: #000;
}

.haut .content {
  width: 100%;
  max-width: 90%;
  background-color: transparent;
}

.haut .content h2, .haut .content h1 {
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
}

.haut .content h2 .upline {
  display: block;
  font-size: 0.9rem;
  font-family: 'Apercu-Light', sans-serif;
  line-height: 1;
}

.cli-style-v2 .cli-bar-btn_container .cli-plugin-button {
  border-radius: 2rem !important;
}


.frm_description p {
  font-size: 1.25rem !important;
  text-transform: uppercase;
}

.contenu {
  overflow: hidden;
}

.has-background {
  padding: 1.5rem
}

h5 {
  text-transform: uppercase;
  padding: 1rem 0;
  position: relative;
  font-size: 0.7rem;
  letter-spacing: 0.02rem;
}

h5::before {
  content: "";
  display: inline-block;
  width: 3rem;
  height: 1px;
  background-color: #000000;
  vertical-align: middle;
  margin-right: 0.5rem;
}

h5.title::before {
  display: none;
}

h2.introduction {
  line-height: 1.1;
  font-size: 1.8rem;
  margin-top: 0;
}

.wp-block-quote {
  font-size: 1.2rem;
  padding: 0 45px;
  position: relative;
  border: none;
}

.wp-block-quote cite {
  font-family: 'Apercu-light', sans-serif;
  font-size: 0.8rem;
  display: block;
  text-align: right
}

.wp-block-quote::before, .wp-block-quote::after {
  content: "";
  width: 35px;
  height: 35px;
  display: inline-block;
  font-size: 3em;
  position: absolute
}

.wp-block-quote::before {
  top: 0;
  left: 0;
  background: url(img/quote-open.svg) no-repeat center / contain;
}

.wp-block-quote::after {
  bottom: 0;
  right: 0;
  background: url(img/quote-close.svg) no-repeat center / contain;
}

.card {
  border: none !important;
  flex: 1 1 auto;
}

.wp-block-button.bt-contact, .wp-block-button.bt-250{
  width:80%;
  max-width:250px;
}

@media screen and (min-width: 1200px) {
  h2.introduction {
    font-size: 2rem;
    max-width: 70%;
  }
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 768px) {

  html {
    cursor: none;
  }

  .haut {
    padding-top: 10rem;
  }

  .haut .inner {
    padding-left: calc(7.5% + 1rem);
    padding-right: calc(7.5% + 1rem);
  }

  .haut {
    padding-top: 5rem;
    padding-bottom: 1rem;
    background-color: #f7f7f7;
  }

  .haut .content h2, .haut .content h1 {
    font-size: 2rem;
  }
}

@media screen and (min-width: 1024px) {
  .haut .content h2, .haut .content h1 {
    font-size: 2.2rem;
    line-height: 3rem;
  }
}

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

  h2.introduction {
    font-size: 2.2rem;
  }
}


/* -- DATA ------------------------------------------------------------------ */
[data-ratio] {
  display: block;
  max-width: 100%;
  position: relative;
}

[data-ratio]:before {
  content: "";
  display: block;
}

[data-ratio] > * {
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

/*[data-ratio] {display: block; max-width: 100%; position: relative}
[data-ratio]:before {content: ''; display: block;}
[data-ratio] > * {display: block; height: 100%; left: 0 ;position: absolute; top: 0; width: 100%;}

[data-ratio='20:9']:before { padding-top: 45%; }
[data-ratio='16:9']:before { padding-top: 56.25%; }
[data-ratio='4:3']:before { padding-top: 75%; }
[data-ratio='3:4']:before { padding-top: 120%; }
[data-ratio='1:1']:before { padding-top: 100%; }
[data-ratio='slider']:before { padding-top: 65% }*/

[data-ratio="20:9"]:before {
  padding-top: 45%;
}

[data-ratio="16:9"]:before {
  padding-top: 56.25%;
}

[data-ratio="4:3"]:before {
  padding-top: 75%;
}

[data-ratio="1:1"]:before {
  padding-top: 100%;
}

[data-ratio="slider"]:before {
  padding-top: 63.75%;
}

[data-ratio="slide"]:before {
  padding-top: 100%;
}

@media screen and (min-width: 1024px) {
  [data-ratio="slide"]:before {
    padding-top: 100%;
  }
}

p{
  line-height: 150%;
  text-align: left;
}

.accroche {
  font-size: 1.5rem;
  line-height: 120%;
}

@media screen and (min-wdth:768px){
  .accroche {
    font-size: 1.75rem;
    line-height: 120%;
  }
}

.gros-titre {
  text-transform: uppercase;
  font-size: 5vw
}

#cookie-law-info-again {
  box-shadow: none !important;
}

.wp-block-button a.has-violet-background-color:hover {
  background-color: rgb(0, 0, 0);
}

@media screen and (orientation: landscape) {
  .gros-titre {
    font-size: 3.5vw
  }
}

.has-violet-color {
  color: #6c63fc
}

.has-grisclair-color {
  color: #f7f7f7
}

.has-gris-color {
  color: #7c7c7c
}

.has-bleu-color {
  color: #1495cc
}

.has-blanc-color {
  color: #FFFFFF
}

.has-violet-background-color {
  background-color: #6c63fc
}

.has-grisclair-background-color {
  background-color: #f7f7f7
}

.has-gris-background-color {
  background-color: #7c7c7c
}

.has-bleu-background-color {
  background-color: #1495cc
}

.has-blanc-background-color {
  background-color: #FFFFFF
}

/* POLITIQUE DE CONFIDENTIALITE */
#politique {
  padding: 10rem 7.5% 5rem;
  text-align: left;
}

#politique h2 {
  font-size: 1.5rem;
}

@media screen and (min-width: 991px) {
  #politique h2 {
    font-size: 2.5rem;
  }
  .haut .content h2, .haut .content h1 {
    margin-bottom: 3rem;
  }
}

/* -- SERVICES ---------------------------------------------------------------*/
.services {
  background-color: #f7f7f7;
}

.services a {
  text-decoration: none;
}

.services .swiper-slide {
  background: #fff;
}

/* -- HAUT & TITRE -- */
.services .haut {
  background-color: #f7f7f7;
  position: relative;
}

.services .haut svg {
  position: absolute;
  top: -15rem;
  left: 0;
  width: 100vw;
  z-index: 1;
}

.services .haut .content h2 {
  margin: 0;
}

.services .titre_svg_digit,
.services .titre_svg_ident {
  overflow: hidden;
  height: 20rem;
  position: relative;
  margin-top: 5rem;
  text-align: left;
}

.services .titre_svg_digit svg {
  width: 1630px;
  height: 295px;
}

.services .titre_svg_digit svg text,
.services .titre_svg_ident svg text {
  font-size: 300px;
}

.services .titre_svg_ident svg {
  width: 2050px;
  height: 295px;
}

.services #svg_digital,
.services #svg_identite {
  transform: translateX(100vw);
  height: 10rem;
  width: auto;
}

/* -- CAROUSEL -- */
.services .carousel {
  padding: 5rem 0;
  background-color: #f7f7f7;
}

.services .carousel h3.titre_dig {
  text-align: center;
  padding: 0 1rem;
}

.services .carousel .card .text {
  min-height: 10rem;
  padding: 0 2rem;
}

.services .carousel .text p {
  margin: 0;
  font-size: 1rem;
}

.services .trait_car {
  width: 1px;
  height: 2rem;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

.services .swiper {
  width: 100%;
  height: 100%;
}

.services .swiper-slide {
  text-align: center;
  font-size: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  overflow: hidden;
  width: 70%;
}

.services .accroche {
  width: 100%;
  max-width: 80vw;
  font-size: 1.5rem;
  text-align: center;
  margin: auto;
  margin-bottom: 1rem;
  font-family: Apercu-Bold, sans-serif;
}

.services h3 {
  font-size: 1.5rem;
  margin-bottom: 0.25rem;
}

.services .img-service {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 250px;
  position: relative;
}

.services .img-service lottie-player {
  width: 55%;
  position: absolute;
  left: 50%;
  top: 10px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

.services .img-service img {
  width: 52.5%;
  position: absolute;
  left: 50%;
  top: 10px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  object-fit: contain
}

.services .carousel .modif-text,
.services .carousel .modif-trait {
  color: black;
  transition: 0.2s ease-in;
}

.services .carousel a:hover .modif-text {
  text-decoration: none;
  color: #6c63fc;
  transition: 0.2s ease-out;
}

.services .carousel a:hover .modif-trait {
  background: #6c63fc;
  transition: 0.2s ease-out;
}

/* -- COLLAB -- */
.services .collab {
  background-color: #000;
  margin: 0;
  overflow: hidden;
  padding-top: 4rem;
  padding-bottom: 2rem;
  position: relative;
}

.services .collab .accroche, .services .collab h2 {
  color: #fff;
}

.services .collab img, .services .methode img {
  width: 70%;
  top: 25%;
  margin: 1rem 0 5rem;
  position: relative;
}

.services .collab .chiffre {
  font-size: 0.7em;
}

.services .collab h3 span {
  display: inline-block;
  color: #fff;
  vertical-align: middle;
  margin-right: 1rem;
  font-size: 1.5rem;
}

.services .collab .tiret {
  width: 2rem;
  height: 1px;
  background-color: #fff;
  display: none;
}

.services .trait_cb {
  display: none;
}

.services .collab .content, .services .methode .content {
  text-align: left;
  margin: 4rem 0;
}

.services .collab .titre {
  font-family: Apercu-Bold, sans-serif;
}

.services .collab .text {
  line-height: 125%;
  color: #fff;
}

/* -- SOFTWARES -- */
.services .softwares, .services .methode {
  background-color: #f7f7f7;
  margin: 0;
  padding: 5rem 0;
  padding-bottom: 7rem;
  overflow: hidden;
}

.services .trait_sw {
  width: 1px;
  height: 3rem;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

.services .items {
  background-color: #fff;
  height: 23rem;
  padding: 3rem 2rem;
  margin: 1rem 0;
}

.services .items .titre {
  padding: 1.5rem 0 1rem 0;
  font-family: Apercu-Bold, sans-serif;
  font-size: 1.5rem;
}

.services .items .trait_sw_in {
  width: 1px;
  height: 3rem;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

.services .items .content {
  color: #7c7c7c;
  line-height: 125%;
}

.services .items .image img {
  width: 4rem;
}

.partenaires {
  padding: 3rem 7.5%;
  text-align: center;
}

.partenaires h2 {
  text-align: center
}

.partenaires .item {
  padding: 4rem 2rem;
  background-color: var(--blanc);
  margin: 1rem 0;
  height: 100%;
}

.partenaires .item img {
  width: auto;
  height: 50px;
}

.partenaires .item .logo {
  margin-bottom: 4rem;
  position: relative;
}

.partenaires .item .logo::after {
  content: "";
  display: block;
  width: 1px;
  height: 2rem;
  background-color: rgb(0, 0, 0);
  position: absolute;
  left: 50%;
  top: 110%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.partenaires .item .extrait {
  margin-bottom: 2rem;
}

.partenaires .item a {
  display: inline-block;
  text-transform: uppercase;
  text-decoration: none;
  color: rgb(0, 0, 0);
  font-family: 'Apercu-bold';
}

.logo-partner {
  margin: 3rem 0 1rem;
}

.logo-partner img {
  display: block;
  width: 90%;
  max-width: 300px;
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 768px) {
  .services .haut svg {
    top: 0;
    width: auto;
  }

  .services .collab img, .services .methode img {
    top: 15%;
    margin-bottom: 5rem;
    width: 15rem;
    position: relative;
  }

  .services .haut .content h2 {
    font-size: 2rem;
  }

  .services .accroche {
    font-size: 2rem;
  }

  .services .softwares .accroche, .services .methode h2 {
    font-size: 2rem;
  }

  .services .swiper-slide {
    width: 60.5%;
  }

  /* .services .methode h2 { margin-bottom:2em; } */
  .services #svg_digital,
  .services #svg_identite {
    height: 20rem;
  }

  .services .collab {
    padding-bottom: 4rem;
  }

  .services .collab .tiret {
    display: inline-block;
  }
}

@media screen and (min-width: 992px) {
  .services .items {
    height: 28rem;
  }

  .services .collab img, .services .methode img {
    width: 20rem;
  }

  .services .swiper-slide {
    width: 37%
  }
}

@media screen and (min-width: 1024px) {
  .services .haut .content {
    max-width: 80%;
  }

  .services .collab img, .services .methode img {
    width: 20rem;
    margin-bottom: 5rem;
  }

  .services .titre_svg_digit2 {
    display: block;
    bottom: 20rem;
    text-align: left;
  }

  .services .swiper-slide {
    width: 37.5%
  }
}

@media screen and (min-width: 1200px) {
  .services .haut .content h2 {
    font-size: 2.2rem;
  }

  .services .titre_svg_digital {
    text-align: right;
  }

  .services .accroche {
    width: 100%;
    font-size: 2.5rem;
    text-align: center;
    margin: auto;
    margin-bottom: 1rem;
    font-family: Apercu-Bold, sans-serif;
  }

  .services .collab .tiret {
    width: 2rem;
    height: 1px;
    background-color: #fff;
  }

  .services .collab img, .services .methode img {
    width: 25rem;
  }

  .services .trait_cb {
    position: absolute;
    width: 1px;
    background-color: #fff;
    display: inline-block;
    margin: 2rem 0;
    left: 50%;
  }

  .services .trait_cb.is-visible {
    height: 100%;
  }

  .services .collab .content, .services .methode .content {
    text-align: left;
    padding-left: 5%;
    margin: 4rem;
  }

  .services .softwares .accroche, .services .methode h2 {
    font-size: 2.5rem;
  }

  .services .trait_sw {
    height: 3rem;
  }

  .services .items {
    height: 25rem;
  }

}

@media screen and (min-width: 1680px) {
  .services .swiper-slide {
    width: 20.5%
  }
}

/* -- JOBS ------------------------------------------------------------------ */
/* -- CONTENT -- */
#jobs h5 {
  margin: 0;
}

#jobs .col-xs-12 {
  padding-right: 0;
  padding-left: 0;
}

#jobs .content h2 {
  color: #fff;
  margin-bottom: 3.5rem;
}

#jobs .content .first {
  margin-bottom: 0;
}

#jobs .haut {
  padding-top: 6.5rem;
  background-size: cover;
}

#frm_field_108_container {
  opacity: 0 !important;
}

#jobs .haut .content {
  max-width: 90%;
}

#jobs .haut .titre {
  color: #fff;
}

#jobs .haut .tiret {
  background: #ccc;
}

/* -- ANNONCES -- */
#jobs .annonces {
  background-color: #f7f7f7;
  overflow: hidden;
  padding-top: 5rem;
}

#jobs .annonces .items {
  background-color: #fff;
  height: calc(100% - 2rem);
  padding: 3rem 2rem;
  margin: 1rem auto;
}

#jobs .annonces .accroche {
  font-size: 1.5rem;
  font-family: Apercu-Bold, sans-serif;
  margin-top: 2rem;
}

#jobs .annonces .items .titre {
  padding: 1.5rem 0 1rem 0;
  font-family: Apercu-Bold, sans-serif;
  font-size: 2rem;
}

#jobs .annonces .texte {
  max-width: 90%;
  margin: 0 auto;
  color: #7c7c7c;
  min-height: 5rem;
}

#jobs .annonces .texte p, #jobs .annonces .categorie p {
  text-align: center
}

#jobs .annonces .categorie p {
  font-size: 1rem;
}

#jobs .annonces .job-title {
  padding: 0 !important;
}

#jobs .annonces .titre h2 {
  margin: 0;
  font-size: 1.35rem;
  text-align: center;
  text-transform: uppercase;
}

#jobs .annonces .items .trait_sw_in {
  width: 1px;
  height: 2rem;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 1rem 0;
}

#jobs .annonces .postuler {
  margin-top: 2rem;
  color: #000;
}

#jobs .annonces .postuler a {
  font-family: Apercu-Medium, sans-serif;
  align-items: center;
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}

#jobs .annonces .postuler svg {
  margin: 1.5rem 0;
}

#jobs .annonces .postuler .border {
  border: 1px solid #6c63fc;
  display: inline-block;
  border-radius: 50%;
  height: 4rem;
  width: 4rem;
  transition: 0.3s ease;
}

#jobs .annonces .postuler .border svg {
  fill: #6c63fc;
  transition: 0.3s ease;
}

#jobs .annonces a {
  text-decoration: none;
  color: #000;
}

#jobs .annonces .postuler p {
  text-decoration: none;
  color: #1495cc;
  transition: 0.3s ease;
  margin-left: 0.5rem;
}

#jobs .annonces .postuler:hover p {
  color: #6c63fc;
  transition: 0.3s ease;
}

#jobs .annonces .postuler:hover .border {
  border: 1px solid #1495cc;
  transition: 0.3s ease;
  background: #1495cc;
}

#jobs .annonces .postuler:hover .border svg {
  fill: #fff;
  transition: 0.3s ease;
}

#jobs .annonces .texte_bottom {
  margin-top: 5rem;
  margin-bottom: 6rem;
}

#jobs .annonces .texte_bottom a {
  margin-left: 0.5rem;
  color: #1495cc;
  transition: 0.3s ease;
}

#jobs .annonces .texte_bottom a:hover {
  margin-left: 0.5rem;
  color: #6c63fc;
  transition: 0.3s ease;
}

/* -- EXPOSITION -- */
.parent img {
  height: 100%;
  object-fit: cover;
}

.parent {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(6, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
}

.div1 {
  grid-area: 1 / 1 / 7 / 3;
}

.div2 {
  grid-area: 5 / 3 / 7 / 5;
}

.div3 {
  grid-area: 5 / 5 / 7 / 7;
}

.div4 {
  grid-area: 1 / 3 / 5 / 7;
}

.div5 {
  grid-area: 1 / 7 / 4 / 9;
}

.div6 {
  grid-area: 4 / 7 / 7 / 9;
}

.div7 {
  grid-area: 1 / 9 / 4 / 11;
}

.div8 {
  grid-area: 1 / 11 / 4 / 13;
}

.div9 {
  grid-area: 4 / 9 / 7 / 13;
}

#jobs .row {
  margin: 0;
}

#jobs .exposition {
  padding: 0;
  overflow: hidden;
  font-size: 1.8rem;
  font-family: Apercu-Bold, sans-serif;
}

#jobs .exposition a {
  text-decoration: none;
  color: #fff;
}

#jobs .exposition .expo {
  flex-grow: 1;
}

#jobs .exposition img {
  width: 100%;
}

#jobs .exposition .ag {
  background-color: #1495cc;
  opacity: 0.7;
  transition: 0.3s ease;
  padding: 3rem;
}

#jobs .exposition .ag:hover {
  background-color: #1495cc;
  opacity: 1;
  transition: 0.3s ease;
}

#jobs .exposition .ag h2 {
  text-align: center;
  font-size: 1.5rem;
}

#jobs .exposition .co {
  background-color: #6c63fc;
  opacity: 0.7;
  padding: 3rem;
  transition: 0.3s ease;
}

#jobs .exposition .co:hover {
  background-color: #6c63fc;
  opacity: 1;
  transition: 0.3s ease;
}

#jobs .exposition .co h2 {
  text-align: center;
  font-size: 1.5rem;
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 768px) {
  #jobs .haut {
    padding-top: 11.5rem;
  }

  #jobs .exposition .ag h2 {
    font-size: 2rem;
  }

  #jobs .exposition .co h2 {
    font-size: 2rem;
  }

  #jobs .col-xs-12 {
    padding-right: 1rem;
    padding-left: 1rem;
  }

  #jobs .annonces .texte {
    height: 7rem;
  }
}

@media screen and (min-width: 992px) {
  #jobs .haut {
    padding-top: 16.5rem;
  }

  #jobs .exposition .ag {
    padding: 5rem;
  }

  #jobs .exposition .co {
    padding: 5rem;
  }

  #jobs .exposition .ag h2 {
    font-size: 2.2rem;
  }

  #jobs .exposition .co h2 {
    font-size: 2.2rem;
  }
}

@media screen and (min-width: 1024px) {
  #jobs .haut .content {
    max-width: 70%;
  }
}

@media screen and (min-width: 1200px) {
  #jobs .annonces .texte {
    height: 5rem;
  }
}

@media screen and (min-width: 1400px) {
  #jobs .haut .content {
    max-width: 65%;
  }
}

/* -- JOURNAL --------------------------------------------------------------- */
#journal {
  background: #f7f7f7;
}

#journal .nav_journal {
  text-align: left;
  padding: 0;
  max-width: 600px;
}

#journal .nav_journal ul {
  padding: 0;
}

#journal .nav_journal ul li {
  display: inline-block;
  padding: 0 10px 10px 0;
}

#journal .nav_journal ul li a {
  text-decoration: none;
  color: #7c7c7c;
  font-size: 0.7rem;
}

#journal .nav_journal ul li a:hover {
  text-decoration: none;
  color: #000;
}

/* -- CONTENT -- */
#journal .content_journal {
  text-align: left;
  background-color: #f7f7f7;
  padding-bottom: 7rem;
}

#journal .content_journal .item a {
  text-decoration: none;
}

#journal .content_journal img {
  width: 100%;
  padding: 0;
}

#journal .content_journal p {
  margin-bottom: 0;
}

#journal .content_journal .accroche {
  font-family: Apercu-Bold, sans-serif;
  color: #000;
  font-size: 1rem;
  padding: 1rem 0 0.5rem 0;
}

#journal .content_journal .texte {
  color: #707070;
  font-size: 0.9rem;
}

#journal .content_journal .card {
  margin-bottom: 2rem;
  padding: 0 1.5rem;
  border: none;
  border-radius: 0;
  background-color: transparent
}

#journal .content_journal .img_space {
  flex-grow: 1;
}

#journal .row {
  margin-right: 0;
  margin-left: 0;
}

#journal .content_journal .inner {
  padding-right: 0;
  padding-left: 0;
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 576px) {
  #journal .content_journal .accroche {
    font-size: 1.1rem;
  }

  #journal .content_journal .texte {
    font-size: 0.8rem;
  }
}

@media screen and (min-width: 768px) {
  #journal .nav_journal ul li a {
    font-size: 1rem;
  }

  #journal .nav_journal ul li {
    padding: 10px 15px 10px 0;
  }

  #journal .content_journal .accroche {
    font-size: 1.2rem;
  }

  #journal .content_journal .texte {
    font-size: 0.9rem;
  }

  #journal .content_journal .inner {
    padding-right: 7.5%;
    padding-left: 7.5%;
  }

  #journal .content_journal .card {
    padding: 0 1rem;
  }
}

@media screen and (min-width: 992px) {
  #journal .content_journal .accroche {
    font-size: 1.3rem;
  }

  #journal .content_journal .texte {
    font-size: 0.9rem;
  }
}

@media screen and (min-width: 1024px) {
  #journal .haut .content {
    max-width: 80%;
  }
}

@media screen and (min-width: 1200px) {
  #journal .content_journal .accroche {
    font-size: 1.5rem;
  }

  #journal .content_journal .texte {
    font-size: 1rem;
  }
}

/* -- REFERENCE ------------------------------------------------------------- */
#references h3 {
  text-align: center;
}

/* GALLERY -- */
#references .gallery {
  overflow: hidden;
  padding-top: 3rem;
  background-color: #f7f7f7;
}

#references .gallery .container-ref {
  min-height: 60vw;
  overflow: clip;
}
#references .gallery .container-ref a{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: end;
  padding:1.5rem;
  flex: 1 1 auto;
  position: relative;
  overflow: clip;
  transition: all 0.2s ease;
  text-decoration: none
}
#references .gallery .container-ref .back{
  position:absolute;
  left: 50%; top:50%;
  transform: translate(-50%, -50%);
  width:100%; height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transition: all 0.5s ease;
}
#references .gallery .container-ref .filtre{
  position:absolute;
  left: 50%; top:50%;
  transform: translate(-50%, -50%);
  width:100%; height: 100%;
  background: linear-gradient( to top, rgba(0,0,0,.5) 20%, rgba(0,0,0,.1) 100% );
  display: flex;
  align-items: start;
  justify-content: center
}
#references .gallery .container-ref .filtre .icone{
  display: block;
  width:0px; height:0px;
  background: url(img/arrow-ref.svg) no-repeat center / contain;
  opacity:0;
  transition: all 0.3s ease-out;
  transform-origin: center;
  margin-top:2rem
}
@media screen and (min-width: 1200px){
  #references .gallery .container-ref .filtre{
    align-items: center;
  }
  #references .gallery .container-ref .filtre .icone{
    margin-top:0
  }
}
#references .gallery .container-ref a:hover .back{
  transform: translate(-50%, -50%) scale(1.1);
  filter: blur(5px)
}

#references .gallery .text_container {
  position: relative;
  text-align: left;
  color: #fff;
}

#references .gallery .container-ref .sous-titre {
  font-family: 'Apercu-bold', 'sans-serif';
  font-size: 0.8rem;
  transition: all 0.2s ease;
}


#references .gallery .container-ref .titre {
  font-family: 'Apercu-bold', 'sans-serif';
  font-size: 1rem;
  line-height: 1.2;
  transition: all 0.2s ease;
  margin-bottom: 0.75rem
}

#references .gallery .container-ref .titre .type {
  font-family: 'Apercu-light', 'sans-serif';
  font-size: 0.9em;
}

#references .gallery .container-ref .titre p {
  margin: 0;
}

@media screen and (min-width:1280px){
    #references .gallery .container-ref a:hover .titre {
      opacity:0.4
    }
    /* #references .gallery .container-ref a:hover .sous-titre {
      font-size: 1.15rem;
    } */
    #references .gallery .container-ref a:hover .filtre .icone{
      opacity:0.8;
      width: 50px; height: 50px;
    }
}

/* -- SECTEURS -- */
#references .secteurs {
  background: #000000;
  color: #FFFFFF;
  padding-bottom: 6rem;
  position: relative;
}
#references .secteurs::before {
 content:"";
 display: block;
 width:1px;
 height:100%;
 position: absolute;
 left:50%;
 top:0;
 background-color: rgba(255,255,255,.2);
 transform: translateX(-50%)
}

#references .secteurs .accroche {
  font-size: 1.5rem;
  font-family: Apercu-Bold, sans-serif;
  padding-top: 4rem;
}

#references .trt_first {
  width: 2px;
  height: 2rem;
  margin: 0 auto;
  background-color: var(--violet);
  display: inline-block;
  margin: 1rem 0;
}

#references .trt_end {
  width: 2px;
  height: 2rem;
  margin: 0 auto;
  background-color: var(--bviolet);
  display: inline-block;
  margin: 1rem 0;
}

#references .secteurs .sous_accroche {
  width: 90%;
  max-width: 768px;
  margin: 0 auto;
  margin-bottom: 3rem;
  color: var(--blanc)
}

#references .secteurs .sous_accroche p {
  font-size: 1.1rem;
  margin-top: 0;
  color: var(--blanc);
  text-align: center;
}

#references .secteurs .sous_accroche.is-visible {
  transform: translateY(0);
  opacity: 1;
}

#references .et {
  font-size: 2rem;
  font-family: Apercu-Bold, sans-serif;
}

.haut h1 span {
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  font-family: Apercu-medium, sans-serif;
  font-size: 0.7rem;
  text-transform: uppercase;
}

#references .secteurs .texte_small p {
  width: 100%;
  max-width: 40rem;
  margin: 0 auto;
  color: gray;
  font-size: 0.7em;
  line-height: 1.1rem;
  text-transform: uppercase;
}

#references .secteurs .texte_small span {
  font-family: 'Apercu-Bold', 'sans-serif';
  color: black;
  font-size: 0.7rem;
}

#references .secteurs .content {
  text-align: center;
  background-color: var(--noir);
  transition: all 1s linear;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding:0.5rem;
}

@media screen and (min-width:1440px){
  #references .secteurs .content {
    padding:0.5rem 10%
  }
}


#references .secteurs .content .icone {
  width:30px;
  aspect-ratio : 1/1;
  margin-bottom: 0 auto 1rem auto;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
#references .secteurs .content .icone img {
  width:100%;
  height: 100%;
  object-fit: contain;
  position: relative;
  z-index:2
}

#references .secteurs .content h3 {
  font-size:2.15rem;
  font-family: 'Apercu-light', 'sans-serif';
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  letter-spacing: 0.05rem;
}
#references .secteurs .content::after {
  content:"";
  display: block;
  width:35px;
  aspect-ratio: 50/8;
  background-color: var(--violet);
  margin:0.5rem 0;
}
#references .secteurs .content h3 .mediumtext{
  font-size:0.65em;
}
#references .secteurs .content h3 .littletext{
  text-transform: uppercase;
  font-size:0.5em;
  font-family: 'Apercu-Bold', 'sans-serif';
}

#references .secteurs .content .texte {
  color: var(--grismed);
  font-size:0.75rem;
  display: none
}

#references .secteurs .inner > .row {
  position: relative;
}

/* -- CLIENTS -- */
#references .clients {
  background-color: #000;
  color: #fff;
  padding: 3rem 0;
  transition: all 0.5s ease-in-out;
}

#references .clients .titre {
  font-size: 1.5rem;
  font-family: 'Apercu-Bold', 'sans-serif';
  padding-top: 3rem;
  margin-bottom: 1rem;
}

#references .trt_clients {
  width: 1px;
  height: 3rem;
  left: 50%;
  background-color: #ccc;
  display: inline-block;
  margin: 2rem 0;
  opacity: 1;
}

#references .client_content {
  font-size: 1.1rem;
  font-weight: lighter;
  line-height: 2rem;
  color: #ccc;
  text-transform: uppercase;
}

#references .client_content p {
  text-align: center;
}

#references .clients .more_btn p {
  border: 1px solid;
  border-color: #fff;
  color: #fff;
  text-decoration: none;
  border-radius: 50px;
  padding: 1rem 3rem;
  display: inline-block;
  transition: all 0.2s ease-in-out;
  font-size: 0.7rem;
  margin-top: 1rem;
  margin-bottom: 3rem;
  cursor: pointer;
}

#references .clients .more_btn p:hover {
  background-color: #fff;
  color: #000;
}

#references .clients .more-clients {
  display: none;
  transition: 0.3s ease-in-out;
}

#references .clients .more-clients.collapse {
  display: block;
  transition: 0.3s ease-in-out;
}

#references .more {
  margin-bottom: 3rem;
}

#references .clients .more_btn.hide,
#references .clients .trt-more.hide {
  display: none;
  transition: 0.3s ease-in-out;
}

#references .sect {
  position: relative;
  z-index: 2;
}

#references .gros_trt_verti {
  position: absolute;
  width: 1px;
  background-color: black;
  z-index: 1;
}

#references .gros_trt_verti.is-visible {
  height: 100%;
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 568px) {
  #references .gallery .text_container .titre {
    font-size: 1.2rem;
  }
}

@media screen and (min-width: 768px) {
  #references .clients .more_btn p {
    cursor: none;
  }
  #references .gallery .container-ref {
    min-height: 45vw;
  }
}

@media screen and (min-width: 992px) {
  #agence .accroche {
    font-size: 2.2rem;
  }

  #references .secteurs .accroche {
    font-size: 2.2rem;
  }

  #references .secteurs .sous_accroche p {
    font-size: 1.3rem;
  }

  #references .gallery .container-ref {
    min-height: 30vw;
  }

  #references .gallery .text_container .sous-titre {
    font-size: 0.9rem;
  }

  #references .gallery .text_container .titre {
    font-size: 1.25rem;
  }

  #references .et {
    margin-top: 2rem;
  }

  #references .clients .titre {
    font-size: 2.2rem;
  }

  #references .client_content {
    font-size: 1.15rem;
  }

  #references .secteurs .content .texte p {
    text-align: center;
    line-height: 1.8;
    color: var(--grismed);
    letter-spacing: 0.05rem
  }

  #references .gros_trt_hori {
    position: relative;
    height: 1px;
    background-color: black;
  }

  #references .gros_trt_hori.is-visible {
    width: 100%;
  }
}

@media screen and (min-width: 1024px) {
  #references .haut .content {
    max-width: 70%;
  }
}

@media screen and (min-width: 1200px) {
  #references .secteurs .inner > .row {
    /* width: 60rem; */
    margin: auto;
    /* height: 40rem; */
    position: relative;
  }
}

@media screen and (min-width: 1400px) {
  #references .haut .content {
    max-width: 65%;
  }
  #references .gallery .container-ref {
    min-height: 25vw;
  }
}

/* -- AGENCE ---------------------------------------------------------------- */
/* -- CAROUSEL -- */
#agence {
  background: #f7f7f7;
}

#agence .carousel-wrapper {
  background: #f7f7f7;
}

#agence .carousel-agence {
  background-color: #f7f7f7;
  height: 40vh;
}

#agence .carousel-agence .swiper {
  width: 100%;
  height: 40vh;
}

#agence .fadeUp {
  animation-name: fadeUp;
  animation-duration: 1s;
}

#agence .swiper-slide {
  text-align: center;
  font-size: 0.9rem;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  transition: filter 1s ease-in;
}

#agence .carousel-ref .swiper-slide {
  text-align: center;
  font-size: 0.9rem;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: filter 1s ease-in;
}

#agence .swiper-slide .row {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

#agence .swiper-slide .row > div {
  padding: 0;
}

#agence .swiper-slide img {
  width: 100%;
  height: 100%;
}

#agence .carousel-agence .swiper-slide img {
  object-fit: cover;
  transition: filter 0.3s ease-in;
}

#agence .carousel-agence .swiper-slide-next {
  overflow: hidden;
}

#agence .carousel-agence .swiper-slide-next img {
  width: -webkit-fill-available;
  transition: filter 0.3s ease-in;
}

#agence .swiper-button-prev:focus,
#agence .swiper-button-next:focus {
  /* seulement pour google..*/
  outline: none;
}

/* -- PILIER -- */
#agence .swiper-button-prev,
#agence .swiper-button-next,
#agence .astraga .swiper-button-prev2,
#agence .astraga .swiper-button-next2 {
  position: absolute;
  cursor: pointer;
  font-size: 1rem;
  width: 30px;
  height: 15px;
  top: 0;
  z-index: 20;
}

.haut h1 span {
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  font-family: 'Apercu-medium', 'sans-serif';
  font-size: 0.7rem;
  text-transform: uppercase;
  text-align: left;
  opacity: 1;
  transform: translate(0px);
  letter-spacing: 0.1rem
}

#agence .swiper-button-prev::after,
#agence .astraga .swiper-button-prev::after {
  display: none;
}

#agence .swiper-button-next::after,
#agence .astraga .swiper-button-next::after {
  display: none;
}

#agence .container_nav_slide {
  padding: 3rem 0 2rem;
  margin: auto;
  margin-bottom: 5rem;
  width: -webkit-fill-available;
  z-index: 1;
}

#agence .swiper-button-prev,
#agence .astraga .swiper-button-prev2 {
  left: 0;
  background: url("./other/pictures/left_arrow.svg") no-repeat left center;
  margin: 0 -1rem;
}

#agence .swiper-button-next,
#agence .astraga .swiper-button-next2 {
  right: 0;
  background: url("./other/pictures/right_arrow.svg") no-repeat right center;
  margin: 0 -1rem;
}

#agence .container_nav_slide .swiper-pagination,
#agence .container_nav_slide .swiper-pagination2 {
  position: relative;
  font-size: 0.7rem;
  font-family: Apercu-Bold, sans-serif;
  bottom: 4rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

#agence .container_nav_slide .swiper-pagination-custom {
  bottom: 1px;
}

#agence .container_nav_slide .swiper-pagination-custom span {
  vertical-align: middle;
}

#agence .nav-slider {
  width: 125px;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  font-size: 0.8rem;
  font-weight: bold;
  position: absolute;
}

#agence .tiret-pagination {
  width: 1.7rem;
  height: 1rem;
  background: url("./other/pictures/tiret.svg") no-repeat center;
  display: inline-block;
  margin: 0 1rem;
}

#agence .pilier {
  background-color: #f7f7f7;
  margin: 0;
  padding-bottom: 5rem;
  overflow: hidden;
  z-index: 99;
}

#agence .accroche {
  width: 100%;
  max-width: 600px;
  font-size: 1.5rem;
  text-align: center;
  margin: auto;
  font-family: Apercu-Bold, sans-serif;
  padding-bottom: 2rem;
}

#agence .trait_sw {
  width: 1px;
  height: 3rem;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

#agence .pilier .no-pad {
  padding: 0;
}

#agence .items {
  background-color: #fff;
  height: 32rem;
  padding: 4rem 2rem;
  margin: 2rem auto;
  width: 90%;
}

#agence .items .image {
  height: 4em;
}

#agence .items .image img {
  height: 100%;
  width: auto;
}

#agence .items .titre {
  padding: 1.5rem 0 1rem 0;
  font-family: Apercu-Bold, sans-serif;
  font-size: 1.5rem;
}

#agence .items .trait_sw_in {
  width: 1px;
  height: 30px;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 10px 0;
}

#agence .items .content {
  padding-top: 1.5rem;
  color: #7c7c7c;
  line-height: 155%;
}

#agence .pilier .argumentaire {
  margin-top: 5rem;
}

#agence .pilier .argumentaire .argu {
  align-items: start;
  margin: 0;
}

#agence .pilier .argumentaire .argu h2 {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

#agence .pilier .argumentaire .argu h3,
#agence .pilier .argumentaire .argu p {
  margin-top: 0;
  text-align: left;
  line-height: 1.4rem;
}

#agence .pilier .argumentaire .argu-paragraphe,
#agence .pilier .argumentaire .argu-titre {
  margin-top: 3.3rem;
}

/* -- ASTRAGA -- */
#agence .astraga {
  z-index: 99;
  background: white;
  overflow: hidden;
}

#agence .astraga .flux-container {
  height: 35rem;
}

#agence .astraga .png_astraga {
  width: 100%;
  height: 50rem;
  left: 0;
  object-fit: cover;
}

#agence .astraga {
  background-color: #f7f7f7;
  height: auto;
  position: relative;
}

#agence .astraga .svg_astraga {
  float: right;
  /* height: 50rem; */
  position: absolute;
  left: -15rem;
}

#agence .container_astra {
  position: absolute;
  top: 7%;
  padding: 0 2rem;
  font-family: Apercu-Bold, sans-serif;
}

#agence .astraga .titre {
  padding: 1rem 0;
  font-size: 2.2rem;
  padding-top: 3rem;
}

#agence .astraga .trait_sw_in {
  width: 1px;
  height: 3rem;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

#agence .astraga .content {
  width: 100%;
  margin: 0 auto;
  font-size: 1.5rem;
  padding: 1rem 0;
}

#agence .astraga .argu-content {
  margin-top: 3rem;
  font-family: "Apercu-light", sans-serif;
}

/* -- CAROUSEL REF -- */
#agence .carousel-ref .swiper-slide {
  width: 100%;
  height: 250px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#agence .carousel-ref .content {
  position: absolute;
  color: #fff;
  font-family: Apercu-Bold, sans-serif;
}

#agence .carousel-ref .content img {
  width: 40px;
  height: 40px;
}

#agence .carousel-ref .content .text {
  font-size: 0.8rem;
  margin: 1rem 2rem;
}

#agence .carousel-ref .content .auteur {
  font-size: 0.6rem;
  font-family: Apercu-light, sans-serif;
  max-width: 60%;
  margin: auto;
}

#agence .carousel-ref .content .auteur span {
  color: #ccc;
}

#agence .carousel-ref .content .more_arrow {
  width: 100%;
  height: 100%;
  margin-top: 1rem;
}

#agence .carousel-ref .content a {
  height: 30px;
  margin-left: 1.5rem;
  display: inline-block;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}

#agence .carousel-ref .content .more_arrow {
  background: url("./other/pictures/white_arrow_down.svg");
  width: 1rem;
  height: 1rem;
  display: inline-block;
}

.chiffres-cles{
  position: relative;
}
.chiffres-cles::before{
  content:'';
  display: block;
  width:1px; height:2.5rem;
  position:absolute;
  left:50%; top:0;
  background-color: var(--noir);
  transform: translate(-50%);
}
.chiffres-cles::after{
  content:'';
  display: block;
  width:1px; height:2.5rem;
  position:absolute;
  left:50%; bottom:0;
  background-color: var(--noir);
  transform: translateX(-50%);
}
.chiffres-cles .chiffre{
  background-color: var(--blanc)
}
.chiffres-cles .chiffre .num{
  font-size:2.5rem;
  font-family:'Apercu-bold', 'sans-serif';
  line-height:1.1;
  color: var(--violet)
}
.chiffres-cles .chiffre .libelle{
  font-size:0.75rem;
  text-transform: uppercase;
  font-family:'Apercu-bold', 'sans-serif';
}

/* -- MEDIA QUERY -- */
@media only screen and (min-width: 480px) {
  #agence .astraga .flux-container {
    height: 30rem;
  }

  #agence .container_astra {
    top: 15%;
  }
}

@media screen and (min-width: 667px) {
  #agence .astraga .svg_astraga {
    float: right;
    height: 50rem;
    left: -15rem;
  }
}

@media screen and (min-width: 768px) {
  #agence .carousel-ref .swiper-slide {
    height: 350px;
  }

  #agence .carousel-ref .content img {
    width: 75px;
    height: 75px;
    margin-bottom: 2rem;
  }

  #agence .carousel-ref .content .text {
    font-size: 1rem;
    max-width: 60%;
    margin: 0 auto;
    margin-bottom: 1rem;
  }

  #agence .carousel-ref .content .auteur {
    font-size: 0.8rem;
    margin-top: 2rem;
  }

  #agence .carousel-ref .content .more_arrow {
    width: 2rem;
    height: 2rem;
  }

  #agence .container_astra {
    width: 100%;
  }

  #agence .astraga .argu-content {
    width: 45rem;
    margin: auto;
  }

  #agence .astraga .svg_astraga {
    float: right;
    height: 50rem;
    position: absolute;
    left: -15rem;
  }

  #agence .accroche {
    font-size: 1.8rem;
  }
}

@media screen and (min-width: 992px) {
  #agence .astraga .content {
    width: 55%;
  }

  #agence .carousel-ref .swiper-slide {
    height: 450px;
  }

  #agence .carousel-ref .content .text {
    font-size: 1.5rem;
  }

  #agence .astraga .svg_astraga {
    float: right;
    height: 50rem;
  }
}

@media screen and (min-width: 1024px) {
  #agence .carousel-agence {
    height: 28rem;
  }

  #agence .carousel-agence .swiper {
    height: 28rem;
  }

  #agence .haut .content {
    max-width: 70%;
  }

  #agence .accroche {
    font-size: 2.2rem;
  }
}

@media screen and (min-width: 1200px) {
  #agence .carousel-ref .swiper-slide {
    height: 600px;
  }

  #agence .carousel-ref .content .text {
    font-size: 1.5rem;
  }
}

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

}

@media screen and (min-width: 1400px) {
  #agence .astraga .svg_astraga {
    float: right;
    height: 50rem;
    position: absolute;
    left: -17rem;
  }

  #agence .haut .content {
    max-width: 65%;
  }
}


/*TEAM SLIDER AGENCE*/
#agence .equipe {
  padding-top: 3rem;
}

#agence .h5 {
  text-transform: uppercase;
  padding: 1rem 0;
}

#agence .equipe .tiret {
  width: 3rem;
  height: 1px;
  background-color: #000;
}

#agence .equipe .stagger span {
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  font-family: Apercu-medium, sans-serif;
  font-size: .7rem;
  text-transform: uppercase;
}

#agence .equipe .titre_svg_digit {
  overflow: hidden;
  height: 15rem;
  position: relative;
  margin-top: 2rem;
  text-align: left;
}

#agence .equipe .carousel-team {
  overflow: hidden;
}

#agence .equipe .carousel-team .swiper {
  padding-bottom: 3rem;
}

@media screen and (min-width: 1300px) {
  #agence .equipe .titre_svg_digit {
    margin-top: 7rem;
  }

  #agence .equipe .titre_svg_digit {
    height: 20rem;
  }

}

#agence .equipe .swiper {
  width: 100%;
  height: 100%;
}

#agence .equipe .titre_svg_digit svg {
  width: 1630px;
  height: 260px;
  bottom: 0;
}

#agence .equipe .titre_svg_digit text {
  font-size: 240px;
}

#agence .equipe .argu-content {
  text-align: left;
  padding: 1rem 0;
  font-size: 1.3rem;
  line-height: 1.5;
}

#agence .equipe .h2 {
  font-size: 2.2rem;
  line-height: 3.5rem;
}

#agence .equipe .content {
  font-size: 1.5rem;
  padding: 1rem 0;
  font-weight: 700;
}

#agence .team-slider .swiper-slide {
  text-align: center;
  font-size: 18px;
  padding-bottom: 2rem;
  overflow: hidden;
  background-color: #FFFFFF;
  height: 100%;
}

#agence .team-slider .swiper-slide:hover,
#agence .team-slider .team:hover {
  cursor: none !important;
}

#agence .team-slider .card {
  background-color: var(--blanc);
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  min-height: 92.5%;
  overflow: hidden;
}

#agence .content {
  text-align: left;
}

#agence .team-slider {
  background-color: #f7f7f7;
}

#agence .team-slider .row {
  justify-content: center;
  align-items: flex-end;
}

#agence .team-slider .team {
  height: 200px;
  position: relative;
  z-index: 1
}

#agence .team-slider .team img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  transform-origin: top center;
}

/* #agence .team-slider .card:hover img {
  -webkit-transform: scale(1.525);
  transform: scale(1.25);
  opacity: .2
} */

#agence .team-slider .team::after {
  content: '';
  display: block;
  width: 50px;
  height: 2px;
  background-color: var(--violet);
  position: absolute;
  left: 50%;
  top: 96%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

#agence .team-slider .infos {
  position: relative;
  z-index: 2;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

/* #agence .team-slider .card:hover .infos {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
} */

#agence .team-slider .team-name {
  padding: 0 2rem;
  font-size: 2rem;
}

#agence .team-slider .team-fonction {
  padding: 0rem 2rem 1rem;
  font-size: 1rem;
  font-family: 'Apercu-bold', 'sans-serif';
  min-height: 3rem;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
}

/* @media screen and (min-width: 1280px) {
  #agence .team-slider .team-fonction {
    opacity: 0;
  }

  #agence .team-slider .card:hover .team-fonction {
    opacity: 1
  }
} */

fieldset {
  display: flex;
  flex-direction: column;
}

#postuler .frm_dropzone {
  border: 1px solid #fff;
}

#postuler .frm_dropzone .dz-message {
  border: none;
  background: none;
  font-family: Apercu-Light, sans-serif;
  font-size: 0.7rem;
  margin: 0;
  padding: 2rem;
}

#postuler .frm_dropzone.dz-clickable button,
.frm_dropzone.dz-clickable * {
  cursor: none;
}

#postuler .frm_dropzone.dz-clickable .frm_upload_text button {
  cursor: none !important;
}

#postuler .frm_dropzone .dz-message:hover {
  background: #262426;
  transition: all 0.4s ease;
}

#postuler .frm_dropzone .frm_small_text {
  font-size: 0.7rem;
  color: #ccc;
}

#postuler .frm_dropzone .frm_upload_icon:before {
  font-size: 1rem;
  margin-bottom: 1rem;
  display: inline-block;
}

#postuler .frm_dropzone.frm_single_upload {
  max-width: unset;
}

#postuler input {
  font-family: Apercu-Bold, sans-serif;
}

#postuler .inner {
  padding-left: 0;
  padding-right: 0;
}

/* -- LEFT SIDE -- */
#postuler .left-side {
  z-index: 10;
  padding: 13rem 7.5%;
  padding-bottom: 0;
}

#frm_field_113_container {
  opacity: 0 !important;
}

#postuler .left-side h2 {
  font-size: 2.2rem;
  color: #fff;
}

#postuler .full-contact .titre {
  color: #fff;
}

#postuler h5 {
  margin: 0;
}

#postuler .full-contact .tiret {
  background: #fff;
}

#postuler .full-contact .tiret {
  width: 3rem;
  height: 1px;
  background-color: #fff;
}

#postuler .full-contact h5 span {
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  font-family: Apercu-Medium, sans-serif;
}

#postuler textarea {
  outline: none;
  resize: none;
  padding: 1rem;
  font-family: Apercu-Medium, sans-serif;
  font-size: 1rem;
  width: -webkit-fill-available;
}

#postuler input#field_m0crm {
  cursor: pointer;
}

#postuler input#file-upload-button {
  outline: none;
}

/* -- RIGHT SIDE -- */
#postuler .right-side {
  z-index: 10;
  padding: 13rem 7.5%;
  padding-top: 1rem;
  padding-bottom: 4rem;
}

/* -- BTN -- */
#postuler .frm_button_submit {
  padding: 1rem 2.2rem;
  font-size: 0.8rem;
  font-family: Apercu-Bold, sans-serif;
  border-radius: 50px;
  border: none;
  transition: all 0.4s ease;
  border: 1px solid white;
}

#postuler .frm_button_submit:hover {
  color: white;
  background: none;
}

/* -- MEDIA QUERY */
@media screen and (min-width: 768px) {
  #postuler .form-container {
    padding: 0 3rem;
  }

  #postuler .left-side {
    z-index: 10;
    padding: 13rem 7.5%;
    padding-bottom: 0;
  }

  #postuler .right-side {
    z-index: 10;
    padding: 13rem 7.5%;
    padding-top: 1rem;
    padding-bottom: 4rem;
  }

  #postuler .inner {
    padding-left: 7.5%;
    padding-right: 7.5%;
  }
}

@media screen and (min-width: 1024px) {
  #postuler fieldset {
    flex-direction: row;
  }

  #postuler .full-contact {
    display: flex;
    z-index: 99;
    flex-direction: column;
  }

  #postuler .left-side {
    display: grid;
    align-items: center;
    height: 100vh;
    z-index: 10;
    padding: 13rem 5%;
    width: 50%;
  }

  #postuler .right-side {
    transform: translate(0px, -30%);
    display: grid;
    align-items: center;
    width: 50%;
    background: none;
    padding: 13rem 5%;
  }
}

@media screen and (min-width: 1160px) {
  #postuler .contact-info {
    color: #fff;
    text-align: left;
    padding: 1rem;
    padding-left: 5rem;
  }
}

/* -- ACTU ------------------------------------------------------------------ */
/* --CONTENT -- */
#actu {
  background-color: #f7f7f7;
}

#actu .content {
  background-color: #f7f7f7;
}

#actu .haut {
  padding-bottom: 9rem;
}

#actu .haut .content {
  background-color: transparent;
  color: #fff;
  max-width: 90%;
}

#actu .haut .titre {
  color: #fff;
}

#actu .haut .tiret {
  background: #ccc;
}

#actu .huge_padding {
  width: 90vw;
  margin: 0 auto;
  text-align: left;
}

#actu .huge_padding h2 {
  font-size: 2.5rem;
  margin: 1em 0;
  font-family: Apercu-Bold, sans-serif;
  color: #7c7c7c;
}

#actu .huge_padding h3 {
  font-size: 1.75rem;
  margin: 1em 0;
  font-family: Apercu-Bold, sans-serif;
  color: #7c7c7c;
}

#actu .huge_padding .texte {
  font-size: 0.9rem;
  color: #7c7c7c;
}

#actu .huge_padding img {
  margin: 0;
  width: 100%;
}

/* -- CAROUSEL -- */
#actu .swiper {
  width: 100%;
  height: 100%;
}

#actu .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #cee9f4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  overflow: hidden;
}

#actu .swiper-slide a {
  padding: 0 4rem;
}

#actu .carousel {
  font-family: Apercu-Bold, sans-serif;
}

#actu .carousel a {
  text-decoration: none;
  color: #fff;
  font-size: 1.2rem;
}

#actu .carousel a:hover {
  text-decoration: none;
}

#actu .carousel .swiper-button-prev {
  left: 5%;
  top: 85%;
  background: url("./other/pictures/journal/white_arrow_left.svg") no-repeat left center;
  margin: 0;
  width: 52px;
  outline: none;
  cursor: none;
}

#actu .carousel .swiper-button-next {
  right: 5%;
  top: 85%;
  background: url("./other/pictures/journal/white_arrow_right.svg") no-repeat right center;
  margin: 0;
  width: 52px;
  outline: none;
  cursor: none;
}

#actu .carousel .swiper-button-prev::after {
  display: none;
}

#actu .carousel .swiper-button-next::after {
  display: none;
}

#actu .carousel .img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  min-height: 55vw;
  width: -webkit-fill-available;
}

#actu .carousel .texte_center {
  text-align: center;
  top: 35%;
  position: relative;
}

#actu .has-violet-color {
  color: #6c63fc !important
}

#actu .has-grisclair-color {
  color: #f7f7f7 !important
}

#actu .has-gris-color {
  color: #7c7c7c !important
}

#actu .has-bleu-color {
  color: #1495cc !important
}

#actu .has-blanc-color {
  color: #ffffff !important
}

#actu .has-violet-background-color {
  background-color: #6c63fc !important
}

#actu .has-grisclair-background-color {
  background-color: #f7f7f7 !important
}

#actu .has-gris-background-color {
  background-color: #7c7c7c !important
}

#actu .has-bleu-background-color {
  background-color: #1495cc !important
}

#actu .has-blanc-background-color {
  background-color: #ffffff !important
}

#actu .has-background {
  padding: 1rem;
}

#actu .wp-block-separator.has-background {
  padding: 0;
}

#actu .huge_padding ul li {
  margin: 1em 0;
}

#actu .accroche {
  font-size: 1.85rem;
  line-height: 120%;
}

#actu h2.gros-titre {
  font-size: 2.5rem;
  padding-right: 5%;
  margin-top: 0.5em;
  line-height: 105%;
  text-transform: uppercase;
}

.wp-block-image figcaption {
  text-align: left;
  font-size: 0.7rem;
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 576px) {
  #actu .content_journal .accroche {
    font-size: 1.1rem;
  }

  #actu .content_journal .texte {
    font-size: 0.8rem;
  }
}

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

  #actu .huge_padding .titre {
    font-size: 1.2rem;
  }

  #actu .huge_padding .texte {
    font-size: 0.9rem;
  }

  #actu .carousel a {
    font-size: 1.2rem;
  }

  #actu .carousel .img {
    min-height: 40vw;
  }

  #actu .carousel2 .swiper-slide {
    height: 350px;
  }

  #actu .carousel2 .content img {
    width: 75px;
    height: 75px;
  }

  #actu .carousel2 .content .text {
    font-size: 1rem;
    max-width: 60%;
    margin: 0 auto;
    margin-bottom: 1rem;
  }

  #actu .carousel2 .content .auteur {
    font-size: 0.8rem;
  }
}

@media screen and (min-width: 992px) {
  #actu .huge_padding .titre {
    font-size: 1.3rem;
  }

  #actu .huge_padding .texte {
    font-size: 1rem;
  }

  #actu .carousel a {
    font-size: 1.3rem;
  }

  #actu .carousel .img {
    min-height: 30vw;
  }

  #actu .carousel2 .swiper-slide {
    height: 450px;
  }

  #actu .carousel2 .content .text {
    font-size: 1.5rem;
  }

}

@media screen and (min-width: 1024px) {
  #actu .haut .content {
    max-width: 80%;
  }

  #actu .carousel .swiper-button-prev {
    left: 41%;
    top: 80%;
  }

  #actu .carousel .swiper-button-next {
    right: 41%;
    top: 80%;
  }

  #actu .carousel .texte_center {
    text-align: right;
    top: 50%;
  }

  #actu .carousel .swiper-slide-next .texte_center {
    text-align: left;
    top: 50%;
    position: relative;
  }

  /* #actu .huge_padding .wp-block-columns{
    width:70vw; margin:0 auto; padding-bottom:3rem;
  } */
  /* #actu .huge_padding .wp-block-columns.alignwide, #actu .huge_padding .wp-block-columns.alignfull{
    width:100%;
  }
  #actu .huge_padding .wp-block-image.alignwide, #actu .huge_padding .wp-block-image.alignwide img{
    max-width:100%;
  } */
  #actu h2.gros-titre {
    font-size: 3rem;
  }

}

@media screen and (min-width: 1200px) {
  #actu .huge_padding {
    width: 60vw;
  }

  *.alignfull {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    max-width: 100vw;
    width: 100vw;
  }

  /* #actu .huge_padding .wp-block-columns{
    width:50vw; margin:0 auto;
  } */
  #actu .huge_padding .titre {
    font-size: 1.5rem;
  }

  #actu .huge_padding .texte {
    font-size: 1rem;
  }

  #actu .carousel a {
    font-size: 1.5rem;
  }

  #actu .carousel .img {
    min-height: 19vw;
  }

  #actu .carousel .swiper-button-prev {
    left: 43%;
    top: 80%;
  }

  #actu .carousel .swiper-button-next {
    right: 43%;
    top: 80%;
  }

  #actu .carousel2 .swiper-slide {
    height: 600px;
  }

  #actu .carousel2 .content .text {
    font-size: 1.5rem;
  }

  #actu h2.gros-titre {
    font-size: 3.5rem;
  }
}

@media screen and (min-width: 1440px) {
  #actu .huge_padding {
    width: 50vw;
  }
}

/* -- SINGLE REF ------------------------------------------------------------ */
/* --CONTENT -- */

#single_ref .content {
  background-color: #f7f7f7;
}

#single_ref .content.white {
  background-color: var(--blanc);
}

#single_ref .haut, #single_refac .haut {
  color: #fff;
  padding-bottom: 9rem;
}

#single_ref .tiret, #single_refac .tiret {
  background: #fff;
}

#single_ref .haut .content {
  background-color: transparent;
}

#single_ref .huge_padding {
  width: 90vw;
  margin: 0 auto;
  text-align: left;
  background-color: #f7f7f7;
}

#single_ref .content.white .huge_padding {
  background-color: var(--blanc);
}

#single_ref .huge_padding .titre h2 {
  font-size: 1.5rem;
  margin: 3rem 0;
  margin-top: 1rem;
  font-family: Apercu-Bold, sans-serif;
}

#single_ref .huge_padding .texte {
  font-size: 0.7rem;
}

#single_ref .huge_padding .lien a {
  text-decoration: none;
  font-size: 0.7rem;
  color: #6c63fc;
  font-weight: bold;
  overflow: hidden;
  background: linear-gradient(to right, #000, #000 50%, #6c63fc 50%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 200% 100%;
  background-position: 100%;
  transition: background-position 275ms ease;
}

#single_ref .huge_padding .lien a:hover {
  background-position: 0 100%;
}

#single_ref .huge_padding ~ img {
  height: auto;
  max-width: 100%;
}

/* -- CAROUSEL -- */
#single_ref .swiper-container {
  width: 100%;
  height: 100%;
}

#single_ref .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #cee9f4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  overflow: hidden;
}

#single_ref .carousel {
  font-family: Apercu-Bold, sans-serif;
}

#single_ref .carousel a {
  text-decoration: none;
  color: #fff;
  font-size: 1.2rem;
}

#single_ref .carousel a:hover {
  text-decoration: underline;
}

#single_ref .carousel .swiper-button-prev {
  left: 5%;
  top: 85%;
  background: url("./other/pictures/journal/white_arrow_left.svg") no-repeat left center;
  margin: 0;
  width: 52px;
}

#single_ref .carousel .swiper-button-next {
  right: 5%;
  top: 85%;
  background: url("./other/pictures/journal/white_arrow_right.svg") no-repeat right center;
  margin: 0;
  width: 52px;
}

#single_ref .carousel .swiper-button-prev::after {
  display: none;
}

#single_ref .carousel .swiper-button-next::after {
  display: none;
}

#single_ref .carousel .img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  min-height: 55vw;
}

#single_ref .carousel .texte_left {
  text-align: center;
  padding: 5% 6%;
  top: 0;
}

#single_ref .carousel .texte_right {
  text-align: center;
  padding: 5% 6%;
  top: 0;
}

/* -- CAROUSEL2 -- */
#single_ref .carousel2 {
  margin-top: 7em;
}

#single_ref .carousel2 .swiper-slide {
  text-align: center;
  font-size: 0.9rem;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  transition: filter 1s linear;
}

#single_ref .carousel2 .swiper-slide {
  width: 100%;
  height: 250px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#single_ref .carousel2 .content {
  position: absolute;
  color: #fff;
  font-family: Apercu-Bold, sans-serif;
  background-color: transparent;
}

#single_ref .carousel2 .content img {
  width: 40px;
  height: 40px;
  margin-bottom: 20px;
}

#single_ref .carousel2 .content .text {
  font-size: 0.8rem;
  margin: 1rem 2rem;
}

#single_ref .carousel2 .content .auteur {
  font-size: 0.6rem;
  margin-top: 2rem;
  font-family: Apercu-light, sans-serif;
}

#single_ref .carousel2 .content .auteur span {
  color: #ccc;
}

#single_ref .carousel2 .content .more_arrow {
  width: 100%;
  height: 100%;
}

#single_ref .carousel2 .content a {
  width: 30px;
  height: 15px;
}

.nav-interpost {
  overflow: hidden;
}

.nav-interpost .row > div {
  padding-left: 0;
  padding-right: 0;
}

.nav-interpost .bt {
  position: relative;
  font-family: 'Apercu-Bold';
  opacity: .7;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.nav-interpost .bt a {
  display: block;
  padding: 3rem;
  font-size: 1.5rem;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  z-index: 2;
}

.nav-interpost .bt.prec {
  background: #1495cc;
}

.nav-interpost .bt span.fl {
  display: block;
  position: absolute;
  bottom: 2rem;
  width: 52px;
  height: 10px;
  z-index: 1;
}

.nav-interpost .bt.prec span.fl {
  right: 10%;
  background: url(img/white_arrow_left.svg) no-repeat left center / cover
}

.nav-interpost .bt.suiv {
  background: #6c63fc;
}

.nav-interpost .bt.suiv span.fl {
  left: 10%;
  background: url(img/white_arrow_right.svg) no-repeat right center / cover
}

.nav-interpost .bt:hover {
  opacity: 1;
}

.nav-interef {
  padding: 1rem 10% 3rem 10%;
  text-align: center;
}

.nav-interef h3 {
  text-align: center;
}

.nav-interef a, .nav-interef a span {
  display: block;
}

.nav-interef a {
  text-decoration: none;
  color: var(--noir);
  margin-bottom: 1rem;
}

.nav-interef .ttl {
  padding: 0.5rem 0;
  text-align: left;
}

.nav-interef .vignette {
  overflow: hidden;
}

.nav-interef .vignette img {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.nav-interef a:hover .vignette img {
  -webkit-transform: translate(-50%, -50%) scale(1.1);
  transform: translate(-50%, -50%) scale(1.1);
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 576px) {
  #single_ref .content_journal .accroche {
    font-size: 1.1rem;
  }

  #single_ref .content_journal .texte {
    font-size: 0.8rem;
  }
}

@media screen and (min-width: 768px) {
  #single_ref .huge_padding .titre {
    font-size: 1.2rem;
  }

  #single_ref .huge_padding .texte,
  #single_ref .huge_padding .lien {
    font-size: 0.9rem;
  }

  #single_ref .huge_padding .lien a {
    font-size: 0.9rem;
  }

  #single_ref .huge_padding ~ img {
    height: auto;
    max-width: 100%;
  }

  #single_ref .carousel a {
    font-size: 1.2rem;
  }

  #single_ref .carousel .img {
    min-height: 40vw;
  }

  #single_ref .carousel .texte_left {
    padding: 0 6%;
    top: 50%;
  }

  #single_ref .carousel .texte_right {
    padding: 0 6%;
    top: 50%;
  }

  #single_ref .carousel2 .swiper-slide {
    height: 350px;
  }

  #single_ref .carousel2 .content img {
    width: 75px;
    height: 75px;
  }

  #single_ref .carousel2 .content .text {
    font-size: 1rem;
    max-width: 60%;
    margin: 0 auto;
    margin-bottom: 1rem;
  }

  #single_ref .carousel2 .content .auteur {
    font-size: 0.8rem;
  }

  .nav-interpost .bt a {
    font-size: 2rem;
  }
}

@media screen and (min-width: 992px) {
  #single_ref .huge_padding .titre {
    font-size: 1.3rem;
  }

  #single_ref .carousel a {
    font-size: 1.3rem;
  }

  #single_ref .carousel .img {
    min-height: 30vw;
  }

  #single_ref .carousel .texte_left {
    text-align: left;
    padding: 0 6%;
    top: 50%;
  }

  #single_ref .carousel .texte_right {
    text-align: right;
    padding: 0 6%;
    top: 50%;
  }

  #single_ref .carousel2 .swiper-slide {
    height: 450px;
  }

  #single_ref .carousel2 .content .text {
    font-size: 1.5rem;
  }

  .nav-interpost .bt a {
    font-size: 2.2rem;
  }
}

@media screen and (min-width: 1024px) {
  #single_ref .haut .content {
    max-width: 70%;
  }
}

@media screen and (min-width: 1200px) {
  #single_ref .huge_padding .titre {
    font-size: 1.5rem;
  }

  #single_ref .huge_padding .texte,
  #single_ref .huge_padding .lien {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  #single_ref .huge_padding .lien a {
    font-size: 1rem;
  }

  #single_ref .carousel a {
    font-size: 1.5rem;
  }

  #single_ref .carousel a:hover {
    text-decoration: none;
  }

  #single_ref .carousel .img {
    min-height: 19vw;
  }

  #single_ref .carousel .texte_left {
    text-align: left;
    padding: 0 2rem;
    top: 30%;
  }

  #single_ref .carousel .texte_right {
    text-align: right;
    padding: 0 2rem;
    top: 30%;
  }

  #single_ref .carousel .swiper-button-prev {
    left: 43%;
    top: 70%;
  }

  #single_ref .carousel .swiper-button-next {
    right: 43%;
    top: 70%;
  }

  #single_ref .carousel2 .swiper-slide {
    height: 600px;
  }

  #single_ref .carousel2 .content .text {
    font-size: 1.5rem;
  }

  .nav-interpost .bt a {
    padding: 5rem;
  }
}

@media screen and (min-width: 1200px) {
  #single_ref .huge_padding {
    width: 60vw;
  }

  #single_ref .content.white .huge_padding {
    width: 80vw;
  }
}

/* -- SERVICES -------------------------------------------------------------- */
#single_service {
  background: #f7f7f7;
}

#single_service .accroche_web {
  padding-bottom: 4rem;
  background-color: #f7f7f7;
}

#single_service .accroche_web img {
  height: auto;
  max-width: 100%;
}

#single_service .accroche_web .texte p {
  margin-top: 0;
}

#single_service .trait_sw {
  width: 1px;
  height: 3rem;
  background-color: #000;
  display: inline-block;
  margin: 2rem 0;
}

/* -- CAROUSEL -- */
#single_service .swiper {
  width: 100%;
  height: 35vh;
  margin-left: 0;
}

#single_service .carousel {
  background: #f7f7f7;
}

#single_service .img-scale {
  transform: scale(1);
  overflow: hidden;
  transition: transform 0.25s ease-in-out;
}

#single_service .swiper-slide:hover .img-scale {
  transform: scale(1.1);
  overflow: hidden;
  transition: transform 0.25s ease-in-out;
}

#single_service .fadeUp {
  animation-name: fadeUp;
  animation-duration: 1s;
}

#single_service .swiper-info {
  width: 50%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

#single_service .gallery-thumbs {
  background: #000;
}

#single_service .swiper-set {
  width: 11rem;
  margin: 0 auto;
  position: relative;
}

#single_service .carousel .text_container {
  padding: 1rem;
  height: auto;
  position: relative;
}

#single_service .carousel .text_container a {
  text-decoration: none;
  color: #fff;
  transition: all 0.4s ease;
}

#single_service .carousel .titre {
  font-size: 1.2rem;
}

#single_service .carousel .titre span {
  font-family: Apercu-Bold, sans-serif;
}

#single_service .carousel .accroche {
  font-size: 1rem;
  font-family: Apercu-Bold, sans-serif;
}

#single_service .carousel .accroche p {
  text-align: center;
}

#single_service .trait_carousel {
  display: none;
  width: 1px;
  height: 2rem !important;
  margin: 0 auto;
  background-color: #fff;
  margin: 2rem 0;
}

#single_service .carousel .swiper-button-prev,
#single_service .carousel .swiper-button-next {
  cursor: pointer;
  z-index: 20;
  height: 0.95rem;
  margin: 0;
  outline: none;
}

#single_service .swiper-button-next::after,
#single_service .swiper-button-prev::after {
  display: none;
}

#single_service .carousel .swiper-button-prev {
  background: url("./other/pictures/white_left_arrow.svg") no-repeat left center;
  top: -3rem;
}

#single_service .carousel .swiper-button-next {
  background: url("./other/pictures/white_right_arrow.svg") no-repeat right center;
  top: -3rem;
}

#single_service .carousel .swiper-pagination {
  font-size: 0.7rem;
  font-family: Apercu-Bold, sans-serif;
  bottom: 2rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: #fff;
}

#single_service .tiret-pagination {
  width: 1.7rem;
  height: 1.1rem;
  background: url("./other/pictures/white-tiret.svg") no-repeat center;
  display: flex;
  margin: 0 1rem;
}

/* -- SERVICES -- */
#single_service .services_appli_web {
  background-color: #f7f7f7;
  overflow: hidden;
  padding: 5rem 0;
  z-index: 2;
}

#single_service .services_appli_web h2 {
  font-size: 2rem;
}

#single_service .services_appli_web .inner {
  margin: auto;
}

#single_service .services_appli_web .link-card {
  text-decoration: none;
  color: #000;
}

#single_service .services_appli_web .items {
  background-color: #fff;
  height: auto;
  min-height: 30rem;
  padding: 3rem 2rem;
  margin: 1rem auto;
  height: calc(100% - 2rem);
}

#single_service .services_appli_web .accroche {
  font-size: 1.5rem;
  font-family: Apercu-Bold, sans-serif;
  margin-top: 2rem;
}

#single_service .services_appli_web .accroche {
  margin: auto;
  width: fit-content;
  padding: 0 7.5%;
}

#single_service .services_appli_web .accroche h2 {
  margin-bottom: 0;
  text-align: center;
}

#single_service .services_appli_web .items .titre {
  padding: 1.5rem 0 1rem 0;
  font-family: Apercu-Bold, sans-serif;
  font-size: 2rem;
}

#single_service .services_appli_web .items .titre h2 {
  font-size: 1.5rem;
  margin: auto;
  width: fit-content;
  text-align: center;
}

#single_service .services_appli_web .items .trait_sw_in {
  width: 1px;
  height: 3rem;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

#single_service .services_appli_web .items .image {
  text-align: center;
}

#single_service .services_appli_web .items img {
  margin-top: 1rem;
  left: 50%;
  top: 50%;
  width: 75%;
  object-fit: contain;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 375px) {
  #single_service .carousel .accroche {
    font-size: 1.2rem;
  }
}

@media screen and (min-width: 768px) {
  #single_service .swiper {
    height: 28rem;
  }

  #single_service .carousel .titre {
    font-size: 0.8rem;
  }

  #single_service .carousel .accroche {
    font-size: 1.5rem;
  }

  #single_service .services_appli_web h2 {
    font-size: 2.5rem;
  }

  #single_service .carousel .text_container {
    padding: 10rem;
  }
}

@media screen and (min-width: 991px) {
  #single_service .accroche_web .texte {
    text-align: left;
    max-width: 75%;
    padding-left: 1rem;
  }
}

@media screen and (min-width: 1024px) {
  #single_service .carousel {
    display: flex;
  }

  #single_service .swiper {
    width: 100%;
  }

  #single_service .carousel .text_container {
    padding: 5rem;
  }

  #single_service .trait_carousel {
    height: 2rem !important;
    display: inline-block;
  }

  #single_service .carousel .accroche p {
    margin-top: 0;
  }

  #single_service .carousel .swiper-pagination {
    bottom: 4rem;
  }

  #single_service .carousel .swiper-button-prev {
    top: -5rem;
  }

  #single_service .carousel .swiper-button-next {
    top: -5rem;
  }
}

@media screen and (min-width: 1200px) {
  #single_service .trait_carousel {
    height: 2rem !important;
    margin: 2rem 0;
  }
}

#contact {
  font-family: Apercu-Bold, sans-serif;
}

#contact input {
  font-family: Apercu-Bold, sans-serif;
}

/* -- LEFT SIDE -- */
#contact .left-side {
  background: #fff;
  z-index: 10;
  padding: 8rem 7.5%;
  display: grid;
  align-items: center;
}

#contact .left-side h2 {
  font-size: 1.75rem;
  padding-bottom: 2rem;
}

/* -- BTN -- */
#contact .frm_button_submit {
  padding: 1rem 2rem;
  font-family: Apercu-Bold, sans-serif;
  border-radius: 50px;
  transition: all 0.4s ease;
}

#contact textarea {
  outline: none;
  resize: none;
  padding: 1rem;
  font-family: Apercu-Medium, sans-serif;
  font-size: 1rem;
  width: -webkit-fill-available;
}

/* -- RIGHT SIDE -- */
#contact .right-side {
  background: #000;
  z-index: 10;
  padding: 8rem 7.5%;
  display: grid;
  align-items: center;
}

#contact .contact-info {
  color: #fff;
  text-align: left;
  padding: 1rem 0;
}

#contact .contact-info .tiret {
  width: 2rem;
  height: 1px;
  margin-right: 2rem;
  background-color: #fff;
  display: inline-block;
  align-self: center;
}

#contact .contact-info .full-section {
  display: flex;
  padding-bottom: 0.7rem;
}

#contact .contact-info .title-section {
  padding-top: 1.3rem;
  text-transform: uppercase;
  font-size: 0.8rem;
  line-height: 1.5rem;
  letter-spacing: 0.05rem;
}

#contact .contact-info .title-section-inline {
  text-transform: uppercase;
  font-size: 0.8rem;
  line-height: 1.5rem;
  letter-spacing: 0.05rem;
}

#contact .contact-info .title-section h5,
#contact .contact-info .title-section-inline h5 {
  margin: 0;
}

#contact .contact-info a {
  text-decoration: none;
  color: #fff;
}

#contact .contact-info p {
  padding-left: 4rem;
  margin-top: 1rem;
  letter-spacing: 0.1rem;
  width: fit-content;
  color: #fff;
  text-decoration: none;
  font-family: "Apercu-Light";
}

#contact .socials p,
#contact .contact-mail p {
  color: #fff;
  overflow: hidden;
  background: linear-gradient(to right, #707070, #707070 50%, #fff 50%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 200% 100%;
  background-position: 100%;
  transition: background-position 275ms ease;
}

#contact .socials p:hover,
#contact .contact-mail p:hover {
  background-position: 0 100%;
}

/* -- MEDIA QUERY */
@media screen and (min-width: 768px) {
  #contact .left-side {
    background: #fff;
    z-index: 10;
    padding: 8rem 15%;
  }

  #contact .form-container {
    padding: 0 3rem;
  }

  #contact .contact-info {
    color: #fff;
    text-align: left;
    padding: 1rem;
  }
}

@media screen and (min-width: 1024px) {
  #contact .form-container {
    padding-top: 5rem;
  }

  #contact .full-contact {
    display: flex;
  }

  #contact .contact-info:first-child {
    padding-top: 6rem;
  }

  #contact .left-side {
    background: #fff;
    z-index: 10;
    padding: 8rem 5%;
    width: 50%;
  }

  #contact .right-side {
    width: 50%;
  }
}

@media screen and (min-width: 1160px) {
  #contact .contact-info {
    color: #fff;
    text-align: left;
    padding: 1rem;
    padding-left: 4rem;
  }
}

@media screen and (min-width: 1200px) {
  .left-side {
    padding: 8rem 7.5%;
  }
}

/* -- COOKIES --------------------------------------------------------------- */
#cookie-notice {
  font-family: Apercu-light, sans-serif !important;
  font-size: 0.7rem !important;
  text-transform: uppercase;
}

#cookie-notice .cookie-notice-container {
  padding: 0 7.5%;
  text-align: left;
  display: flex !important;
  flex-direction: column-reverse;
}

#cookie-notice #cn-notice-text {
  margin: 0;
  display: block !important;
  max-width: 30rem;
  line-height: 1rem;
  margin: 1rem 0;
}

#cookie-notice #cn-notice-buttons {
  justify-content: flex-end;
  flex-grow: 1;
}

#cookie-notice a {
  color: #fff;
  font-size: 0.7rem !important;
  font-family: Apercu-light, sans-serif !important;
}

#cookie-notice .cn-text-container,
.cn-buttons-container {
  display: flex !important;
  flex-direction: column;
  margin-top: 1rem;
}

#cookie-notice #cn-accept-cookie  {
  margin-right: 3rem !important;
}

#cookie-notice .cn-button {
  width: 11rem;
  border: 1px solid !important;
  border-color: #fff !important;
  text-transform: uppercase;
  border-radius: 50px;
  padding: 0.5rem 1rem;
  color: #fff;
  background: #000;
  transition: all 0.4s ease;
  margin: 0 !important;
}

#cookie-notice .cn-button:hover {
  color: #000;
  background: #fff;
  transition: all 0.4s ease;
}

#cookie-notice .cn-close-icon {
  position: absolute;
  left: 90vw;
  top: 24%;
  margin-top: -10px;
  width: 15px;
  height: 15px;
  opacity: 0.5;
  padding: 10px;
  outline: none;
}

#cookie-notice .cn-close-icon:hover {
  opacity: 1;
  transition: all 0.4s ease;
}

#cookie-notice #cn-close-notice {
  margin-right: 0;
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 768px) {
  #cookie-notice #cn-notice-text {
    margin: 0;
    padding: 0.5rem 0;
  }

  #cookie-notice #cn-close-notice {
    margin-right: 7.5%;
  }

  #cookie-notice .cn-text-container,
  .cn-buttons-container {
    align-items: center;
    display: flex !important;
    flex-direction: row;
    margin: 0;
  }

  #cookie-notice .cookie-notice-container {
    padding: 0 7.5%;
    text-align: left;
    display: flex !important;
    flex-direction: row;
  }

  #cookie-notice .cn-button {
    margin: 0 3rem !important;
  }

  #cookie-notice .cn-close-icon {
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -10px;
    width: 15px;
    height: 15px;
    opacity: 0.5;
    padding: 10px;
    outline: none;
  }
}

@media screen and (min-width: 1400px) {
  #cookie-notice .cn-button {
    margin: 0 5rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #cookie-notice .cn-button {
    margin: 0 10rem !important;
  }
}




/* -- SERVICES -------------------------------------------------------------- */
#app_web .accroche_web {
  padding-bottom: 6rem;
  background-color: #f7f7f7;
}

#app_web .accroche_web img {
  min-width: 200px;
  height: auto;
  max-width: 100%;
}

#app_web .accroche_web .texte {
  text-align: center;
  max-width: 100%;
}

#app_web .accroche_web .texte p {
  margin-top: 0;
}

#app_web .accroche_web img {
  margin: 25% 0;
}

#app_web .trait_sw {
  width: 1px;
  height: 3rem;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

/* -- CAROUSEL -- */
#app_web .carousel {
  margin-top: 3rem;
  z-index: 2;
  position: sticky;
  top: 0;
}

#app_web .swiper {
  width: 100%;
  height: 100%;
}

#app_web .swiper-slide {
  text-align: center;
  font-size: 0.9rem;
  background: #f7f7f7;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

#app_web .swiper-slide .row {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

#app_web .swiper-slide .row > div {
  padding: 0;
}

#app_web .swiper-slide .vs {
  overflow: hidden;
}

#app_web .swiper-slide .vs > div {
  height: 120%;
  top: -10%;
}

#app_web .carousel .text_container {
  height: auto;
  position: absolute;
  left: 50%;
  top: 42%;
  transform: translate(-50%, -50%);
  width: 80%;
}

#app_web .carousel .text_container a {
  text-decoration: none;
  color: #000;
}

#app_web .carousel .text_container a:hover {
  text-decoration: underline;
}

#app_web .carousel .titre {
  font-size: 0.7rem;
}

#app_web .carousel .accroche {
  font-size: 1rem;
  font-family: Apercu-Bold, sans-serif;
}

#app_web .trait_carousel {
  width: 1px;
  height: 15px !important;
  margin: 0 auto;
  background-color: black;
  display: inline-block;
  margin: 10px 0;
}

#app_web .carousel .swiper-button-prev,
#app_web .carousel .swiper-button-next {
  position: absolute;
  cursor: pointer;
  font-size: 1rem;
  width: 30px;
  height: 15px;
  top: 0;
  z-index: 20;
}

#app_web .swiper-button-next::after,
#app_web .swiper-button-prev::after {
  display: none;
}

#app_web .carousel .swiper-button-prev {
  left: 0;
  background: url("./other/pictures/left-arrow.png") no-repeat left center;
  margin: 0;
}

#app_web .carousel .swiper-button-next {
  right: 0;
  background: url("./other/pictures/right-arrow.png") no-repeat right center;
  margin: 0;
}

#app_web .carousel .swiper-pagination {
  position: relative;
}

#app_web .carousel .swiper-pagination-fraction {
  bottom: 0;
}

#app_web .carousel .swiper-pagination-fraction span {
  vertical-align: middle;
}

#app_web .nav-slider {
  width: 125px;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  font-size: 0.6rem;
  font-weight: bold;
}

#app_web .tiret-pagination {
  width: 18px;
  height: 2px;
  background: url("./other/pictures/right-arrow.png") no-repeat center;
  display: inline-block;
  margin: 0 8px;
}

/* -- SERVICES -- */
#app_web .services_appli_web {
  background-color: #f7f7f7;
  overflow: hidden;
  padding: 5rem;
}

#app_web .services_appli_web .items {
  background-color: #fff;
  height: auto;
  padding: 3rem 2rem;
  margin: 1rem auto;
  width: 80%;
  max-width: 80%;
}

#app_web .services_appli_web .accroche {
  font-size: 1.5rem;
  font-family: Apercu-Bold, sans-serif;
  margin-top: 2rem;
}

#app_web .services_appli_web .accroche {
  margin: auto;
  width: fit-content;
}

#app_web .services_appli_web .accroche h2 {
  margin-bottom: 0;
}

#app_web .services_appli_web .items .titre {
  padding: 1.5rem 0 1rem 0;
  font-family: Apercu-Bold, sans-serif;
  font-size: 2rem;
}

#app_web .services_appli_web .items .titre h2 {
  font-size: 1.5rem;
  margin: auto;
  width: fit-content;
}

#app_web .services_appli_web .items .trait_sw_in {
  width: 1px;
  height: 3rem;
  background-color: black;
  display: inline-block;
  margin: 2rem 0;
}

#app_web .services_appli_web .items img {
  margin-top: 1rem;
}

/* -- MEDIA QUERY -- */
@media screen and (min-width: 991px) {
  #app_web .accroche_web .texte {
    text-align: left;
    max-width: 75%;
  }
}

@media screen and (min-width: 1200px) {
  #app_web .accroche_web::before {
    background: #000d;
    content: "";
    position: absolute;
    display: block;
    height: 100%;
    width: 1px;
    left: 50%;
  }
}

#form_rappel .frm_fields_container {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

/* #form_rappel  .form-field {
  display: flex;
  justify-content: center;
} */

/* #form_rappel  .phone_number {
  width: 16%;
  font-size: 3rem;
  text-align: center;
  margin-bottom: 1.5rem;
} */
#form_rappel  .phone_number input {
  font-size: 2rem;
  text-align: center;
}
#form_rappel .frm_error{
  margin:0;
}
#form_rappel input[type=checkbox]{
	border: 1px solid;
}
/*PAGINATION*/
.pagination {
  display: flex;
  justify-content: center;
  margin: 2rem 0;
  color: var(--violet);
  font-size: 0.8rem;
  font-weight: 600;
}
.pagination .page-numbers{
  padding: .35rem .75rem;
  display: inline-block;
  color: var(--violet);
  text-decoration: none;
}

.pagination .page-numbers.current {
  color: var(--blanc);
  background-color: var(--violet)
}

.navigation-links a{
  display: inline-block;
  border: solid 1px var(--violet);
  padding: 1rem 2rem;
  border-radius: 30px;
  text-decoration: none;
  margin-bottom: 2rem;
  color: var(--violet);
  min-width:250px;
}

.navigation-links a:hover {
  display: inline-block;
  border: solid 1px var(--violet);
  background: var(--violet);
  color: #FFFFFF;
}

.round-corner{
  border-radius: 1rem;
  overflow: clip;
}
.boutons{
  gap: 1rem;
}
.boutons .wp-block-button a{
  display: grid;
  grid-template-columns: [icone] 50px [libelle] auto;
  align-items: center;
  gap: 0 0.5rem;
  font-family: 'Apercu-bold', sans-serif;
}
.boutons .wp-block-button a::before{
  content:"";
  display: inline-block;
  align-self: center;
  width:50px; height:50px;
  border-radius: 50%;
  background-position: center;
  background-size:65%;
  background-repeat: no-repeat
}
.boutons .wp-block-button.phone a{
  color: #D74161;
}
.boutons .wp-block-button.phone a::before{
  background-color: #D74161;
  background-image: url(img/phone-white.svg);
}
.boutons .wp-block-button.mail a{
  color: var(--violet);
}
.boutons .wp-block-button.mail a::before{
  background-color: var(--violet);
  background-image: url(img/mail-white.svg);
}
.boutons .wp-block-button a:hover{
  color: var(--noir);
}
.boutons .wp-block-button a:hover::before{
  background-color: var(--noir);
}
@media screen and (max-width:768px){
  .boutons .btn{
    flex: 1 1 auto;
  }
}


@media screen and (min-width:1200px){
  .pagination {
  font-size: 1rem;
  }
}

hr.wp-block-separator.has-background{
    padding:0 !important
}