body {
    background-color: aliceblue;
}
#bloc {
    display: flex;
    font-size :large;
    padding: 5px;
    }
    
    #texte{
        
        padding: 10px;
        display: flex;
      font-size :large;
        max-width: 40%;
        max-height: 40%;
    }
    
    
    #imagef{
        padding: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 60%;
        }
    
        #imagefond {
            border: 2px solid black ;
            max-width: 100%;
           height: 70%;
         align-items: center;
           justify-content: center;
            display: flex;
    
        }
    
        
    
    
    
    
    #logo {
        background-color: aliceblue;
          border: 2px solid black;
          text-align: center;
          font-size: 30px;
          border-radius: 10px;
          font-weight:bold;
        /*  color: #efefef;*/
        color: teal;
          text-shadow:1px 3px 8px rgba(0,0,0,0.80);
          padding: 10px;
      }
      
      
      #titre {
      
        font-size: 40px;
      color:white;
      text-shadow:1px 3px 8px rgba(0,0,0,0.80);
         text-align: center;
      display: flex;
      align-items: center;
        justify-content: center;
         
      
      }
      
      
      
      #logo1 {
        border:2px solid black;
        background-image:url(vert.jpg);
         display: flex;
        align-items: center;
          justify-content: center;
          
          
      }
      
      
      #im2 {
       
        padding: 15px;
        width :9%;
        height: 8%;
      }
      
      
      #im1 {
        padding: 3px;
          width: 13%;
          height: 13%;
          
      
      }
      
      #menu{
        border: 2px solid black;
      }
    
      #navi  {
     
      background-image: url("vert.jpg");
      
      height:  5%;
      font-size: 15px;
         text-align: center;
          padding: 1px;
      color: aliceblue;
      }
     
      #navi  li {
        height: 40px;
        width:200px;
      /*  background-color: teal;*/
    background: linear-gradient(navy, aquamarine);
       /*- padding : 25px;*/
        border: 3px solid black;
      font-family: 'elmessiri';
        display: inline-flex;
     margin-right:4%;
       font-style:italic;
      font-style: oblique;
        text-transform: uppercase;
    color: aliceblue;
    align-items: center;
    justify-content: center;
     
      }
      
      #navi li a {
        text-decoration: none;
        font-family: 'elmessiri';
        color: aliceblue;
        
      }


      
     .box{
  border: navy 3px solid;
background: linear-gradient(#f0f8ff, DodgerBlue);

   width:950px;
  margin:20px auto; 

    /* margin:70px auto; */
   padding-top:20px;
  font-family: serif;
}
#form{
/* opacity: 0.4; */
  border-radius:2px;
  padding:20px 30px;
  box-shadow:0 0 15px;
  font-size:14px;
  font-weight:bold;
    width:700px;
   margin:20px 250px 0 35px;
   margin: auto;

}
h3{
  border: navy 1px solid;
  text-align:center;
  font-size:20px;
}
input{
  width:100%;
  height:35px;
  margin-top:5px;
  margin-bottom: 20px;
  border:1px solid #999;
  border-radius:3px;
  padding:5px;
}
#bouton{
  /* background-color:#ca1e1e; */
  margin :5px;
    background-color:DarkBlue;
  border:2px solid white;
  font-family: serif;
  font-Weight:bold;
     font-size:18px;
    width: 100%;
height: 45px;
  color:white;
}
textarea{
  width:100%;
  height:70px;
  margin-top:5px;
  border-radius:3px;
  padding:5px;
  resize:none;
}
#captcha{
   width : 50%;
   height : 50%;
/* background-color:  white; */
}

span{
  color:red
}
.successMessage{
    background-color: #7acc7d;
    border: #2b5a2d 1px solid;
    padding: 5px 9px;
    color: #262b26;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
}
.errorMessage{
    background-color: #e64141;
    border: #da1414 1px solid;
    padding: 5px 10px;
    color: #fdf7f7;
    border-radius: 4px;
}
.info{
    font-size: 0.9em;
    color: #d67262;
    letter-spacing: 2px;
    padding-left: 5px;
}

#titre2 {
text-align: center;
}