/****************************************************************************/
/*                              FONT                                        */
/****************************************************************************/
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&family=Outfit:wght@100..900&display=swap');

:root{
  --color-blue: #00143B;
  --color-blue1:#979BEE;
  --color-blue2:#485879;
  --color-blue3:#2C2C2C;

  --color-black1:#001030;

  --color-grey:#474747;
  --color-greyL:#8E8E8E;
  --color-greyH:#3B3B3B;
  --color-grey1:#F7F7F7;
  --color-grey2:#E5E5E5;
  --color-grey3:#D3C0A9;
  --color-grey3:#898989;
  --color-grey4:#6C6C6C;
  --color-grey5:#5E5E5E;
  --color-grey6:#D3D3D3;
  --color-grey7:#98A5BE;
  --color-grey8:#ACB7CB;
  --color-grey9:#31405D;
  --color-grey10:#818DA5;
  --color-grey11:#848484;

  --color-orange:#C47B30;

  --color-beige:#F8F2EB;
  --color-beige1:#DECEBC;
  --color-beige2:#A99782;
}

.listpuce li{}


/****************************************************************************/
/*                              GENERAL                                     */
/****************************************************************************/
html, body{
    width:100%;
    height:100%;
    padding: 0;
    margin:0;
    --scroll-behavior: smooth;
    scroll-behavior: smooth;
}
footer{position: absolute;}
/****************************************************************************/
/*                              FONTS                                       */
/****************************************************************************/
.ftout{font-family: "Outfit", arial, sans-serif;}
.ftibm{font-family: "IBM Plex Sans", arial, sans-serif;}
.ftblue{color:var(--color-blue)}
.ftblue1{color:var(--color-blue1)}
.ftblue2{color:var(--color-blue2)}
.ftblue3{color:var(--color-blue3)}
.ftblack1{color:var(--color-black1)}
.ftgrey{color:var(--color-grey)}
.ftgrey3{color:var(--color-grey3)}
.ftgrey4{color:var(--color-grey4)}
.ftgrey5{color:var(--color-grey5)}
.ftgrey6{color:var(--color-grey6)}
.ftgrey7{color:var(--color-grey7)}
.ftgrey8{color:var(--color-grey8)}
.ftgrey9{color:var(--color-grey9)}
.ftgrey10{color:var(--color-grey10)}
.ftgrey11{color:var(--color-grey11)}
.ftgreyL{color:var(--color-greyL)}
.ftorange{color:var(--color-orange)}
.ftgreyH{color:var(--color-greyH)}
.ftbeige2{color:var(--color-beige2)}

.fillblue{fill:var(--color-blue)}
.fillblue1{fill:var(--color-blue1)}

.border1{border: 1px solid}
.borderBlue{border-color:var(--color-blue)}


/****************************************************************************/
/*                              ELEMENTS                                    */
/****************************************************************************/

.backgrounded{
  background: transparent no-repeat center center;
}
.background1{
  background-image:url('../img/header.png');
  height:705px;
}
.background2{
  background-image:url('../img/936e7e90f6fa1fb23f5fdea0ad71d2f143685504.jpg');
  height:560px;
  background-position: center center;
  background-size: 100%;
}
.background3{
  background-image:url('../img/fond-entreprises-accompagnees.png');
  background-position: center center;
  background-size:cover;
}
.background4{
  background-image:url('../img/union.svg');
  background-position: center center;
  background-size:cover;
}

.opac1{background-color:rgba(0,0,0,.3);}

.backgrey{background:var(--color-grey1)}
.backbeige{background:var(--color-beige)}
.backblue{background:var(--color-blue)}
.backblue1{background:var(--color-blue1)}
.backblack1{background:var(--color-black1)}

.eltSlide{border-top: 2px solid var(--color-beige1) }
.eltSlide div{color:var(--color-beige1)}
.eltSlide.activ .barre{background:var(--color-orange)}
.eltSlide.activ div{color:var(--color-orange)}

