﻿/*-------------------------------------------------------
 FORM BUILDER FORMS
---------------------------------------------------------*/
.oDataFormContainer { width: 100%; overflow: hidden; clear: both; font-size: 0.9em; }

fieldset.oDataFormFieldset { border: 1px #dbdbdb solid; margin: 0; margin-top: 1em; padding: 0px; }
.oDataFormLegend { padding-left: 10px; padding-right: 10px; color: #999; }

.window .oDataFormElementContainer { padding: 0; margin: 0; }
fieldset.oDataFormFieldset .oDataFormElementContainer, fieldset.oDataFormFieldset .oDataElementContainer { padding: 6px 10px 10px 10px; }
.oDataFormElement, .element { width: 100%; overflow: hidden; clear: both; margin-bottom: 1em; }

.oDataFormComment { margin: 0.5em 0 0.5em 0; }

.oDataFormQuestion, .question { text-align: left; width: 100%; float: left; display: block; color: #000; }
.oDataFormQuestionNewLine { width: 100%; float: none; text-align: left; display: block; margin-bottom: 2px; }
.oDataFormLabel, .label, label { display: block; margin-right: 3px; padding: 3px 10px 3px 10px; }
.oDataFormLabelNewLine { }

.oDataFormButtonContainer { text-align: right; margin: 1em 0; clear: both; }
.oDataFormButton, .button { background: #778899; border: none; color: #fff; padding: 7px 20px; margin: 0 10px 19px 0; font-weight: 700; font-size: 1.1em; cursor: pointer; }


.oDataFormAnswer, .answer { text-align: left; display: block; width: 64%; float: left; }
.oDataFormAnswerNewLine { text-align: left; display: block; width: 100%; float: none; padding-bottom: 5px; }
.oDataFormAnswerText { text-align: left; float: left; display: block; padding-top: 2px; }
.oDataFormAnswerTextNewLine { float: none; width: 100%; padding-bottom: 5px; }
.oDataFormAnswerTextStyle { }
.oDataFormInputSuffix { padding-left: 10px; }
.oDataFormInputNote { padding-left: 4px; }

.oFormBuilder .oDataFormAnswer .oDataFormInputText { margin: 0px; width: 90%; border: 1px solid #dbdbdb; background: none; }
.oFormBuilder .oDataFormAnswer .oDataFormInputTextarea { margin: 0px; width: 90%; border: 1px solid #dbdbdb; background: none; }
.oFormBuilder .oDataFormAnswer .hasDatepicker { width: 100px; background: none; border: 1px solid #dbdbdb; }
.oFormBuilder .oDataFormAnswer .oDataFormInputText, .oFormBuilder .oDataFormAnswer .oDataFormInputTextarea, .oFormBuilder .oDataFormAnswer .hasDatepicker { border-bottom: 2px ridge #dbdbdb; }
.oFormBuilder .oDataFormCheckboxList, .oFormBuilder .oDataFormCheckboxList li { list-style-type: none; padding: 0; display: block; clear: both; }
.oFormBuilder .oDataFormCheckboxList li input { margin-right: 5px; height: 15px; width: 13px; overflow: hidden; margin: 2px; float: left; clear: none; }
.oFormBuilder .oDataFormCheckboxList label { display: block; padding-top: 2px; float: left; clear: none; width: 60%; }

.oFormBuilder .oDataFormButtonContainer { float: right; padding: 1em 0; }
.oFormBuilder .oDataFormButtonContainer .oDataFormButton { margin-left: 10px; background: #fff; border: 1px solid #dbdbdb; color: #00A0DE; cursor: pointer; }
.oFormBuilder .oDataFormButtonContainer .oDataFormButton:first-child { background: #f3ecf7; border: 2px solid #00A0DE; }

.DataFormMarker { color: #ff0000; font-weight: bold; font-size: 1.2em; line-height: 1em; }

.oFormBuilder ul.checklist-items { list-style-type: none; margin: 0; padding: 0; }
.oFormBuilder ul.checklist-items li { list-style-type: none; margin: 0; padding: 0 0 3px 0; float: left; }
.oFormBuilder ul.checklist-items input { float: left; margin: 5px 5px 0 0; }
.oFormBuilder ul.checklist-items label { float: left; padding: 0 15px 0 0; }

/* Forms e.g. Contact Us */
.ClientAreaContainer .oFormBuilder fieldset { border: none; padding: 0; float: left; width: 100%; }
.ClientAreaContainer .oFormBuilder legend { display: none; }
.ClientAreaContainer .oFormBuilder .form .question { text-align: left; }
.ClientAreaContainer .oFormBuilder .form .question .label { font-weight: 600; margin: 0; padding: 0 0 3px 0; }
.ClientAreaContainer .oFormBuilder .form .answer { clear: both; width: 100%; }
.ClientAreaContainer .oFormBuilder .form .answer .textbox { border: 4px solid #bbb; background: #fcfcfc; margin: 0; width: 95%; }
.ClientAreaContainer .oFormBuilder .form .answer .oDataFormInputSelect { border: 4px solid #bbb; padding: 2px 0; background: #fcfcfc; font-size: 0.9em; width: 97%; } 
.ClientAreaContainer .oFormBuilder .form .answer .textarea { border: 4px solid #bbb; background: #fcfcfc; width: 94%; }
.ClientAreaContainer .oFormBuilder .form .buttons { float: right; }
.ClientAreaContainer .oFormBuilder .form .submit { border: none; background: #001535; color: #fff; padding: 7px 20px; margin: 0 10px 19px 0; font-weight: 700; font-size: 1.1em; cursor: pointer; }
.ClientAreaContainer .oFormBuilder .form .reset { border: none; background: #eee; padding: 7px 20px; margin: 0 10px 19px 0; font-weight: 700; font-size: 1.1em; cursor: pointer; }

/* forms v6 */

span.oDataFormCheckboxList { width: 100%; overflow: hidden; display: block; }
span.oDataFormCheckboxList input { height: 15px; width: 13px; overflow: hidden; margin: 2px; float: left; }
span.oDataFormCheckboxList label { display: block; margin-left: 22px; padding-top: 2px; }
span.oDataFormCheckboxList br { clear: left; margin: 0 0 2px 0; display: block; font-size: 2px; line-height: 2px; }

.form-intro-message { display: block; margin: 0.5em 0 0.5em 0; }
.hidden-label label { display: none; }
.oMultiSelectAnswer .oDataFormElement { float: left; width: auto; clear: none; }
.oMultiSelectAnswer .oDataFormLabel { display: none; }

/* helper icon, change css when html fixed */
.oElementFormHelperIcon { float: right; }
.oElementFormHelperIcon input { margin-left: 5px; }
span.question div.oElementFormElement { position: relative; overflow: visible; width: 100%; }
span.question div.oElementFormElement span.oElementFormHelperText { width: 80%; display: block; padding: 3px; font-size: 0.9em; border: 1px solid #cdc2e4; background: #f7f7f7; position: absolute; top: 3px; left: 10px; z-index: 99; }

/* Mandatory Icons */
.ClientAreaContainer .form .element.mandatory .question .label { background: url("/easysiteweb/style/7/img/required.png") no-repeat center right; padding: 0 15px 3px 0; float: left; }
.form-advisory .mandatory, .mandatory-field-legend { background: url("/easysiteweb/style/7/img/required.png") no-repeat center left; padding: 0 0 0 15px; }
