html{
background-color: white;
font-size: 17px;
}

.graphicTextContainer{
	width:900px !important;	
}

.smallTextContainer {
	width:500px;
}

#projections_fallback, #media_fallback {display:none; width:100%;}
#origin {position: relative; left:0; float:left; text-align: left; font-family: SourceSansPro-Light; font-size:11pt; text-transform: uppercase;}
#destination {position: relative; right:15px; float:right; text-align: right; font-family: SourceSansPro-Light; font-size:11pt; text-transform: uppercase;}


@media (max-width:900px){
	
.MedianColumn {width:calc(100% / 4) !important;}

	.graphicTextContainer{
		width:98% !important;
		margin:0 auto;
	}
	
	.smallTextContainer {
		width:100%;		
	}
}

#page4 h3{
	margin-left: 150px;
}
body {
margin: 0 auto 0 auto;	
background-color: white;	
font-family: SourceSansPro-Regular, arial, sans-serif;
cursor:default;
}
#loadMore{
margin: 30px auto 0 auto;
color:#EE3127;
font-size: 12pt;
cursor:pointer;
font-family: SourceSansPro-Bold, arial, sans-serif;
text-align: center;

}	

#loadMore:hover{
	color:black;
}

.narrow {
width: 66%;	
margin: 0 auto 0 auto;
}



/*header wrapper for everything*/
section#ReutersGraphicsCharts{
	width:100%;
	margin: 0 auto 0 auto;
	position:relative;
	
}
/*header across the top*/
section#ReutersGraphicsCharts header{
	font-size:1.5rem;	
  position: fixed;
  text-align: left;
  top:0;
  left:-2px;
  width: 100%;
  padding: 0 0 20px 0;
  background:white;
  /* opacity:0.7; */
  z-index: 10000000;
  -webkit-box-shadow: 0 0px 10px -2px #cccccc;
  -moz-box-shadow: 0 0px 10px -2px #cccccc;
  box-shadow: 0 0px 10px -2px #cccccc;	
}
/*header logo*/
section#ReutersGraphicsCharts #logo{
	background-image: url('thelogo.png');
	height:22px;
	background-position: center center;
	background-repeat: no-repeat;
	width:100%;
	margin-top:10px;
}

section#ReutersGraphicsCharts #logoHolder{
  text-align: left;
  top:-10px;
  left:-2px;
  width: 100%;
  padding: 8px 0 16px 0;
  z-index: 10000000;
  margin-bottom: -10px;
}

/*width of graphic floating in center*/
section#ReutersGraphicsCharts section{
/* 	width:940px; */
	margin: 0 auto;

}



/*EACH OF YOUR WELLS*/
.pageContainer {
width: 100%;
margin: 0 auto 0 auto;
display:none;
}
.pageContainer.selected{
	display:block;
}

.subhed {
font-family : RobotoSlab-Regular, arial, sans-serif;
font-size : 24px;
line-height : 36px;
color : black;
margin-top: 15px;	

}


/*text formatting*/
h1{
font-family : "Roboto Slab", arial, sans-serif;
font-size : 1.7em;
font-weight:300;
color : black;
}

#mainhead{
	width:100%;
	margin-top:15px;
	margin-bottom:7px;
	text-align: center;
}

#mainsubhead {width:100%;}

h2{
text-align: center;
font-size : 40px;
line-height : 28px;
color: #BBBBBB;
font-family: SourceSansPro-Regular, arial, sans-serif;
}


h3 {
font-size: 1.2em;
line-height: 1.3em;
color: black;
font-family: "SourceSansPro-LightIt", SourceSansPro-Light, Arial, sans-serif;
}


h4 {
font-size: 0.75em;
color: #BBBBBB;
}

#top {
width: 100%;
margin: 0 auto 0 auto;
font-size : 0px;
text-align:center;
}

#page1Photo {
	width:100%;
 	height:auto; 
	margin-bottom:20px;
	}
	
.photoContainer {
	position:relative;	
}

.graphicTextContainer {	
	width:500px;
	position: relative;
	margin:0 auto;	
}

@media (max-width:340px){
	.graphicTextContainer{
		width:100% !important;
		margin-top: 240px;
	}
	#page1Photo{
		display:none !important;
	}
	
	#projections_fallback, #media_fallback {display:block;}
	/* #MainPopulation, .labelHolder, #MainMedian {display:none;} */
}

h3.graphicSubhead {font-family: RobotoSlab-Regular, arial, sans-serif; font-size:18px; line-height: 25px;}

p.mytext {font-size:1.1em; font-family: "SourceSansPro-Light", Arial, sans-serif; line-height: 1.3em; margin-top:10px; }

