@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
html{
    scroll-behavior: smooth;
    font-family: Georgia, 'Times New Roman', Times, serif;}
body{
background-color: #fffae4;
    margin: 0px;
    padding: 0px;
    font-family: Georgia, 'Times New Roman', Times, serif;
    width: 100%;
}
nav{
    background-color: #fffae4;
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
    align-items: center;
    border-bottom: 5px solid #fffae4;
}
nav h1{
    text-align: left;
    color: #602600;
    font-family:'Times New Roman', Times, serif;
    text-align: left;
}
nav .onglets{
    margin-top: 3px;
    margin-left: 800px;
}
nav .onglets a{
    text-decoration: none;
    color: #fffae4;
    margin-right: 10px;
    border-bottom: 1px solid #fffae4;
    padding-bottom: 5px;
    border-left-color: #fffae4;
    color: #602600;
}
header{
    display: flex;
   background:#fffae4;
    background: url('plan6.PNG');
    background-size: cover;
    color: #fffae4;
    height: 220px;
  }
header h1{
    font-family:'Times New Roman', Times, serif;
}
header h4{
    margin-top: -20px;
    font-size: 20px;
    text-align: center;
    border-bottom: 1px solid #fffae4;
}
.centre{
    margin-left: 250px;
    margin-right: 250px;
    text-align: center;
}
.services{
    margin-top: -10px;
    display:flex;
    flex-wrap:wrap;
    margin-left: 50px;
    margin-right: 50px;
}
.servicess{
    width: 550px;
    color:rgb(56, 57, 58);
    margin-left: 50px;
}
.complet{
    width: 100%;
    height: 200px;
}
.imagedeco{
      width: 1280px;
      height: 450px;
      background-image: url("./image/font33.PNG");
      -webkit-animation-name: diapo1;
      -webkit-animation-duration: 15s;
      -webkit-animation-timing-function: linear;
      -webkit-animation-iteration-count: infinite;
      -webkit-animation-direction: normal;
       -moz-animation-name: diapo1;
       -moz-animation-name: diapo1;
       -moz-animation-duration: 15s;
       -moz-animation-timing-function: linear;
       -moz-animation-iteration-count: infinite;
       -moz-animation-direction: normal;
      animation-name: diapo1;
      animation-name: diapo1;
      animation-duration: 15s;
      animation-timing-function: linear;
      animation-iteration-count: infinite;
      animation-direction:alternate;
  }
  @-webkit-keyframes diapo1{
    17%{background-image: url("./car/1,2.png");}
    18%{background-image: url("./car/4.PNG");}
    19%{background-image: url("./car/5.PNG");}
    18%{background-image: url("./car/6.PNG");}
    19%{background-image: url("./car/7.PNG");}
    17%{background-image: url("./car/9.PNG");}
    18%{background-image: url("./car/8.PNG");}  
  }
  @-moz-keyframes diapo1{
    17%{background-image: url("./car/1,2.png");}
    18%{background-image: url("./car/4.PNG");}
    19%{background-image: url("./car/5.PNG");}
    18%{background-image: url("./car/6.PNG");}
    19%{background-image: url("./car/7.PNG");}
    17%{background-image: url("./car/9.PNG");}
    18%{background-image: url("./car/8.PNG");}
  }
  @keyframes diapo1{
    17%{background-image: url("./car/1,2.png");}
    18%{background-image: url("./car/4.PNG");}
    19%{background-image: url("./car/5.PNG");}
    18%{background-image: url("./car/6.PNG");}
    19%{background-image: url("./car/7.PNG");}
    17%{background-image: url("./car/9.PNG");}
    18%{background-image: url("./car/8.PNG");}
  }
  .imagedeco1{
    width: 1280px;
    height: 500px;
    background-image: url("./car/16.PNG");
    -webkit-animation-name: diapo2;
    -webkit-animation-duration: 15s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
     -moz-animation-name: diapo2;
     -moz-animation-name: diapo2;
     -moz-animation-duration: 15s;
     -moz-animation-timing-function: linear;
     -moz-animation-iteration-count: infinite;
     -moz-animation-direction: normal;
     animation-name: diapo2;
     animation-name: diapo2;
     animation-duration: 15s;
     animation-timing-function: linear;
     animation-iteration-count: infinite;
     animation-direction:alternate;
}
@-webkit-keyframes diapo2{
 33%{background-image: url("./car/11.PNG");}
 25%{background-image: url("./car/16.PNG");}  
 25%{background-image: url("./car/14.PNG");}
 24%{background-image: url("./car/15.PNG");}
}
@-moz-keyframes diapo2{
    33%{background-image: url("./car/11.PNG");}
    25%{background-image: url("./car/16.PNG");}  
    25%{background-image: url("./car/14.PNG");}
    24%{background-image: url("./car/15.PNG");} 
}
@keyframes diapo2{
    33%{background-image: url("./car/11.PNG");}
    25%{background-image: url("./car/16.PNG");}  
    25%{background-image: url("./car/14.PNG");}
    24%{background-image: url("./car/15.PNG");}
}
@media screen  and (max-width:800px){
    body{
        background-color: #fffae4;
        margin: 0px;
        padding: 0px;
        font-family:'Times New Roman', Times, serif;
    }
    nav h1{
        margin-left: 0px;
       text-align: left;
    }
    nav .onglets {
      margin-left: 0px;
      margin-bottom: 20px;
    }
    nav .onglets{
        text-align: right;
    }
    nav .onglets a{
        flex-direction: column;
    }
    header{
        background: url('plan51.PNG');
          background-size: cover;
          height: 100px;
          color: #fffae4;
          padding: 0px;
    }
    header h1{
        font-family:'Times New Roman', Times, serif; 
    }
    header h4{
        margin-top: -20px;
        font-size: 20px;
        text-align: center;
        
       color: cornflowerblue;
    }
    .centre{
        width: 35%;
        text-align: center;
    }
    .dir{
        margin-left: -60%;
        margin-right: -50%;
    }
    .servicess{
        font-size: small;
       text-align: center;
       margin-left: -180px;
    }
    .services{
        width:0px;
       
    }
    .posi{
        text-align: center;
        
       width: 400px;
    }
    .servicesss{
      font-size: small;
        margin-left: -390px;
    }
    .imagedeco1{
        text-align: center;
        width: 500px;
        height: 300px;
        background-image: url("traiteur_m.jpg");
        -webkit-animation-name: diapo2;
        -webkit-animation-duration: 15s;
        -webkit-animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-direction: normal;
        -moz-animation-name: diapo2;
        -moz-animation-name: diapo2;
        -moz-animation-duration: 15s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
        -moz-animation-direction: normal;
        animation-name: diapo2;
        animation-name: diapo2;
        animation-duration: 15s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
        animation-direction:alternate;
    }
    @-webkit-keyframes diapo2{
     33%{background-image: url("assistan_admi_m.jpg");}
     25%{background-image: url("assist_tech_m.jpg");}  
     25%{background-image: url("gestion_immobilere_m.jpg");}
     24%{background-image: url("orga_de_voyage2.jpg");}
    }
    @-moz-keyframes diapo2{
        33%{background-image: url("assistan_admi_m.jpg");}
        25%{background-image: url("assist_tech_m.jpg");}  
        25%{background-image: url("gestion_immobilere_m.jpg");}
        24%{background-image: url("orga_de_voyage2.jpg");} 
    }
    @keyframes diapo2{
     33%{background-image: url("assistan_admi_m.jpg");}
     25%{background-image: url("assist_tech_m.jpg");}  
     25%{background-image: url("gestion_immobilere_m.jpg");}
     24%{background-image: url("orga_de_voyage2.jpg");}
    }
    .imagedeco{
        width: 1280px;
        height: 450px;
        background-image: url("./image/font33.PNG");
        -webkit-animation-name: diapo1;
        -webkit-animation-duration: 15s;
        -webkit-animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-direction: normal;
         -moz-animation-name: diapo1;
         -moz-animation-name: diapo1;
         -moz-animation-duration: 15s;
         -moz-animation-timing-function: linear;
         -moz-animation-iteration-count: infinite;
         -moz-animation-direction: normal;
         animation-name: diapo1;
         animation-name: diapo1;
         animation-duration: 15s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
        animation-direction:alternate;
    }
    @-webkit-keyframes diapo1{
        33%{background-image: url("assistan_admi_m1.jpg");}
        25%{background-image: url("assist_tech_m1.jpg");}  
        25%{background-image: url("gestion_immobilere_m2.jpg");}
        24%{background-image: url("orga_de_voyage2.jpg");}
    }
    @-moz-keyframes diapo1{
        33%{background-image: url("assistan_admi_m1.jpg");}
        25%{background-image: url("assist_tech_m1.jpg");}  
        25%{background-image: url("gestion_immobilere_m2.jpg");}
        24%{background-image: url("orga_de_voyage2.jpg");}
    }
    @keyframes diapo1{
        33%{background-image: url("assistan_admi_m1.jpg");}
        25%{background-image: url("assist_tech_m1.jpg");}  
        25%{background-image: url("gestion_immobilere_m2.jpg");}
        24%{background-image: url("orga_de_voyage2.jpg");}
    }
  }