/**
 * Screen styles for JGTN
 * Created 14 Apr 2008
 */
 
 body {
 	margin: 0;
 	padding: 0;
 	}
 	
 	
 	/* links */
 	a {
 		color: #6eab23;
 		}
 	a:hover {
 		text-decoration: none;
 		}
 	a img {
 		border: 0;
 		}
 		
 		
 	/* common elements */
 	h1, h2, h3, h4, h5, h6, ul, p {
 		margin: 0;
 		}
 	
 	
 	/* structure
 	--------------------------------------*/
 	#container {
 		position: relative;
 		width: 776px;
 		margin: 35px auto;
 		text-align: left;
 		}
 		
 		/* using clearfix solution to reduce any html markup just apply class="clearfix" to any div you want. */
		.clearfix:after {
			display: block;
			clear: both;
			height: 0;
			content: ".";
			visibility: hidden;
			}
		* html .clearfix { /* ie hack it needs to use height: 1%, does not support the :after pseudoclass */
			height: 1%;
			}
		*+ html .clearfix {
			height: 1%;
			}
 		
 		
 		/* header */
 		#header {
 			position: relative;
 			height: 124px;
 			}
 			
 			#header h2 {
 				position: absolute;
 				top: 45px;
 				left: 147px;
 				}
 				
 			#header h3 {
 				position: absolute;
 				top: 31px;
 				right: 0;
 				}

			/* main navigation */
 			#header ul {
 				position: absolute;
 				bottom: 0;
 				left: 141px;
 				width: 636px;
 				height: 29px;
 				padding: 0 0 0 10px;
 				list-style: none;
 				background: url(images/bg-nav.gif) no-repeat;
 				}
 			#header li {
 				float: left;
 				display: block;
 				}
 			#header li a {
 				display: block;
 				padding: 1px 15px 1px;
 				font-size: 1.6em;
 				line-height: 1.7;
 				color: #005bb8;
 				text-decoration: none;
 				}
 			#header li a:hover,
 			#header li a.on {
 				background: #6eab23;
 				color: #fff;
 				}
 				
 				
 		/* main body */
 		#main-body {
 			margin: 12px 0;
 			}
 			
 			#content {
 				float: left;
 				width: 520px;
 				}
 				
 				/* content title */
 				#content h2 {
 					height: 56px;
 					background: url(images/bg-title.gif) no-repeat;
 					color: #fff;
 					font-size: 2em;
 					font-weight: normal;
 					}
 				#content h2 div {
 					padding: 13px 15px;
					line-height: 1.6;
 					}
 					
 					/* content area */
					#inner-content {
						padding: 15px 15px 0;
						font-size: 1.2em;
						}
					#inner-content h3 {
						margin: 0 0 8px;
						color: #6eab23;
						font-size: 1.7em;
						font-weight: normal;
						}
					#inner-content p {
						line-height: 1.6;
						padding: 5px 0;	
						}
					#inner-content .image {
						float: left;
						padding-right: 15px;
						}
 				
 			#sidebar {
 				float: right;
 				width: 243px;
 				}
 				
 				/* titles available */
 				#titles {
 					float: left;
 					margin: 10px 0 0;
 					background: #6eab23;
 					}
 				#titles h3 {
 					padding: 15px 12px 6px;
 					color: #005bb8;
 					font-size: 1.8em;
 					background: url(images/bg-titles-header.gif) top left no-repeat;
 					}
 				#titles ul {
 					float: left;
 					width: 243px;
 					padding: 0 0 18px;
 					list-style: none;
 					border-top: 1px solid #92c05a;
 					background: url(images/bg-titles-footer.gif) bottom left no-repeat;
 					}
 				#titles li {
 					float: left;
 					display: block;
 					width: 243px;
 					border-bottom: 1px solid #92c05a;
 					}
 				#titles li a {
 					float: left;
 					display: block;
 					width: 219px;
 					margin: 0;
 					padding: 3px 12px;
 					color: #fff;
 					font-size: 1.4em;
 					font-weight: normal;
 					text-decoration: none;
 					line-height: 1.6;
 					}
 				#titles li a:hover, #titles li a.on {
 					background: #005bb8;
 					color: #fff;
 					}
 			
 			
 		/* footer */
 		#footer {
 			height: 29px;
 			background: url(images/bg-footer.gif) no-repeat;
 			font-size: 1.2em;
 			}
 		#footer p {
 			margin: 0;
 			padding: 5px 12px;
 			line-height: 1.6;
 			}