body{font-family: sans-serif;overflow-x: hidden;}
#navbar{
  top:-30%;
  transition: top 0.3s;
}
#navbar img{
  background-color: white;
}
 video{
  width:100%;
}
main section {
  background-color: rgb(230,230,230);
  color:#293f55;
  margin: auto;
  margin-top:3%;
  padding-left: 17%;
  margin-bottom:2%;
  padding-bottom: 8%;
  padding-top:3%;
  text-align: justify;
}
main section img{
  width: 25%;
  float: left;
  margin-right: 3%;
}
main section article{
  width:100%;
  margin-left:5%;
}
main article p{
  width:80%;
  line-height: 30px;
  margin-bottom: 3%;
}
.button{
  background-color: #293f55;
  color:white;
  padding:1%;
  margin-top:5%;
  font-size: large;
  border:none;
  width: 13%;
}
.button:hover{
  background-color: white;
  color:#293f55;
  transition:0.2s;
}
main article a {text-decoration-line:none;}
main article a:hover{text-decoration-line:none;}
main h1,main h2{color:#293f55;}
.container h2{text-align: center;}
/******************************************************/
.container{
  margin-bottom: 1%;
  background-color: rgb(230,230,230);
  padding: 1%;
}
.container h2,.container h3{
  font-size: xx-large;
  color:#293f55;
}
.container p{
  color:#293f55;
  line-height: 30px;
  text-align: justify;
}
.services{
  background-color: rgb(245,245,245);
  padding:9%;
  padding-top:5%;
  margin-bottom: 3%;
}
.services img{
  width:50%;
}
.gestion img,.achat img{
  float:left;
  margin-right: 3%;
}
.vente img{
  float: right;
  margin-left: 3%;
}
   /**********************************/
   @media only screen and (max-width:600px){
        header{position: fixed;}
        main section {
          margin: auto;
          margin-top:3%;
          padding-left: 2%;
          padding-right: 2%;
          margin-bottom:3%;
          padding-top:3%;
        }
     main section img{
       width: 60%;
       float: none;
       margin-right: 0%;
     }
     main section article{
       width:100%;
       margin-left:0%;
     }
     main article p{width:100%;}
     .button{
       background-color: #293f55;
       color:white;
       padding:2%;
       margin-top:5%;
       font-size: large;
     }
     .container{
       padding: 0%;
       padding-left: 2%;
       padding-right: 2%;
     }
     .container h2,.container h3{
       font-size: x-large;
     }
     .services{
       background-color: rgb(245,245,245);
       padding:5%;
       padding-top:1%;
       margin-bottom: 7%;
     }
     .services img{
       width:100%;
       float: none;
     }
   }
   @media only screen and (max-width:992px) and (min-width:600px){
        header{position: fixed;}
        main section {
          margin: auto;
          margin-top:3%;
          padding-left: 2%;
          margin-bottom:3%;
          padding-top:3%;
          width: 100%;
        }
        main section img{
          width: 40%;
          margin-right: 4%;
        }
        main article p{width:90%;}
        .container h2,.container h3{
          font-size: x-large;
        }
        .services img{
          width:70%;
        }
   }