p.myLabel {font-size:1em; font-family: "SourceSansPro-Regular", Arial, sans-serif; line-height: 20px; margin-top:25px;}
p.myLabelIt {font-size:1em; font-family: "SourceSansPro-LightIt", Arial, sans-serif; line-height: 1.3em;margin-top:3px;}
.mylabelIt {font-family: "SourceSansPro-Light", Arial, sans-serif; font-size: 1em;display:inline-block; margin-left:5px;}
.mylabelBold {font-size:1.3em; font-family: "SourceSansPro-Bold", Arial, sans-serif; line-height: 1.3em; }

#page1graphics {
	width:100%;
/* 	height:500px; */
	margin:0 auto;
	position: relative;
	display:block;	
}	

	
#page1graphic {position:realtive;width:100%; margin:0 auto; float:left;}
.demGraphics {width:100%; margin:0 auto; display:block; clear:both; position:relative;}
.demGraphicsSmall { height:300px;margin:0 auto; display:block; clear:both; position:relative;}
.MedianColumn {width:calc(100% / 7);position: relative; display: block-inline; float:left;margin-top:20px;}

@media (max-width:400px){
	.MedianColumn{
		width:calc(100% / 2) !important;
	}
	
	#projections_fallback, #media_fallback {display:block;max-width:400px; }
	/* #MainPopulation, .labelHolder, #MainMedian {display:none;} */
}

.trackerColumnHead {font-family: "SourceSansPro-Regular"; font-size: 1em;}   
.chartContainer{
	width:100%;
	height:170px;vertical-align: top;background-color: #fff;}
	
.chartContainer2{ width:calc(100% - 155px); height:300px;vertical-align: top;background-color: #fff;margin-bottom:20px;display:inline-block; float:left;margin-bottom:60px;}




.theCharts {position: relative;width:100%;height:90%;font-size: 16px;padding-top:5%;padding-bottom:5%;display:block;font-family:"SourceSansPro-Regular", Arial, sans-serif;background-color: transparent;}
#MainPopulationChart, #MainMedianChart {height:300px;float:left; display:inline-block;position: relative; width:100%;}
/* #chart {width:calc(100%-165px);} */
.flowContainer {width:calc(100%-165px);}

.labelHolder {width:180px; height:300px; float:left; display:inline-block;position: relative;margin-left:-25px;}

@media (max-width:400px){
	.chartContainer2{
		width:100%;
	}

.labelHolder{
		width:100%;
		display:block;
		margin-left: 0px;
		margin-top: -20px;
		height:150px;
		

	}	
	.mylabel{
		position:static !important;		
		display:block;
		float:none !important;
		margin-top: 2px;
	}

}


#UKlabel, #Francelabel, #Gerlabel, #Italabel, #Spainlabel, #Polandlabel, #Swelabel, #projections, #GerlabelMedian, #ItalabelMedian, #SpainlabelMedian, #SwelabelMedian, #UKlabelMedian, #PolandlabelMedian  {position:absolute; float:left;  }
#projections {top:20px;}
#UKlabel {top:66px;}
#Francelabel {top:87px;}
#Gerlabel {top:117px;}
#Italabel {top:130px;}
#Spainlabel {top:165px;}
#Polandlabel {top:215px;}
#Swelabel {top:256px;}

#GerlabelMedian {top: 30px;}
#ItalabelMedian {top: 47px;}
#SpainlabelMedian {top:72px;}
#SwelabelMedian {top: 87px;}
#UKlabelMedian {top: 102px;}
#PolandlabelMedian {top:117px;}

.arrowUp {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	
	border-bottom: 8px solid #333;
	display:inline-block;
}

.arrowDown {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;	
	border-top: 8px solid #6ac7e1;
	display:inline-block;
}


hr.faded {clear: both; float: left; width: 100%; height: 1px;margin: 40px 0px 40px 0px;border: none; background: #ddd; background-image: -webkit-gradient(       linear,       left bottom,       right bottom,       color-stop(0, rgb(255,255,255)),       color-stop(0.3, rgb(221,221,221)),       color-stop(0.7, rgb(221,221,221)),       color-stop(1, rgb(255,255,255)) );background-image: -moz-linear-gradient(
left center,rgb(255,255,255) 0%, rgb(221,221,221) 30%,
rgb(221,221,221) 70%,rgb(255,255,255) 100%
  );}

section#ReutersGraphicsCharts .axis line, section#ReutersGraphicsCharts .axiszero line  {fill: none;stroke: #eaeaea;stroke-width: 1.5px;}
section#ReutersGraphicsCharts .axiszero line {  stroke: #231F20;stroke-width: 1.5px;}
section#ReutersGraphicsCharts .axis text {font-family:  "SourceSansPro-Light", Arial, sans-serif;font-size: 7pt;}
 section#ReutersGraphicsCharts .axiszero text, section#ReutersGraphicsCharts .axis path, section#ReutersGraphicsCharts .axiszero path {display: none;} 


*tooltips get centered*/
.tip1, .tip2, .tip3 {/* text-align: center; */font-size: 10pt; }
.tip1Yes {background-color:#f17a5e; font-family: SourceSansPro-Bold, Arial, sans-serif;font-size: 14pt;line-height: 1.4;height:20px;width:100px;color:#000;}

section#ReutersGraphicsCharts .caption {font-size: 18pt;width:200px;}	
section#ReutersGraphicsCharts .captiontop {font-size: 14pt;margin-bottom:6px; }

/*lines and area and plot space*/
section#ReutersGraphicsCharts .line {
  fill: none;
  stroke: #231F20;
  stroke-linejoin: round;
  stroke-linecap:round;
} 
section#ReutersGraphicsCharts .lineChart {
  stroke-width:5px;
} 

