@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-Regular.ttf") format("opentype");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-Bold.ttf") format("opentype");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-Italic.ttf") format("opentype");
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-BoldItalic.ttf") format("opentype");
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-Light.ttf") format("opentype");
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-LightItalic.ttf") format("opentype");
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-Medium.ttf") format("opentype");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "Ubuntu";
    src: url("../font/Ubuntu-MediumItalic.ttf") format("opentype");
    font-weight: 500;
    font-style: italic;
}

:root{
    --font-family-sans-serif: "Ubuntu"
}

*{
    font-family: "Ubuntu";
}

#navbar-ml{
  background-color: var(--dark);
}

a {
  color: inherit;
  cursor: pointer;
}
a:hover {
  color: #ff6633 !important;
  cursor: pointer;
}
 
a:hover {
  text-decoration: none;
}

 
.container-fluid-max {
  max-width: 1440px;
}
 
.cover {
  background: no-repeat center/cover;
}
 
.p-15 {
  padding: 15px;
}


.scroll .page-header {
    background: var(--dark);
  }

.scroll .hero {
  transform: scale(0.98);
}

  .page-header {
    transition: background 0.5s ease-in-out;
  }

.hero {
  background-attachment: fixed;
  transition: transform 0.5s ease-in-out;
}
   
@media screen and (max-width: 991px) {
  .page-header {
    background: var(--dark);
  }
}

  .page-header .navbar {
    padding: 1rem 0;
  }
   
  .page-header .navbar-toggler {
    border-color: var(--white); 
  }
   


  #home {
      background-image: url(../img/bg/VISUEL_CMC.jpg);
      background-size: cover;
  }


   

   
  .hero::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(
      rgba(0, 0, 0, 1) 0,
      rgba(0, 0, 0, 0.5) 20%,
      rgba(0, 0, 0, 0.3) 50%,
      rgba(0, 0, 0, 0.1) 100%
    );
  }
   
  .hero .container-fluid {
    z-index: 10;
  }

  hr{
    background-color: grey;
  }

  .highlight1 {
    color: #ffcc33 !important;
  }

  .highlight2 {
    color: #ff6633 !important;
  }

  .highlight3 {
    color: #ff0000 !important;
  }

.contact{
  margin-top: 0;
  padding-top: 0;
  border-color: var(--dark);
  background: linear-gradient(
      rgba(255, 255, 255, 0) 0,
      rgba(255, 255, 255, 0) 20%,
      rgba(255, 255, 255, 1) 50%,
      rgba(255, 255, 255, 1) 100%
    );
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.photo1 {

  filter: grayscale(100%);

}
.photo2 {

  filter: grayscale(100%);

}
.photo3 {

  filter: grayscale(100%);

}

  .fa-linkedin{
    color: var(--dark);
  }

  .description{
    background-image: url(../img/bg/VISUEL_CMC_3.jpg);
    height:75vh;
  }

  .page-footer .footer-links {
    text-align: right;
  }
   
  @media screen and (max-width: 767px) {
    .page-footer .footer-child {
      text-align: center;
    }
  }

  a img:hover {
    border: solid 2px #ff6633;
    margin: -2px;
  }
  
  a span:hover {
    color: #ff6633;
  }

  .btn-plateform {
    height : 65px; 
    width: 200px;
  }
  .btn-plateform:hover {
    border: solid 2px #ff6633;
  }
  button img:hover {
    border : none;
    margin : none;
  }