*{
padding: 0;
margin: 0;
outline: none;
text-decoration: none;
list-style-type: none;
}
html, body{
height: 100vh auto;

text-align: center;
font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.navBar{
background: linear-gradient(#2596be,#e1dd72);
width: 100%;
}
nav ul{
display: inline-flex;
flex-wrap: wrap;
flex-direction: column;

}
nav ul li.btnNav{
padding: 15px;
margin: 15px;
}
li.btnApp{
    padding: 33px;
    margin: 15px;
}
li.btnApp a.btn{
color: #1a576d;
font-weight: bold;
border-radius: 18px;
/* border: 1px solid white; */
font-size: large;
padding: 15px;
text-decoration: none;
}
 li.btnApp a.btn:hover{
background-color: #1a576d;
color:#e1dd72;
transition: 0.3s;
}
.Header{
    
width:100%
background:url("https://images.pexels.com/photos/6571948/pexels-photo-6571948.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1") 0 0 no-repeat;
background-size:cover;
}
.Header h1{
color: #2596be;
padding: 65px;
text-align: center;
}
.Header h2{
padding-bottom: 65px;
}
.box{
display: inline-flex;
flex-wrap: wrap;

}
footer{
    /* position: absolute; */
width: 100%;
bottom:0 ;
background-color: #1a576d;
height: 150px auto;
text-align: center;
}
.boxDroite, .boxGauche{
 margin: 15px;
 padding: 35px;
 font-size: medium;
}
a.btnGest:hover, a.btnZA:hover{
text-decoration: underline;
transition: 0.3s;
}

.bodyContainer .Avantage{
display: inline-flex;
flex-wrap: wrap;
}
span{
font-weight: bold;
color: #1a576d;
}
.avantage{
width: 450px;
padding: 35px;
margin: 25px;
border-radius: 18px;
box-shadow:#1a576d 0px 1px 15px;
/* rgba(0, 0, 0, 0.35) */
}

@media screen and (max-width:1110px) {
    .btn{
        font-size: small !important;
    }
    h1{
    font-size: x-large;
    }
    h3{
    font-size: large;
    }
    .avantage{
        width: auto;
        height: auto;
    }
    
}