body {
	background: url("images/body_slice.png") repeat-x 0 0 #66D9ff;
	width: 100%;
	height: 100%;
	}
#wrap {
	width: 960px;
	margin: 0 auto;
	min-height: 1px;
	}
#left {
	display: inline;
	float: left;
	width: 590px;
	}
	
a:hover, a:focus {

	text-decoration: none;

	}
	h1 {
		display: inline;
		float: left;
		text-indent: -9999px;
		line-height: 0;
		height: 180px;
		width: 290px;
		background: url("images/h1.png") no-repeat 0 0;
		}
	.topLinks {
		display: inline;
		float: left;
		width: 300px;
		}
		.topLinks a {
			display: block;
			text-indent: -9999px;
			}
		.topLinks .dcmp {
			height: 119px;
			}			
			.topLinks .dcmp a {
				width: 300px;
				height: 119px;
				background: url("images/topLinks_dcmp.png") no-repeat 0 0;
				}
				.topLinks .dcmp a:hover, .topLinks .dcmp:focus {
					background: url("images/topLinks_dcmp_hover.png") no-repeat 0 0;
					}
		.topLinks .facebook {
			display: inline;
			float: left;
			width: 200px;
			height: 61px;
			}
			.topLinks .facebook a {
				width: 200px;
				height: 61px;
				background: url("images/topLinks_facebook.png") no-repeat 0 0;				
				}
				.topLinks .facebook a:hover, .topLinks .facebook a:focus {
					background: url("images/topLinks_facebook_hover.png") no-repeat 0 0;	
					}
		.topLinks .twitter {
			display: inline;
			float: left;
			width: 100px;
			height: 61px;
			}
			.topLinks .twitter a {
				width: 100px;
				height: 61px;
				background: url("images/topLinks_twitter.png") no-repeat 0 0;
				}
				.topLinks .twitter a:hover, .topLinks .twitter a:focus {
					background: url("images/topLinks_twitter_hover.png") no-repeat 0 0;
					}
					
	h2#takeTheQuiz {
		clear: both;
		height: 46px;
		}
		h2#takeTheQuiz a {
			display: block;
			text-indent: -9999px;
			width: 590px;
			height: 46px;
			background: url("images/takeTheQuiz.png") no-repeat 0 0;
			}
			h2#takeTheQuiz a:hover, h2#takeTheQuiz a:focus {
				background: url("images/takeTheQuiz-hover.png") no-repeat 0 0;
				}
	h2#dcmpTitleH2 {
		clear: both;
		height: 113px;
		line-height: 0;
		background: url("images/dcmpTitle_h2.png") no-repeat 0 0;
		text-indent: -9999px;
		}
	#dcmpTitle {
		background: url("images/dcmpTitle_background.png") repeat-y 0 0;
		padding: 0 30px 0 20px;
		font-size: 1.4em;
		}
		#dcmpTitle p {
			color: #fff;
			line-height: 130%;
			margin: 0 0 .8em 0;
			}
			#dcmpTitle p a {
				color: yellow;
				}
		#dcmpTitle ul {
			margin: -20px 0 0 -20px;
			padding: 0 0 20px 0;
			min-height: 1px;
			}
		ul.flyers {
			min-height: 1px;
			margin: -20px 0 20px 0;
			}
			#dcmpTitle ul li, ul.flyers li {
				display: inline;
				float: left;
				padding: 10px;
				width: 145px;
				margin: 20px 0 0 20px;
				background: #fff;
				}
				
			#dcmpTitle ul li a:hover, #dcmpTitle ul li a:focus {
			
				text-decoration: none;	
				
				}
		ul.flyers img {
			display: block;
			width: 140px;
			height: 140px;
			background: red;
			}
				#dcmpTitle ul p {
					color: #333;
					font-size: .8em;
					margin: .8em 0 0 0;
					}
		#dcmpTitle ol {
			margin: 0 0 0 -10px;
			min-height: 1px;
			}
			#dcmpTitle ol li {
				display: inline;
				float: left;
				margin: 0 0 0 10px;
				cursor: pointer;
				}
				#dcmpTitle ol li a {
					display: block;
					font-size: 1.5em;
					padding: .4em .6em;
					border: 1px solid #004359;
					color: #fff;
					background: #004359;
					text-decoration: none;
					}				
				#dcmpTitle ol li a:hover, #dcmpTitle ol li a:focus {
					background: #007fa9;
					border-color: #fff;
					}
						
		#dcmpTitle ol {
			display: none;
			}
				
		#dcmpTitlesBottom {
			height: 28px;
			background: url("images/dcmpTitles-bottom.png") no-repeat 0 0;
			}
		h3.flyers {
			text-indent: -9999px;
			height: 56px;
			background: url("images/flyers.png") no-repeat left top;
			}
		#left p.background {
			background: url("images/flyers_bg.png") repeat-x left top #18343D;
			width: 530px;
			padding: 10px 20px;
			margin: 0 0 20px 0;
			font-size: 1.4em;
			color: #fff;
			line-height: 130%;
			}
			
			#left p.background, .flyers {
				display: none;
				}
			
