/* ************************************************************************************* */
/* *** $COMMON *** */
/* ************************************************************************************* */

.mr21 { margin-right: 21px; }
.mt60 { margin-top: 60px; }
.pt5 { padding-top: 5px; }
.txttransform-none { text-transform: none; }
.txtunderline { text-decoration: underline; }
.txtupper { text-transform: uppercase; }
.fsize-18 { font-size: 1.8rem; }
.fsize-30 { font-size: 3rem; }

/* ************************************************************************************* */
/* *** $GLOBAL *** */
/* ************************************************************************************* */

body { font-family: "Swis721 Lt BT"; color: #011430; background: #fff; }

img { width: 100%;  }

section { padding: 0 30px 30px; clear: both; }

h3, .h3-like { font-family: "GeoSlab703 Lt BT"; font-size: 1.8rem; line-height: 1.2; text-transform: uppercase; }
h4, .h4-like { padding-bottom: 10px; font-family: "Swis721 Md BT Medium"; font-weight: normal; font-size: 1.8rem; line-height: 1.3; text-transform: uppercase; }

a { color: #011430; text-decoration: none; }
a:focus { outline: 0; }
a:hover img { opacity: 0.8; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; }

.link-more { margin: 20px auto 0; text-align: center; }
.link-more a { display: inline-block; position: relative; padding-left: 12px; text-transform: uppercase; font-size: 1rem; }
.link-more a:hover { text-decoration: underline; }
.link-more .white { background: url(../img/icons/icon-plus-white.png) left 2px no-repeat; }
.link-more .blue-dark { background: url(../img/icons/icon-plus-blue-dark.png) left 2px no-repeat; }

.nota,
.nota-required { font-family: 'Swis721 Lt BT Italic';  }
.nota-required,
.nota-legal { font-size: 1.2rem; color: #9099a5; }

.white, .white a { color: #fff;}
.blue-dark, .blue-dark a { color: #011430; }
.beige, .beige a { color: #bcae9d; }
.red {  }

.gray-bg { background-color: #e5e9f0; }

.separator-blue-dark { display: inline-block; width: 59px; height: 5px; background: #011430; }

.separator-rainbow { display: block; margin: 0 auto; width: 59px; height: 5px; }

/* ************************************************************************************* */
/* *** $FORMULAIRE *** */
/* ************************************************************************************* */

.form { position: relative; }
.form:before, 
.form:after { content: " "; display: table; }
.form:after { clear: both;}
.form label { display: inline-block; float: left; padding: 6px 5px 6px 0; cursor: default; font-size: 1.8rem; }
.form input,
.form textarea,
.form select { display: inline-block; float: left; width: 100%; margin: 3px 0; padding: 3px 5px; font-size: 1.6rem; color: #9099a5; background: #fff; }
.form input,
.form textarea { border: 1px solid #d9dce0; }
.form textarea { min-height: 100px; }
.form input[type=radio],
.form input[type=checkbox] { width: 16px; height: 16px; cursor: pointer; padding: 0; }
.form input[type=radio] { margin: 8px 0; }
.form input[type=checkbox] { margin: 10px 0; }
.form input[type=text]:disabled { color: #333; background:#f1f1f1; }
.form input:focus,
.form textarea:focus,
.form label:active + input,
.form label:active + textarea { outline: none; border: 1px solid #011430; }
.form select:focus { outline: none; }

.form .radio-button label,
.form .checkbox label { float: left; width: 95%; padding-left: 5px; cursor: pointer; }
.form .radio-button label { font-size: 1.6rem; }
.form .checkbox label { font-size: 1.8rem;  }

.form .radio-button label.w274p,
.form .checkbox label.w274p { width: 274px; }

.form .radio-button label.w50p,
.form .checkbox label.w50p { width: 50px; }

.form input.reset,
.form input.submit { display: inline-block; float: none; width: auto; margin: 0; padding: 5px 15px 5px 25px; cursor: pointer; text-transform: uppercase; border: none; }
.form input.submit { font-size: 1.2rem; color: #fff; }
.form input.reset { margin-right: 15px; font-size: 1rem; color: #011430; background: url(../img/icons/icon-plus-blue-dark.png) no-repeat 13px center #fff; }
.form .bigger input.submit { font-size: 1.8rem; font-family: "Swis721 Md BT Medium"; }
.form .participant input.reset { margin-right: 0; padding-right: 0; }

.gray-bg input[type=checkbox],
.gray-bg input[type=radio],
.gray-bg input.reset,
.gray-bg input.reset:hover { background-color: #e5e9f0; }

/* *** VALIDATION *** */
.form .field-validation-error { color: #e02828; }
.form .input-validation-error::-webkit-input-placeholder { line-height: 1.6; font-size: 1.2rem; color:#e02828; }
.form .input-validation-error::-moz-placeholder { line-height: 1.6; font-size: 1.2rem; color:#e02828; } /* firefox 19+ */
.form .input-validation-error:-ms-input-placeholder { height: 25px; font-size: 1.2rem; color:#e02828; } /* ie */
.form input.input-validation-error:-moz-placeholder { line-height: 1.6; font-size: 1.2rem; color:#e02828; }
.form input.input-validation-error,
.form textarea.input-validation-error,
.form select.input-validation-error { color: #e02828; background: #fcecec; border: 1px solid #e02828; }
.form .line .field-validation-error { display: block; padding: 5px 15px; background: #fcecec; }

/* ***  FORM-SMALL *** */
.form-small { width: 530px; margin: 0 auto; padding: 10px; }
.form-small label { width: 220px; }
.form-small input,
.form-small textarea,
.form-small select { width: 290px; }

/* ***  FORM-MEDIUM *** */
.form-medium { width: 660px; margin: 0 auto; padding: 10px; }
.form-medium label { width: 220px; }
.form-medium input,
.form-medium textarea,
.form-medium select { width: 290px; }

/* ***  FORM-LARGE *** */
.form-large { width: 990px; }
.form-large .formation .feature-catalogue { width: 100%; height: 161px; }
.form-large label { width: 210px; }
.form-large input,
.form-large textarea,
.form-large select { width: 225px; }
.form-large .formation input,
.form-large .formation textarea,
.form-large .formation select { width: 490px; }
.form-large .formation input[type=checkbox] { width: 16px; }

/* ***  CAPTCHA *** */
.form .recaptchatable a, 
.form .recaptchatable a:hover { color: #011430; }

.form .recaptchatable #recaptcha_image { border: 0 !important; }
.form  #recaptcha_logo,
.form  .recaptcha_only_if_privacy { display: none; }
.form .captcha img { width: auto; }
.form .captcha-validation-error { color: #e02828; }


@media only screen and (max-width: 768px) {
    .form-large { width: 768px; }
}

@media only screen and (max-width: 480px) {
    .form { width: 306px; }
    
    .form label,
    .form input,
    .form textarea,
    .form select { width: 100%; }
    
    .form-small .radio-button label.w274p,
    .form-small .checkbox label.w274p { width: 90%; }
    
    .left,
    .right { float: none; }
    
    .form label { font-size: 1.4rem; }
    .form input,
    .form textarea,
    .form select { font-size: 1.2rem; }
    .form .radio-button label { font-size: 1.4rem; }
    .form .checkbox label { font-size: 1.4rem;  }
    .form .bigger input.submit { font-size: 1.4rem; }
    
    .form .radio-button label, 
    .form .checkbox label { width: 90%; }
}