@charset "UTF-8";
/* CSS Document */
/*---------------*/
/* FORMULAIRE */
/*---------------*/
*::-moz-placeholder {
color: #999;
opacity: 1;
font-weight:300;
}
::-webkit-input-placeholder {
opacity: 1;
color:#999;
font-weight:300;
}
::-moz-placeholder {
opacity: 1;
color:#999;
font-weight:300;
}
:-ms-input-placeholder {
opacity: 1;
color:#999;
font-weight:300;
}
input[disabled]::-webkit-input-placeholder, textarea[disabled]::-webkit-input-placeholder {
color:#CCC;
}
input[disabled]::-moz-placeholder, textarea[disabled]::-moz-placeholder {
color:#CCC;
}
/**/
fieldset { margin: 10px 0; border: 1px solid #DDD; }
.rowElem { margin: 15px 0; position: relative; }
input, textarea, select { background: #FFFFFF; border: 2px solid #BDC3C7; color: #34495E; display: inline-block; height: 42px; outline: 0 none; font-size: 14px; vertical-align: top; width: 100%; padding: 0 0 0 36px; border-radius: 3px; -webkit-border-radius: 3px; box-sizing: border-box; }
input[disabled], textarea[disabled] { background: #CCC; border: 2px solid #CCC; color: #CCC; }
input:focus, textarea:focus, select:focus { border-color: #62d0ba; color: #999; }
input:hover, textarea:hover, select:hover, file:hover { border-color: #62D0BA; }
textarea { height: 96px; line-height: 19px; padding: 10px 10px 10px 36px; resize: none; }
textarea:focus { height: 120px; }
label i { color: inherit; font-size: 14px; pointer-events: none; transition: all 0.5s ease-in-out 0s; -webkit-transition: all 0.5s ease-in-out 0s; position: absolute; top: 14px; left: 14px; z-index: 4; color: #BDC3C7; }
label span { background: #62d0ba; top: -8px; color: #fff; font-size: 11px; font-weight: 600; left: 10px; max-height: 0; overflow: hidden; position: absolute; }
label.show-label span { max-height: 22px; padding: 0 10px; border-radius: 3px; }
input[type="submit"] { background-color: #62d0ba; border: none; color: #FFF; font-size: 14px; text-shadow: 0 1px rgba(0, 0, 0, 0.08); border-radius: 3px; padding: 0; }
input[type="submit"]:hover { background-color: #62d0ba; }
.radioElem, .checkboxElem, .selectElem { position: relative; }
/* select */
select { display: block; margin: 0; outline: none; padding: 9px 10px; text-indent: 0.01px; text-overflow: ""; z-index: 10; }
.selectElem i { right: 10px; top: 10px; left: auto; font-size: 22px; z-index: 12; }
.selectElem:hover i, .selectElem:focus i { color: #62d0ba; }
.selectElem select:focus i { color: #62d0ba; }
.selectElem { position: relative; }
.selectElem:before { content: ""; pointer-events: none; position: absolute; z-index: 10; background: #FFF; /*border-left: 1px solid #d3dae7;*/ bottom: 1px; right: 1px; top: 1px; width: 40px; }
/* checkbox, radio*/
input[type="radio"], input[type="checkbox"] { height: inherit; left: 0; opacity: 0; position: absolute; width: inherit; }
.radio, .checkbox { background: #FFFFFF; border: 3px solid #B5C1C7; display: inline-block; height: 21px; margin: 0 2px 0 0; position: relative; top: 5px; width: 21px; max-height: inherit; left: 0; }
.checkbox:before, .radio:before { content: ""; display: none; }
input:checked + .checkbox:before, input:checked + .radio:before { display: block; }
.checkbox:before { border-color: #62d0ba; -o-border-image: none; border-image: none; border-style: solid; border-width: 0 0 3px 3px; height: 6px; left: 4px; position: absolute; top: 3px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); width: 9px; }
input:checked + .checkbox, input:checked + .radio { border: 3px solid #62d0ba; }
.radio { border-radius: 20px; }
.radio:before { background: #62d0ba; border-radius: 10px; height: 7px; margin: 4px; width: 7px; }
input:hover + .checkbox, input:hover + .radio { border-color: #62D0BA; }
input:focus + .checkbox, input:focus + .radio { border-color: #62d0ba; }
input:focus + .radio:before { background: #62d0ba; }
input:focus + .checkbox:before { border-color: #62d0ba; }
/*file*/
.btnfile { height: 34px; line-height: 34px; padding: 0 16px; position: absolute; right: 4px; top: 4px; z-index: 10; background-color: #62d0ba; color: #FFF; border-radius: 3px; max-height: inherit; left: auto; }
input[type="file"] { bottom: 0; cursor: pointer; height: 100%; opacity: 0; padding: 8px 10px; position: absolute; right: 0; width: 100%; z-index: 11; }
.fileElem input[type="file"] + input[type="text"] { padding: 0 0 0 10px; }
.fileElem input[type="file"]:hover + input[type="text"] { border-color: #62D0BA; }
/* tooltip */
.tooltip { background: #34495E; color: #FFFFFF; font-size: 11px; font-weight: normal; left: -9999px; opacity: 0; position: absolute; top: auto; transition: margin 0.6s ease 0s, opacity 0.6s ease 0s; -webkit-transition: margin 0.6s ease 0s, opacity 0.6s ease 0s; width: 184px; z-index: -1; }
.tooltip > em { display: block; font-style: normal; padding: 12px; position: static; }
.tooltip:after { content: ""; position: absolute; }
input:focus + .tooltip, textarea:focus + .tooltip { opacity: 1; z-index: 999; }
.tip-left { margin-right: -20px; top: 1px; }
.tip-left:after { border-bottom: 8px solid rgba(0, 0, 0, 0); border-left: 8px solid #34495E; border-top: 8px solid rgba(0, 0, 0, 0); left: 100%; top: 12px; }
input:focus + .tip-left, textarea:focus + .tip-left { left: auto; margin-right: 5px; right: 100%; }
.tip-right { margin-left: -20px; top: 1px; }
.tip-right:after { border-bottom: 8px solid rgba(0, 0, 0, 0); border-right: 8px solid #34495E; border-top: 8px solid rgba(0, 0, 0, 0); right: 100%; top: 12px; }
input:focus + .tip-right, textarea:focus + .tip-right { left: 100%; margin-left: 5px; }
.tip-right-top { bottom: 100%; margin-bottom: -20px; }
.tip-right-top:after { border-left: 8px solid rgba(0, 0, 0, 0); border-right: 8px solid rgba(0, 0, 0, 0); border-top: 8px solid #34495E; right: 12px; top: 100%; }
input:focus + .tip-right-top, textarea:focus + .tip-right-top { left: auto; margin-bottom: 10px; right: 0; }
.tip-left-top { bottom: 100%; margin-bottom: -20px; }
.tip-left-top:after { border-left: 8px solid rgba(0, 0, 0, 0); border-right: 8px solid rgba(0, 0, 0, 0); border-top: 8px solid #34495E; left: 12px; top: 100%; }
input:focus + .tip-left-top, textarea:focus + .tip-left-top { left: 0; margin-bottom: 10px; right: auto; }
.tip-right-bottom { margin-top: -20px; top: 100%; }
.tip-right-bottom:after { border-bottom: 8px solid #34495E; border-left: 8px solid rgba(0, 0, 0, 0); border-right: 8px solid rgba(0, 0, 0, 0); bottom: 100%; right: 12px; }
input:focus + .tip-right-bottom, textarea:focus + .tip-right-bottom { left: auto; margin-top: 10px; right: 0; }
.tip-left-bottom { margin-top: -20px; top: 100%; }
.tip-left-bottom:after { border-bottom: 8px solid #34495E; border-left: 8px solid rgba(0, 0, 0, 0); border-right: 8px solid rgba(0, 0, 0, 0); bottom: 100%; left: 12px; }
input:focus + .tip-left-bottom, textarea:focus + .tip-left-bottom { left: 0; margin-top: 10px; right: auto; }

