/* ZEROING */
body, div, dl, dt, dd, li, pre, div#loop11Panel div, div#loop11Panel dl, div#loop11Panel dt, div#loop11Panel dd, div#loop11Panel li, div#loop11Panel pre,
form, fieldset, input, textarea, p, blockquote, th, td, legend, div#loop11Panel form, div#loop11Panel fieldset, div#loop11Panel input, div#loop11Panel textarea, div#loop11Panel p, div#loop11Panel blockquote, div#loop11Panel th, div#loop11Panel td, div#loop11Panel legend { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6, div#loop11Panel h1, div#loop11Panel h2, div#loop11Panel h3, div#loop11Panel h4, div#loop11Panel h5, div#loop11Panel h6{ margin: 0; padding: 0; font-size: 100%; font-weight: normal; }
address, caption, cite, code, dfn, em, strong, var, div#loop11Panel address, div#loop11Panel caption, div#loop11Panel cite, div#loop11Panel code, div#loop11Panel dfn, div#loop11Panel em, div#loop11Panel strong, div#loop11Panel var { font-style: normal; font-weight: normal; }
ol, ul, div#loop11Panel ol, div#loop11Panel ul  { list-style: none; margin: 0; padding: 0; }
table, div#loop11Panel table { border-collapse: collapse; border-spacing: 0; } 
caption, th, div#loop11Panel caption, div#loop11Panel th { text-align: left; font-weight: normal; font-style: normal; }
acronym, abbr, fieldset, img, div#loop11Panel acronym, div#loop11Panel abbr, fdiv#loop11Panel ieldset, div#loop11Panel img { border: 0;}


.clear {clear: both; }
.null {display: none; }
.hidden {position: absolute; top: -9999px; height: 0; overflow: hidden; width: 0;}
.important {font-size: 1.5em; line-height: 1.5em; }
strong { font-weight: bold; }
em {font-style: italic; }
sup { font-size: .6em; vertical-align: 0; position: relative; bottom: 1ex; }
.imgPreview { padding-top: .5em; }

