/* 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;
  --grisclair: #f7f7f7;
  --grismed: #dfdfdf;
  --gris: #7c7c7c;
  --audit: #f8e2e5;
  
  --blanc: #FFFFFF;
  --neutral-lightest: #EEEEEE;
  --neutral-lighter : #CCCCCC;
  --Neutral-light : #AAAAAA;
  --neutral : #666666;
  --neutral-dark : #444444;
  --neutral-darker : #222222;
  --noir: #000000;

  --ultra-violet-lightest : #E8E7FE;
  --ultra-violet : #6C63FF;
  --citrus-lightest : #FEF3E0;
  --citrus : #FDB239;
  --framboise-lightest : #F8E2E6;
  --framboise : #D74161;
  --orange-lightest : #FDEADE;
  --orange : #F37A29;
}

.has-blanc-background-color {
  background-color: var(--blanc);
}
.has-neutral-lightest-background-color {
  background-color: var(--neutral-lightest);
}
.has-neutral-lighter-background-color {
  background-color: var(--neutral-lighter);
}
.has-neutral-light-background-color {
  background-color: var(--neutral-light);
}
.has-neutral-background-color {
  background-color: var(--neutral);
  color: var(--blanc)
}
.has-neutral-dark-background-color {
  background-color: var(--neutral-dark);
  color: var(--blanc)
}
.has-neutral-darker-background-color {
  background-color: var(--neutral-darker);
  color: var(--blanc)
}

.has-noir-background-color {
  background-color: var(--noir) !important;
  color: var(--blanc);
}
.has-violet-background-color {
  background-color: var(--ultra-violet) !important;
  color: var(--blanc);
}
.has-ultra-violet-lightest-background-color {
  background-color: var(--ultra-violet-lightest) !important;
}
.has-ultra-violet-background-color {
  background-color: var(--ultra-violet) !important;
  color: var(--blanc);
}
.has-citrus-lightest-background-color {
  background-color: var(--citrus-lightest) !important;
}
.has-citrus-background-color {
  background-color: var(--citrus);
}
.has-framboise-lightest-background-color {
  background-color: var(--framboise-lightest) !important;
}
.has-framboise-background-color {
  background-color: var(--framboise) !important;
  color: var(--blanc);
}
.has-orange-lightest-background-color {
  background-color: var(--orange-lightest) !important;
}
.has-orange-background-color {
  background-color: var(--orange) !important;
  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(--ultra-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 {
  scroll-behavior: smooth;
}

h1, h2, h3, h4, h5, h6, .haut-accroche{
  font-weight: 700;
  margin:0.75em 0;
  line-height: 1.1;
}
h1, .haut-accroche{
  font-size:2.5rem;
}
h2{
  font-size:2.25rem;
}
h3{
  font-size:2rem;
}
h4{
  font-size:1.5rem;
}
h5{
  font-size:1.25rem;
}
h6{
  font-size:1.125rem;
}

@media screen and (min-width: 1200px){
  h1, .haut-accroche{
    font-size:3.5rem;
  }
  h2{
    font-size:3rem;
  }
  h3{
    font-size:2.5rem;
  }
  h4{
    font-size:2rem;
  }
  h5{
    font-size:1.5rem;
  }
  h6{
    font-size:1.25rem;
  }
}
a{
  color: var(--ultra-violet);
  transition: all 0.2s ease;
  text-decoration: underline dotted;
}
.relative{
  position:relative;
}
.wrapper{
  overflow: clip
}
.aos-init {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 0.6s, transform 0.6s;
}

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

html {
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
  font-size:16px;
}

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

a {
  cursor: none;
}

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

.text-bold {
  font-weight: "bold";
}

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

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

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

strong {
  font-weight: 700;
}

/* Pleine largeur (full-bleed) */
:where(.alignfull) {
  inline-size: 100vw;
  max-inline-size: 100vw;
  margin-inline: calc(50% - 50vw); /* ← une SEULE valeur, symétrique */
}

/* Fond plein écran, contenu réaligné sur la colonne centrale */
:where(.alignfull.has-background) {
  padding-inline: calc(50vw - 50%); /* identique à ton calc initial */
}

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

.has-small-font-size {
  font-size: 0.875rem !important;
  line-height:1.5
}

.has-medium-font-size {
  font-size: 1.125rem !important;
  line-height:1.5
}

.has-large-font-size {
  font-size: 1.25rem !important;
  line-height:1.75
}

.has-x-large-font-size {
  font-size: 2rem !important;
  line-height:1.5
}
.strong{
font-weight: 700;
}

/*BUTTONS*/

.btn, .wp-block-button  a {
  display: inline-block;
  padding: 0.75rem 2rem;
  border-radius: 3rem;
  font-weight: 500;
  font-size: 1.1rem;
  font-family: "Apercu";
  font-weight: 500;
  text-decoration: none;
}
.wp-block-button  a{
  font-weight: 500;
  transition:all 0.2s ease;
}
.wp-block-button.is-style-outline a{
  border-width: 1px;
}

.btn-primary, .frm_forms .frm_submit .frm_button_submit,
.frm_style_style-form-services.with_frm_style .frm_submit .frm_button_submit, .wp-block-button a {
  background: var(--ultra-violet);
  color: var(--blanc);
  border: solid 1px var(--ultra-violet);
}

.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, .wp-block-button a:hover {
  background: var(--blanc) !important;
  color: var(--ultra-violet) !important;
  border-color: var(--ultra-violet);
}