section#ReutersGraphicsCharts .lineChart:hover {
  stroke-width:5px;
} 

section#ReutersGraphicsCharts .lineChart.notSelected {
 /*  opacity:0.5; */
 /*  stroke:#307eba; */
} 

section#ReutersGraphicsCharts #MainPopulation .line .Selected, section#ReutersGraphicsCharts #MainMedian .line .Selected {
  opacity:1;
  stroke:#307eba;
  stroke-width:5px;
} 


section#ReutersGraphicsCharts .bar:hover{fill:orange !important;}

section#ReutersGraphicsCharts .area, section#ReutersGraphicsCharts .area2 {
	opacity:0.4;
	fill:#88c4d8;
}

section#ReutersGraphicsCharts .plot{fill: #ffffff;}
section#ReutersGraphicsCharts .states { fill: none;stroke: #ffffff;stroke-linejoin: round;}
section#ReutersGraphicsCharts .cursorline {stroke: #AFBABF;stroke-width: 1px;}
section#ReutersGraphicsCharts #MainPopulationChart .cursorline, section#ReutersGraphicsCharts #MainMedianChart .cursorline {stroke: #AFBABF;stroke-width: 0px;}
#EUavgkey {width:15px;height:5px; background: #88c4d8;margin-top:3px; display:inline-block;position: relative; margin-left:3px; }
.tooltipYes {
	position: absolute;
	text-align: left;
	/* width: 60px; */
	height:15px;
	/* padding: 2.5px; */
	background: #ffffff; 
	pointer-events: none; 
	line-height: 12px;
	z-index: 5;
	font-size: 12px;
}
.tooltipNo, .tooltipDK, .tooltipIt, .tooltipEs, .tooltipPo, .tooltipSwe {
	position: absolute;
	text-align: left;
	/* width: 60px; */
	height:15px;
	/* padding: 2.5px; */
	background: #ffffff;
	pointer-events: none; 
	line-height:12px;
	font-size: 12px;
	z-index: 5;
}

.tooltip1{
	display:inline-block;
	font-family: "SourceSansPro-Regular", arial, sans-serif;
	/* text-transform: uppercase; */
}
.tooltip2{
	display:inline-block;
	font-family: "SourceSansPro-Light", arial, sans-serif;
	margin-left:3px;
}


/*Footer et cet.*/
/*

#chart {width:100%;}
*/
.credit {width:500px; margin:0 auto; position: relative; display:block;}
.source {color:#333;font-size:13px;line-height:17px;margin-bottom:50px;position: relative;float:left;}

#hedbox {
display:inline-block;
width:100%;
font-size: 13px;

float: left;
}

#hedbox h2{
	display: inline-block;
	color: #BBBBBB;
	text-align: left;
	font-size: 22px;
	margin:0 15px 0 0;
	
}
#updatedLine{
	position:fixed;
	z-index: 10000000;
	top:20px;
	right:15px;
}

#talliesbox {
width: calc(50% - 15px);
display:inline-block;
float: right;
}

g {
vertical-align: top;
	
}

.counter {
width: calc(50% - 15px);
display:inline-block;
margin: 0 auto 0 auto;
height: 100%;
text-align: center !important;
}

nav {
margin: 0 auto;
width: 500px;
clear:both;
white-space: nowrap;
}

.menuItem {
vertical-align: top;
display:inline-block;
width:110px;
font-size : 14px;
color : #ccc;
/* margin: 0px 0 0 0 !important; */
/* text-align: left !important; */
text-align:center;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
padding:15px 5px 15px 5px;
margin-right:30px;
font-family: SourceSansPro-Regular, serif;
}

