/* Styles are labeled by color, size, weight combinations */
	
/* <STYLE TYPE="text/css"> 
<!-- 
*/

A:link { color: #333333 }
A:visited { color: #999999 }
A:hover	{ color: #666699 }
A:active { color: #666699 }


/* default text */	
	BODY {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		color: #000000;
		}		
	
	BODY, P, OL, UL, TABLE, TR, TD, PRE, BLOCKQUOTE {

		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		color: #000000;
		margin-left: 0;
		margin-right: 0;
		margin-top: 0;
	}
	
	LABEL { 
		font-weight: bold;
		color: #333366;
		}
		
	LABEL.plain {
		font-weight: normal;
		color: black;
		}
	
	LABEL.radioselected {
		font-weight: bold;
		background-color: #ffcc00;
		border: solid 1px: black;
		}
		
		
	H1 {
		font-family: trebuchet, helvetica, verdana, arial;
		color: #036;
		font-size: 160%;
		}
		
	H2 { font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 14px;
		color: #003366;	}
		
			
	/* BODY {
		background-image: url('http:\\www.workinsights.com\User\images\Backgrounds\Stripes8.jpg');
		background-repeat: repeat-x;
	} */
	
	TH {
		font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 14px;
		color: #FFFFCC;	
		background-color: #333366;
	}
	
	TR.OddRowColor {
  		background-color: #FFFFFF;
	}

	TR.EvenRowColor {
		background-color: #CCCCCC;
	}
	
	TR.TitleRowColor {
		font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 14px;
		color: #333366;
	}
	
	TD.Title {
		font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 12px;
		background-color: #333366;
		color: #FFFFCC;
		padding: 0 1em;
	}
	
	IMG {	border-width: 0px; }
	

  	/* Special text */	
	#helpText { 
		font-family: arial, helvetica, sans-serif, verdana;
		font-style: normal;
		font-weight: normal;
		font-size: 10px;
		color: #000000;
	}	

	#spellErrorText { 
		font-family: arial, helvetica, sans-serif, verdana;
		font-style: normal;
		font-weight: bold;
		font-size: 12px;
		color: #FF0000;
	}	

	/* id depreciated. use class */
	#requiredField { 
		font-family: trebuchet, verdana, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		vertical-align: bottom;
		color: #FF0000;
	}

	.requiredField { 
		font-size: 12px;
		vertical-align: bottom;
		color: #FF0000;
	}	
	
	/* depreciated - use requiredField class */
	#requiredField2 { 
		font-family: arial, helvetica, sans-serif, verdana;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;		
		color: #FF0000;
	}	
	
	#noteText { 
		font-family: arial, helvetica, sans-serif, verdana;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		color: #FF0000;
	}	

	#tipWeek {
		font-family: arial, helvetica, sans-serif;
		font-style: italic;
		font-weight: bold;
		font-size: 11px;
		color: #666666;
	}	
	
	#faq {
		font-family: arial, helvetica, sans-serif;
		font-style: italic;
		font-weight: bold;
		font-size: 13px;
		color: #666666;
	}	

	#dateTime {
		font-family: trebuchet, verdana, sans-serif;
		font-style: italic;
		font-weight: bold;
		font-size: 12px;
		color: #666666;
	}

    #copyright {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 10px;
		color: #FFFFFF;
	}

    A.headline {
		font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 16px;
	}
	
	.LinkTableHeader {
		font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 14px;
		color: #FFFFCC;	
		background-color: #333366;
	}

	#headline {
		font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 16px;
		color: #333333;
	}
	
	#SectionHeader {
		font-family: trebuchet, helvetica, verdana, arial;
		font-style: normal;
		font-weight: bold;
		font-size: 16px;
		color: #666699;
	}
	
	#Data {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 11px;
		color: #000000;
	}
	
	#Level0 {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: bold;
		font-size: 14px;
		color: #000000;
	}

	#Level1 {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 14px;
		text-indent: 10px;
		color: #336633;
	}
	
	#Level2 {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		text-indent: 20px;
		color: #003366;
	}
	
	#Level3 {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		text-indent: 30px;
		color: #990033;
	}

	/* Deprecated - use .BlueText def'n */
	#BlueHeader {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: bold;
		font-size: 12px;
		color: #333366;
	}

	.BlueHeader {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: bold;
		font-size: 12px;
		color: #333366;
	}
	
	.BlueText {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		color: #333366;
	}

	/* Deprecated - use .BlueText def'n */
	#BlueText {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		color: #333366;
	}

	#QuestionText {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		text-decoration: underline;
		font-size: 12px;
		color: #000000;
	}

	#ReturnToText {
		font-family: arial, helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		font-size: 12px;
		color: #333366;
	}
	