/*RIGHT DIV*/

#right {
	display: inline;
	float: left;
	width: 370px;
	}

#right h2 {
	text-indent: -9999px;
	width: 370px;
	height: 272px;
	background: url("images/right_top.png") no-repeat 0 0;
	}
	
	#rightContent {
	
		background: url("images/right_slicea.png") no-repeat left 77px;
		padding: 0 20px 20px 30px;
		margin: -77px 0 0 0;
		font-size: 1.2em;
	
		}
		
		#rightContent p {
		
			line-height: 140%;
		
			}
			
		#rightContent p.intro {
			font-style: italic;
			font-size: 1.2em;
			}
			
		#rightContent h3, #rightContent p.looksLikeH2 {
		
			font-size: 2em;
			margin: .4em 0;
			line-height: 110%;
		
			}
			
		#panaraVideo {
		
			margin: 30px 0 20px 0;
		
			}
			
		#rightContent ul {
			margin: 30px 0 0 0;
			}
			
			#rightContent ul li {
				margin: 0 0 10px 0;
				}
				
				#rightContent ul h3 {
					display:inline;
					float: left;
					height: 75px;
					width: 208px;
					text-indent: -9999px;
					line-height: 0;
					margin: 0;
					}
					
					#rightContent .rockets {
						background: url("images/rockets.png") no-repeat 0 0;
						}
					#rightContent .mac {
						background: url("images/mac.png") no-repeat 0 0;
						}
					#rightContent .hkas {
						background: url("images/hkas.png") no-repeat 0 0;
						}
					#rightContent .hkgc {
						background: url("images/hkgc.png") no-repeat 0 0;
						}
					
				#rightContent ul a {
					display: inline;
					float: left;
					width: 112px;
					height: 75px;
					text-indent: -9999px;
					background: url("images/play-on-youtube.png") no-repeat left top;
					}
					
					#rightContent ul a:hover, #rightContent ul a:focus {
						background: url("images/play-on-youtube-hover.png") no-repeat left top;
						}
				

		
#quizWrap {

	clear: both;
	background: url("images/trivia_slice.png") repeat-x 0 0 #432D16;

		}

	#quiz {
		width: 960px;
		margin: 0 auto;
		padding: 58px 0 30px 0;
		font-size: 1.4em;
		line-height: 140%;
		}
		
		#triviaQuiz {
			height: 94px;
			text-indent: -9999px;
			background: url("images/trivia_h2.png") no-repeat left top;
			line-height: 0;
			}
			
		#quiz p.background {
			background: url("images/trivia_p_background.png") repeat-x left top #29180a;
			width: 550px;
			padding: 10px 20px;
			color: #fff;
			}
			
	#results {
	
		display: none;
	
		}
			
	#quiz ol {
		margin: 10px 0 0 0;
		}
		#quiz ol li {
			min-height: 70px;
			padding: 20px 0;
			border-bottom: 2px solid #fff;
			}
			#quiz ol span {
				display: inline;
				float: left;
				}
				#quiz ol span.question {
					width: 570px;
					padding: 10px 20px 10px 0;
					color: #fff;
					min-height: 50px;
					}
				#quiz ol span.resource {
					width: 320px;
					padding: 10px 10px 10px 40px;
					min-height: 50px;
					background: url("images/trivia_white_pointer.png") no-repeat left center #fff;
					font-size: .85em;
					}
				#quiz .inputs {
					display: none;
					}
				#quiz #quizSubmit {
					display: none;
					}
				
				
#dcmpTitle ul:after, #dcmpTitle ol:after, ul.flyers:after, #right:after, #rightContent ul li:after, #wrap:after, #quiz li:after, #quiz .inputs:after, #results:after {
		content: ".";
		display: block;
		height: 0px;
		font-size: 0px;
		clear: both;
		visibility:hidden;
		overflow: hidden;
		}
