
.sweep-to-right2 {
  border:none;
  position: relative;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-transition: color 1000ms;
  transition: color 300ms;
  border: 1px solid #FFF;
}
.sweep-to-right2:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #FFF;
  border: 1px solid #FFF !important;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition: 300ms ease-out;
  transition: 300ms ease-out;
}
.sweep-to-right2:hover:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  
}
.sweep-to-right2:hover{
  color:#2c2a2a; border: 1px solid #2c2a2a;
}

.sweep-to-right {
  border:none;
  position: relative;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-transition: color 1000ms;
  transition: color 300ms;
}
.sweep-to-right:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #2c2a2a;

  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition: 300ms ease-out;
  transition: 300ms ease-out;
}
.sweep-to-right:hover:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
.sweep-to-right:hover{
  color:#FFF;
}

*{
  font-family: "Cairo";
}
.carousel-item {
  height: 669px;
  min-height: 350px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.temoignages .carousel-item{
  height: 420px;
  min-height: 350px;
}
.bg-light {
    background-color: #FFF !important;
}
.navbar-dark .navbar-nav .nav-link {
    color: #282828;
    padding-top: 0;
    padding-bottom: 0;
}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: #d90017;
}
.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link {
    color: #d90017;
}
.carousel-caption {
    bottom: 20%;
}
.display-4 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
    margin-bottom: 30px;
}
.lead {
    font-size: 1rem;
    font-weight: 300;
    margin-bottom: 40px;
}
.carousel-indicators .active{
  background-color:#d90017;
}
.btn-light {
    color: #d90017; border-radius:0;
    }
h1{
  font-size: 34px; text-transform: uppercase; margin-bottom: 50px;
}
.marginImg{
  margin: auto;
    max-width: 95%;
    display: inline-block;
    margin-bottom:30px;
    border-radius: 20px;
}
.py-5{
  background: #f2f2f2;
}
.btn-red{
  background-color:#2c2a2a; color:#FFF; border-radius: 0;
}
.navbar-dark .navbar-toggler {
    color: rgb(217, 0, 23);
    border-color: rgb(217, 0, 23);
}

.pictos{
  margin-bottom:40px;
}
.pictos:hover img{
  transform: rotateY(180deg);
  transition: transform 0.8s;
  transform-style: preserve-3d;
}
.pictos h4{
  font-size: 18px; text-transform: uppercase; line-height: 26px; margin-top:20px;
}
.pictos h4 span{
  font-size: 26px; display: block;  font-weight: bold;
}

.card{
  border-radius: 20px; border-color:#2c2a2a; margin-bottom: 30px;
}
.card h4{
  background: #2c2a2a; color:#FFF; text-align: center; font-size: 20px; padding:10px 0;
}
.card p{
  padding: 10px; text-align: center; min-height: 140px;display: flex; /* contexte sur le parent */
  flex-direction: column; /* direction d'affichage verticale */
  justify-content: center; /* alignement vertical */
}
h2.title{
  text-transform: uppercase; margin-bottom: 60px; margin-top: 60px;
}
h2.title span{
  font-weight: bold;
  }

  h2::after{
        display: block;
    margin: auto;
    width: 50px;
    height: 3px;
    margin-top: 15px;
    border: 3px solid #d90017; content:" ";
  }
  h3.title{
    margin-bottom: 30px;
  }
h2.paddingresp::after{
  margin:0;
}
  .bx-wrapper{
    border:none; box-shadow: none;
  }

  .partenaires .bx-wrapper{
    background: #F6F6F6;
  }

  .bx-wrapper li{
        max-width: 345px;
  }
  .bx-wrapper img{
    margin:auto;
  }
  .paddingresp{
  padding:20px 20px 20px 20%
  }
  .map{
  padding:20px 20px 20px 20%
  }
  h2.map::after{
        display: block;
    margin: 0;
    width: 50px;
    height: 3px;
    margin-top: 15px;
    border: 3px solid #FFF; content:" ";
  }
  .map ul{
    margin: 0; padding:0;
  }
  .map li::before{
    content: "- ";
    padding-left: 0;
    font-size: 20px;
  }
  .map li{
    color: #FFF; list-style: none;
  }
  .desc{
    min-height: 150px;
  }

 footer{
  color:#FFF;
 } 
.pratiques p{
  line-height: 35px; margin-bottom: 0px;
 }
 .pratiques a{
  color: #FFF; text-decoration: none;
 }
 .pratiques a:hover{
  text-decoration: underline;
 }


 footer h6::after{
        display: block;
    margin: 0;
    width: 50px;
    height: 3px;
    margin-top: 15px;
    border: 3px solid #d90017; content:" ";
  }

  .img{
    display: none;
  }
button.btn-light.active{
  color: #FFF !important;
    background-color: #d90017 !important;
    border-color: #d90017 !important;
}

.step{
  display: none;
}
.step1{
  display: block;
}
.xdsoft_datetimepicker.xdsoft_inline{
  width: 100% !important;
}
.xdsoft_datetimepicker .xdsoft_datepicker{
  width: 80% !important;
}

.paddingpres {
    padding: 20px 20% 20px 20px;
}
 h2.paddingpres::after {
    display: block;
    margin: 0;
    width: 50px;
    height: 3px;
    margin-top: 15px;
    border: 3px solid #d90017;
    content: " ";
    /* left: 0; */
}
#map_canvas {  overflow: initial !important;}
#map_canvas .gm-style>div {overflow: hidden;}
.marquee{
  list-style: none;
}
.marquee li{
  display: inline-block; margin-left: 40px;
}

.headerpage{}
.bgimage{position:absolute;right:0;        padding: 150px 0px;}

@media screen and (max-width:992px){
.paddingresp{
  padding:20px ;
  }
  .map{
  padding:20px ;
  }
}  
@media screen and (max-width:767px){

  .percent{
    max-width: 90px; 
  }
   .desc{
    min-height: 110px;
  }
  .navbar-brand img{
    max-width: 60%;
  }
  .display-4 {
    font-size: 1.8rem;
  }
  .carousel-caption {
      bottom: 10%;
  }
  .carousel-caption{
    left:8%;
  }
}

.gm-style-iw-d h3{
  font-size: 0.8em !important;
}