.contact-form {
    display: inline-block;
}
.contact-form > .form-wrapper{
    padding: 10px;
}

.contact-form > .form-wrapper:nth-child(even){
    background-color: #f9f9f9;
}

.fieldset-wrapper {
    padding-top: 10px;
}

.form-required:after {
    content: " *";
}

.form-item > label {
    display: block;
    padding-left: 3px;
    padding-bottom: 2px;
}

.js-form-type-checkbox > label {
    display: inline-block;
}

/** input **/
.form-text,
.form-email,
.form-textarea {
    width: 100%;
    padding: 8px 5px;
}


/** checkbox **/

/**
* [type="checkbox"]:checked ou [type="checkbox"]:not(:checked), ce qui veut dire que si le navigateur ne reconnait
* pas le sélecteur, ces styles ne seront pas appliqués. C’est une sorte de détection de support du navigateur
*/

/* Cachons la case à cocher */
.form-checkbox[type="checkbox"]:not(:checked),
.form-checkbox[type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
    display: none;
}

/* on prépare le label */
.form-checkbox[type="checkbox"]:not(:checked) + label,
.form-checkbox[type="checkbox"]:checked + label {
    position: relative; /* permet de positionner les pseudo-éléments */
    padding-left: 35px; /* fait un peu d'espace pour notre case à venir */
    cursor: pointer; /* affiche un curseur adapté */
    padding-bottom: 15px;
    padding-top: 2px;
}

/* Aspect des checkboxes */
/* :before sert à créer la case à cocher */
.form-checkbox[type="checkbox"]:not(:checked) + label:before,
.form-checkbox[type="checkbox"]:checked + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 4px;
    width: 20px;
    height: 20px; /* dim. de la case */
    border: 1px solid #cecece;
    background: #fff;
}

/* Aspect général de la coche */
.form-checkbox[type="checkbox"]:not(:checked) + label:after,
.form-checkbox[type="checkbox"]:checked + label:after {
    content: '✔';
    position: absolute;
    top: 0;
    left: 4px;
    font-size: 18px;
    color: #0089b4;
    transition: all .2s; /* on prévoit une animation */
}

/* Aspect si "pas cochée" */
.form-checkbox[type="checkbox"]:not(:checked) + label:after {
    opacity: 0; /* coche invisible */
    transform: scale(0); /* mise à l'échelle à 0 */
}

/* Aspect si "cochée" */
.form-checkbox[type="checkbox"]:checked + label:after {
    opacity: 1; /* coche opaque */
    transform: scale(1); /* mise à l'échelle 1:1 */
}