body 
	{
	margin: 0;
	padding:0;
	background-color: white;

	color: black;   padding: 0; 
	}



img
  	{
 	margin: 0px;
 	padding: 0px;
 	border: none;
 	 } 
 
 
b {color: black;}

h1 
	{
	
  	margin: 0;
  	height:75px;
   background-color: white;
  	color: black;
 	 }


h2
	{

	font: 1em "Arial Black", helvetica, arial, sans-serif; 
 background-color: white;
  	color: black;
	border-top: 2px solid white;

	padding: 3px 3px 3px 74px;
	margin: 0;
	}

h3
	{
	page-break-before: always;
	font: .9em "Arial Black", helvetica, arial, sans-serif; 
 background-color: white;
  	color: black;
	border-top: 2px solid white;

	padding: 3px 3px 3px 50px;
	margin: 0 0 10px 0;
	}

h4 
	{
	font: .9em "Arial Black", helvetica, arial, sans-serif; 
	color: #555;

  	margin: 5px 0 5px 50px;
  	
}




#intro
	{color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;
	position: relative;
	border: none;
	background-color: transparent;
	padding-top: 10px;
	margin: -11px auto 0 auto;
	width: 400px;}

#introcaption
{color: #555;
	font: 0.69em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;
	position: relative;
padding-top: 0px;
	margin: 10px auto 0 auto;
	width: 400px;}
	


p.caption
	{color: #555;
	font: 0.7em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: transparent;
	padding: 5px 0 5px 0;
	margin-left: 50px;
	width: 650px;
	clear: both;}

p.normal {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: transparent;
	padding: 5px 0 5px 0;
	margin-left: 50px;
	width: 650px;
	clear: both;}

p.normal a {text-decoration: none;}

p.warning {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	border: 1px solid #ccc;
	background-color: white;
	padding: 10px;
	margin-left: 0px;
	width: 650px;
	clear: both;}
	
div.tip {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 10px 10px 0 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	overflow: visible;
	clear: both;}

div.tip_full {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	overflow: visible;
	clear: both;}

p.tip {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	clear: both;}

div.note {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 10px 10px 0 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	overflow: visible;
	clear: both;}
	
div.note_full {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border: 1px solid #ccc;

	padding: 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	overflow: visible;
	clear: both;}	

p.note {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	clear: both;}

div.quote {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 10px 10px 0 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	overflow: visible;
	clear: both;}

div.quote_full {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border: 1px solid #ccc;
	
	padding: 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	overflow: visible;
	clear: both;}

p.quote {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
		background-color: white;
	border: 1px solid #ccc;
	padding: 10px;
	margin: 10px 0 10px 50px;
	width: 650px;
	clear: both;}


ul#quote2 
	{ 	background-color: white;
	margin: 5px -11px 0 -11px;
	padding: 5px 5px 5px 25px;
	
	border: 1px solid #ccc;
	}

ul#quote2 li
	{ 	background-color: white;
	color: black;
  padding: 5px 5px 0 5px;
	list-style-image: url(../images/quotelist2.gif);
     list-style-type: circle;
	}




ul#quote 
	{ 	background-color: white;
	margin: 5px -11px 0 -11px;
	padding: 5px 5px 5px 25px;
	
	border: 1px solid #ccc;
	}

ul#quote li
	{ 	background-color: white;
	color: black;
	padding: 5px 5px 0 5px;
	list-style-image: url(../images/quotelist.gif);
     list-style-type: circle;
	}


ul#normal 
	{ background-color: white;
	margin: 5px -11px 0 -11px;
	padding: 5px 5px 5px 25px;
	
	border: 1px solid #ccc;
	}


ul#normal li
	{ padding: 5px 5px 0 5px;
	list-style-image: url(../images/list.gif);
     list-style-type: circle;
	}

ol#normal li
	{ color: #555;
  font:  .8em "Helvetica Neue", helvetica, arial, sans-serif;
	margin: 0 0 0 50px;
	padding: 0;
	width: 650px;
	list-style: decimal;
	height: auto;
	}










.yourlevel {
			color: black;
			background-color: white;
			font-weight: 800;
			padding: 0 2px 0 2px;
			border: 1px solid #eee;
			}

.otherlevel {
			color: black;
			background-color: #ddd;
			font-weight: 800;
			padding: 0 2px 0 2px;
				border: 1px solid #aaa;
			}

.perceptionlevel {
			color: black;
			background-color: #eee;
			font-weight: 800;
			padding: 0 2px 0 2px;
				border: 1px solid #777;
			}


#rollover {
margin: 0 0 0 50px; 
background-color: white;
padding: 10px; 
border-top: 2px solid yellow; 
border-bottom: 2px solid yellow; 