.spacor{
  width:2px;
  height:17px;
  background: var(--color-beige);
  margin: 0 16px;
}
.fullseparator{height:1px; background: var(--color-grey2)}
.fullseparator1{height:1px; background: var(--color-grey9); margin: 20px 0}
.separatorB{border-bottom:solid 1px var( --color-grey6)}

/****************************************************************************/
/*                              SWIPER                                    */
/****************************************************************************/
.swiperPartners .swiper-slide{
  display: flex;
  align-items: center;
  justify-content: center;
}
.swiper-button{
  border-radius: 50px;
  width: 40px;
  height: 40px;
  background-color: var(--color-blue1);
  border: 1px solid var(--color-blue1) ;
  text-align: center;
}
.swiper-button svg{fill:var(--color-beige)}
.swiper-button:after{
  content: '';
}
.swiper-button.swiper-button-disabled{
  background-color: transparent;
  border: 1px solid var(--color-grey3) ;
}
.swiper-button.swiper-button-disabled svg{fill:var(--color-grey3)}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { left: 50px;}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {  left: 0px;  right: auto;}
/****************************************************************************/
/*                                     CTA                                  */
/****************************************************************************/
.CTA{padding: 10px 60px; border-radius:10px; font-size: 15px; font-family: "Outfit", arial, sans-serif; text-decoration: none;}
.CTABlue{background:var(--color-blue); color:var(--color-white);border: 2px solid var(--color-blue)}
.CTABlue:hover{background:var(--color-white); color:var(--color-blue);}

.CTA1{padding: 8px 16px; border-radius:35px; font-size: 14px; font-family: "ibm", arial, sans-serif; text-decoration: none;}
.CTAOrangeOutline{background:var(--color-white); color:var(--color-orange);border: 2px solid var(--color-orange)}
.CTAOrangeOutline:hover{background:var(--color-white); color:var(--color-orange);}

.CTA2{padding: 16px; border-radius:6px; font-size: 16px; font-family: "ibm", arial, sans-serif; text-decoration: none;}
.CTAOrange{background:var(--color-orange); color:var(--color-white);border: 2px solid var(--color-orange)}
.CTAOrange:hover{background:transparent; color:var(--color-white);}

a:hover{color: inherit;}
/****************************************************************************/
/*                              ANIMATIONS                                  */
/****************************************************************************/



/****************************************************************************/
/*                              MEDIA QUERIES                               */
/****************************************************************************/
@media (max-width: 991.98px) {
}
@media (max-width: 767.98px) {
}
@media (max-width: 575.98px) {
    .background1{
      height:448px;
    }
    .pad10-{padding: 10px}
    .spacor{
      margin: 0 8px;
    }
}

.container-special{
  width: 100%;
  padding-right: var(--bs-gutter-x,.75rem);
  padding-left: var(--bs-gutter-x,.75rem);
  margin-right: auto;
  margin-left: auto;
}
.specialblock .swiper-slide{width:310px !important}
@media (min-width: 576px) {
  .container-special {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container-special {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container-special {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container-special {
    max-width: 1140px;
  }
}

@media (min-width: 1400px) {
  .container-special {
    max-width: 1320px;
  }
}

.specialblockmobile{display:none}
.specialblock{display:block}
.specialblock{
  max-width:54vw;
  left:49%;
  top:0px;
}
@media (max-width: 1880px) {
  .specialblock{
    max-width: 64vw;
    left: 38%;
    top: 0px;
  }
}

@media (max-width: 1400px) {
  .specialblock{
    max-width: 70vw;
    left: 32%;
    top: 0px;
  
  }
}

@media (max-width: 1300px) {
  .specialblock{
    max-width: 78vw;
    left:35%;
    top: 0px;
  
  }
}

@media (max-width: 1200px) {
  .specialblock{
    max-width: 95vw;
    left:36%;
    top: 0px;
  
  }
}

@media (max-width: 1000px) {
  .specialblock.absolute{
    left:0%!important;
    top: 90px;
    max-width: initial!important;
  }
  .container-special{height: 540px!important;}
.container-special .absolute .swiper-wrapper{
  overflow: auto!important;
  }
.specialblock .swiper-slide{max-width:initial;}
.specialblockmobile{display:block}
.specialblock{display:none}
}