
body{
    font-family: Poppins;
}
p{
  font-family: Poppins;
  /* font-size: 20px; */
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
}
.detlgr p
{
  margin-bottom: 0px;
}
.detlgractive p{
  margin-bottom: 0px;
}
p span{
  color: #0286fa;
}
h3{
  font-family: Poppins;
  font-size: 40px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.67;
  letter-spacing: normal;
  text-align: left;
  color: #101010;
}
h2{
  font-size: 35px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: normal;
  text-align: center;
  color: #3f596c;
}
nav{
  box-shadow: #167ac605 6px 7px 6px 6px;
}
.navbar-brand img{
  width: 80%;
}
.nav-link{
    margin-left: 20px;
    /* margin-top: 10px; */
    font-family: Montserrat;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.2;
    letter-spacing: normal;
    text-align: center;
    color: #e5e5e5;
    vertical-align: middle;

}

.link-dark{
    color: #9a9899;
}
.link-active
{
    color: #f2f2f2;
    font-weight: 600;
    border-bottom: solid 5px #fe1b24;
}
.btnsignore
{
  /*margin: 0px 0 0 39px; */
    width: 200px;
    /* height: 54px; */
    padding: 8px 10px 8px 10px;
    border-radius: 34px;
    background-color: #fe1b24;
    font-size: 14px;
    font-weight: 600;
    margin-left: 30px;
}
.navbar-brand img {
  width: 100px;
}
.navbar-brand {
  padding: 0px;
}
.btnlgpaie-1
{
  width: 100%;
  height: auto;
  /* margin: 0 0 0 39px; */
  /* margin-right: 39px; */
  font-family: SegoeUI;
  margin-bottom: 10px;
  padding: 15px 20px 12px 20px;
  border-radius: 34px;
  background-color: #0286fa;
}
.btnsignoredevis
{
  width: 100%;
  height: auto;
  /* margin: 0 0 0 39px; */
  /* margin-right: 39px; */
  font-family: SegoeUI;
  margin-bottom: 10px;
  padding: 15px 20px 12px 20px;
  border-radius: 34px;
  color: #0286fa;
  background-color: #fff;
}
.textzonerightbnt
{
  text-align: center;
  margin-right: 30px;
}
.float-left{
  float: left;
  vertical-align: middle;
}
.float-right{
  float: right;
  vertical-align: middle;
  text-align: right;
}
.btnlgpaie-2
{
    width: 194px;
    height: auto;
    /* margin: 0 0 0 39px; */
    padding: 4px 10px 0px 4px;
    border-radius: 34px;
    background-color: #FFF;
    color: #0286fa;
    border: solide 1px #0286fa ;
    font-family: WorkSans;
    /* font-size: 20px; */
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.17;
    letter-spacing: normal;
    text-align: left;
    margin-bottom: 10px;

}
.btnlgpaie-3{
  background: #ffffff;
  color: #0286fa;
  border: solide 1px #0286fa ;
  border-radius: 34px;
}
.iconvideoreg
{
    border-radius: 50%;
    font-size: 20px;
    margin-right: 4px;
    margin-bottom: 3px;
}
.colorprimary{
    color: #e05858;
  
}
.banniersignore{
    width: 100%;
    min-height: 600px;
    /* margin: 70px 0 0; */
    background-position : center;
    /* padding: 0 0 0 9.8px; */
    /* padding-top: 50px; */
    padding-bottom: 100px;
    background-image: url(../img/Digital_marketingbannernv.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #ffffff;
  
}

.h1signore {
    
  font-family: Poppins;
  font-size: 37px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.85;
  letter-spacing: normal;
  text-align: left;
  color: #101010;
  }
  .Simplifiez-vos-dmarches-administratives-et-gagnez-du-temps-avec-notre-logiciel-de-paie {
    
    /* margin: 24px 0 6px; */
    font-family: Montserrat;
    font-size: 20px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.23;
    letter-spacing: normal;
    text-align: left;
    color: #444f60;
  }
  .lgrrelative
{
    position: relative;
}.lgrabsolute
{
    position: absolute;
}
.cicle1{
  width: 152px;
  height: auto;
  background-repeat: no-repeat;
  /* background: aliceblue; */
  animation: cicle1 20s ease 0s infinite normal none;
  position: absolute;
  z-index: 9;
  right: 569px;
  top: 50px;;
  /*  background-image: url(../img/banner/Path_32.png); */
}
.cicle2{
  width: 288px;
  /* height: 317px; */
  background-repeat: no-repeat;
  /* background: #ffc107; */
  position: absolute;
  top: -46px;
  left: -179px;
    left: -149px;
  /* background-image: url(../img/banner/Path_33.png); */
  animation: myAnim 7s

}
.cicle1 img{
  width: 100%;
}
.cicle2 img{
  width: 285px;
}
.cicle3
{
  width: 122px;
  /* height: 163px; */
  background-repeat: no-repeat;
  /* background: #084298; */
  position: absolute;
  z-index: 11;
  top: 408px;
  right: 645px;
  /* background-image: url(../img/banner/Path_34.png); */
  animation: cicle3 30s ease 0s infinite normal both;


}
.posabs
{
  z-index: 99;
    position: absolute;
}
.banniercontent{
    z-index: 99;
    width: 95%;
    position: absolute;
}

.bgwihte{
  background-color: #ffffff;
  text-align: center;
  height: 560px;
}
.bggriy{
  background-color: #f5f6fb;
}
.bggriyrel1
{
  background-color: #f5f6fb;
  position: relative;
  /* background-image: url('../img/beneficiez.png'); */
  /* width: 97%; */
}
.bggriyrel
{
  background-color: #fff;
  position: relative;
  /* background-image: url('../img/beneficiez.png'); */
  /* width: 97%; */
}
.boxbene
{
  position: absolute;
}
.boxlog
{
  position: absolute;
  margin-top: 75px;
  margin-bottom: 75px;
  
  
}
.boxlog h3
{
  margin-bottom: 100px;
}
.boxbinif
{
    height: auto;
    /* width: 50%; */
    margin-top: 80px;
    margin-left: 34px;
    /* right: 100px; */
    padding: 47px 70px 50px 50px;
    border-radius: 20px;
    box-shadow: 0 0 30px 0 rgb(114 114 114 / 20%);
    background-color: #fff;
}
.btn-danger:hover {
  color: #fff;
}

.redcolorbtn:hover {
  color: #fff !important;
}
.btnbox a
{
  /* margin-top: 10px; */
  background: #0286fa;
  border-radius: 20px;
  padding: 5px 10px 5px 10px;
  font-size: 16px;
  width: 200px;
}

.colimg
{
  height: 600px;
  background: #f5f6fb;
}

.colimg1
{
  height: 550px;
}

.circ1
{
  position: absolute;
    left: -77px;
    top: 52px;
    animation: myAnim 7s ease 0s infinite normal forwards;

}

.circ1 img{
  width: 200px;
}
.circ2
{
  position: absolute;
  right: 0;
  top: 377px;
  width: 150px;
  animation: cicle3 30s ease 0s infinite normal both;
}
.circ3
{
  position: absolute;
  width: 138px;
  right: 84px;
  top: 48px;
  /* top: 100px; */
  animation: cicle1 20s ease 0s infinite normal none;

}
.zoneadt
{
  position: absolute;
  height: 350px;
}
.zoneadt img
{
  margin-top: 10px;
}
.zonlog h3{
  margin-bottom: 50px;
  margin-top: 70px;
  /* position: absolute; */
}
.zonlog
{
  background-color: #fff;
  position: relative;
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px;
}
.imgbox
{
  /* margin-bottom: 10px; */
  height: 60px;
}
.boxbinif img
{
  border: 0px;
  width: 201px;
  
}
.boxbinif p
{
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;

}
.title3
{
  margin: 0 0 35px;
  font-family: Montserrat;
  font-size: 35px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
}
.col-md-12
{
  width: 98%;
  padding-right: 0px;
}
.deviscontent{
  background-image: url('../img/bannierdevis.png');
  color: #fff;
  position: relative;
  padding: 80px 40px 30px 40px;
  min-height: 700px;
  /* margin-bottom: 20px; */
}
.imglog
{
  width: 130px;
}
.devis
{
  width: 99%;
  margin-bottom: 30px;
}
.deviscontent h4{
  font-family: Montserrat;
  font-size: 41px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: normal;
  text-align: left;
  color: #fff;
}
.pdevcont
{
  margin: 77px 6px 0 0;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: left;
  color: #fff;
}
.zonedevisbottom
{
  position: absolute;
  bottom: 0px;
  left: 0px;
  text-align: center;
  background-color: #016ece;
  color: #fff;
  width: 100%;
}
.pzonebottomright span
{
  color: #fff;
}
.pzonebottom {
  font-size: 18px;
  margin-top: 10px;
  margin-left: 25px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
.pzonebottomright {
  font-size: 18px;
  margin-top: 10px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
.zonedevis{
  padding: 28px 36px 44px 35px;
  background: #F5F6FA;
}
.zonedevis h4{
  font-size: 30px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
  margin-bottom: 20px;
}
.formdevis{
  background: #fff;
  padding: 36px 39px 49px 33px;
    border-radius: 30px;
}
.formdevis label{
  font-size: 20px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
  margin-top: 10px;
}
.formdevis textarea
{
  border-radius: 15px;
  border: solid 2px #e3e0e2;
  padding: 10px;
}
.formdevis textarea:focus, input:focus{
  outline: none;
  border: solid 2px #2a99fb;

}
.formdevis input:focus, input:focus{
  border: solid 2px #2a99fb;

}
.formdevis input{
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: left;
  color: #252525;
  padding: 10px 10px 10px 20px;
  border-radius: 38px;
  border: solid 2px #e3e0e2;
  background-color: #fff;
}
.formdevis input[type=submit]{
  margin: 27px 0px 0 2px;
  /* padding: 15px 63px 16px 64px; */
  border-radius: 34px;
  /* width: 100%; */
  background-color: #0286fa;
  color: #fff;
  font-family: WorkSans;
  text-align: center;
}
.formnewsletter
{
  background: #fff;
  border-radius: 26px;
  padding: 2px;
  width: 100%;
  margin-left: 10px;
}
.footer
{
  background-image: url('../img/pngfindcom.png') ; 
  background-repeat: no-repeat;
  
  background-size: cover;
  margin-top: 50px;
  

}
.newsletter h4{
  font-family: Alata;
  font-size: 35px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  /* line-height: 1.44; */
  /* letter-spacing: -0.9px; */
  text-align: center;
  color: #fff;
  margin-bottom: 30px;
}
.formnewsletter input[type=text]{
   color: #252525;
    border: 0px;
    float: left;
    background: #fff0;
    text-align: center;
    /* margin-left: 20px; */
    margin-top: 5px;
    /* padding-right: 80px; */
    font-family: Poppins
}
.formnewsletter input[type=text]:focus{
  box-shadow: none;
}

.formnewsletter button{
  border-radius: 50px;
  background-color: #0286fa;
  color: #fff;
  font-family: Poppins;
  font-size: 16px;
  font-weight: 900;
  padding: 6px 31px 8px 36px;
  width: 100%;
  /* font-stretch: normal; */
  /* font-style: normal; */
  /* line-height: 4.12; */
  letter-spacing: 0.34px;
  text-align: center;
  color: #fff;
}
.footer-content h4
{
  font-family: Montserrat;
  /* font-size: 35px; */
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
  margin-bottom: 20px;
}
.footer-content p
{
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
}
.newsletter
{
  width: 100%;
  text-align: center;
  padding: 50px;
  /* padding-bottom: 50px; */
  border-radius: 20px;
  background: #0286fac7;
  /* opacity: 0.8; */
  margin-top: 32px;
  margin-bottom: 20px;
  color: #fff;
  box-shadow: #167ac657 10px 7px 29px 15px;
  background-image: url(../img/banner/newsletterbannier.png);
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 50px;
}
.navbar-collapse ul
{
  width: 100%;
}
.flex-column a{
  font-family: Poppins;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
}
.flex-column .active{
  color: #0286fa;
  margin-left: 10px;
}
.flex-column a:hover{
  color: #0286fa;
  margin-left: 10px;
}
.socialmedia{
  color: #0286fa;
  text-align: center;
  font-size: 30px;
  border: 1px solid;
  border-radius: 50%;
}
.footer-bottom
{
  position: relative;
  width: 100%;
  height: 50px;
  background-color: rgba(2, 134, 250, 0.5);
  margin-top: 30px;
}
.rec1{
  position: absolute;
  background-color: rgba(2, 134, 250, 0.5);
  bottom: 0px;
  height: 46px;
  width: 100%;
}
.rec2{
  position: absolute;
}
.rec3{
  position: absolute;
}
.copyright
{
  font-family: Montserrat;
  font-size: 17px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  color: #fff;
  position: absolute;
  bottom: 0px;
  text-align: center;
  background-color: #0286fa;
  width: 100%;
  padding-top: 6px;
  height: 40px;
}
.detlgractive{
  height: auto;
  overflow: none;
  display: block;
}
.detlgr
{
  /* height: 290px; */
  /* overflow: hidden; */
  display: none;
}

.telechargermentbannier
{
  background-image: url(../img/banner/telechargermentbannier.png);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding-top: 40px;
    padding-bottom: 40px;
    margin-top: 54px;
    margin-bottom: 50px;
}
.telechargermentbannier h4{
  font-family: Montserrat;
  font-size: 30px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.43;
  letter-spacing: normal;
  text-align: center;
  color: #fff;
}
.telechargermentbannier a{
  border-radius: 30px;
    margin-top: 20px;
    font-family: WorkSans;
    font-size: 15px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.21;
    letter-spacing: normal;
    text-align: left;
    color: #0286fa;
    padding: 10px 30px 10px 30px;
}
.zonetelecherger h5{
  font-family: Montserrat;
  font-size: 20px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
}
.telechargerbtn{
  border-radius: 30px;
  font-family: WorkSans;
    /* font-size: 16px; */
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.19;
    letter-spacing: normal;
    text-align: left;
    color: #fff;
    padding: 5px 15px 5px 15px;
}
.algright
{
  text-align: right;
}
.formnewsletter .col-md-12
{
  width: 100%;
}
.hidebtn
{
  display: none;
}
.btncloseform
{
    background: #ffffff;
    color: #0286fa;
    border: 1px solid #0286fa;
    border-radius: 20px;
    padding: 5px 10px 5px 10px;
    font-size: 16px;
    width: 200px;
}
.btncloseform:hover{
  background-color: #0286fa;
  border: 1px solid #026dfa;

}
.fomrModal .modal-footer
{
  padding-right: 35px;
}

.fomrModal  .close
{
  color: #252525;
  right: 0px;
}
.modal-body form
{
  padding: 30px;
}
.modal-body input
{
  margin-bottom: 20px;
}
.fomrModal .modal-header 
{
  padding: 15px 100px 10px 100px;
}
.fomrModal .modal-title
{
  margin-left: 13%;
  font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.22;
    letter-spacing: normal;
    text-align: left;
    color: #3f596c;
}
.referances .active{
  background-color: #0286fa;
  border-radius: 38px;
  font-family: 'Montserrat';
}
.referances .nav-link{
  margin-left: 7px;
}
.refshow
{
  display: block;
}
.refhide
{
  display: none;
}
.col-3
{
  margin-bottom: 20px;
}
.bartop
{
  background-color: #2f2f2f;
  width: 100%;
  height: 40px;
  padding: 6px 0px 6px 0px;
  color: #fff;
  font-family: SegoeUI;
}
.bartop a {
  color: #fff;
  text-decoration: none;
}
.signoremenu
{
  /* margin-top: 40px; */
  background-image: url('../img/halfnavbar.png');
  background-repeat: no-repeat;
  background-position: left;
    background-position-x: left;
  background-color: #fff;
  z-index: 1000;
  width: 100% !important;

}
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}

.sticky + .content {
  padding-top: 102px;
}
.borderactive {
  width: 108px;
  height: 0;
  margin: 33.5px 26.5px 0 0;
  border: solid 5px #fe1b24;
}
#navbarTogglerDemo02
{
  margin-right: 10px;
}
.produitsignore
{
  margin-top: 50px;
  margin-bottom: 50px;
  text-align: center;
}
.cartsignore
{
  text-align: center;
  font-family: Poppins;
  color: #747b86;
  -webkit-box-shadow: 1px 7px 18px -2px rgba(0,0,0,0.42); 
  box-shadow: 1px 7px 18px -2px rgba(0,0,0,0.42);
  margin-top: 20px;
}
.cartsignore .card-title
{
  font-size: 24px;
  font-weight: bold;
  letter-spacing: -0.96px;
  color: #000;
}
.cartsignore .card-text
{
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.78;
  letter-spacing: normal;
  text-align: center;
  color: #747b86;
  margin-top: 30px;
}
.bordered
{
  border-bottom: solid 5px #fe1b24;
}
.borderblue
{
  border-bottom: solid 5px #0083ff;
}
.linkproduit 
{
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 3.2px;
  color: #e74d57;
  text-decoration: none;
}
.produitsignore h2
{
  font-family: Poppins;
  font-size: 56px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.2;
  letter-spacing: -2.24px;
  text-align: center;
  
  margin-bottom: 40px;
}
.linkproduitplus
{
  margin-top: 30px;
    background-color: #fff;
    color: #0083ff;
    padding: 10px 25px 10px 25px;
}

.bluecolor
{
  color: #0083ff !important; 
}
.redcolor
{
  color: #fe1b24 !important;

}
.redcolorbtn
{
  color: #fe1b24 !important;

}
.contactzone
{
  background-color: #f8fcff;
  padding: 70px 0px 70px 0px;
  /* background-image: url('../img/bgphone.png'); */
}
.contactzone input{
  margin: 12px 4px 12px 0;
  /* padding: 21px 456px 20px 38px; */
  box-shadow: 0 0 10px 0 rgba(42, 153, 251, 0.3);
  background-color: #fff;
  border-radius: 0px;
}
.contactzone textarea{
  margin: 12px 4px 12px 0;
  /* padding: 21px 456px 20px 38px; */
  box-shadow: 0 0 10px 0 rgba(42, 153, 251, 0.3);
  background-color: #fff;
  border-radius: 0px;
}
.contactzone label{
  font-family: Poppins;
  font-size: 20px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.75;
  letter-spacing: normal;
  text-align: left;
  color: #3f596c;
}
.contactzone h3
{
  text-align: center;
  font-family: Poppins;
  /* font-size: 41px; */
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.49;
  letter-spacing: normal;
  color: #000;
  margin-bottom: 40px;
}
.contactzone button
{
  margin: 28px 0px 0 2px;
  padding: 19px 63px 19px 64px;
  background-color: #0083ff;
}
.siegesocialzone{
  margin-top: 23px;
    background-color: #fff;
    padding: 30px 10px 30px 10px;
    box-shadow: 0 0 10px 0 rgb(42 153 251 / 30%);
}
.borderrightzoness 
{
  border-right: 1px solid rgba(1, 130, 253, 0.19);
}
.contactzone h4
{
  text-align: center;
  margin-top: 20px;
}
.contactzone h5
{
  text-align: center;
}
.contactzone a
{
  text-decoration: none;
  color: #000;
}
.contactzone .mdi{
  object-fit: contain;
  color: #0083ff;
  text-align: center;
  margin: 0px 0px 0px 10px;
  font-size: 20px;
}
.footersignore
{
  padding: 87px 140px 46px 141px;
  background-color: #18212e;
  color: #fff;
  
}
.footersignore img
{
  width: 176px;
  margin-bottom: 30px;
}
.footersignore label
{
  font-size: 13px;
  font-weight: 500;
  color: #b3bbc6;
}
.footersignore p
{
  font-family: Poppins;
  font-size: 15px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  color: #fff;
}
.footersignore a
{
  font-family: Poppins;
  font-size: 15px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  color: #fff;
  text-decoration: none;
}
.borderfooter
{
  border-bottom: 1px solid rgba(255, 255, 255, 0.603);
  margin-bottom: 40px;
}
.lienutiles a
{
  font-family: Poppins;
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  text-align: left;
  color: #b3bbc6;
}
.lienutiles
{
  margin-top: 74px;
}
.lienutiles .footerlinkactive
{
  font-weight: 600;
  color: #0083ff;
}
.newsletterzone
{
  width: 100%;
    padding: 53px 46px;
    background-color: #232b38;
    text-align: center;
    margin-top: 70px;
}
.newsletterzone h4
{
  font-family: Poppins;
  font-size: 20px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #fff;
}
.newsletterzone .input-group
{
  margin-top: 31px;
}
.newsletterzone input
{
  border-radius: 0px;
  color: #747b86;
  font-family: Poppins;
  font-size: 15px;
}
.newsletterzone .input-group-append
{
  border-radius: 0px;
  
}
.newsletterzone .input-group-text
{
  background-color: #0083ff;
  color: #fff;
  cursor: pointer;
}
.newsletterlinks
{
  text-align: center;
  margin: 30px 0px 60px 0px;
  
}
.newsletterlinkm
{
  margin: 20px;
}
.footersignore h6
{
  text-align: center;
}

.prodheader
{
  background-image: url(../img/bannerProduit.png);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding-top: 40px;
    padding-bottom: 40px;
    /* margin-top: 54px; */
    margin-bottom: 50px;
}
.prodheader h1{
  text-align: center;
  color: #fff;
}
.prodzone h2
{
  /* margin: 117px 549px 8px 63px;  */
  font-family: Poppins;
  /* font-size: 51px; */
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.32;
  letter-spacing: -2.04px;
  text-align: left !important;
  color: #000;
}
.etatstock
{
  font-family: Poppins;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.92;
  letter-spacing: -0.92px;
  color: #5bb300;
}
.decprod{
  margin: 35.5px 0px 40px 0px;
    font-family: Poppins;
    font-size: 20px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: -1.2px;
    text-align: left;
    color: #000;
}
.btnprod{
  padding: 10px 50px 10px 50px;
  border-radius: 34px;
  background-color: #fe1b24;
  font-family: SegoeUI;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
  text-align: left;
  color: #fff;
}
.tabproduit
{
  margin-top: 50px;
}
.tablink .active{
  font-family: Poppins;
    font-size: 30px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: -1.2px;
    text-align: left;
    color: #0095ff;
    text-decoration: none;
    margin-right: 20px;
}
.tablink a{
  font-family: Poppins;
  font-size: 30px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.67;
  letter-spacing: -1.2px;
  text-align: left;
  color: #000;
  text-decoration: none;
  margin-right: 20px;

}
.tabproduitcontent
{
  font-family: Poppins;
  font-size: 20px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.67;
  letter-spacing: -1.2px;
  text-align: left;
  color: #000;
}
.nav-fill .active
{
  border-bottom: 3px solid #fe1b24;
}
.catplus
{
  display: none;
}
#clienthide
{
  display: none;
}
#fourhide
{
  display: none;
}
.ref
{
  display: none;
}
.zonclient .active{
  display: block;
}
.clientplus
{
  display: none;
}
.refbtn{
  color: #0083ff ;
}
.fourplus{
  padding-bottom: 30px;
  display: none;
}
.fourbnt
{
  color: #fe1b24 ;
}
.four 
{
  display: none;
}
.fourzone
{
  padding: 20px 0px 20px 0px;
  background-color: #f9f9f9;
}
/* end css */
/* slide css  */
.slider {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 40%;
  gap: 1rem;
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
  cursor: grab;
  margin-top: 5rem;
  padding-inline: 1rem;
  
}
.slider::-webkit-scrollbar {
  display: none;
}
.slide img {
  inline-size: 100%;
  aspect-ratio: 16 / 0;
  /* object-fit: cover; */
  height: 297px;
}
.zonetext
{
  position: absolute;
  padding: 35px 8px 30px 8px;
  background: rgb(0 0 0 / 50%);
  width: 100%;
  height: -webkit-fill-available;
  text-align: center;
  display: none;
}
.slide
{
  position: relative;
  height: 297px;
  margin-top: 10px;
}
.slideshadw
{
  -webkit-box-shadow: 1px 3px 15px 5px #000000;
    box-shadow: 0px 0px 5px 1px #363636;
}
.slide h4
{
  color: #fff;
}
.slide p
{
  color: #fff;
  text-align: center;
}
.articlezone
{
  margin-bottom: 50px;
  margin-top: 50px;
  background-image: url(../img/zonevideos.png);
  background-repeat: no-repeat;
  /* background-size: cover; */
  text-align: center;
  padding: 40px 0px 87px 0px;
}
.articlezone h2
{
  color: #fff;
}

/* slide css  */


/* scool left */
.scroll-left {
        height: 93px;
        overflow: hidden;
        position: relative;
        background: #f5f6fb;
        margin-bottom: 80px;
    }
    .logozone{
      width: max-content;
      left: 0;
      position: absolute;
      height: 100%;
      margin: 0px 0px 0px 0px;
      line-height: 50px;
      text-align: center;
      -moz-transform: translateX(100%);
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
      -moz-animation: scroll-left 30s linear infinite;
      -webkit-animation: scroll-left 20s linear infinite;
      animation: scroll-left 20s linear infinite;
    }
    /* Move it (define the animation) */
    @-moz-keyframes scroll-left {
    0% { -moz-transform: translateX(100%); }
    100% { -moz-transform: translateX(-100%); }
    }
    @-webkit-keyframes scroll-left {
    0% { -webkit-transform: translateX(60%); }
    100% { -webkit-transform: translateX(-100%); }
    }
    @keyframes scroll-left {
    0% { 
    -moz-transform: translateX(100%); /* Browser bug fix */
    -webkit-transform: translateX(100%); /* Browser bug fix */
    transform: translateX(1%); 
    }
    100% { 
    -moz-transform: translateX(-100%); /* Browser bug fix */
    -webkit-transform: translateX(-100%); /* Browser bug fix */
    transform: translateX(-60%); 
    }
}    
.logozone img
{
    width: 70%;
    text-align: center;
}
.logoimage{
  background: #ffffff;
  float: left;
  margin-left: 15px;
  box-shadow: #167ac605 6px 7px 6px 6px;
  margin-top: 13px;
  height: 70px;
  width: 180px;
  padding: 10px;
  border-radius: 10px;
}
.navbar-brand
{
  margin-right: 0px;
}
/* scool left */



/* modal video */
.modal-dialog {
  max-width: 800px;
  margin: 30px auto;
}



.modal-body {
position:relative;
padding:0px;
}
.close {
  position: absolute;
  right: 0px;
  top: 0;
  z-index: 999;
  font-size: 2rem;
  font-weight: normal;
  color: #393939;
  background: #f0f8ff00;
  border: 0px;
  opacity: 1;
}
/* end modal video */
/* style max de 1400px */
@media (min-width: 1400px) {
  .cicle3 {
    right: 701px;
    top: 480px;
  }
  .banniersignore
  {
    height: 700px;
  }
}
/* max de 1400px */
@media (max-width: 1110px) {
  .colimg {
    height: 780px;
  }
  .cicle1
  {
    right: 291px;
  }
  .cicle3
  {
    right: 47px;
    top: 268px;
  }
  .supimg
  {
    height: 874px; 
    object-fit: cover;
  }
  .btnbox a {
    
    width: 166px;
  }
}
/* max de 1110px */

  @media (max-width: 440px) {
  
  .slider {
    grid-auto-columns: 40%;
  }
}
/* slide css  */
/* style min de 770px */
@media (max-width: 770px) {
  .banniersignore{ 
    /* height: 1060px; */
    width: 100%;
   }
   .btnsignore
   {
    margin-left: 0px;
   }
   .produitsignore h2
   {
    font-size: 30px;
   }
   .btnsignore
   {
    width: 100% !important;
   }
   .bartop
   {
    text-align: center;
    padding-bottom: 80px;
   }
   .bartop .float-right{
     float: none;
     text-align: center;
   }
   .menusig
   {
    overflow-y: hidden

   }
   .footersignore
   {
    padding: 20px 10px 40px 10px;
    text-align: center;
   }
   .footersignore p
   {
    text-align: center;
   }
   .nav-link
   {
    color: #101010 !important;
   }
   .cicle1 {
    right: 25px;
    top: 0px;
   }
   .cicle2 img {
    width: 219px;
    
  }
  .cicle2 {
      width: 236px;
      left: -68px;
      top: 10px;
    }
  .boxbene
  {
    margin-top: 200px;
  }
  .bggriyrel1
  {
    height: 1056px;
  }
  .colimg {
    height: 235px;
  }
  .title3
  {
    font-size: 20px;
  }
  .boxlog img
  {
    margin-top: 30px;
  }
  .bgwihte
  {
    height: 2160px;
  }
  .circ1 {
    position: absolute;
    left: -77px;
    top: 171px;
    animation: myAnim 7s ease 0s infinite normal forwards;
  }
  .circ2 {
    position: absolute;
    right: 0;
    top: 614px;
    width: 150px;
    animation: cicle3 30s ease 0s infinite normal both;
  }
  .deviscontent {
    background-image: url(../img/bannierdevis.png);
    color: #fff;
    position: relative;
    padding: 80px 40px 30px 40px;
    min-height: 798px;
    margin-bottom: 20px;
  }
 
  .btnlgpaie
  {
    width: 100%;
  }
  .logozone{
    width: max-content;
    animation: scroll-left 20s linear infinite;
  }
  .newsletter
  {
    padding: 30px 20px 30px 20px;
  }
  .formnewsletter
  {
    width: 100%;
  }
  .soultions .col-md-6{
    margin-bottom: 30px;
  }
  .soultionsb
  {
    
    color: #101010;

  
  }
  .boxlog img{
    width: 60%;
    
  }
  .fomrModal .modal-header 
  {
    padding: 0px;
    
  }
  .close
  {
    margin-right: 0px;
  }
  .fomrModal .modal-title
  {
    margin-left: 0px;
  }
  .fomrModal .modal-title
  {
    padding: 10px;
  }
  .modal  
  {
    width: 90%;
    margin-left: 3%;
  }
  .slide img {
    height: 220px;
    object-fit: cover;
  }
  .zonetext 
  {
    display: block;
  }
  .slide{
    width: 290px;
  }
  .newvideo
  {
    height: 220px;
  }
  .slider
  {
    gap: 11rem;
  }
  .slide video{
    height: 220px;
  }
  .btnbox a {
    
    width: 200px;
  }
  
 }
 /* style min de 770px */
/* animation */
@keyframes cicle3 {
  0% {
    transform: scale3d(1, 1, 1);
  }

  30% {
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    transform: scale3d(1.05, 0.95, 1);
  }

  100% {
    transform: scale3d(1, 1, 1);
  }
}

@keyframes myAnim {
    0% {
      transform: translate(0);
    }
  
    20% {
      transform: translate(-2px, 2px);
    }
  
    40% {
      transform: translate(-2px, -2px);
    }
  
    60% {
      transform: translate(2px, 2px);
    }
  
    80% {
      transform: translate(2px, -2px);
    }
  
    100% {
      transform: translate(0);
    }
  }
  @keyframes cicle1 {
    0%,
    100% {
      transform: rotate(0deg);
      transform-origin: 50% 50%;
    }
  
    10% {
      transform: rotate(8deg);
    }
  
    20%,
    40%,
    60% {
      transform: rotate(-10deg);
    }
  
    30%,
    50%,
    70% {
      transform: rotate(10deg);
    }
  
    80% {
      transform: rotate(-8deg);
    }
  
    90% {
      transform: rotate(8deg);
    }
  }
  @keyframes circal1 {
    0% {
      transform: translate(0);
    }
  
    10% {
      transform: translate(-2px, -2px);
    }
  
    20% {
      transform: translate(2px, -2px);
    }
  
    30% {
      transform: translate(-2px, 2px);
    }
  
    40% {
      transform: translate(2px, 2px);
    }
  
    50% {
      transform: translate(-2px, -2px);
    }
  
    60% {
      transform: translate(2px, -2px);
    }
  
    70% {
      transform: translate(-2px, 2px);
    }
  
    80% {
      transform: translate(-2px, -2px);
    }
  
    90% {
      transform: translate(2px, -2px);
    }
  
    100% {
      transform: translate(0);
    }
  }
 
  
  /* end animation */ 