
html {
   background-color: #A7A7A7;
}

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: smaller;
   margin: 8px 0 0 0;
}

#container {
	width: 760px;
	margin: auto;
	padding: 0;
	text-align: left;
   background-color: white;   
}

#header {
	margin: 0 0 0 0;    /* top right bottom left */
   background-image: url(images/header.jpg);
   height: 47px;
}

#nav {   /* survey navigation: back, next */
   margin-top: 15px;
}

#start { }

#footer {   /* styling for footer... margins, padding, border */
   background-color: #CFCFCF;
	margin: 0 0 0px 0;
   text-align: left;
	padding: 8px 10px;
	clear: both;
   font-size: smaller;
}

h3 {
   font-size: 1.4em;
}

ul { }

   ul li {
      list-style: disc;
      margin: 4px 0 4px 30px;
   }



/* ----------------------------- FORM / PAGE CONTENT -----------------------------*/

form {

	margin: 0;
	padding: 5px 15px 15px 15px;
}

table {
	border: 0;		      /* border = 0 */
	border-spacing: 0;	/* cellspacing = 0 */
	padding: 0;		      /* cellpadding = 0 */
}

em {
   font-style: italic;
}

strong {
   font-weight: bold;
}
	
p {
	margin: 13px 0;
   line-height: 1.4em;
}

p.question {
	font-weight: bold;
}

p.DevelopersBox {
	background-color: pink;
	padding: 6px;
}

p.error {
	font-weight: bold;
	line-height: 1.4em;
   color: red;
}

p.warning {
   font-weight: bold;
}

span.highlight {	/* highlighted text, use this instead of blue/red text :) */
	background-color: #D1E4EF;	
	padding: 2px 4px;
	line-height: 1.5em;
}

span.small {
   font-size: smaller;
}

/* ----------------------------- RADIO/CHECKBOX  -----------------------------*/

div#container form table tr.ans:hover {
   background-color: #e3e3e3;
}

td.radio {
   vertical-align: top; 
   padding: .38em 0 0 .4em;
}

td.checkbox {
   vertical-align: top;
   padding: .38em 0 0 .4em;         
}

td.checkboxMIDDLE {
   vertical-align: middle;
   padding: 0 0 0 .4em;
}

label {
   display: block;
   padding: 3px 5px 3px 5px;
   margin: 0;
}

input.openend {
   padding: .15em .2em;
}
      
tr.other td {
   vertical-align: middle;
   padding-top: 0;
   padding-bottom: 0;
}

   tr.other label {
      float: left;
      vertical-align: top;
      padding: .45em 3px .45em 5px;
   }

   tr.other input.openend {
      margin: .15em;
   }
   
/* ----------------------------- DROP DOWN  -----------------------------*/

select {
   font-size: 1em;
   padding: 2px;
}
   
/* ----------------------------- XB  -----------------------------*/
						    
tr.alt {
	background-color: #e3e3e3;
}
	
table.XB { }

table.XB tr.XBRow { }

table.XB td.XBRadio {		                  /* td containing the radio buttons */
	height: 25px;
	border-bottom: 1px solid silver;
	text-align: center;
}

   td.RadioH  {                   /* TD highlight when clicked (JS) */
      background-color: #9BB9CF;
   }
	
div#container table.XB tr.XBRow td.XBRadio:hover {	/* highlight when hovering over an x5b-radio td */
	background-color: #CED7DE;
}

table.XB td.XBHeader {                       /* td containing the column labels */
	text-align: center;
	line-height: 1.2em;
	padding: 1px 4px 3px 4px;
	background-color: #efefef;
}

table.XB td.XBHeaderS {                      /* td containing the column labels */
	text-align: center;
	line-height: 1.2em;
   font-size: smaller;
	padding: 1px 4px 3px 4px;
	background-color: #efefef;
}

table.XB td.XBText {                            /* column cell containing text, no adio button */
   padding: 2px 4px 2px 4px;
   border-bottom: 1px solid silver;
   text-align: center;
}

td.XBQuestion {
   border-bottom: 1px solid silver;
	padding: 2px 0 2px 4px;
}

dt {
   font-weight: bold;
}

dd {
   margin: 3px 0px 6px 25px;
}


	
table.x5b {

}

td.x5b-label {		/* each "answer" - left-most column */
	border-bottom: 1px solid silver;
	padding: 2px 0 2px 4px;
}



td.error {
	color:#FF0000;
}

div.progress {
	padding-right: 15px;
	float: right;
}

/* ----------------------------------------- MAXDIFF STYLES */

table#MaxDiff {
   border-collapse: collapse;
   margin: 0 auto 10px auto;
   
}

   table#MaxDiff thead tr td {
      text-align: center;
      padding: 3px 15px;
      font-weight: bold;
   }
   
   div#container table#MaxDiff tr td.MDRadio:hover {	/* highlight when hovering over an x5b-radio td */
	   background-color: #CED7DE;
   }
   
   table#MaxDiff tr.MDRow td {
   	border-bottom: 1px solid silver;
      text-align: center;
      height: 25px;
      padding-left: 10px;
      padding-right: 10px;
   }
   
   table#MaxDiff td.MDRadio {
      vertical-align: middle;
      padding: 0;
   }
   
   table#MaxDiff td.MDRadioH {
      background-color: #9BB9CF;
      vertical-align: middle;
      padding: 0;
   }

   span.QCount {
      display: block;
      margin: 10px 0 15px 18px;
   }
