

@font-face {
    font-family: 'elmessiri' ;
    src: url('elmessiri.ttf') ;
}

#debut{
  background-color: white;
}

header {
     background-color: #f0f8ff;

}



#cadre{
   border: navy 4px solid;
  background-image: url("wallbleu.jpg");
  /* border-color: navy; */
  /* border-width: 4px; */
}


#logo {
  width : 14%;
height : 14%;
 text-align: center;
   display: block;
   margin: auto;
}

#titre{

  color:black;
text-align: center;
font-family: 'elmessiri';
font-style: oblique;
}

#navi  {
  border: navy 3px solid;
  background-image: url("wallbleu.jpg");
  /* background-color: black; */
height:  5%;
font-size: 22px;
   text-align: center;
     padding: 1px;

}

#navi  li {
font-family: 'elmessiri';
  display: inline-block;
margin-right:4%;
 font-style:italic;
font-style: oblique;
  text-transform: uppercase;

}

#navi  li a {
  text-decoration: none;
  font-family: 'elmessiri';
  color : black;
}

#navi li:hover a {
  border: #ffebcd 2px solid;
  color:white;
}





.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;
}
