/* BANDEAU */
#bandeau {position: relative; height: 350px; width:100%; background-size: cover!important; background: url("../images/bandeau_contact.jpg") center center;}

#formulaire_contact {width: 1170px; margin: 40px auto; font-family: 'DINPro-Light', Sans-Serif;}

/*.bloc_right {float: right; width: 50%;}*/
.bloc_right {width: 50%; margin: 0 auto;}
.bloc_right .top{background-color: #ebebec; padding: 30px 40px; margin-bottom: 30px;}
.bloc_right .top .titre {font-size: 50px; font-size: 5.0rem; color: #53eac4; text-transform:  uppercase;}
.bloc_right .top .sous-titre {font-size: 25px; font-size: 2.5rem; color: #afa89a; padding-bottom: 15px; background: url("../images/trait_menu.jpg") no-repeat left 100%; text-transform: uppercase;}
.bloc_right .top .info {padding-top: 15px; font-size: 15px; font-size: 1.5rem; color: #808285;}
.bloc_right .top .info .plus {color: #53eac4;}

.bloc_left {float: left; width: 50%;}
.bloc_left form.form_common p label {display: block;}
form.form_common p select, form.form_common p textarea, form.form_common p input{width: 471px;}
form.form_common p.nom , form.form_common p.prenom {width: 230px; display: inline-block;}
form.form_common p.nom input, form.form_common p.prenom input{width: 230px;}
form.form_common p.prenom {margin-right: 10px;}
form.form_common p input, form.form_common p select, form.form_common p textarea{background-color: #ebebec; border: none;}
form.form_common label{color: #808285; font-size: 14px; font-size: 1.4rem; margin-bottom: 8px;}
form.form_common p select option, form.form_common p select{color: #808285;}
form.form_common #btn_submit input {background-color :#b9b1a2; text-transform: uppercase;}
.bloc_right img{max-width: 100%;}
/**
 * Responsive Design
 */

/* Grand écran */
@media screen and (min-width: 1430px) {
}

/* Ecran classique / Tablette paysage */
@media screen and (min-width: 980px) and (max-width: 1429px) {

    #formulaire_contact {width: 940px;}

    .titre_page .bloc_right {height: 130px; padding-top: 33px;}

    form.form_common p select, form.form_common p textarea, form.form_common p input{width: 400px;}
    form.form_common p.nom , form.form_common p.prenom {width: 194px;}
    form.form_common p.nom input, form.form_common p.prenom input{width: 194px;}
}

/* Tablette portrait */
@media screen and (min-width: 764px) and (max-width: 979px) {
    #bandeau {height: 218px;}
    #bandeau .icones {top: 10%;}
    .titre_page {padding-left: 50px; padding-top: 55px;}
    .titre_page .bloc_right {height: 106px; padding-top: 22px;}
    .titre_page h1 {font-size: 30px; font-size: 3.0rem;}

    #formulaire_contact {width: 700px;}

    form.form_common p select, form.form_common p textarea, form.form_common p input{width: 90%;}
    form.form_common p.nom , form.form_common p.prenom {width: 90%;}
    form.form_common p.nom input, form.form_common p.prenom input{width: 100%;}
}


/* Mobile */
@media screen and (max-width: 763px) {
    #bandeau {height: 218px;}
    #bandeau .icones {display: none;}

    .titre_page {padding-left: 18px; padding-top: 55px;}
    .titre_page .bloc_right {height: 106px; padding-top: 22px; width: 250px;}
    .titre_page h1 {font-size: 25px; font-size: 2.5rem;}
    .titre_page .categorie {font-size: 18px; font-size: 1.8rem;}

    #formulaire_contact {width: 300px;}

    .bloc_right {float: none; width: 100%;}
    .bloc_right img{display: none;}
    .bloc_right .top .titre {font-size: 30px; font-size: 3.0rem; }
    .bloc_right .top .sous-titre {font-size: 20px; font-size: 2.0rem; }

    .bloc_left {float: none; width: 100%;}
    form.form_common p select, form.form_common p textarea, form.form_common p input{width: 100%;}
    form.form_common p.nom , form.form_common p.prenom {width: 100%;}
    form.form_common p.nom input, form.form_common p.prenom input{width: 100%;}
}