/*
	Title: JRF hnm screen
	Author: RZ
	Date: 2009-09
*/


/* 
Reset from Eric Meyer
-------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

:focus {
	outline: 0;
}

ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* HTML
-------------------------------------------------- */

body {
	font-family: helvetica, arial, sans-serif;
	background-color: #fff;
	text-align: center;
	font-size: 81%;
	line-height: 1.4;
	color: #454545;
	background: url(../images/header-bg.jpg) 0 0 repeat-x;
}

a {
	text-decoration: none;
	color: #577499;
}

a:hover {
	text-decoration: underline;
	color: #577499;
}

p {
	margin-bottom: 1em;
}

h1, h2, h3 {
	line-height: 1;
}

h1 {
	font-size: 3.0em;
	margin: 20px 0 25px;
	color: #222;
	font-weight: normal;
}

h2 {
	font-size: 1.5em;
	margin: 10px 0 5px;
	line-height: 1.1;
	font-weight: bold;
	color: #333;
}

h3 {
	font-size: 1.2em;
	margin: 10px 0;
	line-height: 1.2;
	font-weight: normal;
	color: #000;
}

/* Wrapper
-------------------------------------------------- */

#wrapper {
	width: 100%;
	overflow: hidden;
	min-width: 980px;
}

/* Header & Logo
-------------------------------------------------- */

#header {
	height: 50px;
}
	
	#logo {
		width: 388px;
		height: 16px;
		display: block;
		float: left;
		background: url(../images/logo-hnm.jpg) 0 0 no-repeat;
		text-indent: -9999px;
		margin: 18px 0 0;
	}

/* Top Nav
-------------------------------------------------- */

#nav {
	float: right;
	display: block;
	margin: 0;
}

	#nav li {
		float: left;
	}	
		#nav li a {
			width: auto;
			height: 25px;
			text-align: center;
			display: block;
			font-size: 1.15em;
			font-weight: bold;
			color: #a3b3c3;
			margin-left: 20px;
			padding-top: 8px;
			border-top: 6px solid #272727;
		}
		
		#nav li a:hover {
			text-decoration: none;
		}
		
		#nav li a:hover,
		body.home #nav li.home a,
		body.maps #nav li.maps a,
		body.charts #nav li.charts a,
		body.publications #nav li.reports a,
		body.about #nav li.about a {
			color: white;
			border-top: 6px solid white;
		}

/* Content
-------------------------------------------------- */

#content, #header, #footer {
	width: 976px;
	text-align: left;
	margin: 0 auto;
	overflow: hidden;
	clear: both;
	position: relative;
}

	#content .section {
		width: 100%;
		overflow: hidden;
		clear: both;
		padding: 0 0 10px; 
	}
	
		#content .section .col {
			float: left;
			display: block;
			margin: 0 20px 0 0;
			overflow: hidden;
			border-top: 4px solid #103b68;
			padding-top: 5px;
		}
	
			#content .section .col h2 a {
				background: url(../images/arrow-blue.gif) 100% 5px no-repeat;
				padding-right: 14px;
			}
		
		#content .section .col-last {
			margin-right: 0;
		}

	#content .intro {
		line-height: 1.34;
		font-size: 1.28em;
		color: #111;
	}
	
	.publications #content .intro {
		border-bottom: 1px solid #ccc;	
	}
	
	.divider {
		clear: both;
		height: 1px;
		overflow: hidden;
		width: 100%;
		margin: 30px 0;
		border-top: 1px solid #ddd;
	}

/* Footer
-------------------------------------------------- */

#footer {
	margin: 20px auto 0;
	border-top: 4px solid #103B68;
	height: 50px;
}

	#footer ul {
		margin: 15px 0 0 255px;
	}

		#footer ul li {
			display: inline;
			text-align: center;
			padding-right: 5px;
			border-right: 1px solid #ddd;
			margin-right: 5px;
			line-height: 1;
			font-size: .88em;
		}

		#footer ul li.copy {
			margin: 0;
			padding: 0;
			border: 0;
		}

	#footer a.jrf {
		position: absolute;
		left: 0;
		top: 10px;
		width: 196px;
		height: 27px;
		background: url(../images/logo-jrf.gif) 0 0 no-repeat;
		display: block;
		text-indent: -9999px;
	}
	
	#footer a.tbx {
		position: absolute;
		right: 0;
		top: 12px;
		width: 100px;
		height: 27px;
		background: url(../images/logo-torchbox.gif) 0 0 no-repeat;
		display: block;
		text-indent: -9999px;
	}


/* Breadcramb
-------------------------------------------------- */

