/**********************************
* slider haut de page (page tarif)
**********************************/

#slider-haut-contact .slide1 {
    background:rgb(0,0,0) url("../images/slide-hautpage/contact/contact-creation-site-internet-pour-avocat.jpg") top center no-repeat;
}
#slider-haut-contact .slide1 .bContainer {
    top: 10%;
    left:0%;
    border:0px solid red;
}

/**********************************
* Coordonnées
***********************************/

#contact h3{
    font-size: 1.6em;
    font-weight: normal;
}

#contact ul.coordonnees li{
    text-align: left;
    padding-left: 30px;
    padding-bottom:0.5em;
    padding-top: 4px;
}

.divider{
    padding: 0px;
    margin:1em 0px;
    line-height: 5px;
    width: 100%;
    background: transparent url("../images/contact/divider.png") top center repeat;
}

/************************************
* Formulaire de contact
************************************/

form {font-size: 0.95em;}
textarea {overflow: auto; resize: none; }
button { overflow: visible; padding: 0 10px; cursor: pointer; } button::-moz-focus-inner { padding: 0; border: none; }

.form-a { width: 100%; }
.form-a fieldset { display: block; border: none; margin: 0 0 1em 0; padding: 0; }
.form-a .fgroup-a { width: 100%; padding-top: 9px; }
.form-a .fgroup-a:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.form-a .field-a { position: relative; float: left; width: 100%; max-width: 300px; }
.form-a .field-b { position: relative; float: left; width: 100%;}

@media only screen 
and (min-width : 0px) 
and (max-width : 1200px) {
    .form-a .field-a{
        max-width: 800px;
    }
}

.form-a .fl-a { float: right; }
.form-a .fl-b { width: 100%; }
.form-a .field-a label, .form-a .field-b label { display: block; padding-bottom: 9px; color: #172934; /*font: normal 1em/1.2 Segoe UI Semibold,Helvetica Neue,Helvetica,Arial,sans-serif;*/ }
.form-a .field-a input { display: block; width: 90%; padding: 8px 5px 7px 45px; border: 1px solid #dbdbdb; color: #3c525f; line-height: 1.2; background: #fff url(../images/contact/icones-contact.png) 0 0 no-repeat; -webkit-box-shadow: inset 1px 1px 3px 1px #f2f2f2; -moz-box-shadow: inset 1px 1px 3px 1px #f2f2f2; box-shadow: inset 1px 1px 3px 1px #f2f2f2; outline: none; }

@media only screen 
and (min-width : 0px) 
and (max-width : 400px) {
    .form-a .field-a input{
        width: 75%;
    }
}

.ie .form-a .field-a input { padding-top: 8px; }
.form-a .field-a input:focus { background-color: #fffff7; border-color: #d2d2d2; }
.form-a .field-a input.name { background-position: 7px 6px; }
.form-a .field-a input.prenom { background-position: 7px 6px; }
.form-a .field-a input.activite { background-position: 8px -43px; }
.form-a .field-a input.email { background-position: 8px -91px; }
.form-a .field-a input.phone { background-position: 8px -141px; }
.form-a .field-a input.ville { background-position: 12px -442px; }
.form-a .field-a .focus-wrapper { display: block; position: relative; float: left; }
.form-a .field-a .focus-helper { position: absolute; right: -13px; top: 0; display: block; overflow: hidden; width: 14px; height: 34px; background: url(../images/contact/field-focus-helper.png) 0 0 no-repeat; text-indent: -10001px; }

.form-a .field-a select { display: block; width: 325px; padding: 6px 4px 6px 4px; border: 1px solid #dbdbdb; color: #3c525f; line-height: 1.2; -webkit-box-shadow: inset 1px 1px 3px 1px #f2f2f2; -moz-box-shadow: inset 1px 1px 3px 1px #f2f2f2; box-shadow: inset 1px 1px 3px 1px #f2f2f2; outline: none; }
.form-a .field-a select:focus { background-color: #fffff7; border-color: #d2d2d2; }

@media only screen 
and (min-width : 400px) 
and (max-width : 1200px) {
    .form-a .field-a select{
        width: 100%;
    }
}

@media only screen 
and (min-width : 0px) 
and (max-width : 400px) {
    .form-a .field-a select{
        width: 95%;
    }
}

.form-a .field-b textarea { display: block; width: 650px; height: 182px; padding: 12px 40px 8px 45px; border: 1px solid #dbdbdb; color: #3c525f; background: #fff url(../images/contact/icones-contact.png) 0 0 no-repeat; line-height: 1.5; -webkit-box-shadow: inset 1px 1px 3px 1px #f2f2f2; -moz-box-shadow: inset 1px 1px 3px 1px #f2f2f2; box-shadow: inset 1px 1px 3px 1px #f2f2f2; outline: none; }
.form-a .field-b textarea:focus { background-color: #fffff7; border-color: #d2d2d2; }
.form-a .field-b textarea.message { background-position: 8px -191px; }

@media only screen 
and (min-width : 1300px) 
and (max-width : 1400px) {
    .form-a .field-b textarea{
        width: 620px;
    }
}

@media only screen 
and (min-width : 1200px) 
and (max-width : 1300px) {
    .form-a .field-b textarea{
        width: 580px;
    }
}

@media only screen 
and (min-width : 600px) 
and (max-width : 1200px) {
    .form-a .field-b textarea{
        width: 85%;
    }
}

@media only screen 
and (min-width : 400px) 
and (max-width : 600px) {
    .form-a .field-b textarea{
        width: 75%;
    }
}

@media only screen 
and (min-width : 0px) 
and (max-width : 400px) {
    .form-a .field-b textarea{
        width: 60%;
    }
}

.form-a .fgroup-a { width: 100%; padding-top: 7px;border:0px solid black; }

.form-a a { color: #5f8195; text-decoration: none; }
.form-a a:hover { color: #172934; text-decoration: none; }

.form-a .btn-container { overflow: hidden; width: 100%; }
.form-a .btn { margin-bottom: 0; position: relative; float: left; left: 50%; font-size: 1.2em; text-transform: uppercase;}
.form-a .btn button { display: block; position: relative; float: left; left: -50%; margin: 0; padding: 0 15px 0 0; color: #fff; border: 5px solid #e7e7e7; background: url(../images/contact/bouton.jpg) 0 0 repeat-x; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; }
.form-a .btn button span { display: block; padding: 0 15px 0 15px;line-height: 2.3em; border:0px solid red; height: 32px; background: url(../images/contact/fleche.png) 100% 50% no-repeat; /*font: normal 1em/35px MuseoSans700,Segoe UI,Helvetica Neue,Helvetica,Arial,sans-serif;*/ text-transform: uppercase; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; }
.form-a .btn button:hover { background-position: 0 -32px; }
.form-a .btn button:active { -webkit-box-shadow: inset 0px 0px 3px 2px rgba(27,97,0,0.37); -moz-box-shadow: inset 0px 0px 3px 2px rgba(27,97,0,0.37); box-shadow: inset 0px 0px 3px 2px rgba(27,97,0,0.37);  }