.btn-o, .wp-block-button__link.has-violet-color.has-blanc-background-color {
  border: solid 1px var(--ultra-violet);
  background: var(--blanc);
  color: var(--ultra-violet);
  display: inline-block;
}

.btn-o:hover, .wp-block-button__link.has-violet-color.has-blanc-background-color:hover, .wp-block-button.is-style-outline a:hover {
  background: var(--ultra-violet);
  color: var(--blanc) !important;
}

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

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

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

.haut.centre{
  max-width:992px;
  margin-left: auto;
  margin-right: auto;
}

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

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

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

.haut .content {
  width: 90%;
  max-width: 1200px;
  background-color: transparent;
}
.haut img{
  width:80%;
  max-width: 375px;
}

.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', 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{
  width:90%;
  max-width:1440px;
  margin: 0 auto;
  text-align:left;
}
.inner {
    width:90%;
    max-width:1440px;
    margin:0 auto;
}
.wp-block-image.aligncenter{
  margin-left: auto;
  margin-right: auto
}
@media screen and (min-width: 1920px){
  .contenu{
    max-width:1580px;
  }
  .inner{
    max-width:1580px;
  }
}

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

.wp-block-quote cite {
  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 {
    text-align:left
  }
}

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

}

@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="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%;
}

.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 .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', 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, 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, 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 {
  text-align: center;
}

.partenaires h2 {
  text-align: center
}
.partenaires .item {
  padding: 4rem 2rem;
  background-color: var(--blanc);
  margin: 1rem 0;
  border-radius: 1rem;
}
.partenaires .item img {
  width: auto;
  height: 70px;
}
/* .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 .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, 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%
  }
}

/* -- 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, 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) {

}

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

/* -- 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, sans-serif;
  padding-top: 4rem;
}

#references .trt_first {
  width: 2px;
  height: 2rem;
  margin: 0 auto;
  background-color: var(--ultra-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, sans-serif;
}

.haut h1 span {
  display: inline-block;
  vertical-align: middle;
  margin-right: 1rem;
  font-family: Apercu, 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', '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', '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(--ultra-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', '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', '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: 992px) {

  #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) {

}

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

/* -- AGENCE ---------------------------------------------------------------- */


.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', 'sans-serif';
  line-height:1.1;
  color: var(--ultra-violet)
}
.chiffres-cles .chiffre .libelle{
  font-size:0.75rem;
  text-transform: uppercase;
  font-family:'Apercu', 'sans-serif';
}

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

  .page-template-page-agence .container_astra {
    top: 15%;
  }
}

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

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

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

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

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

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

  .page-template-page-agence .container_astra {
    width: 100%;
  }

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

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

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

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

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

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

  .page-template-page-agence .astraga .svg_astraga {
    float: right;
    height: 50rem;
  }
}

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

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

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

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

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

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

}

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


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

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

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

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

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

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

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

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

  .page-template-page-agence .equipe .titre_svg_digit {
    height: 20rem;
  }

}

.page-template-page-agence .equipe .swiper {
  width: 100%;
  height: 100%;
}

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

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

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

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

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

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

.page-template-page-agence .team-slider .swiper-slide:hover,
.page-template-page-agence .team-slider .team:hover {
  /* cursor: none !important; */
}

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

.page-template-page-agence .content {
  text-align: left;
}

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

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

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

.page-template-page-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;
}

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

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

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

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

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

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

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

  .page-template-page-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, 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, 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, sans-serif;
}

#postuler textarea {
  outline: none;
  resize: none;
  padding: 1rem;
  font-family: Apercu, 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, 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;
  }
}

@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;
}

#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, sans-serif;
  color: #7c7c7c;
}

#actu .huge_padding h3 {
  font-size: 1.75rem;
  margin: 1em 0;
  font-family: Apercu, 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, 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-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 .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;
  }
  #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, 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, 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, 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, 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;
  opacity: .7;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  line-height: 1.1
}

.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: var(--ultra-violet);
}

.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(--blanc);
  margin-bottom: 1rem;
}

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

.nav-interef .vignette {
  overflow: hidden;
  border-radius : 1rem
}

.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) {

}

@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 .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, sans-serif;
}

#single_service .carousel .accroche {
  font-size: 1rem;
  font-family: Apercu, 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, 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 {
  z-index: 2;
}

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

#single_service .services_appli_web .items {
  background-color: #fff;
  padding: 3rem 2rem;
  margin: 1rem auto;
  border-radius: 1.5rem;
}

#single_service .services_appli_web .accroche {
  font-size: 1.5rem;
  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-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 {
  width: 80%;
  aspect-ratio: 4/3
}

#single_service .services_appli_web .items img {
  margin-top: 1rem;
  width: 100%; height: 100%;
  object-fit: contain;
 
}

/* -- 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, sans-serif;
}

#contact input {
  font-family: Apercu, 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, sans-serif;
  border-radius: 50px;
  transition: all 0.4s ease;
}

#contact textarea {
  outline: none;
  resize: none;
  padding: 1rem;
  font-family: Apercu, 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";
}

#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, 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, 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, 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, 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, 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  .phone_number input {
  font-size: 2rem;
  text-align: center;
}
#form_rappel .frm_error{
  margin:0;
}
#form_rappel input[type=checkbox]{
	border: 1px solid;
}

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

.navigation-links a:hover {
  display: inline-block;
  border: solid 1px var(--ultra-violet);
  background: var(--ultra-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', 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(--ultra-violet);
}
.boutons .wp-block-button.mail a::before{
  background-color: var(--ultra-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
}