h2, h3 {
	margin: 0 0 5px 0;
	font-family: "Arial";
	font-size: 22px;
	color: #a90677;
}

h3 {
	font-size: 14px;
}

#header {
	position: absolute;
	z-index: 10;
	top: 25px;
	margin-left: 34px;
}

#test {
	display: none;
	position: absolute;
	z-index: 1;
	margin-left: 28px;
	top: 45px;
	width: 904px;
	height: 439px;
	padding-top: 40px;
	background: url(/images/bg_test_top.png) no-repeat;
}

	#test #text {
		min-height: 140px;
		margin-right: 3px;
		padding-top: 20px;
	}
	
	#test #text #pageReadMore p, #test #text #pageReadMore ul, #test #text #pageReadMore h2, #test #text #pageReadMore h3 {
		width: 600px;
		margin-left: 180px;
	}
	
	#test #text #pageReadMore ul.menu {
		float: left;
		width: 160px;
		margin-left: -20px;
		margin-top: 30px;
		padding: 0 5px;
	}

	#test #text #pageReadMore ul.menu li {
		cursor: pointer;
		text-decoration: underline;
	}

	#test #text #pageReadMore ul.menu li.active {
		text-decoration: none;
		font-weight: bold;
	}
	
	#test #text #pageReadMore h2 {
		line-height: 22px;
	}
	
	#test #text p.small {
		font-size: 10px;
		color: #666666;
	}
	
	#test #text p.small a {
		color: #666666;
	}
	
	#test #text #introduction {
		width: 350px;
	}
	
	#test #text #doYouKnow {
		position: absolute;
		width: 400px;
		top: 280px;
		left: 450px;
	}
	
	#test #text h2 {
		margin-bottom: 10px;
	}
	
	#test #text p, #test #text ul {
		width: 350px;
		margin-bottom: 20px;
		font-size: 12px;
	}
	
	#test #text ul li {
		margin-left: 20px;
	}
	
	#test #text p.highlight {
		color: #719933;
		font-weight: bold;
	}
	
	#test #text p.highlight a{
		color: #719933;
	}
	

	#test #testBottom {
		clear: both;
		position: relative;
		width: 904px;
		height: 99px;
		/*top: 380px;*/
		z-index: 0;
		background: url(/images/bg_test_bottom.png) no-repeat bottom left;
	}
	
	#test #testBottom #logo {
		
	}

	#test #groups {
		position: absolute;
		left: 300px;
		top: 0;
		width: 600px;
		height: 150px;
	}
	
		#test #groups #txtHowMuchSalt {
			position: absolute;
			width: 285px;
			height: 28px;
			left: 167px;
			top: 104px;
		}
		
		#test #groups .group {
			position: absolute;
		}
		
		#test #groups .group img {
			position: absolute;
		}
		
		#test #groups .group img.active {
			position: absolute;
			display: none;
		}

	#test img#logo {
		float: right;
		margin: 10px 20px 0 0;
	}


	input {
		vertical-align: middle;
		margin-right: 10px;
	}

	#question {
		display: none;
		position: absolute;
		width: 820px;
		top: 240px;
		padding-left: 52px;
	}

		#question h2 {
			width: 540px;
			font-size: 18px;
			line-height: 22px;
		}
		
		#questionSub h2 {
			font-size: 18px;
			line-height: 22px;
		}

		#question #catImage {
			position: absolute;
			top: 25px;
			left: 540px;
		}
	
		#question #catImage img {
			position: absolute;
			display: none;
		}
	
	
	#questionSub {
		display: none;
		position: absolute;
		opacity: 0;
		width: 425px;
		top: 295px;
		left: 260px;
		padding: 15px 25px;
		background-color: #ffffff;
		border: 2px solid #dddddd;
		border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
	}
		
		.categories {
			width: 540px;
			margin-bottom: 15px;
			font-size: 0.8125em;
		}
		
		.ANSwers {
			margin-left: 10px;
		}
		
		.answers .left {
			margin-right: 50px;
		}

		.answers .answer {
			height: 24px;
			font-size: 12px;
			cursor: pointer;
		}
		
	span.radio {
		display: inline-block;
		width: 22px;
		height: 24px;
		vertical-align: bottom;
		background:	url(/images/radio.png) no-repeat 0 10px;
	}
	
	span.radio.checked {
		width: 22px;
		height: 24px;
		background:	url(/images/checked.png) no-repeat;
	}
	
	#test #resultGlobal {
		position: absolute;
		width: 570px;
		height: 200px;
		left: 0px;
		top: 260px;
		padding: 0 10px 0px 30px;
		/*border-right: 1px solid #dddddd;*/
	}
	
	#test #resultGlobal #resultText {
		width: 430px;
		font-size: 12px;
	}
	
	#test #resultGlobal #resultVisual {
		margin-left: 40px;
		margin-top: 20px;
		width: 94px;
		height: 94px;
		text-align: center;
	}
	
		#test #resultGlobal #saltNumber {
			margin-top: 30px;
			margin-bottom: 10px;
			color: #ffffff;
			font-size: 30px;
			text-align: center;
		}
	
	
	#test.good #resultGlobal #resultVisual {
		background: url(/images/circle_green.png);
	}
	#test.average #resultGlobal #resultVisual {
		background: url(/images/circle_orange.png);
	}
	#test.bad #resultGlobal #resultVisual {
		background: url(/images/circle_purple.png);
	}
	
	
	#test #resultTable {
		position: absolute;
		width: 830px;
		height: 510px;
		top: 380px;
		margin: 20px;
		padding: 15px;
		background: #f1f1f1;
		-moz-border-radius: 15px; -webkit-border-radius: 15px;
	}

		#test #resultTable .header {
			width: 240px;
			padding: 2px 5px;
			color: #ffffff;
			font-weight: bold;
			font-size: 11px;
		}
		#test.good #resultTable .header {
			background-color: #8cc63f;
		}	
		#test.average #resultTable .header {
			background-color: #faa61a;
		}	
		#test.bad #resultTable .header {
			background-color: #aa0677;
		}	
		
		#test #resultTable #results .scrollable{
    		position: relative;
			margin-top: 10px;
			/*border: 1px solid #8cc63f;*/
		}

			#test #resultTable #results .scrollable .items {
				font-size: 11px;
			}
			
			#test.good #resultTable #results .scrollable {
				border-color: #8cc63f;
			}
			#test.average #resultTable #results .scrollable {
				border-color: #faa61a;
			}
			#test.bad #resultTable #results .scrollable {
				border-color: #aa0677;
			}
			
			#test #resultTable #results .scrollable .items div.item {
				width: 225px;
				height: 21px;
				padding: 7px 0 3px 10px;
				clear: both;
			}
			#test #resultTable #results .scrollable .items div.item img {
				display: none;
			}

			#test #resultTable #results .scrollable .items div.active {
				width: 225px;
				background: url(/images/result_highlight.png) no-repeat;
				color: #ffffff;
				font-weight: bold;
			}
			#test #resultTable #results .scrollable .items div.active img {
				display: inline;
				vertical-align: middle;
			}
			
			#test #resultTable #results .scrollable .items div.active .catName {			
				font-size: 11px;
			}
			#test #resultTable #results .scrollable .items div.active .catSalt {			
				font-size: 11px;
			}
			
			#test #resultTable #results .scrollable .items div.item.odd {
				/*background-color: #f3f9eb;*/
			}
			
			#test #resultTable #results .scrollable .items div div {
				font-size: 12px;
				float: left;
			}
			
			#test #resultTable #results .scrollable .items div.catNum {
				width: 25px;
				padding-left: 5px;
			}
			#test.good #resultTable #results .scrollable .items div.catNum {
				color: #8cc63f;
			}
			#test.average #resultTable #results .scrollable .items div.catNum {
				color: #faa61a;
			}
			#test.bad #resultTable #results .scrollable .items div.catNum {
				color: #aa0677;
			}
			
			#test #resultTable #results .scrollable .items div.catName {
				width: 168px;
				cursor: pointer;
			}
			#test #resultTable #results .scrollable .items div.catSalt {
				width: 30px;
				margin-right: 20px;
				float: right;
			}
			
 			#results .items div.item div.details {
				display: none;
				position: absolute;
				left: 260px;
				top: 0;
				width: 580px;
				color: #000000;
				font-weight: normal;
			} 
			
			#test #resultTable #results .scrollable .items div.item div.details .footer, .footer {
				width: 270px;
				margin-top: 3px;
				padding-left: 10px;
				font-style: italic;
				font-size: 10px;
				color: #797979;
			}
			
 			#results .items div.item div.details p{
				width: 460px;
				margin-bottom: 25px;
			}
			
 			#results .items div.active div.details th {
				background: #aa2a77;
			}
			
			#results .items .productTable {
				width: 274px;
				margin-right: 10px;
				text-align: left;
				font-weight: normal;
				border-right: 1px solid #aa2a77;
				border-bottom: 1px solid #aa2a77;
			}
			
			#results .items .productTable tr.even td {
				background-color: #f6e6f1;
			}

			#results .items .productTable th {
				color: #ffffff;
				font-size: 11px;
				font-weight: normal;
			}
			
			#results .items .productTable td {
				border-left : 1px solid #aa2a77;
				padding: 2px 5px;
				font-size: 12px;
				color: #000000;
			}
			
			#test #resultTable #resultExplanationText {
				position: absolute;
				width: 340px;
				height: 252px;
				margin-left: -330px; 
				margin-top: -290px; 				
				padding: 15px 25px;
				background-color: #ffffff;
				border: 2px solid #dddddd;
				border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
				font-size: 11px;
				line-height: 13px;
			}
			
	
