/****************************************************************************************
	[FORMS]
*****************************************************************************************/

/* [GLOBAL RULES]
-------------------------------------------------------*/
input, textarea, select, button { font-family: Arial, Helvetica, sans-serif; }

textarea { overflow: auto; }

input[type="submit"], input[type="image"] { cursor: pointer; }

button { overflow: visible; width: auto; cursor: pointer; }


/* [STANDARD FORM]
-------------------------------------------------------*/
/* Form Wrappers */
.form-wrapper { float: left; width: 726px; background: url("../images/template/bg-form-wrap-top.gif") no-repeat 0 0; padding-top: 3px; margin-bottom: 12px; }

.form-wrapper-inner { float: left; width: 686px; padding: 17px 20px 20px; background: url("../images/template/bg-form-wrap-btm.gif") no-repeat 0 100%; }
/* Inner Wrappers */
.form-inner-wrap { float: left; width: 686px; background: url("../images/template/bg-form-wrap-inner-top.gif") no-repeat 0 0; padding-top: 3px; margin-top: 10px; }
    .form-inner-wrap select { background-color: #FFFFFF; }

.form-inner { float: left; padding: 17px 20px 20px; width: 646px; background: url("../images/template/bg-form-wrap-inner-btm.gif") no-repeat 0 100%; }

    .form-inner .spacing { margin-right: .8em; }

    .form-inner textarea { display: block; height: 3em; width: 40em; margin: 2px 0 0 22px; }
/* Main Fieldset */
.form-wrapper fieldset { float: left; width: 100%; padding-bottom: 24px; border-bottom: 1px dotted #d7d7d7; margin-bottom: 18px; }

    .form-wrapper fieldset.last { padding: 0; border: none; margin: 0; }

    .form-wrapper fieldset fieldset { float: left; width: 90%; padding-bottom: 24px; border-bottom: 1px dotted #d7d7d7; margin-bottom: 18px; margin-left: 20px; }
/* Visible Legend */
.form-wrapper h1, legend.form-hdr { font-size: 1.5em; /* 18px */ padding: 0 0 .6em 0; color: #275da6; }

.form-wrapper h1 { font-size: 1.2em; }
/* Sub Header */

.form-wrapper h2,
.form-wrapper h3 { font-size: 100%; font-weight: bold; color: #575757; margin-bottom: 1em; padding-top: 1em; float: left; width: 100%; }

    .form-wrapper h2.no-padding,
    .form-wrapper h3.first { padding: 0; }

.form-wrapper h3 { float: none; margin-bottom: .8em; }
/* Row */
.form-row { float: left; padding-bottom: .4em; width: 100%; }

    .form-row.spacing { padding-bottom: .6em; }

    .form-row.last { padding: 0; }

    .form-row.inline { float: none; }
    /* Labels */
    .form-row label,
    .form-row .form-lbl { width: 16em; float: left; margin: 0 1.5em 0 0; display: block; font-weight: bold; padding-top: 3px; }

        .form-row label.no-padding,
        .form-row .form-lbl.no-padding { padding: 0; }

        .form-row label.wide { width: 100%; margin: 0 0 .6em; padding: 0; }

        .form-row label span,
        .form-row .form-lbl span { display: block; font-weight: normal; }

    .form-row .aaformsRadioButtonsVertical { float: left; display: block; padding-top: 5px; }
        .form-row .aaformsRadioButtonsVertical input { width: auto !important; height: 16px; border: none; margin-top: 5px; padding: 5px 0px 5px 0px; font-size: 1.1em; vertical-align: top; float: none; }
        .form-row .aaformsRadioButtonsVertical label { border: none; width: auto; font-size: 1.1em; font-weight: normal; padding-top: 5px; vertical-align: top; float: none; }


ul.aaformsRadioButtonsVertical { background-image: none; list-style-image: none; list-style-type: none; padding-left: 0px; font-size: 1.1em; }
    ul.aaformsRadioButtonsVertical li { background-image: none; list-style-image: none; list-style-type: none; font-size: 1.1em; margin-left: 0px; }
        ul.aaformsRadioButtonsVertical li input { margin-top: 0px; padding-left: 0px; }
        ul.aaformsRadioButtonsVertical li label { padding-top: 0px; }



/* Inputs */
.txt-input, textarea, .txt-input-sml, select, .txt-input-med { scrollbar-shadow-color: none; width: 26em; padding: .45em .35em; background-color: #FFFFFF; border: 1px solid #D2D2D2; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; font-size: 100%; color: #575757; }

select { border: none; outline: none; width: auto; background: transparent; border: 1px solid #d8d8d8; -webkit-appearance: none; }

.txt-input-sml { width: 5.5em; float: left; }

.txt-input-med { width: 13em; float: left; }


.ddlist { width: auto; }

textarea { height: 7em; }

    textarea.lrge { width: 43.5em; }


    input[type="text"]:focus, input[type="password"]:focus, textarea:focus { border-color: #ccc; box-shadow: 0 1px 2px #ccc; -moz-box-shadow: 0 1px 2px #ccc; -webkit-box-shadow: 0 1px 2px #ccc; }
/* Column [used for multiple inputs] */
.form-column { /*margin-left: 17.5em;*/ float: left; padding-top: 2px; }

    .form-column label,
    .form-row.inline label { width: auto; float: none; margin: 0; display: inline; font-weight: normal; padding: 0; }

    .form-column ul,
    .form-inner ul,
    .form-column ol,
    .form-inner ol { margin: 0; }

    .form-column li,
    .form-inner li { margin-bottom: .4em; background: none; padding: 0; }

        .form-column li.last,
        .form-inner li.last { margin: 0; }
    /* Horizontal List */
    .form-column .horizontal li { display: inline; margin: 0 .8em 0 0; }
    /* Workshops List */
    .form-column .workshops li { position: relative; padding-left: 22px; }

        .form-column .workshops li input { position: absolute; top: 0; left: 0; }

        .form-column .workshops li label,
        .form-column .workshops li em,
        .form-column .workshops li span { display: block; }

        .form-column .workshops li em { font-weight: bold; font-style: normal; }

.form-row li label, .form-row li input,
.form-row.inline label, .form-row.inline input { vertical-align: middle; }

/* Submit */
.submit { width: 100%; clear: both; margin-bottom: 1.5em; }

    .submit img { margin-left: 3px; }

ul.cbList { background-image: none; list-style-image: none; list-style-type: none; padding-left: 0px; display: block; }

    ul.cbList li { background-image: none; list-style-image: none; list-style-type: none; margin-left: 0px; display: block; }

        ul.cbList li input { margin-top: 0px; padding-left: 0px; float: left; clear: left; }

        ul.cbList li label { padding-top: 0px; float: left; width: 25em; font-weight: normal; }

ul.cbl { background-image: none; list-style-image: none; list-style-type: none; padding-left: 0px; display: block; }

    ul.cbl li { background-image: none; list-style-image: none; list-style-type: none; margin-left: 0px; display: block; }

        ul.cbl li input { margin-top: 0px; padding-left: 0px; float: left; clear: left; }

        ul.cbl li label { padding-top: 0px; float: left; width: 95%; font-weight: normal; }


/* [OTHER FORMS]
-------------------------------------------------------*/
/* Global Search */
#header .search { float: right; background: #f2f2f2 url("../images/template/bg-search.gif") no-repeat 0 0; padding: 2px 6px 5px 31px; position: relative; color: #767676; /* #D3D3D3 */ border-bottom-right-radius: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; margin-bottom: 33px; }

    #header .search * { vertical-align: middle; }

    #header .search a,
    #header .txt-input { color: #000; font-weight: bold; margin: 0 5px; }

#header .txt-input { border-color: #E0E0E0; margin: 0 0 0 7px; width: 142px; padding: 6px 34px 6px 10px; }

#header .btn-submit { position: absolute; top: 6px; right: 12px; }

/* used for sub headings within radion button lists */
p.listSubHeading { margin-top: 5px; margin-bottom: 2px; font-weight: bold; }

.requiredFieldIndicator { color: #ae0000; font-size: 14px; width: 20px; vertical-align: top; text-align: center; display: inline-block; float: left; padding-top: 5px; font-family: Tahoma, Verdana, sans-serif; }

.notRequiredFieldIndicator { color: #5c6776; font-size: small; width: 20px; vertical-align: top; text-align: center; display: inline-block; float: left; padding-top: 5px; }

.requiredMsg { padding: 5px 0px; color: #ae0000; }

/*adds units next to form fields */
.units { font-size: 10px; font-weight: normal; float: left; padding-left: 10px; padding-top:3px; color: #5c6776; }

.furtherInfo, .furtherInfo2 { clear: both; margin-left: 230px; font-size: 10px; padding-top: 0px; color: #5c6776; margin-bottom: 10px; }

.furtherInfo2 { margin-left: 0px; }


.highlightBox { border: 1px solid #CCCCCC; background-color: #D8F0F6; padding: 10px; margin: 10px 0px 10px 0px; }

/* ################################################################## */
/*  calendar styles */

.calendarColumn { float: left; margin-left: 10px; }

.calendarIcon { float: left; padding-top: 3px; margin-left: 5px; margin-right: 10px; width: 16px; height: 16px; }

.calendar { width: 160px; border: 1px solid gray; padding: 0; margin: 0; }

.calendarTitle { color: white; background-color: #393536; padding: 0; margin: 0; border: 0; }

.calendarNextPrevious, .calendarNextPrevious a { color: white !important; text-decoration: none; }

.calendarDayHeader { color: #333333; background-color: #A4DBEB; font-size: smaller; }

.calendarOtherMonth { color: #333333; background-color: #A5A5A5; }

.calendarDays, .calendarDays a { background-color: white; color: black !important; }

.calendarSelectedDay { font-weight: bold; background-color: CadetBlue; }

.calendarToday { border: solid 1px goldenrod; color: mediumblue !important; font-weight: bold; }

.calendarDaysDisabled, .calendarDaysDisabled a { background-color: lightgray; color: gray; text-decoration: none; }


/* ################################################################## */
/* Create two column layout inside form-inner-wrap section*/


.form-inner .columnContainer { clear: both; margin-bottom: 10px; }
    .form-inner .columnContainer .requiredFieldIndicator { float: left; padding-top: 0px; }
    .form-inner .columnContainer .columns2across { width: 310px; margin-right: 10px; float: left; padding-bottom: 5px; }
        /* .form-inner .columnContainer .columns2across label { width: auto !important; float: left; margin-right: 0.5em;  } */
        .form-inner .columnContainer .columns2across input { width: 200px; float: left; clear: both; }
        .form-inner .columnContainer .columns2across .txt-input, .form-inner .columnContainer .columns3acrossMainFirst .txt-input, .form-inner .columnContainer .columns3acrossMainChild .txt-input { width: 20em; }
        .form-inner .columnContainer .columns2across textarea { width: 23em; float: left; clear: both; margin-left: 0px; }
        .form-inner .columnContainer .columns2across .form-row .errorHandling { float: left; clear: both; }

    /* ################################################################## */
    /* Create three column layout inside form-inner-wrap section*/
    .form-inner .columnContainer .columns3across, .form-inner .columnContainer .columns3acrossMainFirst, .form-inner .columnContainer .columns3acrossMainChild, .form-inner .columnContainer .columns3acrossMainSecond { float: left; margin-right: 10px; padding-bottom: 5px; }
        .form-inner .columnContainer .columns3across:last-child, .form-inner .columnContainer .columns3acrossMainFirst:last-child, .form-inner .columnContainer .columns3acrossMainChild:last-child, .form-inner .columnContainer .columns3acrossMainSecond:last-child { margin-right: 0px; }
    .form-inner .columnContainer .columns3across { width: 187px; }
    .form-inner .columnContainer .columns3acrossMainFirst, .form-inner .columnContainer .columns3acrossMainSecond { width: 120px; }
        .form-inner .columnContainer .columns3acrossMainFirst:first-child { width: 290px; margin-right: 10px; }
        .form-inner .columnContainer .columns3acrossMainChild { width: 290px; }

.columnContainer input { clear: left; float: left; margin-top: 0px; border: 1px solid #d0d0d0; height: 16px; padding: 5px 0 5px 5px; font-size: 1.1em; }
.columnContainer select { clear: left; float: left; margin-top: 0px; border: 1px solid #d0d0d0; height: 26px; padding: 2px 0 2px 5px; font-size: 1.1em; outline: none; box-shadow: none; }
.columnContainer label { font-weight: bold; width: auto !important; float: left; margin-right: 0.5em; }


/* "add item" section */
.addItemHeaderTable, .addItemTable, .addItemFooterTable { margin: 0px; width: 590px; }
.addItemTableDescription, .addItemTableAmount, .addItemTableButtons, .addItemTableColumn { padding: 5px; color: #5c6776; vertical-align: top; border-bottom: 1px solid #aaaaaa; }
.addItemTableColumn { border-bottom: none; }
.addItemTableAmount { text-align: right; width: 60px; }
.addItemTableButtons { text-align: right !important; width: 150px; }
    .addItemTableButtons input { padding: 0px !important; float: none !important; }
.addItemTableColumn { width: 300px; margin-right: 10px; }
    .addItemTableColumn label { width: auto !important; float: left; margin-right: 0.5em; }
    .addItemTableColumn input { width: 150px; float: left; clear: both; }
    .addItemTableColumn .requiredFieldIndicator { float: left; }

    .addItemTableColumn .form-row .errorHandling { float: left; clear: both; }

.requiredMsg { padding: 5px 0px; color: #ae0000; }

.headerAddItems { padding: 5px 5px 10px 5px; color: #5c6776; font-weight: bold; font-size: 1.0em; }
.footerAddItems, .footerAddItemsTotal { border-top: 1px solid #aaaaaa; border-bottom: 1px solid #aaaaaa; padding-top: 10px; padding-bottom: 10px; color: #5c6776; font-weight: bold; font-size: 1.0em; }
.footerAddItemsTotal { text-align: right; width: 60px; }

.btnLineItem { width: 50px !important; height: 28px !important; padding: 5px; margin-left: 10px; background-color: #00A3E0; color: #FFFFFF; }
.btnAddNewItem { width: auto !important; height: 30px !important; padding: 5px; font-size: 1.0em; margin-left: 5px; background-color: #00A3E0; color: #FFFFFF; }
    .btnLineItem:hover, .btnAddNewItem:hover { color: white; background-color: #006D97; cursor: pointer; }




/* ################################################################## */
/* radio buttons - vertical list */




/* [VALIDATION]
-------------------------------------------------------*/
/* Mandatory Field Indicators */
.form-row label img, .form-lbl img, .req { margin: 0 .2em .3em .2em; }
/* Highlight Error Inputs */
.txt-input.validation-error,textarea.validation-error, .txt-input-sml.validation-error, select.validation-error, .txt-input-med.validation-error
.validation-error { background-color: #f7d9d9 !important; border-color: #ae0000 !important; color: #ae0000 !important; }

/* ################################################################## */
/* form receipt */

.formReceipt { font-family: Tahoma, Verdana, sans-serif; font-size: 12px; border-collapse: collapse; width: 600px; margin-bottom: 20px; border: 1px solid #cccccc !important; }

.formReceiptText { text-align: left; width: 300px; border: 1px solid #cccccc !important; }

.formReceiptSectionHead { background-color: #049CC9; color: #FFFFFF !important; font-weight: bold; border-collapse: collapse; padding: 5px; border: 1px solid #cccccc !important; }

td.formReceiptFieldHeader { font-weight: bold; vertical-align: top; text-align: left; width: 200px; padding: 5px; border: 1px solid #cccccc !important; }

.formReceiptText td { padding: 5px; border: 1px solid #cccccc !important; color: #5c6776; }

.formReceiptText { border: 1px solid #cccccc !important; }

/*
.formReceipt td
{
  padding: 5px;
  border-color: #666666!important;
  border: 1px solid #666666!important;
}

.formReceipt tr
{
  border-color: #666666!important;
}
*/
.tableBackground { width: 600px; }