/* STRUCTURE */
/*
body                              { background: #F5F5F5 url('../images/bg_gradient.jpg') repeat-x; font-family: tahoma, arial, sans-serif; font-size: 74%; color: #3F3D24;}
*/
body                              { background-color: #F5F5F5; font-family: tahoma, arial, sans-serif; font-size: 74%; color: #3F3D24;}


div#wrapper                 { min-width: 76em; width: 76em; max-width: 100%; margin-left: auto; margin-right: auto; }
div#shadowRight         { width: 100%; background-image: url('../images/shadow_right.gif'); background-repeat: repeat-y; background-position: top right; background-color: #FFFFFF;}
div#shadowLeft           { width: 100%; background-image: url('../images/shadow_left.gif'); background-repeat: repeat-y; background-position: top left; }
div#canvasRight         { width: 100%; /* background-image: url('../images/canvas_right.jpg'); background-repeat: no-repeat; background-position: top right;  */}
div#canvasLeft           { width: 100%; /* background-image: url('../images/canvas_left.jpg'); background-repeat: no-repeat; background-position: top left;  */}
div#canvas                   { background-color: #FFFFFF; margin-left: 30px; margin-right: 30px; border-left: 1px #6D6D6D solid; border-right: 1px #6D6D6D solid; }

div#footerRight         { clear: both; width: 100%; background-image: url('../images/footer_right.gif'); background-repeat: no-repeat; background-position: top right; background-color: #F5F5F5;}
div#footerLeft           { width: 100%; background-image: url('../images/footer_left.gif'); background-repeat: no-repeat; background-position: top left; }
div#footerCanvas       { background-color: #F5F5F5; background-image: url('../images/footer_repeat.gif'); background-repeat: repeat-x; margin-left: 30px; margin-right: 30px;}
div#footerTopRight   { width: 100%; background: transparent url('../images/footer_top_right_white.gif') top right no-repeat; }
div#footerTopLeft     { width: 100%; background: transparent url('../images/footer_top_left.gif') top left no-repeat; padding-top: 18px; padding-bottom: 32px; }

div#content                 {  height: 100%; width: 100%;background-color: #FFF;}
div#maincontent         { float: left; height: 100%; }

/* GENERAL FORMATTING */
a                                     { color: #006699; text-decoration: underline; }
a:hover, a:focus, a:active { color: #003D59; text-decoration: none; }
a.popup                         { background: url('../images/popup.gif') right 3px no-repeat; padding-right: 14px; }
a.more                           { background: url('../images/arrow_lone.gif') right top no-repeat; padding: 8px 34px 8px 0; float: right; margin: 1em 0 1em 0; }
p                                    { line-height: 1.5em; margin-top: .5em; font-size: 1.2em; }
h1                                  { font-size: 2em; color: #00814D; margin-bottom: .5em; }
h2                                   { font-size: 1.35em; color: #FF6703; padding-top: .5em; padding-bottom: 0; }
h3.inset                       { padding-left: .7em; }
h3                                   { font-size: 1.35em; color: #333; padding-top: .9em; padding-bottom: 0; clear: both; }
.headingUrl                { font-size: 1em; }
div#maincontent h2    { clear: both; }
span.task { text-transform: uppercase; color: #F60; font-size: .9em; }
span.question { text-transform: uppercase; color: #00814D; font-size: .9em; }
ul.bullets { padding-top: 1em; font-size: 1.2em; }
ul.bullets li { padding-bottom: 1em; background: url('../images/bullet_small.gif') .4em .5em no-repeat; padding-left: 2em; }


/* FORMS */
/*
div.formElement { padding-top: 1em; padding-bottom: 1.5em; padding-left: .5em; float: left; width: 67em; clear: both; }
div.formSubmitButtons { margin-top: 2em; }
input.inputText { font-size: 1.3em; padding: 4px; width: 99%; border: 1px #999 solid;}
input.other { width: 60%; margin-left: 1.4em; }
input.inputFile { font-size: 1.3em; padding: 4px; width: 99%; border: 1px #999 solid;}
input.inputRange { font-size: 1.3em; padding: 4px; width: 25%; border: 1px #999 solid;}
input.inputSmall { width:65%; margin-right: .5em; }
input.inputTiny { width:2em; margin-right: .5em; }
input.buttonPlain { color: #3F3D24; background-color: #f0f0f0; border: 1px #999 solid; font-size: 1em; padding: 4px; }
textarea.inputTextarea { font-family: tahoma, arial, sans-serif; line-height: 1.5em; font-size: 1.3em; padding: 4px; width: 99%; border: 1px #999 solid; }
input.inputRadio, input.inputCheckbox { line-height: 1.5em; float: left; clear: left; margin-top: 5px;  }
label.labelRadio, label.labelCheckbox { line-height: 1.5em; float: left; padding: 4px 0 0 8px; width: 86%;}
select { font-size: 1.3em; padding: 4px; width: 102%; border: 1px #999 solid; }
select.selectExpiry{ font-size: 1.3em; padding: 4px; width: 30%; border: 1px #999 solid;}
select.selectUpdate { width: 80%; }
div.formLabel { float: left; width: 99% }
div.formLabel label { float: left; color: #006C41; font-size: 1.3em; width: 99%; }
div.formField { float: left; padding-top: 4px; clear: left; width: 99%; }
div.formField form { float: right; clear: none; padding: 0; margin: 0; }
fieldset { float: left; clear: left; width: 99%; }
fieldset div.formField { width: 99%; }
fieldset.fieldsetInset { padding-left: 20px; margin-top: 0; width: 45%; }
fieldset.fieldsetInset label { width: 99%; margin-top: .75em; font-size: 1.1em; line-height: 1.5em;}
fieldset.fieldsetInset input.inputText { width: 99%; }
fieldset.fieldsetInset select { width: 102%; }
fieldset.fieldsetInset div.formField { width: 90%; }
legend {  margin-bottom: 0; margin-top: 0; color: #006C41; font-size: 1.3em; width: 99%; }
fieldset.fieldsetInset legend { float: left; margin-bottom: 4px; margin-top: 1em; color: #F60; font-size: 1.3em; }
div.formHelp { font-size: .95em; margin-left: 52%; width: 46%; }
div.formHelp p { margin-top: 0; margin-bottom: .3em; }
div.formHelp img { margin-right: 16px; }
div.formHelp li { line-height: 1.5em; }
div.formError { width: 99%; color: #E00; font-size: 1.3em; padding-bottom: 4px; float: left; }
div.formError span { width: 99%; float: left; }
div.formRequired { color: #F60; }
input.add { margin-top: 3px; background: #f0f0f0 url('../images/add.gif') 5px 6px no-repeat; padding-left: 16px; }
input.remove{ background: #f0f0f0 url('../images/remove.gif') 6px 7px no-repeat; padding-left: 16px; }

div.ranking fieldset div.formField { width: 6em;  }
div.ranking div.formField { clear: none; font-size: 1em; padding-top: 2em; width: 6em; float: left; text-align: center; }
div.ranking div.formField input { font-size: 1em; text-align: center; padding: 0; margin: 0 0 0 2.5em;}
div.ranking div.formField label { font-size: 1em; width: 6em; float: left; text-align: center; padding: 0; margin: 0; padding-top: .5em; }

div.matrixRankings div {float: left; width: 6em;  }
div.matrixRankings { padding-left: 10.5em; padding-top: 1em; }

div.matrix div.formField {  float: left; clear: none; }
div.matrix fieldset { padding-left: 10em; width: 80%; }
div.matrix legend { margin-left: -7em; width: 50%; }
div.matrix div.formField { padding: 0; margin: 0;}
div.matrix input { clear: none; float: left; }

div.multiline div.formLabel { padding-top: 1em; }

span.rankNumber { width: 6em; text-align: center; float: left; }
span.rankDescription { clear: both; text-align: center; width: 6em; float: left; }
*/
div.formElement { padding-top: 1em; padding-bottom: 1.5em; padding-left: .5em; float: left; width: 99%; clear: both; }
div.formSubmitButtons { margin-top: 2em; }
input.inputText { font-size: 1.3em; padding: 4px; width: 99%; border: 1px #999 solid;}
input.inputFile { font-size: 1.3em; padding: 4px; width: 99%; border: 1px #999 solid;}
input.inputRange { font-size: 1.3em; padding: 4px; width: 25%; border: 1px #999 solid;}
input.inputSmall { width:65%; margin-right: .5em; }
input.inputTiny { width:2em; margin-right: .5em; }
input.buttonPlain { color: #3F3D24; background-color: #f0f0f0; border: 1px #999 solid; font-size: 1em; padding: 4px; }
input.buttonClear { float: left; clear: left; margin-top: .5em;}
textarea.inputTextarea { font-family: tahoma, arial, sans-serif; line-height: 1.5em; font-size: 1.3em; padding: 4px; width: 99%; border: 1px #999 solid; }
input.inputRadio, input.inputCheckbox { line-height: 1.5em; float: left; clear: left; margin-top: 7px;  }
label.labelRadio span, label.labelCheckbox span { line-height: 1.5em; float: left; padding: 4px 0 0 8px; width: 86%;}
label.labelRadio span.hidden,  label.labelCheckbox span.hidden {position: absolute; top: -9999px; height: 0; overflow: hidden; width: 0;}
select { font-size: 1.3em; padding: 4px; width: 102%; border: 1px #999 solid; }
select.selectExpiry{ font-size: 1.3em; padding: 4px; width: 30%; border: 1px #999 solid;}
select.selectUpdate { width: 80%; }
div.formLabel { float: left; width: 99% }
div.formLabel label { float: left; color: #006C41; font-size: 1.3em; width: 46%;}
div.formField { float: left; padding-top: 4px; clear: left; width: 46%; }
div.formField form { float: right; clear: none; padding: 0; margin: 0; }
fieldset { float: left; clear: left; width: 46%; }
fieldset div.formField { width: 99%; }
fieldset.fieldsetInset { padding-left: 20px; margin-top: 0; width: 45%; }
fieldset.fieldsetInset label { width: 99%; margin-top: .75em; font-size: 1.1em; line-height: 1.5em;}
fieldset.fieldsetInset input.inputText { width: 99%; }
fieldset.fieldsetInset select { width: 102%; }
fieldset.fieldsetInset div.formField { width: 90%; }

fieldset {width:45em;}
legend {float: left; margin-bottom: 0; margin-top: 0; color: #006C41; font-size: 1.3em; white-space: normal;}
legend span { display: block; width: 45em; }
fieldset.fieldsetInset legend { float: left; margin-bottom: 4px; margin-top: 1em; color: #F60; font-size: 1.3em; }
div.formHelp { font-size: .95em; margin-left: 52%; width: 46%; }
div.formHelp p { margin-top: 0; margin-bottom: .3em; }
div.formHelp img { margin-right: 16px; }
div.formHelp li { line-height: 1.5em; }
div.formError { width: 99%; color: #E00; font-size: 1.3em; padding-bottom: 4px; float: left; }
div.formError span { width: 46%; float: left; }
div.formRequired { color: #F60; }
input.add { margin-top: 3px; background: #f0f0f0 url('../images/add.gif') 5px 6px no-repeat; padding-left: 16px; }
input.remove{ background: #f0f0f0 url('../images/remove.gif') 6px 7px no-repeat; padding-left: 16px; }
ol.formOptions { float: left; width: 100%; }
ol.formOptions li { float: left; width: 100%; padding-top: .3em; }

div.ranking fieldset { width: 100%; }
div.ranking fieldset div.formField li { width: 6em;  }
div.ranking div.formField li { clear: none; font-size: 1em; padding-top: 1em; width: 6em; float: left; text-align: center; }
div.ranking div.formField input { font-size: 1em; text-align: center; padding: 0; margin: 0 0 0 2.7em;}
div.ranking div.formField label { font-size: 1em; width: 6em; float: left; text-align: center; padding: 0; margin: 0; padding-top: .5em; }

div.matrixRankings div {float: left; width: 6em;  }
div.matrixRankings { padding-left: 10.8em; padding-top: 1em; }

div.matrix div.formField {  float: left; clear: none; }
div.matrix fieldset { padding-left: 10em; width: 80%; }
div.matrix legend { margin-left: -7em; width: 50%; }
div.matrix div.formField { padding: 0; margin: 0;}
div.matrix input { clear: none; float: left; }
div.matrix div.formField li { padding-top: 0; }

div.multiline div.formLabel { padding-top: 1em; }

span.rankNumber { width: 6em; text-align: center; float: left; }
span.rankDescription { clear: both; text-align: center; width: 6em; float: left; }











div.buttonBackground { float: right; margin-left: 10px; clear: none; background-image: url('../images/button_right.gif'); background-position: right top;  background-repeat: no-repeat; height: 41px; }
div.buttonBackground div { background: transparent url('../images/button_left.gif') 0 0 no-repeat;  height: 41px;  }
div.buttonBackground input { font-family: verdana, arial, sans-serif; color: #333; margin: 0; padding-bottom: 6px; padding-left: 8px; padding-right: 40px; background-color: transparent; border: 0; font-size: 1.4em;  background-image: url('../images/button_arrow.gif'); background-repeat: no-repeat;  background-position: right 6px; text-align: left; height:41px;}
div.buttonBackground input:hover, div.buttonBackground input:focus , div.buttonBackground input:active  { cursor: pointer; color: #FF6600; background-position: right -66px; }
div.buttonBackground input.inputBack { padding-left: 40px; padding-right: 8px; background-image: url('../images/button_arrow_back.gif'); background-repeat: no-repeat;  background-position: left 6px; text-align: left; }
div.buttonBackground input.inputBack:hover, div.buttonBackground input.inputBack:focus , div.buttonBackground input.inputBack:active { background-position: left -66px; }

div.buttonOn { background-image: url('../images/highlight_right.gif'); }
div.buttonOn div{ background-image: url('../images/highlight_left.gif'); }
div.buttonOn input { color: #FFF; font-weight: bold; }
div.buttonOn input:hover, div.buttonOn input:active, div.buttonOn input:focus { color: #FFF; text-decoration: underline; }

div.buttonBackground input.disabled { cursor: default; color: #666; background-image: url('../images/button_arrow_disabled.gif'); }
div.buttonBackground input.disabled:hover, div.buttonBackground input.disabled:focus, div.buttonBackground input.disabled:active { background-position: right 6px; }

/* FAUX BUTTONS (LINKS */
div.buttonFauxHighlight { float: right; width: auto; display: block; position: relative; background-color: #FF7920; background-image: url('../images/highlight_right.gif'); background-position: right top; background-repeat: no-repeat; height: 41px; }
div.buttonFauxHighlight div { background: transparent url('../images/highlight_left.gif') 0 0 no-repeat; height: 41px; }
div.buttonFauxHighlight a { width: auto; display: block; background: url('../images/button_arrow_special.gif') right 6px no-repeat; padding-right: 44px; color: #FFF; text-decoration: none; font-weight: bold; display: block; font-family: verdana, arial, sans-serif; padding-left: 8px; padding-top: 8px; font-size: 1.4em; text-align: left; height:31px;}
div.buttonFauxHighlight a:hover, div.buttonBackground a:focus , div.buttonBackground a:active  { color: #FFF; text-decoration: underline; background-position: right -66px; }

div.buttonFaux { float: right; position: relative; background-color: #CCCCCC; background-image: url('../images/button_right.gif'); background-position: right top; background-repeat: no-repeat; height: 41px; }
div.buttonFaux div { background: transparent url('../images/button_left.gif') 0 0 no-repeat; height: 41px;  }
div.buttonFaux a { padding-right: 44px; color: #333; text-decoration: none; display: block; font-family: verdana, arial, sans-serif; padding-left: 8px; padding-top: 10px; font-size: 1.4em; background-image: url('../images/button_arrow.gif'); background-repeat: no-repeat;  background-position: right 6px;text-align: left; height:31px;}
div.buttonFaux a:hover, div.buttonFaux a:focus , div.buttonFaux a:active  { color: #FF6600; text-decoration: none; background-position: right -66px; }

div.buttonPreview { margin-bottom: 18px; margin-top: 1px; position: relative; background-color: #CCCCCC; background-image: url('../images/nav2_r_long.gif'); background-position: right top; width: 99%; background-repeat: no-repeat; height: 50px; }
div.buttonPreview div { background: transparent url('../images/nav2_l.gif') 0 0 no-repeat; width: 100%; height: 50px;  }
div.buttonPreview a { color: #333; text-decoration: none; display: block; font-family: verdana, arial, sans-serif; padding-left: 8px; padding-top: 13px; font-size: 1.4em; width: 95%; background-image: url('../images/button_preview.gif'); background-repeat: no-repeat;  background-position: right 10px;text-align: left; height:31px;}
div.buttonPreview a:hover, div.buttonPreview a:focus , div.buttonPreview a:active  { color: #FF6600; text-decoration: none; background-position: right -62px; }


/* HEADER */
div#header                   { width: 100%; height: 72px; position: relative; background: #008650 url('../images/header_tile_small.jpg') repeat-x; }
div#header h1               { width: auto; float: left; padding: 0; margin: 0; border: 0; }
div#header.question { height: auto; padding-bottom: 12px; }

/* MAIN CONTENT */
div#maincontent div.panel { clear: both; padding-left: 18px; padding-top: 18px; padding-right: 18px; padding-bottom: 20px; width: 68em; }
div#maincontent img#customLogo { float: right; padding: 3px; margin: 0 0 16px 24px; border: 1px #CCC solid;  }


div#taskPercent { float: right; font-family: tahoma, sans-serif; color: #FFF; text-align: center; padding: 14px 1em 0 .3em; }
div#taskPercent span.percentage { font-family: tahoma, sans-serif; color: #FFF; font-size: 1.8em; float: left; width: 2.4em; text-align: center;}
div#taskPercent span.complete { font-family: tahoma, sans-serif; color: #FFF; font-size: .8em; width: 5em; text-align: center; float: left; clear: left;}



/* FOOTER */
div#footerCanvas {text-align: center; }
div#footerCanvas ul li { display: inline; padding: 1em; }
div#footerCanvas ul li.on { font-weight: bold; }
div#footerCanvas a { text-decoration: underline; color: #666; }
div#footerCanvas a:hover,
div#footerCanvas a:active,
div#footerCanvas a:focus { text-decoration: none; color: #333; }