.menuItem:hover {
color : black;
cursor: pointer;
}

.menuItem.selected {
	color:black !important;
	/* font-family: SourceSansPro-Bold, arial, sans-serif; */
}

.menuPipe {
vertical-align: top;
display:inline-block;
font-size : 1em;
color : #BBBBBB;
margin: 0px 2px 0 0;
}

#page1, #page2, #page3, #page4 {
margin: 0 auto 0 auto;
}

#page1 {margin-bottom:180px;}

.chronobox {
/*background-color: #EFECEA;*/
margin: 15px auto 0 auto;
width:  66.66666666666668%;
padding: 5px 15px 5px 15px;
border-style: solid;
border-left:  solid #BBBBBB;

}

.chronobox.chronopic {
	border-left:none;
}

.chronobox.chronopic .chronodate{
color:white;
display:none;
}

.chronodate {
font-family: RobotoSlab-Bold, arial, sans-serif;
font-size : 1em;
line-height: 1.5em; 
}

.chronoevent {
font-size : 1em;
line-height: 1.25em;
font-family: SourceSansPro-Regular, arial, sans-serif;

}
.chronoevent.narrower{
	width:640px;
}
.chronopic {
display:block;
width: 100%;
margin: 15px auto 0 auto;
font-size : 10;	
background-size: cover;
padding: 0 0 0 0 !important;
background-color: white !important;

}

.chronopic img{
max-width:100%;
}

.captext {
display:block;
margin: 10px auto 0 auto;
font-size : 1em;
font-family: SourceSansPro-LightIt, arial, sans-serif;


}


/*flat graphics*/
.flatGraphic {
width: 630px;
font-size: 0;
margin-top:15px;
background-size: 100%;	
background-repeat: no-repeat;

}

#gdpebola {
background-image: url("images/GDPebola.png");
padding-bottom: 100%;
width:100%;
}

#exafrica {
background-image: url("images/ExAfrica.jpg");
padding-bottom: 76%;
width:100%;
}


.wholabel {
text-align: center !important;
width: 100%;
}


#overallCasesBeds {
background-image: url("images/overallCasesBeds.png");
width: 630px;
padding-bottom: 59%;
margin: 10px auto 10px auto;
background-size: 100%;

}

#batsIllo {
background-image: url("images/batsillo.png");
padding-bottom: 60%;

}

#chimpsMaps {
background-image: url("images/chimpsMaps.png");
padding-bottom: 64%;
}

#pastoutbreaks  {
background-image: url("images/pastoutbreaks.png");
padding-bottom: 70%;
}

#scatterGraphic{
	width:415px;
	height:500px;
	display:block;
	margin:20px auto 0 0;
}

/*scatterchart STYLES*/
.tick {
	
}


/*MAP STYLES*/
#mapGraphic{
	width:415px;
	height:550px;
	display:block;
	margin:20px 0 0 auto;
}
.states{
	stroke:white;
	fill: #464647;
	stroke-width:1px;
}
.countries {
fill: white;
stroke: #CCCCCC;	
	
}

.deaths{
	fill:#E11F26;
	opacity:0.65;
}
.cases{
	fill:none;
	stroke:black;
}

.plot {
	fill: white;
}


/*tooltips get centered*/
.tip1, .tip2, .tip3, .tip4 {
	text-align: center;
	font-size: 10pt; 
	line-height: 1.2;
}
.tip1 {
	font-family: SourceSansPro-Bold, Arial, sans-serif;
	font-size: 14pt;
	line-height: 1;
	margin-bottom:3px;
	}


.tip2 {
	font-family: SourceSansPro-LightIt, Arial, sans-serif;

	}
.tip4{
	margin-top: 8px;
}


.turnedOn{
	opacity:1;
	stroke:white;
	stroke-width:1px;
}
.turnedOn:hover{
	fill:red !important;
	opacity:1 !important;
}

section#ReutersGraphicsCharts #overviewgraphic4{
	background-image: url(map.png);
	width:450px;
	height:560px;
	display:inline-block;
	vertical-align: top;
	margin-top: 20px;
}
#overviewgraphic4 p{
	margin:15px 0 20px 0;
}
#stackLineCharts{
	display:inline-block;
	width:350px;
	height:560px;
	vertical-align: top;
	margin-right: 130px;
	margin-top:20px;
}
section#ReutersGraphicsCharts .chart{
	margin-top:5px;
	width:400px;
	height:160px;	
}

section#ReutersGraphicsCharts #overviewgraphic5{
	margin-top:5px;
	width:940px;
	height:360px;	
}

