%@charset "UTF-8";
/* CSS Document */

/*-------------------------------------------------------------------------------------------------
HTML TAGS
-------------------------------------------------------------------------------------------------*/
a{ color: #189ce7; }
a:hover { color: #064468; }
a img {border: none; }
body { background: #eeeeee; color: #000; font: normal 0.8em Arial, Helvetica, sans-serif; margin: 0; padding: 0 0 20px; }
form { margin: 0; padding: 0; }
h1 { color: #900; font-size: 1.4em; margin: 0 0 1em; }
/*WHY??*/
p { margin: 0 0 1em; }
table { margin: 0 0 20px; padding: 0; width: 780px; }
table.definitions th { text-align: left; }
td { color: #333333; padding: 5px; }
td.tradio { text-align: center; }

/*-------------------------------------------------------------------------------------------------
MAIN PAGE LAYOUT BLOCKS
-------------------------------------------------------------------------------------------------*/
#header { background: url(/_img/banner.jpg) top left no-repeat; border-left: 1px solid #000;  border-right: 1px solid #000; height: 119px; margin: 0 auto; width: 956px;  }
#content {  background: #fff; border-bottom: 1px solid #000; border-left: 1px solid #000;  border-right: 1px solid #000; width: 796px; margin: 0 auto; padding: 30px 80px 20px; }
#progress {  background: #fff; border-bottom: 1px solid #000; border-left: 1px solid #000;  border-right: 1px solid #000; font-size: 0.9em; font-style: italic; font-weight: bold; margin: 0 auto; padding: 5px; text-align: center; width: 946px; } 
#progress img { margin-right: 5px; }
#buttons { margin: 2em 0 0; text-align: center; }
#footer {  background: #fff; border-bottom: 1px solid #000; border-left: 1px solid #000;  border-right: 1px solid #000; color: #454545; font-size: 0.8em; margin: 0 auto; padding: 5px; width: 946px; }
#footer a { color: #fff; text-decoration: none;}
p.instruction { border: 1px dotted #999; padding: 5px; font-style: italic; background-color: #ccc; }
p.error { border: 1px dotted #c00; color: #c00; padding: 5px; text-align: center; }

/*-------------------------------------------------------------------------------------------------
FORMS
-------------------------------------------------------------------------------------------------*/


div.questionframe { border-bottom: 1px solid #ccc; clear: both; margin: 0 0 15px; padding: 0 0 10px; }
div.questionframe p { font-weight: bold; }

.btnNavigation { background: #900; border: 1px solid #000; color: #fff; font-size: 1.1em; margin: 0 5px; }
.btnSave { background: #999; border: 1px solid #000; color: #fff; font-size: 1.1em; margin: 0 5px; }
.btnSubmit { background: #900; border: 1px solid #000; color: #fff; font-size: 1em; margin: 0 5px;  }

.textbox { background: #efefef; border: 1px solid #000;  } 
.fieldP90 { width: 90%; }
/* set column widths and display parameters for table keys */

td.key, td.keyleft, td.keyright { font-size: 0.95em; font-style: italic; color: #000; }
td.option { text-align: left; }
td.totals { text-align: right; }

.radio7col td.key, .radio7col td.keyleft, .radio7col td.keyright { background: #900; border-bottom: 1px solid #900; border-top: 1px solid #900; color: #fff; font-weight: bold; width: 44px; }
.radio7col td.keyleft { border-left: 1px solid #900; }
.radio7col td.keyright { background: #fff; border-right: 1px solid #900; color: #900;  }

.radio6col td.key, .radio6col td.keyleft, .radio6col td.keyright { background: #900; border-bottom: 1px solid #900; border-top: 1px solid #900; color: #fff; font-weight: bold; width: 55px; }
.radio6col td.keyleft { border-left: 1px solid #900; }
.radio6col td.keyright { background: #fff; border-right: 1px solid #900; color: #900;  }

.radio5col td.key, .radio5col td.keyleft, .radio5col td.keyright {border-bottom: 1px solid #000; border-top: 1px solid #000; width: 68px;  }
.radio5col td.keyleft { border-left: 1px solid #000; }
.radio5col td.keyright { border-right: 1px solid #000;  }


.multicol .instruction { background: #900; color: #fff; font-size: 0.95em; font-style: italic; font-weight: bold; }
.multicol td.key,  .multiselect3col td.keyleft, .multiselect3col td.keyright { font-style: normal; font-weight: bold; width: 120px; }

.futurePresent td.keyleft, .futurePresent td.keyright { font-style: normal; font-weight: bold; width: 115px; }
.futurePresent td.keyright {  }
.futurePresent td.score { width: 115px; }
.futurePresent td.first { width: 85px; background: #efe; }
.futurePresent td.last { background: #f5e5e5; }
.futurePresent .textbox { border: 1px solid #000; width: 30px; text-align: center; }
.futurePresent td.last .textbox { background: #f5e5e5; }

.scoreTrue, .scoreFalse { border: 1px solid #000; color: #fff; font-weight: bold; font-size: 1.1em; padding: 2px 10px; }
.scoreFalse { background: #c33; }
.scoreTrue { background: #3c3; }

/* multiselects appear on both pages with a 50/50 and 70/30 layout so need to adapt appearence */

.l5050 table.multiselect { width: 515px; }
.l5050 .multiselect .instruction { background: #fff; color: #000; font-size: 0.95em; font-style: italic; font-weight: normal; width: 140px; }

.l7030 table.multiselect { width: 670px; }
.l7030 table.multiselect td { text-align: left; }
.l7030 .multiselect .instruction { background: #fff; color: #000; font-size: 0.95em; font-style: italic; font-weight: normal; width: 140px; text-align: left; }

/* column constrained labels and selects appear on both pages with a 50/50 and 70/30 layout so need to adapt appearence */

.l5050 .question { float: left; margin: 0 25px 0 0; width: 370px; }
.l5050 select { border: 1px solid #000; background: #fff; float: left; width: 395px; }

.l7030 .question { float: left; margin: 0 25px 0 0; width: 515px; }
.l7030 select { border: 1px solid #000; background: #fff; float: left; width: 240px; }

.clear { height: 1px; font: 1px Arial, Helvetica, sans-serif; color: #fff; clear: both; margin: 0 0 15px 0; }
.nobr { white-space: nowrap; }
.ragged { text-align: left;}


#welcome #frmSurvey { border-top: 1px solid #999; margin: 30px 0 30px; padding: 20px 0 0; }
#welcome > #content > #frmSurvey { border-top: 1px dotted #454545;  }
#welcome #frmSurvey label { }
#welcome #frmSurvey .textbox { width: 12em; margin: 0 20px 0 5px; }
#welcome #frmSurvey .btnSubmit { margin: 0 0 0 5px; }

/* data prtection statement on the welcome page */

#welcome .disclaimer, #pstart .disclaimer { color: #999; font-size: 0.8em; }