/*effet overlay blanc */
.bg_overlay {
  --overlay: linear-gradient(
    to right,
    rgba(255,255,255,.92) 20%,
    rgba(255,255,255,.75) 40%,
    rgba(255,255,255,0) 65%
  );

  background-image:
    var(--overlay),
    var(--bg-image);
  background-position: center right;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 40vh;  
}
@media (max-width: 767.98px) {
  .bg_overlay {
    --overlay: linear-gradient(
      to top,
      rgba(255,255,255,.92) 20%,
      rgba(255,255,255,.75) 40%,
      rgba(255,255,255,0) 65%
    );
    min-height: 30vh;
  }
}
 /****** bg heros sections *******/
.hero_home {
  --bg-image: url("img/hero_home.jpg");
}

.hero_about {
  --bg-image: url("img/bg_about.jpg");
}

.hero_services {
  --bg-image: url("img/bg_services.png");
}

.hero_contact {
  --bg-image: url("img/bg_contact.jpg");
}

.hero_txt{
  font-family: "Bebas Neue", sans-serif;
  font-style: normal;
  color: #1F788C;
  font-size: 3.8rem;
  line-height: 1.2em;
  text-shadow:
    0 1px 2px rgba(255,255,255,0.3),
    0 3px 8px rgba(0,0,0,0.2);
}
@media (max-width: 767.98px) {
  .hero_txt {
    font-size: 3rem;
    line-height: 1em;
  }
}
/****** bouton styles ****************/
.hero_home a, .ic_service a{
  transition: all 0.3s ease;
}
.hero_home a:hover {
  background-color: #1F788C;
  color: #FFF;
}

.ic_service:hover {
  background-color: #24A3BF;
  color: #FFF;
}
/*powering your need*/
.powering_need, .contact_home {
  background-color: #C1D4D9;
}
/* icones services */
.icone_service {
  color: #24A3BF;
  font-size: 3.5em;
}

.icone_contact {
   font-size: 1.6em; 
}
.footer {
  background-color: #8FCBD9;
  min-height: 80px;
}

.logo img {
        width: 190px;
}

.bg_sky_blue {
  background-color: #8FCBD9;
}