section#ReutersGraphicsCharts .cursorline {
  stroke: #AFBABF;
  stroke-width: 2px;
}
/*lines and area and plot space*/
section#ReutersGraphicsCharts .line {
  fill: none;
/*   stroke: #231F20; */
  stroke-linejoin: round;
  stroke-linecap:round;
} 

section#ReutersGraphicsCharts .line.deathsLine {
  stroke-linejoin: round;
  stroke-linecap:round;
  fill:#E11F26;
	opacity:0.65;
} 
section#ReutersGraphicsCharts .lineChart {
  stroke-width:2px;
  transition:stroke-width 0.5s, opacity 0.5s;
  -webkit-transition:stroke-width 0.5s, opacity 0.5s;
  stroke:#307eba;
  opacity:0.7; 
} 

section#ReutersGraphicsCharts #MainPopulationChart .lineChart, section#ReutersGraphicsCharts #MainMedianChart .lineChart {
  stroke-width:5px;
  transition:stroke-width 0.5s, opacity 0.5s;
  -webkit-transition:stroke-width 0.5s, opacity 0.5s;
  stroke:#307eba;
/*   opacity:0.4; */
} 


section#ReutersGraphicsCharts #MainPopulationChart .line:hover, section#ReutersGraphicsCharts #MainMedianChart .line:hover {
  stroke-width:6px;
  stroke:#307eba;
} 

section#ReutersGraphicsCharts .lineChart.Selected {
/*   opacity:0.4; */
  stroke:#307eba;
} 

section#ReutersGraphicsCharts .line.Selected {
/*   opacity:0.4; */
  stroke:#307eba;
} 

section#ReutersGraphicsCharts .lineChart.notSelected {
/*   opacity:0.4; */
} 

section#ReutersGraphicsCharts .lineChart.turnedOff{
	opacity:0;
}

section#ReutersGraphicsCharts .tooltip {
	position: absolute;
	text-align: left;
	max-width: 100px;
	padding:10px;
	background-color: white;
	color: black;
	border: 1px solid #AFBABF;
	border-radius: 6px;
	pointer-events: none; 
	line-height: 1.2em;
	z-index: 5;
}
section#ReutersGraphicsCharts .tooltip.wider {
	max-width: 160px;
}

section#ReutersGraphicsCharts .dateTip{
	text-align: center;
	font-size: 11pt; 

}
section#ReutersGraphicsCharts .nameTip{
	text-align: left;
	font-size: 11pt; 	
	margin-top: 3px;
}
section#ReutersGraphicsCharts .valueTip{
	font-family: SourceSansPro-Bold, Arial, sans-serif;
	text-align: left;
	font-size: 13pt;
	line-height: 1.1;	
}

section#ReutersGraphicsCharts .tipLine{
	height:4px;
	border-radius: 3px;
	width:40px;
	margin-top: 15px;
}
section#ReutersGraphicsCharts .tipGroup{
	display:block;
}
section#ReutersGraphicsCharts .tooltip.wider .tipGroup{ 
	display:inline-block;
	width:80px;
	vertical-align: top;
}

/*Footer et cet.*/

footer a{
	text-decoration: none;
	color:black;
	font-family: SourceSansPro-Bold;
}
footer {
  float: left;
  background-color: #fff;
/*   border-top: 1px solid #EAEAEA; */
  color: #ddd;
  width: 100%;
/*   margin-top: 20px; */
  position:fixed;
  bottom:0;

}
footer .wrapper {
  padding: 1.2em 0;
}
footer a:link,
footer a:visited {
  color: #949494;
}
footer a:hover,
footer a:active,
footer a:focus {
  color: #444444;
}
footer ul {
  margin-bottom: 0.5em;
/*   color: #ddd; */
  font-size: .75em;
  text-align: center;
}
/*
footer li {
  display: inline;
  border-right: 1px solid #CCC;
  margin-right: .3em;
  padding-right: 0.6em;
}
*/
footer li.last-child {
  border: none;
}
footer p {
  font-size: .7em;
  line-height: 1.6em;
}