width: 650px;
}

#rollover table {
color: #555;
  font:  .9em "Helvetica Neue", helvetica, arial, sans-serif;
}







/* Form stylin from here to eternity */

table#button
{margin: 10px 0 5px 50px;}




table#normal  {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;
	padding-top: 10px;
	padding-bottom: 10px;
		margin: 0 0 0 49px;
	
	}
	
table#gender  {

	padding-top: 10px;

		margin: 0 auto 0 auto;
	}

table#gender td {
	text-align: center;
	padding: 5px;
	}

table#graph  {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;
	width: 648px;
		margin: 10px 0 10px 49px;
		font-weight: 800;
	}

table#graph7  {


		margin: 10px;
	}

table#alcoholchart  {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;
	padding-top: 10px;
	padding-bottom: 0;
		margin: 0 0 10px 149px;
	font-weight: 800;
	
	}

table#personal  {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;

	padding-bottom: 10px;
	margin: 0 0 0 49px;
	}

table#info
	{margin: 0 0 0 49px;}

table#personal td.left {
	width: 300px;
	vertical-align: middle;
	text-align: right;
	padding-right: 10px;
	}
	
table#personal td.right {
	width: 300px;
	vertical-align: middle;
	text-align: left;
	}
	

table#q1, table#q2, table#q3, table#q4, table#q5, table#q6, table#q7 {
	color: #555;
	font: 0.8em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;
	padding: 0;
	margin-left: 50px;
	}

table#q1 input, table#q2 input, table#q3 input, table#q4 input, table#q5 input, table#q6 input  {
	border: solid 1px #ccc;
	background-color: #eeeeee;
	color: #555;
	margin-right: 5px;
	padding: 2px;
	height: 15px;
	width: 50px;
	}	
	


table#q1 input:hover, table#q2 input:hover, table#q3 input:hover, table#q4 input:hover, table#q5 input:hover, table#q6 input:hover, table#q7 input:hover {
	background-color: #fff;
	border: solid 1px #006600;
	color: #555;
	}	
	
table#q1 input:focus, table#q2 input:focus, table#q3 input:focus, table#q4 input:focus, table#q5 input:focus, table#q6 input:focus, table#q7 input:focus,
table#personal input:focus {
	background-color: #fff;
	border: solid 1px #006600;
	color: #555;
	}	

table#q1 td.left,
table#q2 td.left,
table#q3 td.left {
	width: auto;
	vertical-align: bottom;
	text-align: right;
	}
	
table#q4 td.left,
table#q5 td.left {
	width: 250px;
	vertical-align: bottom;
	text-align: left;
	}

table#q6 td.left {
	width: 250px;
	vertical-align: bottom;
	text-align: left;
	padding-bottom: 7px;
	}


table#q1 td.right,
table#q2 td.right,
table#q3 td.right {
	vertical-align: bottom;
	text-align: left;
	}

table#q4 td.right,
table#q5 td.right {
	vertical-align: bottom;
	text-align: left;
	}

table#q6 td.right {
	vertical-align: bottom;
	text-align: left;
	padding-bottom: 7px;
	}



table#q7 td.left {
	width: 275px;
	vertical-align: middle;
	text-align: left;
	
	padding-bottom: 12px;
	
	}

table#q7 td.right {
	vertical-align: middle;
	text-align: right;
	padding-bottom: 12px;

	width: 350px;
	}



legend  {
	color: #555;
	font-family: "arial black";
	background-color: #d3d3d3;
	padding: 2px;
	
	}

label   {
	font-weight: 400;
	line-height: normal;
	
	

	}

label.fieldLabel	{
	display: inline;
	float: none;
	}


				


input.formInputField   {
	border: solid 1px #ccc;
	background-color: #eeeeee;
	color: black;
	margin-right: 5px;
	margin-bottom: 0;
	padding: 2px;
	height: 15px;
	width: auto;
	}
	
input.formInputField:hover {
	background-color: #fff;
	border: solid 1px #006600;
	color: #000;
	}


select.formSelect  {
	border: solid 1px #006600;
	background-color: #fff;
	color: #000;
	cursor: pointer;
	margin-right: 5px;
	margin-bottom: 5px;
	padding: 2px;
	}

select.formSelect:hover  {
	background-color: #ccffff;
	color: #000;
	cursor: pointer;
	}


	

	
/* eternity */	


#header	{
	position: relative;
	width: 300px;
	margin: 20px auto 0 auto;
	
	}


#footer	{
	position: relative;
	padding: 5px 0 5px 50px;
	color: #555;
	font: 0.7em "Helvetica Neue", helvetica, arial, sans-serif;
	background-color: white;
	
	}
