body{
font-family: 'Lucida Grande', sans-serif;
margin: 0;
padding: 0;
}

/**MENU**/
#headerMenu{
    height: 90px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    z-index: 5;
}

#headerMenu a{
    font-weight: bold;
    font-size: 16px;
    color: black;
    margin-right: 13px;
}

#headerMenu a:hover{
    color: #FE7763;
}

#headerMenu img{
height: 90px;
}

/**HAUT DE PAGE**/
.haut{
display: flex;
justify-content: space-between;
}

.haut .texte{
display: flex;
flex-direction: column;
margin: 200px 20px 0 25px;
}

.haut .texte h1{
color: #FE7763;
font-weight: bold;
font-size: 48px;
line-height: 50px;
text-align: right;

}

.titre{
font-size: 72px;
line-height: 30px;
}

.haut .texte p{
color: #4E5565;
font-weight: normal;
font-size: 25px;
line-height: 46px;
text-align: justify;
padding: 60px;
}

.haut img{
margin-top: 80px;
height: 90%;
}

/**BAS DE PAGE**/

.bas{
display: flex;
flex-direction: column;
}

.bas .Texte{
display: flex;
}

.bas .Texte p{
font-weight: normal;
font-size: 25px;
line-height: 46px;  
text-align: justify;   
color: #4E5565; 
margin: 260px 30px 0 60px;
}

.bas .Texte img{
margin-top: 150px;
box-shadow: 400px -155px 0px 0px rgba(47, 128, 237, 0.3);
}

/**TIP**/

.bas .tip{
width: 405px;
transform: translate(50%, -160%);
}

.bas .tip p{
color: #FFFFFF;
font-family: Impact;
font-weight: normal;
font-size: 40px;
line-height: 37px;
text-align: right;

}

.bas .tip img{
width: 50%;
}


@media screen and (max-width:375px){
 #headerMenu .headerLogo img{
    display: 5%;
    }

    #headerMenu{
    height: auto;
    width: auto;
    display: flex;
    flex-direction: column;
    position: relative;
    }

    #headerMenu .menu{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    }
    
    #headerMenu .menu a{
    padding: 20px 0 20px 0;
    }


    /**HAUT DE PAGE**/
.haut{
    display: flex;
    flex-direction: column;
    width: 95%;
    }

.haut .texte{
margin: 0 1px 0 1px;
width: 95%;
}
    
    .haut .texte h1{
    font-size: 18px;
    line-height: 15px;
    margin: 0;
    }
    
    .titre{
    font-size: 18px;
    line-height: 15px;
    }
    
    .haut .texte p{
    font-size: 16px;
    line-height: 17px;
    height: auto;
    padding: 0;
    }

    .haut img{
   
    margin-top: 0;
    height: 380px;
    width: 340px;
}

/**bas de page**/

.bas{
display: flex;
flex-direction: column;
width: 90%;
}

.bas .Texte{
display: flex;
flex-direction: column-reverse;
    }

.bas .Texte p{
font-size: 16px;
line-height: 17px;  
margin: 5px;
}

.bas .Texte img{

width: 330px;
height: 483px;
margin-top: 0;
box-shadow: none;
}

/**TIP**/

.bas .tip{
width: 300px;
display: flex;
justify-content: space-between;
transform: translate(5%, -150%);
}

.bas .tip p{
color: white;
font-family: Impact;
font-weight: normal;
font-size: 30px;
line-height: 37px;
text-align: right;

}

.bas .tip img{
display: none;
}

}