@charset "UTF-8";
/* CSS Document */


@font-face {
    font-family: 'josefin_sansregular';
    src: url('../fonts/josefinsans-regular-webfont.eot');
    src: url('../fonts/josefinsans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/josefinsans-regular-webfont.woff2') format('woff2'),
         url('../fonts/josefinsans-regular-webfont.woff') format('woff'),
         url('../fonts/josefinsans-regular-webfont.ttf') format('truetype'),
         url('../fonts/josefinsans-regular-webfont.svg#josefin_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'josefin_sanssemibold';
    src: url('../fonts/josefinsans-semibold-webfont.eot');
    src: url('../fonts/josefinsans-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/josefinsans-semibold-webfont.woff2') format('woff2'),
         url('../fonts/josefinsans-semibold-webfont.woff') format('woff'),
         url('../fonts/josefinsans-semibold-webfont.ttf') format('truetype'),
         url('../fonts/josefinsans-semibold-webfont.svg#josefin_sanssemibold') format('svg');
    font-weight: normal;
    font-style: normal;
} 


@font-face {
    font-family: 'ralewayregular';
    src: url('../fonts/raleway-regular-webfont.eot');
    src: url('../fonts/raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/raleway-regular-webfont.woff2') format('woff2'),
         url('../fonts/raleway-regular-webfont.woff') format('woff'),
         url('../fonts/raleway-regular-webfont.ttf') format('truetype'),
         url('../fonts/raleway-regular-webfont.svg#ralewayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ralewaymedium';
    src: url('../fonts/raleway-medium-webfont.eot');
    src: url('../fonts/raleway-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/raleway-medium-webfont.woff2') format('woff2'),
         url('../fonts/raleway-medium-webfont.woff') format('woff'),
         url('../fonts/raleway-medium-webfont.ttf') format('truetype'),
         url('../fonts/raleway-medium-webfont.svg#ralewaymedium') format('svg');
    font-weight: normal;
    font-style: normal;

}


#formulaire {
  border: 1px solid #ccd3e7;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  background-color:#ccd3e7;
  padding: 5px;
  line-height:1.7;
  color:#002286;
  position:relative;
  margin-left:auto;
  margin-right:auto;
  width:80%;
}

#titreForm {
  background-color:#002286;
  text-align:center;
  color:#FFFFFF;
  padding:5px;
  font-family: 'josefin_sanssemibold', Arial, Helvetica, sans-serif;
  font-size: 24px;
}

.titre {
  font-family: 'ralewaymedium', Arial, Helvetica, sans-serif;
  color:#002286;
  font-size:16px;
}

input[type="text"] {
  color: #002286;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  border:solid 1px #002286;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  border-radius:4px;
  width:50%;
}

input[type="text"].sujet {
  width:50%;
}

input:focus{
  background-color: #fff1cc;
}

textarea {
  color: #002286;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  border:solid 1px #002286;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  width:50%;
}

textarea:focus{
  background-color: #fff1cc;
}

input[type="submit"] {
  width:15%;
  background-color:#002286;
  border:solid 1px #002286;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  color:#FFF;
  padding:10px;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  letter-spacing:1px;
  cursor:pointer;
}

input[type="submit"]:hover {
  width:15%;
  background-color:#03832e;
  border:solid 1px #03832e;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  color:#FFF;
  padding:10px;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  cursor:pointer;
}

.alerte {
  font-family: 'ralewaymedium', Arial, Helvetica, sans-serif; 
  font-size:16px;
  color:#03832e;
  padding:4px;
  border:4px solid #03832e;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px; 
  border-radius:5px;
  background-color:#FFF;
}
	

/* MEDIA QUERIES */

@media only screen and (max-width: 479px) {



#formulaire {
  border: 1px solid #ccd3e7;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  background-color:#ccd3e7;
  padding: 1%;
  line-height:1.7;
  color:#003260;
  position:relative;
  margin-left:auto;
  margin-right:auto;
  width:98%;
}

#titreForm {
  background-color:#002286;
  text-align:center;
  color:#FFFFFF;
  padding:5px;
  font-family: 'josefin_sanssemibold', Arial, Helvetica, sans-serif;
  font-size: 20px;
}

.titre {
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;; 
  color:#002286;
  font-size:16px;
}

input[type="text"] {
  color: #002286;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  border:solid 1px #002286;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  border-radius:4px;
  width:100%;
}

input[type="text"].sujet {
  width:100%;
}

input:focus{
  background-color: #fff1cc;
}

textarea {
  color: #002286;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  border:solid 1px #002286;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  width:100%;
}

textarea:focus{
  background-color: #fff1cc;
}

input[type="submit"] {
  width:100%;
  background-color:#002286;
  border:solid 1px #002286;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  color:#FFF;
  padding:10px;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  cursor:pointer;
}

input[type="submit"]:hover {
  width:100%;
  background-color:#03832e;
  border:solid 1px #03832e;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  color:#FFF;
  padding:10px;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  cursor:pointer;
}

.alerte {
  font-family: 'ralewaymedium', Arial, Helvetica, sans-serif;  
  font-size:14px;
  color:#03832e;
  padding:4px;
  border:4px solid #03832e;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px; 
  border-radius:5px;
  background-color:#FFF;
}
	

}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	
#formulaire {
  border: 1px solid #ccd3e7;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  background-color:#ccd3e7;
  padding: 1%;
  line-height:1.7;
  color:#003260;
  position:relative;
  margin-left:auto;
  margin-right:auto;
  width:98%;
}

#titreForm {
  background-color:#002286;
  text-align:center;
  color:#FFFFFF;
  padding:5px;
  font-family: 'josefin_sanssemibold', Arial, Helvetica, sans-serif;
  font-size: 24px;
}

.titre {
   font-family: 'ralewayregular', Arial, Helvetica, sans-serif;; 
  color:#002286;
  font-size:16px;
}

input[type="text"] {
  color: #002286;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  border:solid 1px #002286;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  border-radius:4px;
  width:100%;
}

input[type="text"].sujet {
  width:100%;
}

input:focus{
  background-color: #fff1cc;
}

textarea {
  color: #002286;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  border:solid 1px #002286;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  width:100%;
}

textarea:focus{
  background-color: #fff1cc;
}

input[type="submit"] {
  width:33%;
  background-color:#002286;
  border:solid 1px #002286;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  color:#FFF;
  padding:10px;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  cursor:pointer;
}

input[type="submit"]:hover {
  width:33%;
  background-color:#03832e;
  border:solid 1px #03832e;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  color:#FFF;
  padding:10px;
  font-family: 'ralewayregular', Arial, Helvetica, sans-serif;
  font-size:16px;
  cursor:pointer;
}

.alerte {
  font-family: 'ralewaymedium', Arial, Helvetica, sans-serif;  
  font-size:16px;
  color:#03832e;
  padding:4px;
  border:4px solid #03832e;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px; 
  border-radius:5px;
  background-color:#FFF;
}
	

}