@font-face {
  font-family: 'SourceSansPro-Light';
  font-style: normal;
  font-weight: 300;
  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/toadOcfmlt9b38dHJxOBGMVNtom4QlEDNJaqqqzqdSs.woff) format('woff');
}
@font-face {
  font-family: 'SourceSansPro-Semibold';
  font-style: normal;
  font-weight: 600;
  src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/toadOcfmlt9b38dHJxOBGCmgpmuQqK2I-L2S9cF65Ek.woff) format('woff');
}
@font-face {
  font-family: 'SourceSansPro-Bold';
  font-style: normal;
  font-weight: 700;
  src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/toadOcfmlt9b38dHJxOBGIqjGYJUyOXcBwUQbRaNH6c.woff) format('woff');
}
@font-face {
  font-family: 'SourceSansPro-LightIt';
  font-style: italic;
  font-weight: 300;
  src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightIt'), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/fpTVHK8qsXbIeTHTrnQH6H7XMO6S-yJpg1torQFmnv33rGVtsTkPsbDajuO5ueQw.woff) format('woff');
}
@font-face {
  font-family: 'SourceSansPro-Regular';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url(http://themes.googleusercontent.com/static/fonts/sourcesanspro/v5/ODelI1aHBYDBqgeIAH2zlNHq-FFgoDNV3GTKpHwuvtI.woff) format('woff');
}
@font-face {
  font-family: 'RobotoSlab-Regular';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Slab Regular'), local('RobotoSlab-Regular'), url(http://themes.googleusercontent.com/static/fonts/robotoslab/v3/y7lebkjgREBJK96VQi37ZrrIa-7acMAeDBVuclsi6Gc.woff) format('woff');
}
@font-face {
  font-family: 'RobotoSlab-Bold';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Slab Bold'), local('RobotoSlab-Bold'), url(http://themes.googleusercontent.com/static/fonts/robotoslab/v3/dazS1PrQQuCxC3iOAJFEJRbnBKKEOwRKgsHDreGcocg.woff) format('woff');
}

.tipsy { position: absolute; padding: 5px; z-index: 100000; }
  .tipsy-inner { background-color: #000; color: #FFF; max-width: 200px; margin:20px 0px 20px 0px; padding:10px;}

  .tipsy-inner { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }

  .tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; margin:20px 0px 20px 0px; border: 5px dashed #000; }
  
  /* Rules to colour arrows */
  .tipsy-arrow-n { border-bottom-color: #000; }
  .tipsy-arrow-s { border-top-color: #000; }
  .tipsy-arrow-e { border-left-color: #000; }
  .tipsy-arrow-w { border-right-color: #000; }
  
	.tipsy-n .tipsy-arrow { top: 0px; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; }
    .tipsy-nw .tipsy-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
    .tipsy-ne .tipsy-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none;  border-left-color: transparent; border-right-color: transparent;}
  .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
    .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
    .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
  .tipsy-e .tipsy-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; }
  .tipsy-w .tipsy-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; }


.gravity { width: 100%; margin: 5px 0; border-spacing: 5px; }
  .gravity td { text-align: center; vertical-align: middle; padding: 5px 0; background-color: #d0d0d0; width: 33%; }
  .gravity a { }
    .gravity a:hover { color: #505050; background: none; }
    
    
/* SHARE BUTTON STUFF */

div.article-share {
  position:fixed;
  width: 100px;
  left:0px;
  top:22px;
}
div.share-toolbar {
  width: auto;
}
div.article-share div.share-toolbar div.share-icon {
  float: right;
  margin: 0 0 0 10px;
}
div.article-share div.share-toolbar div.share-buttons-container {
  left: -50px;
  top: 26px;
}
#share-toolbar,
.share-buttons-wrapper {
  position: absolute;
  padding-top: 15px;
  background: white;
  border: 1px solid #e1e1e1;
  height: 35px;
  width: 415px;
  z-index: 2;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -o-border-radius: 4px;
  -ms-border-radius: 4px;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.05);
}
#share-toolbar .fb,
.share-buttons-wrapper .fb {
  display: inline-block;
  width: 125px;
  height: 20px;
  margin-left: 10px;
  border: none;
}
#share-toolbar .twitter,
.share-buttons-wrapper .twitter {
  margin-left: 15px;
  width: 80px;
  height: 20px;
}
#share-toolbar .IN-widget,
.share-buttons-wrapper .IN-widget {
  margin-left: 15px;
}
#share-toolbar .plusone,
.share-buttons-wrapper .plusone {
  display: inline-block;
  height: 20px;
  width: 32px;
  margin-left: 15px;
}

.share-toolbar {
  z-index: 2;
  width: 20px;
  position: absolute;
}
.share-toolbar .share-more:hover {
  background-position: 0px -60px;
}
.share-toolbar .share-buttons-container {
  width: 0px;
  height: 55px;
  left: -5px;
  top: 39px;
  -webkit-transition: left, opacity, 250ms ease-out;
  -moz-transition: left, opacity, 250ms ease-out;
  -o-transition: left, opacity, 250ms ease-out;
  transition: left, opacity, 250ms ease-out;
  overflow: hidden;
  position: absolute;
  z-index: 99;
  opacity: 0;
}
.share-toolbar .open.share-buttons-container {
  display: block;
  width: 230px;
  opacity: 1;
  left: 0px;
  z-index: 900;
}
.share-toolbar .share-buttons-wrapper {
  width: 183px;
  position: absolute;
  top: 0px;
  left: 30px;
}
.share-toolbar .share-icon {
  position: relative;
  float: left;
  width: 20px;
  height: 20px;
  margin-top: 10px;
  padding-top: 0;
  background: transparent url(../css/share_sprite-gray-20x20.png) no-repeat;
  cursor: pointer;
}
.share-toolbar .share-icon .share-iframe {
  display: block;
  width: 0;
  height: 0;
  opacity: 0;
  padding: 0;
  border: 0;
  background: #FFFFFF;
  position: absolute;
  top: -6px;
  left: -5px;
  overflow: hidden;
}
.share-toolbar .share-icon.open {
  z-index: 999;
}
.share-toolbar .share-icon.open .share-iframe {
  opacity: 1;
  width: auto;
  height: 20px;
  border: 1px solid #dadada;
  padding: 6px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  -ms-border-radius: 3px;
  box-shadow: 0 2px 0 #eaeaea;
  -webkit-box-shadow: 0 2px 0 #eaeaea;
  -moz-box-shadow: 0 2px 0 #eaeaea;
}
.share-toolbar .share-icon:first-child {
  margin: 0px;
}
.share-toolbar .share-more {
  background-position: 0px -40px;
  cursor: pointer;
  height: 17px;
}
.share-toolbar .fb-icon {
  background-position: 0px 0px;
}
.share-toolbar .fb-icon .share-iframe {
  width: 125px;
}
.share-toolbar .fb-icon .share-iframe .fb {
  display: inline-block;
  width: 125px;
  height: 20px;
  border: none;
}
.share-toolbar .twitter-icon {
  background-position: 0px -20px;
}
.share-toolbar .twitter-icon .share-iframe .twitter {
  width: 80px;
}
div.share-toolbar div.share-icon:hover div.share-iframe {
  display: block;
  opacity: 1;
  width: auto;
  height: auto;
  border: 1px solid #E1E1E1;
  border-bottom: 4px solid #E1E1E1;
  padding: 6px 5px;
}


/* the other CSS file from PMI */
body {
	font-family: SourceSansPro-Regular, Arial, sans-serif;
	font-size:11pt;
	color:#231F20;
}	

/*header and other setup*/
section#ReutersGraphicsCharts{
	width:100%;
	margin: 0 auto 0 auto;
	position:relative;
	
}

#fallback{
	margin:100px auto 100px auto;
	font-size: 20px;
	text-align: center;
	
}
#button{
	width:200px;
	height:20px;
	background-color: gray;
	color:white;
	text-align: center;
	line-height: 20px;
	cursor:pointer;
}

#button2{
	margin-top: 10px;
	width:200px;
	height:20px;
	background-color: gray;
	color:white;
	text-align: center;
	line-height: 20px;
	cursor:pointer;
}

