/* CSS Document */

html	{height:100%;}

body {
background:#e9ecea;
font-family: Arial, Helvetica, sans-serif;
color: #333;
margin:0;
padding:0;
text-align: left;
}

p, div, ul, ol, li, h1, h2, h3, h4, h5 {margin-top: 0px;}
p, li {font-size:12px;}
img a {border:0;}
sup   {line-height:0;}

h1, h2, h3, h4, h5 	{font-weight:normal; padding:0; margin:0; font-family:Arial, Helvetica, sans-serif;}

p	{}

a:link,  a	{color:#005a8b; text-decoration:none;}
a:hover		{color:#005a8b}
a:active	{color:#005a8b}
a:visited	{color:#005a8b}

.clear	{clear:both; margin:0; padding:0;}

fieldset {height:auto; width:auto; border:0px; border:none; margin:0; padding:0;}


#container {width:960px; margin:18px auto; position:relative; z-index: 50; }

#header {position:relative; height:70px; z-index: 40; }	
	#logo {display:block; width:363px; height:68px; background:url(../images/css/logo.gif) left top no-repeat; text-indent:-9999px; position:absolute; z-index:1; top:0; left:0;}
	#survey_progress {float:right; font-size:8px; text-transform:uppercase; line-height:8px; padding-top:58px;}
		#survey_progress span {display:block; float:left; border-left:2px solid #e9ecea; position:relative; font-family: Arial;}
			#survey_progress span.start {border:0; padding-right:5px; top:-1px;}
				#survey_progress span a {color: inherit;}
			#survey_progress span.finish {border:0; padding-left:5px; top:-1px;}
			#survey_progress span.complete {border-right:24px solid #d2713a; width:0px; height:6px;}
			#survey_progress span.incomplete {border-right:24px solid #e2c7b5; width:0px; height:4px; top:2px;} 
		

/* welcome */
#banner {height:255px; width:965px; background:url(../images/welcome-to.jpg) left top no-repeat; position:absolute; top:71px; left:0px; z-index: 1; }
#banner h1, #banner h2 {text-indent:-9999px;}

#welcome #header h1 {position:absolute; top:0; left:375px; text-indent:-999em; background:url(../images/css/txt_survey.gif) left top no-repeat; width:329px; height:37px; padding:0; margin:0;}

#content {clear:both; padding-top:255px;}
	#left_col {float:left; width:290px; margin-top:25px; padding:18px 10px; border-top:5px solid #4d70b8;}
	#welcome #left_col h3 {font-size:20px; line-height:27px; color:#4d70b8; padding-bottom:27px;}
	#welcome #left_col a {font-size:20px; line-height:27px; color:#d2713a;}
	#right_col {float:left; width:600px; padding:20px 0 100px 20px;}
		#right_col p {color:#333; font-size:16px; line-height:22.4px; width:545px; margin:0; padding:0 0 16px;}
		#right_col h4 {text-indent:-9999px; width:573px; height:38px; background:url(../images/css/txt_core.gif) left top no-repeat; margin-top:0px;}
		#right_col ol {margin:0; padding:0; list-style-position:inside;}
		#right_col li {margin:0; padding:8px 0 0 3px; font-size:12px; line-height:normal; font-weight:bold;}
			#right_col li span {font-weight:normal; color:#000; }
/* end welcome */

/* membership */
#membership #banner {height:67px; background-image:url(../images/membership.jpg);}
#membership #content {padding-top:67px;}
#membership #header h1 {position:absolute; top:0; left:375px; text-indent:-999em; background:url(../images/css/txt_survey.gif) left top no-repeat; width:329px; height:37px; padding:0; margin:0;}
#membership h2, #show_results h2 {border-top:5px solid #4d70b8; color:#4d70b8; font-size:20px; line-height:27px;}
#membership h3 {color:#fff; font-size:14px; font-weight:bold; line-height:24px; background:#4d70b8; padding-left:10px;}
	#membership #left_col {float:left; width:230px; margin:0; padding:46px 20px 0 0; border-top:0;}
	
	#membership #left_col div.gradient {padding:4px 10px 0 10px; background:url(../images/css/bg_gradient.jpg) left top no-repeat;}
		#membership #left_col div.gradient-closed {}
		#membership #left_col .hide {display:none;}
		#membership #left_col .show {display:block;}
	#membership #left_col p {font-family:Verdana, Arial, Helvetica, sans-serif; color:#333; font-size:10px; line-height:15px; margin:0; padding:0 0 8px;}
		#membership #left_col p.last {padding:0;}
	#membership #left_col a {color:#333; font-weight:bold;}
		#membership #left_col p.close a {margin:0; padding:0;}
	#membership #right_col {padding:45px 0 0; width:710px;}
		a.login {display:block; width:122px; line-height:18px; font-size:10px; padding:0 2px 2px 0; background:url(../images/css/btn_login.gif) left top no-repeat; color:#fff; font-weight:bold; text-align:center; margin-bottom:7px;}

		#membership #right_col p {color:#333; font-size:12px; line-height:17px; width:610px; margin:0; padding:18px 0 0;}
		#membership #right_col li {font-weight:normal; line-height:normal; padding:3px 0 0; margin:0;}
		
		#membership form {border-top:1px solid #4d70b8; padding:15px 0; margin-top:8px;}
			#membership #right_col form ul {margin:0; padding:0; list-style:none;}
			#membership #right_col form li {float:left; margin:0; padding:0 0 6px; list-style:none;}
				#membership #right_col form li.begintextinput {padding-top:23px;}
				#membership #right_col form li.checkbox {padding-left:230px; padding-top:20px;}
				#membership #right_col form li.btn {padding-left:230px; padding-top:20px;}
			#membership form label {display:block; float:left; width:220px; padding:0 10px 0 0; text-align:right; font-size:12px; color:#333; }
			#membership form li.checkbox label {width:290px; padding:0 0 0 5px; text-align:left;}
			#membership form select {display:none;}
			#membership form .select_field {
				float:left; 
				width:295px;
				height:18px; 
				border:1px solid #999; 
				color:#999; 
				font-size:12px; 
				line-height:18px; 
				position:relative; 
				background:#fff url(../images/css/bg_select.gif) right top no-repeat;
				cursor:pointer;
			}
			#membership #right_col form .select_field p {margin:0; padding:0 0 0 5px; width:auto; line-height:18px; font-size:12px;}
			#membership form .select_field div {
				position:absolute;
				left:-1px;
				display:none;
				background:#fff;
				width:295px;
				border:1px solid #999;
				border-top:0;
				z-index:2;
			}
			#membership form .select_field div span {
				display:block;
				line-height:21px;
				font-size:12px;
				padding:0 0 0 5px;
			}
			#membership form .select_field div span.selected {
				background:#ccc;
			}
			#membership form .select_field div span:hover {
				background:#829bcd
			}
			#membership form input {
				float:left; 
				width:290px; 
				padding:0 0 0 5px;
				height:18px; 
				border:1px solid #999; 
				color:#333; 
				font-size:12px; 
				line-height:18px;
			}
			#membership #news {width:auto; padding:0; border:0;}
			#membership #submit {display:block; width:298px; height:20px; font-size:10px; padding:0 6px 4px 0; background:url(../images/css/bg_submit.gif) left top no-repeat; color:#fff; font-weight:normal; text-align:right; text-transform:uppercase; border:0; cursor:pointer}
			#membership #nothanks {display:block; width:290px; height:18px; font-size:10px; padding:4px 8px 2px 0; color:#999; font-weight:normal; text-align:right; text-transform:uppercase; float:left;}
