/* CSS for NYT App ---------------------------------------
	------------------ Taylor Graham Oct. 2015 */
	
	
/* Global Styles*/

	body{
		background-color: white;
		margin: 0px;
		padding-top: 50px;
		
		/*text-align: justify;*/
	  font-weight: 400;
	  font-family: 'raleway',sans-serif;
		}
	.center{
		margin-left: auto;
		margin-right: auto;
		text-align: center;
	}
	.justify{
		text-align: justify;
	}
	a{
		color: #337ab7;
	}
	a:hover{
		color: #175488;
	}
	
	h1, h2, h3, h4, h5{
		font-family: 'proxima-nova',sans-serif;
		text-align: left;
		padding-bottom: 10px;
	}
	.row{
		height:100%;
	}
	.col-md-4, .col-md-8{
	}
	.graphic{
		margin-bottom: 20px;
	}
		
	/* Specific */
	
	#subtitle{
		position: relative;
		bottom:10px;
	}
	#row-2>.col-md-4{
		padding-top: 20px;
	}
	#map-discussion{
		padding-top: 25px;

	}
	/* Aspect*/
	
	#aspect{
		width:300px;
		height:300px;
		margin-bottom: 30px;
		position: relative;
		right:10px;
	}
	/* Map */
	#map{
		height:500px;
	}
	
	#map-counties{
		height:500px;
		border: black solid 1px;
	}
	
	.image-container>img{
		padding-top:0px;
		width:100%;
	}
	.custom-popup .leaflet-popup-content-wrapper>h4 {
		padding:0px;
		margin: 0px;
  }


  
	
	/* Graphs*/
	#conditions-graph{
		position: relative;
		padding-top: 15px;
	}
	#slope-graph{
		position: relative;
		padding-top: 15px;
		padding-bottom: 20px;
	}
	
	#tooltip {
		z-index:2;
    position: absolute;
    width: 120px;
    height: auto;
    padding: 10px;
    background-color: white;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
    
    border: black 1px solid;
	}
	
	#tooltip.hidden {
	  display: none;
	}	
	
	#tooltip p {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-family: 'proxima-nova',sans-serif;
	}
	
	
	#tooltip2 {
		z-index:2;
    position: absolute;
    width: 120px;
    height: auto;
    padding: 10px;
    background-color: white;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
    
    border: black 1px solid;
	}
	
	#tooltip2.hidden {
	  display: none;
	}	
	
	#tooltip2 p {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-family: 'proxima-nova',sans-serif;
	}
	
	#tooltip3{
		z-index:2;
    position: absolute;
    width: 120px;
    height: auto;
    padding: 10px;
    background-color: white;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
    
    border: black 1px solid;
	}
	
	#tooltip3.hidden {
	  display: none;
	}	
	
	#tooltip3 p {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-family: 'proxima-nova',sans-serif;
	}
	
	
	#tooltip4{
		z-index:2;
    position: absolute;
    width: 120px;
    height: auto;
    padding: 10px;
    background-color: white;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
    
    border: black 1px solid;
	}
	
	#tooltip4.hidden {
	  display: none;
	}	
	
	#tooltip4 p {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-family: 'proxima-nova',sans-serif;
	}
	
	
	#conditions-graph-normalized{
		padding-top:15px;
	}
	#normalize-text{
		font-size:12px;
		text-align:right;
	}
	#sidecountry-description{
		position:relative;
		bottom:35px;
		padding-left: 30px;
		padding-right: 30px;
	}
		#sidecountry-description>strong{
			font-size:14pt;
		}
	#glow{
		position: relative;
		top:40px;
	}
	
	/* Counties Map */
	.info {
		width:275px;
		height:75px;
    padding: 6px 8px;
    font: 15px/16px 'proxima-nova',sans-serif;
    background: white;
    background: rgba(255,255,255,1);
    border-radius: 2px;
    text-align: center;
    border: black solid 1px;
}
.info h4 {
    margin: 0px 0px 0px 0px;
    padding: 0px;
    color: #777;
    text-align: center;
		font-weight: bold;
}

#percentage{
	font-size: 100pt;
}
	
	/* Footnotes */
	.footnote{
		position: relative;
		bottom:4px;
		left:2px;
		font-size:8pt;
	}
	#footnotes{
		position: relative;
		padding:25px;
		font-size: 10pt;
		font-weight: 200;
		line-height: 150%;
		width:40%;
		background-color: white;
		color:black;		
		font-family: 'proxima-nova',sans-serif;
		overflow: scroll;
		
	}