section#ReutersGraphicsCharts #mainGraphic{

  padding-bottom: 40px;
  width:960px;
  margin: 250px auto 150px auto;
}

.box {
	fill: pink;
}


.axis path {
display:none;	
	
}

.y.axis line {
	
stroke: #BBBBBB;
}

.x.axis line {
	
stroke: #BBBBBB;
}
.baseline{
	stroke:#BBBBBB;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 640px;
  text-align: left;
  margin-top:22px;
  margin-left: 150px;
  margin-bottom: 30px;
}

thead{
	border-bottom: 5px solid black;
	margin-bottom: 20px !important;
	vertical-align: bottom;		
}

thead th {
  font-family: SourceSansPro-SemiBold, Arial, sans-serif;	
  text-align: left;
    padding-top: 2px;
  vertical-align: bottom; 
  font-size:11pt;
}

thead tr th{
	  padding-bottom: 3px;
	  padding-left: 10px;
}
thead tr th:first-of-type{
	padding-left:0px;
}
tbody th{
	border-right:2px solid #CCCCCB;
	width: 100px;
	line-height: 1.2;
	font-family: SourceSansPro-Bold, Arial, sans-serif;
	text-align: left;
	padding-left: 5px;
}
tbody tr{
	cursor: pointer;
}

tbody tr td{
	padding-top: 10px;
	padding-left: 10px;
	line-height: 1.2;
	padding-bottom: 10px;
	width:120px;
}

tbody tr td.highlight{

	background-color: rgba(204,204,204,0.32);
}

tbody tr:first-child td {
  padding-top: 4px;
}

tbody tr:first-child th {
  padding-top: 4px;
}

tbody td {
  padding: 0;
  border-left: 0;

}