/* end membership */



/* survey step colors - used on welcome, survey, and results pages */
.b1 {background-color:#6281ad;} .s1 tr.number td, td .b1 {border-top:1px solid #6281ad;} .c1 {color:#6281ad;}
.b2 {background-color:#96ab60;} .s2 tr.number td, td .b2 {border-top:1px solid #96ab60;} .c2 {color:#96ab60;}
.b3 {background-color:#b15f56;} .s3 tr.number td, td .b3 {border-top:1px solid #b15f56;} .c3 {color:#b15f56;}
.b4 {background-color:#826e99;} .s4 tr.number td, td .b4 {border-top:1px solid #826e99;} .c4 {color:#826e99;}
.b5 {background-color:#ec903f;} .s5 tr.number td, td .b5 {border-top:1px solid #ec903f;} .c5 {color:#ec903f;}
.b6 {background-color:#b3aa7f;} .s6 tr.number td, td .b6 {border-top:1px solid #b3aa7f;} .c6 {color:#b3aa7f;}
.b7 {background-color:#6ba6b9;} .s7 tr.number td, td .b7 {border-top:1px solid #6ba6b9;} .c7 {color:#6ba6b9;}

/* lighter variation of color */
.s1 h3 {background-color:#C0CDDE;} .s1 td {border-color:#C0CDDE;}
.s2 h3 {background-color:#D5DDBF;} .s2 td {border-color:#D5DDBF;}
.s3 h3 {background-color:#E0BFBB;} .s3 td {border-color:#E0BFBB;}
.s4 h3 {background-color:#CDC5D6;} .s4 td {border-color:#CDC5D6;}
.s5 h3 {background-color:#F7D3B2;} .s5 td {border-color:#F7D3B2;}
.s6 h3 {background-color:#E1DDCC;} .s6 td {border-color:#E1DDCC;}
.s7 h3 {background-color:#C4DBE3;} .s7 td {border-color:#C4DBE3;}

td.noborder {border: 0;}
/* end survey step colors */




/* survey */
body#survey {font-family:Verdana, Arial, Helvetica, sans-serif;}
#survey h1,#survey h2,#survey h3,#survey h4,#survey h5 	{font-family:Verdana, Arial, Helvetica, sans-serif;}
#survey #header h1 {position:absolute; top:0; left:375px; text-indent:-999em; background:url(../images/css/txt_survey.gif) left top no-repeat; width:329px; height:37px; padding:0; margin:0;}
#survey #underlogohelp {color: #103a8d; font-size: 10px; font-weight: bold; z-index: 2; position: absolute; top: 50px; left: 95px; }
#survey #content {padding-top:3px;}
#survey #survey-submit-button {float: right; margin: 0 10px 10px 0;}

#survey h2 .click-to-start {float: right; margin-right: 20px; font-size: 10px; text-transform: uppercase; font-weight: normal;}
#survey h2 {height:36px; line-height:36px; padding-left:64px; color:#fff; font-size:16px; font-weight:bold; cursor:pointer}
	#survey h2 span {opacity:.6; filter:alpha(opacity=60);}
		#survey h2.active span {opacity:1; filter:alpha(opacity=100);}
	
	#survey .step {display:none; background-color:#fff; padding:0 0 0px;}
		#survey .open {display:block;}
		.step h3 {font-weight:bold; font-size:12px; color:#333; line-height:24px; padding:0 18px; /*opacity:.4; filter:alpha(opacity=40);*/}		
		
	.step table {margin:0 18px; padding:0; border:0; color:#666;}
		th {padding:10px 0; margin:0; border:0; font-weight:bold; font-size:12px; text-align: left;}
		td {padding:10px 0; margin:0; border:0; font-size:11px; line-height:13px; vertical-align:top; border-top:1px solid;}
			td td {border:0;}
		td ol {margin:0; padding:0 0 0 23px;}
		td li {margin:0; padding:0; font-size:11px;}
			td.statement li {margin:0 0 0 0;}
			td.principle ol {width:105px;}
		td ul {margin:0; padding:0 0 0 23px;}
		td ul li {margin:0; padding:3px 0;}
		td ul {list-style:none; margin:0; padding:0;}
		td ol ul li {margin:0; padding:3px 0 3px 10px;}
		
		.step tr.top td {border:0;}
		.step td.principle {width:155px;}
		.step td.statement {padding-right:15px; width:355px;}
		.step td.fill {width:75px; text-align:center; /*background:url(../images/css/circle.gif) center 27px no-repeat; padding-bottom:36px;*/}
			.step td.wide {width:auto; text-align:left; vertical-align:middle; /*background-position:7px top; padding:5px 0 12px 42px;*/ padding:5px 0 12px 10px;}
			.step td.fill input {/*display:none;*/ display:block; margin:10px auto 0 auto; }
				.step td.two-lines input {/*background-position:center 40px;*/ position:relative; top:13px;}
				.step td.wide input {display:inline; margin:0 5px 0 0; position:relative; top:2px;}
			.step td.checked {font-weight:bold;}
/* end survey */			
		
/* results */
body#results {font-family:Verdana, Arial, Helvetica, sans-serif;}
#results h1,#results h2,#results h3,#results h4,#results h5 	{font-family:Verdana, Arial, Helvetica, sans-serif;}
#results #header h1 {position:absolute; top:0; left:375px; text-indent:-999em; background:url(../images/css/txt_results.gif) left top no-repeat; width:337px; height:37px; padding:0; margin:0;}
#results #content {padding-top:14px; padding-bottom:100px;}

#results #left_col {width:730px; padding:0; margin:0; border:0;}
#results #right_col {width:225px; padding:0; margin:0;}
#results #left_col h2 {padding:10px 0 0 92px; margin:0; background:none; border:0; font-size:16px; color:#4773a2;}
#results #left_col p {padding:5px 0 20px 92px; margin:0; font-size:12px; line-height:16px; color:#666; width:auto;}
#results #right_col h2 {padding:0; margin:0; background:none; border:0; font-size:16px; color:#4773a2; font-weight:bold;}
#results #right_col p {padding:16px 0 0; margin:0; font-size:12px; line-height:16px; color:#666; width:auto;}
#results #right_col a {text-decoration:underline;}
#results #survey {display:none;}
#results #principles-text {display:none;}

#results .principles-text-1 {border: 1px solid #6281ad; padding: 5px; margin-bottom: 10px;}
#results .principles-text-2 {border: 1px solid #96ab60; padding: 5px; margin-bottom: 10px;}
#results .principles-text-3 {border: 1px solid #b15f56; padding: 5px; margin-bottom: 10px;}
#results .principles-text-4 {border: 1px solid #826e99; padding: 5px; margin-bottom: 10px;}
#results .principles-text-5 {border: 1px solid #ec903f; padding: 5px; margin-bottom: 10px;}
#results .principles-text-6 {border: 1px solid #b3aa7f; padding: 5px; margin-bottom: 10px;}
#results .principles-text-7 {border: 1px solid #6ba6b9; padding: 5px; margin-bottom: 10px;}

#results #below-graph-area {width:702px;}

#results #left_col a.btn {display:block; margin-left:92px; text-indent:-9999px; width:67px; height:33px;}
	#results #left_col a#print {background:url(../images/css/btn_print.gif) left top no-repeat;}
	#results #left_col a#email {background:url(../images/css/btn_email.gif) left top no-repeat;}

#graph {width:702px; background:url(../images/css/bg_graph.jpg) left top no-repeat; padding-top:12px;}
#graph tr, #graph td {border:0; padding:0; margin:0; font-family:Arial, Helvetica, sans-serif;}
#graph tr.graph td.range {border-right:1px solid #909090; padding-right:5px; color:#666; text-align:right;}
#graph tr.graph td.range td {text-align:right; vertical-align:top;}
#graph tr.graph td {text-align:center; vertical-align:bottom;}
	#graph tr.graph td div {width:72px; height:0px; margin:0 auto;}
#graph tr.key td {border-top:1px solid #909090; text-align:center; color:#666; padding-top:10px;}
#graph tr.key td.noborder {border:0;}
	#graph tr.key td span {display:block; color:#999; font-size:10px; padding-top:12px;}
	
#res_tips {position:absolute; right:0; top:40px; width:300px; padding-right:15px; z-index:30;}	
#res_tips h4 {font-size:8px; font-family:Verdana, Arial, Helvetica, sans-serif; float:left; padding-right:10px; color:#d2713a; cursor:pointer; font-weight:bold; text-transform:uppercase;}
#res_tips h4:hover {text-decoration:underline;}
#res_tips div {display:none; width:280px; position:absolute; z-index:20; top:12px; left:0; border:2px solid #999; background:#e9ecea; padding:10px 15px 0;}
#res_tips div p {padding:0 0 16px; margin:0; font-size:11px; line-height:16px; color:#666;}
/* end results */		
		
#footer {clear:both; width:954px; padding:3px 3px; margin:15px auto; border-top:1px solid #999;}
	#footer p {color:#999; font-size:10px; font-family:Arial, Helvetica, sans-serif;}
	
#show_results table { background: #fff; width: 800px; margin: auto; margin-bottom: 50px !important; }
#show_results table td { padding: 5px; }
