@import url('https://fonts.googleapis.com/css2?family=Berkshire+Swash&family=Montserrat:wght@100&display=swap');
body, html {
    height: 100%;
    overflow-x: hidden;
    margin: 0;
   
}

header{
    font-size: 1.2em!important;
    font-family: arial;
   
    
}
nav li a:hover{
    color: skyblue!important;
    text-decoration: none;
}
.lien{
    font-family: 'Berkshire Swash', cursive;
    font-size: 1.3em!important;
    
}
.lampe{
  cursor: pointer;
  background-color: yellow;
}

.lampe:hover{
 background-color: black;
 padding: 5px;
}


.v{
    font-size: 1.4em!important;
}

/*section0*/

 .texte1_accueil{
  font-family: 'Montserrat', sans-serif;
  position: absolute;
  top: 5%;
  left: 35%;
  }
.imgaccueil1{
    height: 900px;
    z-index: 1;
}
.texte1_accueil2{
    position: absolute;
    top: 25%;
    left: 38%;
   font-family: 'Montserrat', sans-serif;
    font-style: italic;
    width: 30%;
    font-size: 1.1em!important; 
    z-index: 2;
}
.texte1_accueil3{
    position: absolute;
    top: 30%;
    left: 80%;
    font-size: 1em!important; 
    z-index: 3;
    transform: translate(-10%,10%);*/
}


/*parallax*/
.parallax {
  /* The image used */
   background-image: url("../images/voitTest.jpg");
   height: 100%; 
   
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.textparallax{
    height: 19em;   
}
.textparallax h2 {
   animation-duration: .8s;
   animation-name: clignoter;
   animation-iteration-count: infinite;
   transition: none;
}
@keyframes clignoter {
  0%   { opacity:1; }
  40%   {opacity:0; }
  100% { opacity:1; }
}

/*section produit*/

/* section client */
.visage{
	margin-top: -50px;
	width: 100px;
    height: 120px;
    margin-left: 20%;
}
/*section client*/
.card{
    min-height: 600px!important;
    box-shadow: black 0.3em 0.3em 0.3em;
}
p{
    font-size: 1.05em;
}
/*section map*/
.imgmap{
    height: 600px!important;
}
.map{
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 1.3em!important; 
}
/*footer*/
footer{
    font-size: 1.1!important;
}

/*  Small device */

@media screen and (max-width:767.98px) {
   body{
    overflow-x: hidden;
    width: 100%;
    
   }
   .container{
   width: 100%;
   }
    .lien{
    font-family: 'Berkshire Swash', cursive;
    font-weight: bold;
    font-size: 1.2em!important;
   
    }
   .v{
    font-size: 1.3em!important;
    font-weight: bold;
    }
 
    header{
    font-size: 1.1em!important;
    font-family: arial;
   
   
    }
    .imgaccueil1{
    height: 300px;
    z-index: 1;
    }
    
    p{
      font-size: 0.9em;   
    } 
  
   .texte1_accueil2{
    
    position: absolute;
    top: 5%;
    left: 3%;
   font-family: 'Montserrat', sans-serif;
    font-style: italic;
    width: 100%;
    font-size: 1em!important; 
    z-index: 2;
    }
    .texte1_accueil3{
    position: absolute;
    top: 80%;
    left: 15%;
    font-size: 0.8em!important; 
    font-weight: bold;
    z-index: 3;
    transform: translate(-10%,10%);*/
    }
   
    .visage{
    margin-top: -50px;
    width: 100px;
    height: 120px;
    margin-left: 20%;
    }

   .parallax {
  /* The image used */
   background-image: url("../images/voitTest.jpg");
   height: 100%; 

  /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    }
  
    .textparallax{
    height: auto;  
   }
   
  h1{
    font-size: 1.4em; 
   }

 h2{
    font-size: 1.2em; 
   }
   .map1{
   visibility: hidden;
    }
   .imgmap{
    height: 300px!important;
    }
    footer{
    font-size: 1em!important;
    }
    #client .card{
    min-height: 430px!important;
    }
}



@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
   body{
    overflow-x: hidden;
    width: 100%;
    
   }
   .container{
   width: 100%;
   }
    .lien{
    font-family: 'Berkshire Swash', cursive;
    font-weight: bold;
    font-size: 1.2em!important;
    }
    
   .v{
    font-size: 1.3em!important;
    font-weight: bold;
    }
 
    header{
    font-size: 1.2em!important;
    font-family: arial;
   
    }
    .imgaccueil1{
    height: 350px;
    z-index: 1;
    }
    
    p{
      font-size: 0.9em;   
    } 

  
   .texte1_accueil2{
    
    position: absolute;
    top: 5%;
    left: 3%;
   font-family: 'Montserrat', sans-serif;
    font-style: italic;
    width: 100%;
    font-size: 1em!important; 
    z-index: 2;
    }
    .texte1_accueil3{
    position: absolute;
    top: 80%;
    left: 15%;
    font-size: 0.8em!important; 
    font-weight: bold;
    z-index: 3;
    transform: translate(-10%,10%);*/
    }
    
   
    .visage{
    margin-top: -50px;
    width: 100px;
    height: 120px;
    margin-left: 20%;
    }

   .parallax {
  /* The image used */
   background-image: url("../images/voitTest.jpg");
   height: 100%; 

  /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    }
  
    .textparallax{
    height: 22em;  
   }
  .textparallax h2 {
   animation-duration: .8s;
   animation-name: clignoter;
   animation-iteration-count: infinite;
   transition: none;
  }
  @keyframes clignoter {
  0%   { opacity:1; }
  40%   {opacity:0; }
  100% { opacity:1; }
  }
  h1{
    font-size: 1.4em; 
   }

 h2{
    font-size: 1.2em; 
   }
   .map1{
   visibility: hidden;
    }
   .imgmap{
    height: 300px!important;
    }
    footer{
    font-size: 1em!important;
    }
    #client .card{
    min-height: 440px!important;
    }
}