body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    /* // margin-top: 0px; */
    margin-top: -120px;
    width: 100vw;
    height: 700px;
    /* // background-color: #f0f0f0; */
    /* background-image: url('image1.jpg');  */
    background-size: cover; 
    background-position: center; 
    background-image: url(../img/fond-login-page.jpg);
}
section{
    padding: 80px;
}
/* .form{
    margin-top: 30px;
    text-align: center;
    justify-content: center;
    align-items: center;
} */
.contenu{
    
    margin-left: 50px;
    padding: 100px 10px 200px;
    margin: 0 0 40px 60px;
    /* border: 3px solid #007bff; */
}

form{
    max-width: 400px;
    margin: 100px auto;
    text-align: center;
    background-color: rgb(255, 255, 255); 
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.464);
    border: #007bff;
    display: grid;
}
form .mdp-oublie{
    margin-left: 5px;
}
form h1{
    color: #007bff;
}
form .connexion{
    display: flex;
   justify-content: space-between;
    margin-left: 10px;
}
form .connexion a{
    /* justify-content: space-evenly; */
     /* margin-left: 160px; */
     margin-right: 90px;
 }

input{
    margin-top: 10px;
    margin-left: 10px;
    color: black;
    background-color: rgba(231, 231, 231, 0.378);
    padding: 15px 10px;
    width: 90%;
    border: none;
    border-radius: 10px;
}
#mdp{
    margin-top: 20px;
    margin-left: 10px;
}
button{
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    cursor: pointer;
    margin: 10px 10px ;
    transition:  0.3s ease;
    background-color: #007bff;
    color: #fff;
}
button:hover{
    border: none;
    border-radius: 4px;
    font-size: 18px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    background-color: #007bff;
    color: #fff;
}
.error-message{
    color: red;
    font-size: 0.9rem;
}