tbody tr {
	  height:30px !important;
	  line-height: 30px;
	  margin-left:20px;
	  border-bottom: 1px solid #AFBABF;
}
tbody tr td{
	 border-right:1px solid #CCCCCB;
}
tbody tr td:last-of-type{
	 border-right:0px solid #CCCCCB;
}

tbody tr{
	background-color: #EEEEEE;
}

tbody tr.inactive{
	background-color: white;
}
tbody tr:hover {
	background-color: #EE3127 !important;
	color:white !important;
	
}

table.tablesorter thead tr .header {
	background-image: url(bg.gif);
	background-repeat: no-repeat;
	background-position: center right; 
	cursor: pointer;

}


table.tablesorter thead tr .headerSortUp {
	background-image: url(asc.gif);
}
table.tablesorter thead tr .headerSortDown {
	background-image: url(desc.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
	font-family: SourceSansPro-Bold;
	font-size: 12pt;
}

#page4 p{
	margin-left: 150px;
}
#scatterCountry, #scatterYear{
	margin-top:-40px; 
}

.countryLabel{
	font-family: SourceSansPro-Bold, arial, sans-serif;
	margin-bottom: 10px;
}

@media (max-width: 400px) {
	
	
	
	.article-share, #updatedLine, #updatedDataLine{
		display:none;
	}
	section#ReutersGraphicsCharts #logoHolder{
		background-color: #d3d8da;
		height:45px;
	}
	#top{
		width:95%;
		margin:20px auto 0 auto;
	}
	#hedbox {
		width:100%;
	}
	#hedbox h2{
		width: calc(50% - 15px);
		margin:0 15px 0 0;
		font-size: 16pt;
	}
	#hedbox h1{
		font-family: "Roboto Slab", arial, sans-serif;
		font-size: 1.7em;
		font-weight:300;
	}
	
	nav{
		width:95%;
		margin: 0 auto 0 auto;
	}
	.menuItem, .menuPipe {
		display:none !important;
		margin:0 0 0 0 !important;
		vertical-align: top !important;
		text-align: center !important;
	}
	nav li:nth-child(1), nav li:nth-child(2), nav li:nth-child(3){
		display:inline-block !important;
	}

	section#ReutersGraphicsCharts section#mainWell, section#ReutersGraphicsCharts section#mainWell section#MainContent{
		width:100% !important;
	}
	.chronobox{
		border:none;
		width:90%;
		line-height: 1.2;
		font-size: 14pt;
	}
	footer{
		display:none;
	}
	#page4 .subhed, #page4 .chronoevent, #page4 #scatterCountry, #page4 #scatterYear{
		display:none;
	}
	#page4 table{
		width:100%;
		margin:0;
	}
	table.tablesorter thead tr .header {
		background-image: none;
	}
	#page2 {
		width:100%;
	}
	section#ReutersGraphicsCharts #overviewgraphic4{
		display:none;
	}
	#stackLineCharts{
		width:320px;
		margin:0 auto 0 auto;
		height:700px;
		display:block;
	}
	section#ReutersGraphicsCharts .chart{
		margin-top:5px;
		width:320px;
		height:200px;	
	}

	section#ReutersGraphicsCharts #overviewgraphic5{
		margin-top:5px;
		width:320px;
		margin:5px auto 0 auto;
		height:200px;	
	}
	#page2 p.subhed{
		width:360px !important;
		margin: 0 auto 0 auto !important;
		font-size: 16pt !important;
	}
	section#ReutersGraphicsCharts #logo{
	background-image: url('thelogo2.png');
	height:22px;
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
	width:100%;
	margin-top:7px;
	}

	#econSub, #page2 .chronoevent, #page2 .flatGraphic, #page2 .wholabel{
		display:none !important;
	}
}





/*legends*/
section#ReutersGraphicsCharts .legendContainer{
	position:absolute;
	right:0px;
}
section#ReutersGraphicsCharts .legendItems{
	margin-bottom:15px;
	position:absolute;
	cursor:pointer;	
	transition:opacity 0.5s;
	-webkit-transition:opacity 0.5s;
}
section#ReutersGraphicsCharts .legendItems.clicked{
	opacity:0.4;
}
section#ReutersGraphicsCharts .legendLines{
	height:4px;
	border-radius: 3px;
}
section#ReutersGraphicsCharts .legendText{
	font-family: SourceSansPro-Semibold, Arial,sans-serif;
	text-transform: uppercase;
	margin-top: 3px;
}
section#ReutersGraphicsCharts .legendDate{
	margin-bottom: 10px;
}
section#ReutersGraphicsCharts .bar{
	stroke-width:2px;
	fill:none;
}


