/********************************/
/* Style Sheet For Online Forms */
/********************************/

/*-- Design Time Actions --*/
#form-design .form-toolbar { position: relative; padding: 0.5em; background-color: #BAE4FF; }
#form-design .form-toolbar div.form-actions { position: absolute; top: 0.5em; right: 0.5em; }

#form-design #form-fields li.hover { background-color: #F0F0F0; cursor: move; } 
#form-design #form-fields li.editing { background-color: #EEE; height: auto; width: auto; } 

#form-design #form-fields li div.form-actions { position: absolute; right: 0.5em; display: none; }
#form-design #form-fields li.hover div.form-actions { display: block; }

#form-design #form-fields .placeholder { border: dashed 3px #F0F0F0; }

#form-nofields { color: #000000; background-color: #FFFFC0; border: solid 1px #DCDC41; padding: 2em; margin: 1em 0; }
#form-nofields h2 { margin-top: 0; }

/*-- Common Field Formatting --*/
.form_info { display: block; color: #000000; background-color: #FFFFC0; border: solid 1px #DCDC41; padding: 2em; margin: 1em 0;}

ul#form-fields { margin: 0; padding: 0; }
ul#form-fields li { position: relative; list-style: none; padding: 0.5em; border: solid 1px #fff; }

.form-fields-beside div.form-label { float: left; width: 225px; padding-right: 10px; line-height: 22px; }
.form-fields-beside div.form-field { margin-left: 235px; }

.form-fields-above div.form-label { margin: 0.5em 0; font-weight: bold; }
.form-fields-above div.form-field { margin-left: 1em; }

#form-fields div.form-field input[type=text] { width: 300px; }
#form-fields div.form-field input[type=text].datepicker { width: 275px; }
#form-fields div.form-field textarea { width: 300px; height: 75px; }

img.ui-datepicker-trigger { position: relative; top: 6px; left: 4px; }

#form-entry div.form-page { position: relative; margin: 1em 0; padding: 0.5em; border-top: solid 1px #EEE; }
#form-entry div.form-page input { padding: 0 5px; }
#form-entry div.form-page em { position: absolute; top: 1em; right: 0.5em; font-size: 0.8em; }

/*-- Design Time Field Formatting --*/
#form-design div.form-page { position: relative; margin: 1em 0; padding: 0.5em; border-bottom: dashed 1px black; }
#form-design div.form-page input { padding: 0 5px; }
#form-design div.form-page em { position: absolute; top: 1em; right: 0.5em; font-size: 0.8em; }

/*-- Editing Field Properties --*/
#form-design div.edit-label { float: left; width: 100px; line-height: 22px; }
#form-design div.edit-field { margin: 5px 0 5px 100px; }
#form-design div.edit-field input[type=text] { width: 350px; }
#form-design div.edit-field textarea { width: 350px; height: 75px; }
#form-design div.edit-btns input { padding: 0 5px; }

#form-design div.edit-label2 { float: left; width: 100px; line-height: 22px; }
#form-design div.edit-field2 { float: left; width: 150px;}
#form-design div.edit-field2 input[type=text] { width: 140px; }

#form-export { margin: 50px 0; padding: 1em; background-color: #EEE;  }

#form-dialog { display: none; }
#form-settings textarea { width: 500px; height: 75px; } 
#form-thankyou textarea { width: 550px; height: 350px; } 

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error
{
    color: #ff0000;
}

.field-validation-valid
{
    display: none;
}

.input-validation-error
{
    border: 1px solid #ff0000;
    padding: 1px;
    background-color: #ffeeee;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid
{
    display: none;
}