﻿/*-------------------------------------------------------
 FORM BUILDER FORMS
---------------------------------------------------------*/
.oDataFormContainer { width: 100%; overflow: hidden; clear: both; font-size: 0.9em; }

fieldset.oDataFormFieldset { border: 0px; 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: right; width: 35%; float: left; display: block; }
.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 { margin-left: 10px; background: #fff; border: 1px solid #dbdbdb; color: #00A0DE; 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 { margin: 0 0 2em; }
.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 { color: #888; width: 100px; background: url('/EasySiteWeb/EasySite/StyleData/sdccg_2019_web_master/Images/search-bg.jpg') no-repeat left top; border-radius: 5px; padding: 5px; border: 0px; margin-right: 5px; }
.oFormBuilder .oDataFormAnswer .ui-datepicker-trigger { width: 0px; height: 0px; vertical-align: middle; padding: 12px 12px 16px 12px; cursor: pointer; background: url('/EasySiteWeb/EasySite/StyleData/sdccg_2019_web_master/Images/cal.jpg') no-repeat left top; }
.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; }
/* text that accompanies 'required field' */
.oFormBuilder p { color: #fff; }

/* 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; }

.oFormBuilder.form { background: #0072c6; border-radius: 15px; }
.oFormBuilder.form .page-element-inner.pel-o { padding: 10px; }
.oFormBuilder.form fieldset { border: 0px; margin: 0px; padding: 0px; }
.oFormBuilder.form legend { background: #00356a; border-radius: 10px; width: 100%; display: block; }
.oFormBuilder.form legend span { color: #FFF; font-size: 1.6em; font-weight: normal; padding: 7px 10px; display: block; }
.oFormBuilder.form .oDataElementContainer { padding-top: 25px; padding-bottom: 0px; }
.oFormBuilder.form .oDataFormLabel { color: #FFF; text-align: left; padding-top: 5px; }
.oFormBuilder.form .oDataFormAnswer .oDataFormInputText { background: url('/EasySiteWeb/EasySite/StyleData/sdccg_2019_web_master/Images/search-bg.jpg') no-repeat left top; border-radius: 5px; color: #888; padding: 5px; }
.oFormBuilder.form .oDataFormCheckboxList li { color: #FFF; float: left; margin-right: 10px; clear: none; }
.oFormBuilder.form .oDataFormCheckboxList li label { width: auto; margin: 0px; padding: 3px; }
.oFormBuilder.form .oDataFormCheckboxList li input { float: none; }
.oFormBuilder.form .oDataFormButtonContainer { text-align: left; margin-left: 35%; float: none; margin-top: 0px; padding-top: 0px; }
.oFormBuilder.form .oDataFormButtonContainer input { float: left; background: #fcfcfc !important; text-align: center; margin: 0px; padding: 5px 20px; border-radius: 3px; border: 0px !important; text-transform: uppercase; font-size: 1.2em; font-weight: bold; color: #0072c6; cursor: pointer; margin: 0px 5px; }
.oFormBuilder.form .oDataFormButtonContainer input[value="Submit"] { float: none; margin-bottom: 5px; }

/* MailChimp */
.pel-emailnews fieldset { padding: 0px; }
.pel-emailnews legend { padding: 0px; font-size: 1.2em; font-weight: bold; color: #16499a; display: block; margin: 0px; margin-bottom: 0.5em; }
.pel-emailnews .fields ul, .pel-emailnews .fields ul li { padding: 0px; margin: 0px; list-style-type: none; }
.pel-emailnews .fields ul li { margin-bottom: 5px; overflow: hidden; }
.pel-emailnews .fields ul li input[type='checkbox'] { float: left; margin: 2px 5px 2px 2px; overflow: hidden; }

@media only screen and (max-width: 320px) {
	.oFormBuilder.form .oDataFormQuestion { width: auto; float: none; }
	.oFormBuilder.form .oDataFormLabel { padding-left: 0px; }
	.oFormBuilder.form .oDataFormAnswer { width: auto; float: none; }

	.oFormBuilder.form .oDataFormButtonContainer { margin-left: 0px; }

}
