/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
html { margin: 0; }
body { font-family: proxima-nova,"Helvetica Neue",Arial,sans-serif; font-size: 16px; }
.si-nav nav ul { font-family: proxima-nova-extra-condensed,sans-serif; position: absolute; right: 0; height: 50px; }
		.si-nav nav li { 
			float: left; 
			line-height: 50px; 
			font-size: 16px; 
			font-weight: 600; 
			text-transform: uppercase; 
			margin-left: 25px;
		}		
		.si-nav li a { text-decoration: none; }
		.si-nav li a:hover { text-decoration: underline; }
		.si-nav li a, .si-nav li a:hover, .si-nav li a:visited { color: #999; }

article header { text-align: right; }
article header .headline { font: 700 42px/1 proxima-nova-extra-condensed; color: #BF3119; text-transform: uppercase; margin: 0; }
article header .headline span { color: #000; }
article header .subhead { font-size: 18px; line-height: 1.2; font-weight: 600; color: #666; }
.intro h4 { color: #999; font-weight: 400; font-size: 14px;  line-height: 17px; }
		.intro .credit { margin-bottom: 10px; }
		.intro .credit a { color: #999; text-decoration: none; }
		.intro .credit a:hover { color: #BF3119; }
		.nprlogo { display: inline-block; text-indent: -999em; width: 51px; height: 17px; background: url(../img/npr-transparent.png) no-repeat; margin: 0 0 0 3px; }
article header p { font-size: 18px; text-align: left; }
article header .note { font-size: 14px; color: #999; }
article header p a { color: #BF3119; text-decoration: none; }
article header p a:hover { text-decoration: underline; color: #BF3119; }
article .intro ul li { float: left; margin-right: 10px; text-align: left; }
article section,
.discussion .section-hed { border-top: 1px solid #ccc; padding-top: 10px; }
article .section-hed { font: 700 24px/1.1 proxima-nova-extra-condensed,sans-serif; text-transform: uppercase; color: #000; }

#map {background: #fff !important; position: relative; }
#map .legend {
	position: absolute;
	top: 8px;
	right: 0;
	font-size: 14px;
	color: #999;
	background: #fff;
	line-height: 15px;
	padding: 5px;
	width: 190px;
	border: 1px solid #DDD;
	z-index: 100;
}

#map .legend p { margin: 10px 0 0 0; }
#map .legend p.instructions { margin: 0 !important; }
#map .legend .key { display: inline-block; border-radius: 30px; height: 10px; width: 10px; background: #d8472b; background: rgba(216, 71, 43, .7) }
.graphic { position: relative; }
.graphic h2.section-hed { margin-bottom: 0; }
#slider { position: absolute; z-index: 10; top: 118px; width: 620px; height: 20px; }
#slider a { position: absolute; display: block; top: 0; height: 19px; width: 9px; background: url(../img/slider.png) no-repeat; }
.graphic h3 { font-size: 14px; text-transform: uppercase; font-weight: normal; color: #999; line-height: 1; }
#chart { height: 120px; margin-bottom: 10px; }
.highcharts-tooltip { z-index: 100; }
.highcharts-tooltip text tspan,
.highcharts-legend text { font-family: proxima-nova,sans-serif !important; font-size: 14px !important; line-height: 110%; }
.highcharts-axis text { font-family: proxima-nova,sans-serif !important; font-size: 12px; }

.data table { width: 100%; }
.data thead th { font-size: 36px; line-height: 1.1; font-weight: 600; }
.data th { text-align: left; }
.data tbody td,
.data tbody th { width: 50%; }
.data tbody td { font-size: 24px; padding: 5px 0; }
.data tbody th { font-size: 14px; color: #999; }
.data th.state { color: #d8472b; }
.data th.county { color: #e38d2c; }
.data .section th { padding: 20px 0 5px; border-bottom: 1px solid #ccc; font-size: 16px; font-weight: 700; color: #333; width: 100%; }
.data tbody .rate td { font-size: 42px; line-height: 1; }
.data a { width: 12px; height: 12px; display: inline-block; overflow: hidden; text-indent: -999em; background: url(../img/info-bug.png) no-repeat center center; margin: 0; }

.discussion { margin-top: 20px; }

.profiles #stories a:hover,
#headlines li a:hover { color: #BF3119; }

.profiles p { font-size: 14px; }
.profiles a.btn { color: #BF3119; text-decoration: none; cursor: pointer; }
.profiles a.btn:hover {text-decoration: underline; }
.profiles #stories p a { display: none; }
.profile img { float: left; margin: 0 10px 10px 0; }
.profile h3 { font-size: 18px; line-height: 1.1; text-decoration: none; margin: 0 0 5px 0; }
.profile h3 a { text-decoration: none; }
.profile p { font-size: 14px; line-height: 1.2; }

#headlines { margin-left: 15px; }
#headlines li { list-style: disc; color: #bf3119; line-height: 1.1; margin-bottom: 3px; }
#headlines li a { font-weight: bold; font-size: 14px; text-decoration: none; }

#share-modal {
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
	        border-radius: 0;
}
#share-modal h2 { font-family: proxima-nova-extra-condensed,sans-serif; margin: 0; text-transform: uppercase; }
#share-modal .modal-header { position: relative; }
#share-modal .modal-header .close { 
	display: block; 
	position: absolute;
	top: 5px; 
	right: 10px;
	width: 20px; 
	height: 20px; 
	background: url(../img/close.png) no-repeat; 
}

textarea { font-family: "Helvetica Neue",Arial,sans-serif; }

footer.container { color: #333; margin-top: 20px; border-top: 1px solid #ccc; padding-top: 10px; width: 940px; }
footer h2 { font-size: 16px; font-weight: 300; color: #fff; border-bottom: 4px solid #ccc; text-transform: uppercase; margin-bottom: 9px;  }
footer p, 
footer li, 
footer dl { font-size: 14px !important; margin: 0; !important; }
footer a, footer a:hover { font-weight: bold; color: #999; }
footer .boilerplate, footer .partnership { text-align: right; }
footer .boilerplate { font-size: 12px; color: #666; }
footer .boilerplate a, footer .boilerplate a:visited { color: #999; }
footer a.nprlogo { text-indent: -999em; text-align: left; }

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}