@media all and (max-width: 1024px)
{
    #bloc_page
    {
        width: 100%;
    }
}

p{
    color: aliceblue;
    background-color: transparent;
  }

body{
    background-image: url(istock.jpg);
    background-size : cover;  
    
}

#nombre1{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: center;
    border:groove;
    background-color:aliceblue;
    border-color: rgb(13, 110, 134);
    border-radius: 10px;
}

#nombre2{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: center;
    background-color:aliceblue;
    border:groove;
    border-color: rgb(13, 110, 134);
    border-radius: 10px;
}

#resultat{
  font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: center;
    background-color:aliceblue;
    border:groove;
    border-color: rgb(13, 110, 134);
    border-radius: 10px;
}

h3{
  font-family: Arial, Helvetica, sans-serif;
    background-color: aliceblue;
    color:rgb(13, 110, 134);
    display: inline;
    font-weight: bold;
    border:groove;
    border-color: rgb(13, 110, 134);
    border-radius: 10px;
}

textarea{
font-family: Arial, Helvetica, sans-serif;
    margin-left: 20%;
    margin-right: 20%;
    font-weight: bold;
    background-color:aliceblue;
    border:groove;
    margin:auto;
    border-color: rgb(13, 110, 134); 
    border-radius: 10px;
}

/*Footer*/

footer
{
    color: #666363;
    background-color: #444444 ;   
    text-align: center; 
    background-image: url('images/BZH.png');
    background-repeat: no-repeat;
    background-position: right;
    background-size: 90px;
    margin-top: 200px;
    margin-bottom: auto;
}