:root{
  --orange:#ffa500;
  
}
header a{
  text-decoration: none;
}

.navbar a{
  text-decoration: none;
}

html{
  font-size: 76.5%;
  overflow-x: hidden;
  scroll-padding-top: 6rem;
  scroll-behavior: smooth;
}
#menu-bar{
  color: #fff;
  font-size: 3rem;
  padding: .5rem 1.2rem;
  cursor: pointer;
  display: none;
}

header{
  position: fixed;
  font-size: 10px;
  top: 0; left: 0; right: 0;
  background: #333;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2rem 9%;
  height: 66px;
}

header .logo{
  font-size: 2.5rem;
  font-weight: bolder;
  color: white;
  text-transform: uppercase;
}
header .logo span{
  color: var(--orange);
}
header .navbar a{
  color: #fff;
  font-size: 2rem;
  margin: 0 .8rem;
}
header .navbar a:hover{
  color: var(--orange);
}






body {
    font-family: 'Poppins', sans-serif;
    font-style: italic;
    
  }

  .b-center{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.card {
  transition: transform 0.2s ease-in-out;
}

.card:hover {
  transform: scale(1.05);
}
.background{
  width: 100%;
}

.service-item h4 {
  font-size: 30px;
  margin: 0;
}

.service-item p {
  color: gray;
  font-size: 17px;
}

.icon_customise {
  font-size: 50px; /* Ajustez selon vos besoins */
}

.fontz{
  font-size: 40px;
}
  

.d-center{
    display: flex;
    margin: auto;
    align-items: center;
    justify-content: center;
}




.slider {
  position: relative;
  height: 770px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: white;
  font-size: 27px;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* Couleur noire avec une opacité de 50% */
  z-index: 1;
}

.container {
  position: relative;
  z-index: 2;
}

.text-element {
  color: white; /* Pour que le texte soit visible sur l'overlay */
  font-size: medium
  px;
}




  
  .services{
    background-image: url('https://templatekit.jegtheme.com/holadoc/wp-content/uploads/sites/212/2021/11/map-dotted-e1637228843644.jpg');
    height: fit-content;
  }
  .overlay-services{
    background-color: rgb(255, 255, 255,0.9);
    z-index: 3;
  }


  .colors{
    font-size: 30px;
    border-radius: 50%;
    padding: 7px;
    color: chocolate;
  }
  
.icon_customise{
  font-size: 30px;
  border: 1px solid chocolate;
  border-radius: 50%;
  padding: 7px;
  color: chocolate;
}

.icon_customise:hover{
  background-color: chocolate;
  color: white;
}

.container-p {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.element-p {
  font-family: Arial, sans-serif;
  font-size: 20px;
  text-align: center;
  line-height: 1.5;
  border-right: 2px solid transparent; /* Animation du curseur de frappe */
}

.check{
  color: chocolate;
}


@media(max-width:991px){
  header{
    padding: 2rem;
}

}


@media(max-width:768px){
  #menu-bar{
      display: initial;
  }

  

  #projets{
    width: fit-content;
  }
  

 


  header .navbar{
      position: absolute;
      top: 100%; right: 0; left: 0;
      background: #333;
      border-top: .1rem solid rgba(255,255,255,.2);
      padding: 1rem 2rem;
      clip-path: polygon(0 0,100% 0,100% 0,0 0);
  }
  header .navbar.active{
      clip-path: polygon(0 0,100% 0,100% 100%, 0 100%);
      display: block;
  }
  header .navbar a{
      display: block;
      border-radius: .5rem;
      padding: 1.5rem;
      margin: 1.5rem 0;
      background: #222;
      font-size: small;
  }
.slider{
  font-size: 20px;
}
.texting{
  padding-top: 115px;
}
  
}