aquarius : form.css | update new dynform on legacy websites
Created by Julien Christe, last modified on nov. 16, 2016
#form { width: 100%; margin: 1.400em 0 0; }
#form fieldset { width: 100%; border: none; margin: 0; padding: 0; }
#form fieldset + fieldset { margin: 1em 0 0; }
#form fieldset legend { margin: 0 0 10px; }
#form fieldset span.text { display: block; margin: 0 0 10px; }
#form span.field { position: relative; display: block; width: inherit; }
#form span.field + span.field { margin: 10px 0 0; }
#form input, #form select, #form textarea, #form .errorMessage { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; }
#form span.singleline input, #form span.email input, #form span.number input { width: inherit; border: 1px #AEC4D3 solid; padding: 5px; background: white; color: #000; }
#form span.radio, #form span.checkbox { padding: 4px 0; }
#form span.radio label, #form span.checkbox label { display: inline-block; margin-right: 10px; }
#form span.radio label input, #form span.checkbox label input { position: relative; top: -1px; left: 0; }
#form span.submit input { border: 0 none; background: #AEC4D3; color: black; padding: 6px 20px; margin: 2em 0 0; text-align: center; }
#form span.submit input:hover { border: 0 none; background: #AEC4D3; color: #009ee2; }
#form textarea { width: inherit; height: 148px; min-height: 148px; border: 1px #AEC4D3 solid; padding: 5px; background: white; color: #000; }
#form select { width: inherit; height: auto; padding: 5px; background: white; color: #000; }
#form span.pulldown div.styledSelect { position: relative; width: 100%; overflow: hidden; border: 1px white solid; background: white; cursor: pointer; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#form span.pulldown div.styledSelect + div.styledSelect { margin: 10px 0 0; }
#form span.pulldown div.styledSelect:after { content: ""; position: absolute; top: 16px; right: 14px; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid black; }
#form span.pulldown div.styledSelect:hover:after { border-top-color: #009ee2; }
#form span.pulldown div.styledSelect select { position: relative; background: transparent; padding: 0 6px 0 1px; line-height: 34px; height: 34px; border: 0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; cursor: pointer; z-index: 1; text-indent: 0.01px; text-overflow: ''; }
#form span.pulldown div.styledSelect select::-ms-expand { display: none; }
#form span.pulldown select[size], #form span.pulldown select[multiple], #form span.pulldown select.multiple { width: 100%; height: auto; border: none; padding: 4px; }
#form span.pulldown select option { line-height: 36px; padding: 6px; cursor: pointer; color: black; }
#form input.error, #form textarea.error, #form span.pulldown.error div.styledSelect { border: 1px black solid; background: white; }
#form span.field.error label { color: white; }
#form span.field.error input::-webkit-input-placeholder, #form span.field.error textarea::-webkit-input-placeholder { color: red; opacity: 1; }
#form span.field.error input:-moz-placeholder, #form span.field.error textarea:-moz-placeholder { color: red; opacity: 1; }
#form span.field.error input::-moz-placeholder, #form span.field.error textarea::-moz-placeholder { color: red; opacity: 1; }
#form span.field.error input:-ms-input-placeholder, #form span.field.error textarea:-ms-input-placeholder { color: red; opacity: 1; }
#form span.field.error input.placeholder, #form span.field.error textarea.placeholder { color: red; opacity: 1; }
#form span.field.error div.errorContainer { position: relative; width: 100%; line-height: 36px; height: 36px; padding: 0 5px; display: block; color: black; white-space: nowrap; }
#form span.required { display: block; margin: 1em 0 10px; }
#form div.errorMessage { display: none; width: 100%; border: 1px white solid; padding: 9px 5px 8px; margin: 2.000em 0 0; color: red; background: white; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#form .checkerror::-webkit-input-placeholder { color: white; }
#form .checkerror:-moz-placeholder { color: white; }
#form .checkerror::-moz-placeholder { color: white; }
#form .checkerror:-ms-input-placeholder { color: white; }
#form .checkerror.placeholder { color: white; }
@-moz-document url-prefix() { select { width: 110% !important; } }
.email_validate { display: none; }