#buttons {
	position: absolute;
	top: 275px;
	margin-left: 35px;
}

	button {
		padding: 5px;
		cursor: pointer;
	}
	
	button#nextQ {
		display: none;
		position: absolute;
		width: 115px;
		height: 55px;
		margin-top: 422px;
		margin-left: 776px;
	}
	
	 #nextQclickthingy { 
		display: none;
		position: absolute; 
		z-index: 100; 
		margin-top: 491px; 
		margin-left: 776px;
		width: 115px; 
		height: 55px;
		cursor: pointer;
	}

	button#prevQ {
		display: none;
		position: absolute;
		width: 87px;
		height: 36px;
		margin-top: 535px;
		margin-left: 65px;
		opacity: 0;
	}
	
	button#toResults {
		display: none;
		position: absolute;
		z-index: 2;
		width: 129px;
		height: 29px;
		margin-top: 470px;
		margin-left: 420px;
	}
	
	button.toResults {
		display: none;
		width: 129px;
		height: 29px;
	}
		
	button.startTest {
		width: 129px;
		height: 29px;
	}

	button.goBack {
		width: 81px;
		height: 29px;
		margin-left: 180px;
		margin-right: 5px;
	}
	
	#logoUnilever {
		position: absolute;
		bottom: 65px;
		margin-left: 780px;
	}
	
	#logoUnilever.small img {
		width: 60px;
		height: 66px;
	}

	
	#topNav {
		width: 925px;
		position: absolute;
		top: 15px;
	}
	
	#textMoreAboutSalt {
		float: right;
		margin-left: 20px;
	}

	#popupTerms, #popupTermsUsage, #contact {
		float: right;
		margin-left: 20px;
	}
	
	#popupTerms a, #popupTermsUsage a, #contact a {
		color: #ffffff;
		font-family: arial;
		font-size: 11px;
		letter-spacing: 1px;
	}
	
.popup {
	position: absolute;
	margin-top: -20px;
	margin-left: 20px;
	padding: 5px;
	width: 274px;
	border: 2px solid #DDDDDD;
	border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
	background: #ffffff;
}

.popup .close {
	float: right;
	padding: 0 5px;
}

#tooltip {
	position: absolute;
	z-index: 100;
	width: 200px;
	border: 1px solid #333;
	background: #f7f5d1;
	padding: 2px 5px;
	color: #333;
	display: none;
}
	
#page2, #page3 {
	display: none;
}