body{/* je met le dégradé au body, il y a 2 manières de le faire, soit avec l'image fond.png en background et en mode repeat, soit avec linear gradient*/
    background: repeat url(../img/fond.png) ;
    /*background:linear-gradient(#d9d9d9, #fff);*/
}
.container{
    width:1000px;
    margin:10px auto;
    font-family: Arial, Helvetica, sans-serif;
    background-color: #fff;
    box-shadow: 4px 1px 8px 3px #878787;
}
.head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: no-repeat 49% 55% url(../img/aide.png); /* je place l'image directement dans le background et lui attribu des coordonnées de position en pourcentage*/
    margin-bottom:15px;
}
.logo{
    display: flex;
    align-items: flex-start;
    margin-left: 15px;
}
.logo img{
    margin-top:5px;
}
.logo img:hover{
    transform: rotate(90deg) scale(1.5);
}
.boutique{
    margin-left:25px;
}
.boutique h1{
    font-style: italic;
    font-size:45px;
    line-height: 53px;
}
.boutique p{
    color:#f583e3;
    font-style:italic;
    font-size:15px;
}
.help{
    color:#3fc9fa;
}
.help h2{
    font-weight: normal;
    line-height: 30px;
}
.help p{
    color:lightgrey;
    font-style:italic;
    margin-top:9px;
}
.panier{
    background-color: #3fc9fa;
    color:#fff;
    text-align: center;
    padding:5px;
}
.article{
    display:flex;
    align-items: center;
}
.panier p:first-child{
    border-bottom:1px solid #fff;
}
.help h3{
    margin-left:42px;
    font-size: 17px;
}
.navHeader ul{
    display:flex;
    background-color: #3fc9fa;
}
.navHeader{
    /*background-color: #3fc9fa;*/    
    width:1000px;
}
.navHeader li{
    width:100%;
    padding-top:10px;
    padding-bottom:10px;
    text-align: center;
}
.navHeader a{
    text-decoration:none;
    color:#fff;
}
.navHeader li:hover{
    background-color: #f583e3;
}
section{
    display:flex;
    margin-top:15px;
    margin-bottom:35px;
}
.paiement h4, .about h4, .services h4{
    color:#3fc9fa;
    margin-bottom:10px;
}
section p, section span{
    font-size:13px;
}
.bloc1{
    line-height: 17px;
}
.paiement{
    width:20%;
    border-right:1px solid lightgrey;
    margin-left: 15px;
}
.txtPaiement{
    margin-bottom:15px;
}
.about{
    width: 55%;
    margin-right: 20px;
    margin-left:20px;
    border-right:1px solid lightgrey;
}
.servicesFlex{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 15px;
}
.servicesFlex p{
    margin-left:12px;
}
.bonPlan{
    border-radius: 10px;
    box-shadow: 6px 5px 8px 2px grey;
    margin-left:15px;
    margin-right:25px;
}
.bonPlan h4, .fave h4, .plaisir h4{
    text-align: center;
    padding-bottom:6px;
    padding-top:6px;
    background-color: lightgrey;
    border-radius: 10px 10px 0 0;
    margin-bottom:10px;
}
.bonPlanFlex{
    display:flex;
    align-items: center;
}
.bonPlanFlex img{
    margin-right:20px;
    margin-left:10px;
}
.pBloc{
    line-height: 17px;
}
.fave{
    border-radius: 10px;
    box-shadow: 6px 5px 8px 2px grey;
    margin-left:25px;
    margin-right:25px;
}
.plaisir{
    border-radius: 10px;
    box-shadow: 6px 5px 8px 2px grey;
    margin-left:25px;
    margin-right:15px;
}
.lien{
    font-size: 13px;
    text-align: right;
    font-weight: 700;
    margin-right:15px;
    margin-bottom:8px;
}
.lien a{
    color:#3fc9fa;
}
.lien a:hover{
    color:#f583e3;
}
.navFooter{
    background-color: #3fc9fa;
    padding:10px;
    color:#fff;
}
.navFooter ul{
    display: flex;
    justify-content: center;
    font-size:13px;
}
.navFooter a{
    color:#fff;
    text-decoration: none;
    padding-left:5px;
}
.navFooter a:hover{
    color:#000;
}