/* Work Hierarchy
	Added by LGN 1/20/2010 */
	
	.wh { font-family: arial; }
	
	.wh0 { 	font-size: 15px; color: #000000; }
	.wh1 { 	font-size: 14px; color: #336633; }
	.wh2 { 	font-size: 13px; color: #003366; }
	.wh3 { 	font-size: 12px; color: #990033; }
	
	TEXTAREA.wh { text-indent: 0px; padding: 0.2em; }
	INPUT.wh { text-indent: 0px; padding: 0.2em; }
	
	.whselected {		font-weight: bold; }
	
	A.whl { text-decoration: none; }
	A.whl:hover { text-decoration: underline }
	

/* Footer Style
	Added by LGN */

	A.footer:visited { color: #FFFFFF; font-size: 11px; text-decoration: none }
	A.footer:link { color: #FFFFFF; font-size: 11px; text-decoration: none } 
	A.footer:hover	{ color: #FFCC00 }
	A.footer:active { color: #FFEE33; text-decoration: underline }

	DIV.footerinfo { 
		color: #FFFFFF;
		/* buffer: 0.6em; */
		padding: 0.5em;
		font-size: 12px;
	}

	SPAN.footerhighlight { color: #FFCC00; font-weight: bold }

	A.footer2:visited { color: #FFFFFF; font-size: 11px; text-decoration: none }
	A.footer2:link { color: #FFFFFF; font-size: 11px; text-decoration: none } 
	A.footer2:hover	{ color: #FFCC00; text-decoration: underline }	
	A.footer2:active { color: #FFEE33; text-decoration: underline }

	/* Added by LGN, 10/27/2005 */

	HR { border: 0; color: #333366; background-color: #333366; height: 3px }

	A.hidden:visited { color: black; text-decoration: none }
	A.hidden:link { color: black; text-decoration: none }
	A.hidden:hover { color: #666699; text-decoration: underline }
	A.hidden:active { color: #666699; text-decoration: none }

	DIV.Highlight { background: #FFCC00; border: solid 2px #DDAA00; text-align: center }


	/* Survey, Description and Status Styles
	Added by LGN, 2/2008 */


	A.status 	{	display: block; opacity: 0.8; float: right; width: 10em; border: solid 0px blue;
				text-decoration: none; text-align: right  }
	A.status:hover { 	opacity: 1.0; text-decoration: underline }
	IMG.status 	{ vertical-align: middle; border-width: 0px; margin: 0px 2px 0px 0px; }
	SPAN.status 	{  }
	
	span.SurveyName { font-weight: bold }
	span.surveyDesc { display: block; margin-left: 5em }


/* ====@@@ Navigation @@@==== */

	DIV.backbutton { position: absolute; left: 1em; top: 100px;
				font-family: Trebuchet, verdana, arial;
				font-weight: bold;
				text-align: right;
				}
	DIV.backbutton A 		{ display: block; width: 10em; padding:0.5em;
					border: solid 1px transparent;
					background-color: #036; color: white;
					text-decoration: none;
					-moz-border-radius: 2em;
					}
	DIV.backbutton A:hover 	{ border: solid 1px black;	
					background-color: #FC0; color: #000;
					}

	
	
/* === FORM STYLES === */

	UL.formlist { 	display: block; padding: 0px; margin: 0px; }
	UL.formlist LI {	display: block; padding: 0.2em 0em 1em 0em; }
	
	
/* =====---* Feedback Messages *---===== */

	DIV.Message { 
		border: solid 2px #FFCC00; padding: 0.5em; width: 40%;
		margin: 0.5em 25% 1em 25%; text-align: center;
		border-radius: 10%; -moz-border-radius: 10%; -webkit-border-radius: 10%;
	}

	A.MessageX:visited { color: #FFCC00 }
	A.MessageX { display: block; width: 1em; border: solid 1px white;
		font-weight: bold; float: right; text-decoration: none; color: #FFCC00 }
	A.MessageX:hover { border: solid 1px #FFCC00; color: white; background: #FFCC00; }
	
	DIV.Message2 { 
		border: solid 2px #FFCC00; padding: 0.5em; width: 75%;
		margin: 0.5em 25% 1em 25%; text-align: center;
	}

	DIV.savednote {
		/*position: relative; top: -1em;*/
		padding: 0.1em 0.5em; border: solid 1px green;
		border-radius: 10%; -moz-border-radius: 10%; -webkit-border-radius: 10%;
		background-color: #BFB;
		}

/* ======== Main pages ======== */


	
	A.menu {
		display: block; padding: 0.4em 1em; width: 260px; border: solid 1px white;
	}
	A.menu:hover { background: #eef; border: solid 1px #dde; text-decoration: none; }
	
	DIV.advancedfeatures {
		padding: 1em; margin: 0.6em;
		background-color: #ddd;
		}

			
	A.stdbutton {
			display: inline-block; padding: 0.5em 1.5em; margin: 2px; border: solid 1px black;
			text-decoration: none; font-size: 12px; font-weight: bold;
			color: black; background-color: #FFCC00;
			-moz-border-radius: 1em;
			-webkit-border-radius: 1em;
			border-radius: 1em;
			}
	A.stdbutton:hover {
			border-width: 2px; margin: 1px;
			text-decoration: underline; 
			box-shadow: 3px 3px 7px #777;
			/*background-color: #FFEE33;*/
			}
	A.stdbutton:visited {
			color: black;
			}


/* Main Table
	Added 2/20/08 by LGN */
	
	TABLE.main { border: solid 1px #bbbbbb;
		background-color: #cccccc;
		border-spacing: 6px;
		color: black;
		border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
	}

	TABLE.main TR { background-color: white; }
	TABLE.main TD { border-bottom: 2px #aaaaaa solid ;
		padding: 0.5em 0.5em 0.5em 1em;
	}
	
	/* "bg" is meant to become faded into the background; useful for inactive surveys */
	TABLE.main TR.bg { background-color: #c4c4c4; }
	TABLE.main TD.bg { background-color: #c4c4c4; border-color: transparent; }
	
	TABLE.main thead { background: #aaaaaa; border-spacing: 1px; 
		border: solid 1px #bbbbbb;
		-moz-border-radius: 8px; 
		font-weight: bold;
	}
	TABLE.main tfoot { background: white; }
	
	TABLE.main TH { background: #036; 
		color: #fff;  
		
		}
		
	TABLE.main .idcol { 
		background-color: #ccc; border-color: transparent;
		}
	
	

/* ========== SURVEY LIST ========== */



	#surveylist 	{ width: 600px; }
		
	DIV.msurvey	{ display: block; padding: 10px 10px 10px 30px;
				border: solid 1px #ccc;
				border-bottom: solid 10px #ccc;
				height: 60px;
				background-color: #f6f6f6; opacity: 1;
				text-decoration: none;
				overflow: hidden; cursor: pointer }
	DIV.msurvey:hover { background-color: white;
				background-image: url('http:\\www.workinsights.com\User\images\Buttons\plus.gif');
				background-repeat: no-repeat; background-position: 10px 10px;
				text-decoration: none; }

	DIV.mselected { display: block; padding: 10px 1em 10px 30px; height: 60px;
				border: solid 1px #aaa;	border-bottom: solid 10px #eee;
				background: #fff; opacity: 1;
				text-decoration: none; }
	DIV.mselected:hover { background-color: #fff;
				background-image: url('http:\\www.workinsights.com\User\images\Buttons\minus.gif');
				background-repeat: no-repeat; background-position: 10px 10px; 
				text-decoration: none; }
	
	DIV.munselected	{ }

	.surveyname { font-family: "Trebuchet MS", Verdana, Arial; color: #003366; float: left; }
		
	.surveydesc { width: 18em; height: 2em; float: left; margin: 0em 0.5em; 
			text-decoration: none; font-size: smaller; color: black;
			}
	.surveyid	{ width: 11em; height: 3em; float: right; margin: 0em 1em 0em 5em; padding: 0px; 
			text-decoration: none; font-size: 12px; color: black;
			text-align: right; font-family: "Trebuchet MS", Verdana, Arial;
			border: solid 0px red;
			}

	DIV.surveymenu { border: solid 1px #aaa; border-top: 0px; height: 420px; border-bottom: solid 10px #aaa;
			background: #ccc; background-image: url('survey-ccc.gif');
			background-repeat: no-repeat; background-position: bottom right;
			opacity: 1; display: none; 
			overflow: auto;
			text-align: center;
			font-family: arial; font-size: 12px;
			}
	DIV.surveymenu .inside {
			margin: 20px 4em; padding: 10px 2em;
			text-align: left;
			background: white;
			-moz-border-radius: 1em;
			-webkit-border-radius: 1em;
			}

	

/* === Survey Pages === */

	.storybook {		/* overflow: auto; white-space: nowrap;*/
				width: 715px; /*height: 22em;*/ border: solid 1px black;
				background-image: url('http://www.workinsights.com/User/images/Backgrounds/Stripes8.jpg');
				background-repeat: repeat-x;
				-moz-border-radius: 10px 10px 0px 0px;
				-webkit-border-radius: 10px 10px 0px 0px;
				}
	.storybook .in	{ /*width: 180em;  border: solid 0px red; */ }
	DIV.surveypage {	border: solid 1px black; height: 16em; width: 13em; 
				padding: 1em 1em 1em 1em; margin: 1em 1em 1em 1em;
				/*white-space: normal;*/
				opacity: 0.8;
				float: left; display: block;
				background: #eee; 
				-moz-border-radius: 10px 10px 0px 10px;
				-webkit-border-radius: 10px 10px 0px 10px;
				}
	DIV.notused {		opacity: 0.3; }
	DIV.surveypage:hover { opacity: 1.0; background: white; }
	DIV.surveypage H3 {	margin: 0px 0px 1em 0px; height: 2em }
	DIV.surveypage UL {	padding-left: 1em; margin: 0.5em 0em; }



/* Pop-ups */

	DIV.popMenu { background: #CCCCCC; border: solid 2px white; padding: 0.2em 0.5em;
		position: absolute; display: none; width: 10em; }
	A.popmenuX { display: block; width: 1em; border: solid 1px white; padding: 1px; 
		font-weight: bold; float: right; text-decoration: none; }

	A.popMenu { display: block;  padding: 2px 0.5em; width: 5em;
		border: solid 1px #CCCCCC; color: #003366; }
	A.popMenu:visited { color: #003366; }
	A.popMenu:hover { text-decoration: none; border: solid 1px white; color: black; }

/*
-->
</STYLE>
*/

/* ===== REPORT PARAMS TABLE (keep similar to "main" table) ===== */

	TABLE.reportparams { background-color: #ccc; 
		border: solid 1px #bbbbbb;
		border-spacing: 6px;
		color: black;
		}

	TR.reportparamsection {   }
	TR.reportparamsection TD {
			border-top: solid 2px #aaa;
			padding: 0.1em 1em; font-weight: bold; text-align: right;
			color: #aaa; }


/* ===== Reporting Groups ===== */

	DIV.grouplistbox { 
			width: 300px; height: 12em; overflow: auto; padding: 1em; 
			border: solid 2px #bbb; border-bottom: solid 0px white;
			background-color: #ccc; color: #333;
			border-radius: 1em 1em 0em 0em; -moz-border-radius: 1em 1em 0em 0em; -webkit-border-radius: 1em 1em 0em 0em;
			opacity: 0.7;
			}
	DIV.selectedgrouplistbox {
			border: solid 2px #bbb; border-bottom: solid 0px white;
			background-color: #fff;
			position: relative; top: 4px;
			opacity: 1.0;
			}
	#workgrouplistbox { float: right; }
	#respondentgrouplistbox { float: left; }
	
	DIV.grouplistbox A {
			display: block; padding: 0.1em 1em;
			}
	DIV.grouplistbox A:hover { text-decoration: none; background-color:  #FFCC00; color: black;}
	
	DIV.grouplist { 
			border: solid 2px #bbb; padding: 2em 1em 3em 1em;
			background-color: #fff; 
			}
	
	DIV.demogroupselection { width: 45%; padding: 1em 5% 1em 0em; float: left; }
	
	DIV.demogroupselection SELECT { width: 20em; margin-top: 0.5em; padding-left: 0.5em; overflow: auto; }

/* ===== Help Section ===== */

	UL.helptagcloud { padding: 1em 0.5em; display: block; list-style-type: none; }
	UL.helptagcloud LI { display: block; padding: 0.1em 0.5em; float: left; }

	A.tag { color: blue; text-decoration: none; }
	A.tag:hover { text-decoration: underline; }

	#searchhelp { padding: 1em; background: #ccc; text-align: center;
		border: solid 1px #999;
		border-radius: 1em; -moz-border-radius: 1em; -webkit-border-radius: 1em;
		}

	A.helpeditbutton { padding: 0.5em 1em; border: solid 1px black; float: right; }

	#helplessoncontent { border-bottom: solid 1px #999999; padding: 0px 0px 1em 0px; margin: 0 0 1em 0 }

	#helplessoncontent A { color: blue; text-decoration: none; }
	#helplessoncontent A:hover { text-decoration: underline; }

	.lastupdate { float: right; color: #999999; font-style: italic; }