#breadcrumb {
	width: 100%;
	border-bottom: 4px solid #103B68;
	overflow: hidden;
	margin: 0;
	padding: 20px 0 10px;
}

	#breadcrumb li {
		float: left;
		padding: 0 5px 0 0;
	}

/* Home page
-------------------------------------------------- */

body.home #content {
	background: url(../images/home-bg.jpg) 100% 0 no-repeat;
}

	body.home #content .section .col {
		width: 312px;
	}
	
	body.home h1 {
		color: #103669;
		margin-bottom: 10px;
		margin-top: 30px; 
		font-size:3.2em;
	}
	
	body.home #content .intro {
		font-size: 1.77em;
		color: #6c7681;
		width: 415px;
		margin: 0 0 35px 0;
	}

/* Charts page
-------------------------------------------------- */

body.charts #content {
}

	body.charts #content .section .col {
		width: 229px;
	}
	
	body.charts #content #main-content .spreadsheet a { padding: 6px 7px 4px; border: 1px solid #4f6e8d; background: #748fac; color: #fff; }
	body.charts #content #main-content .spreadsheet a:hover { background: #222; border: 1px solid #000; }
	body.charts #content #main-content .back-to-top a { display: block; font-weight: normal; border: none; margin: 0; padding: 0; position: relative; top: -15px; }
	body.charts #content #main-content p.source { margin: 0 0 20px 0; }

/* Standard page
-------------------------------------------------- */

#main-content{
	width: 706px;
	margin: 20px 20px 20px 0;
	padding: 0 20px 0 0;
	float: left;
	background: url(../images/vertical-line.gif) right 0 repeat-y;
}

	#main-content #breadcrumb {
		padding-top: 0;
	}

	#main-content h1 {
		border-bottom: 1px solid #103b68;
		padding-bottom:20px;
	}

	#main-content .right {
		float: right;
		margin: 0 0 30px 20px;
	}
	
	#main-content .back-to-top {
		float: right;
		width: 100px;
		text-align: right;	
	}
	
	#main-content iframe {
		margin: 10px 0 20px 0;	
		opacity: 0.7;
		filter:alpha(opacity=70)
	}
	
	#main-content iframe:hover {
		opacity: 1;	
		filter:alpha(opacity=100)
	}
	
	#main-content #anchors {
		margin: 0 0 30px 0;
		padding: 0 0 30px 0;
		border-bottom:1px dotted #103B68;
	}
		#main-content #anchors ul, .about #content ul {
			list-style-type: square;
			list-style-position: inside; 
			margin: 5px 0 0 0;
		}
		
		body.charts #content #main-content #anchors a {
			font-weight: normal;
			border: none;
			padding: 0;
			margin: 0
		}
		
		#toolbar_2_1, #toolbar_2_2,#toolbar_2_3,#toolbar_2_4,#toolbar_2_5,#toolbar_2_6,#toolbar_2_7,#toolbar_2_8,#toolbar_2_9,#toolbar_2_28,#toolbar_2_29, #toolbar_2_18, #toolbar_2_20, #toolbar_2_21, #toolbar_2_26, #toolbar_2_27, #toolbar_2_30, #toolbar_2_12, #toolbar_2_13, #toolbar_2_14, #toolbar_2_15, #toolbar_2_16, #toolbar_2_17, #toolbar_2_10, #toolbar_2_11 { display: none; }
	
		.goog-menu-button {
			float: right;
			margin: 20px 10px 0 0 !important;
		}
		
		.goog-menuitem-content {
			text-align: left;
		}
	

	#main-content .source, #main-content .source em {
		color: #454545;
		font-style: normal;
	}

#side-content {
	width: 216px;
	float: left;
	padding: 35px 0 0;
}

	#side-content h2 {
		font-size: 1.38em;
		color: #222;
		padding: 0 10px 5px 10px;
	}

	#side-content ul {
		border-top: 1px solid #e0e5ed;
		overflow: hidden;
	}

		#side-content li {
			border-bottom: 1px solid #e0e5ed;
			display: block;
		}

			#side-content li a {
				padding: 5px 10px;
				display: block;
			}

			#side-content li a:hover,
			#side-content li a.current {
				text-decoration: none;
				background-color: #103b68;
				color: white;
			}
			
.about #content ul { margin: 0 0 0 20px; }
.about #content #breadcrumb { margin: 0; list-style-type: none; }
.about #content #breadcrumb li { padding: 0; }
.about #content h2, .terms #content h2, .contact #content h2 { margin: 20px 0 10px; font-weight: normal; }