/** SVG **/
svg {
  font-family: proxima-nova,sans-serif;
	font-size: 0.6em;
}  

.countrytable { border: none; border-collapse: collapse; }
.countrytable td.even { border-left: 1px solid #e6e6e6; }
.countrytable td.odd { border-left: 1px solid #f5f5f5; }
.countrytable td:first-child { border-left: none; }


.countrytable td.even { border-bottom: 1px solid #e6e6e6; }
.countrytable td.odd { border-bottom: 1px solid #f5f5f5; }

.countrytable th { 
	background-color: #dcdcdc; 
	border-left: 1px solid #f5f5f5;
	}
	
.countrytable th:first-child { border-left: none; }


.countrytable_cols {
	padding: 5px;
}
.countrytable {
	font-family: "proxima-nova",sans-serif;
	line-height: 1.2em;
    font-size: 0.8em;
}

.countrytable_rows {
	vertical-align: top;
}

.countrytable_rows.even {
	background-color: #f5f5f5;
}

.overlay {
  fill: none;
  pointer-events: all;
  stroke: #d6d6d6;
}

.chart_title text {
	font-size: 1em;
}
  
#legend text {
  fill: #666;
} 

rect.legend {
  cursor: pointer;
} 
  
.country {
  fill: #ddd;
  stroke: white;
  stroke-width: 0.3;
}

.map_clickable {
	cursor: pointer;
}

.progi {
	fill: #8D9120;
}

.progii {
	fill: #C4C488;
}

.progiii {
	fill: #009DE0;
}

.progiv {
	fill: lightblue;
}

.progv {
	fill: #b0b0b0;
}

.pind {
  fill: #b0b0b0;
}

.pnone {
  fill: #b0b0b0;
}
li.paction {
  color: #84c4f0;
}

li.ppledge {
  color: #009cdf;
}

li.pkyoto {
  color: #006E9A;
}
li.pnone{
	color: #b0b0b0;
}
li span{
	color: black;
}

.prognone {
  fill: #b0b0b0;
}
.pseltrue {
  fill: #8D9120;
}
.pselfalse {
  fill: #C4C488;
}
.pselundef {
  fill: #b0b0b0;
}

.pinda {
  fill: #009DE0;
}

.pindb {
  fill: #8D9120;
}
.pindc {
  fill: #C4C488;
}
.pindd {
  fill: #C42117;
}
.pinde {
  fill: #D88665;
}
.pindf {
  fill: #E6AD1F;
}
.pindg {
  fill: #F1CE80;
}
li.pinda {
  color: #009DE0;
}

li.pindb {
  color: #8D9120;
}
li.pindc {
  color: #C4C488;
}
li.pindd {
  color: #C42117;
}
li.pinde {
  color: #D88665;
}
li.pindf {
  color: #E6AD1F;
}
li.pindg {
  color: #F1CE80;
}

.paction {
  fill: #84c4f0;
}

.ppledge {
  fill: #009cdf;
}

.pkyoto {
  fill: #006E9A;
}

.country:hover {
	fill: orange;
}
.sel.country.clicked {
	fill: darkorange;
}

rect.globalclick {
	opacity: 0;
}

.countrylabel {
  text-align: right;
}

path.default_color {
  fill: #fff;
  stroke: #a6a6a6;
  stroke-width: 0.3;
}

path.select_color {
  fill: darkorange;
  stroke: #a6a6a6;
  stroke-width: 0.3;
}

.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.line {
  fill: none;
  stroke: black;
  stroke-width: 2.5px;
  opacity: 0;
}

.line.bau {
  stroke: black;
  stroke-dasharray: 2.5,4; 
}

.line.baun {
  stroke: black;
  stroke-dasharray: 7,4; 
}
.line.uni {
  fill: #0086BD;
  stroke: none;
}
.line.con {
  fill: #19A5E4;
  stroke: none;
}
.line.uni25 {
  fill: #860055;
  stroke: none;
}
.line.con25 {
  fill: #AB487E;
  stroke: none;
}
.line.uni30 {
  fill: #860055;
  stroke: none;
}
.line.con30 {
  fill: #AB487E;
  stroke: none;
}
.line.degreem {
  stroke: #696969;
}
.line.degreem15 {
  stroke: #673327;
}
.line.bonm {
  stroke: #646816;
}
.line.his {
	stroke-width: 3px;
}

.line.show {
  opacity: 1;
}

.area {
  fill: none;
  opacity: 0;
}

.area.bon {
  fill: #8D911F;
  stroke: #8D911F;
  stroke-width: 1px;
}

.area.deg {
  fill: #696969;
  stroke: #696969;
  stroke-width: 1px;
}
.area.deg15 {
  fill: #673327;
  stroke: #673327;
  stroke-width: 1px;
}

.area.show {
  opacity: 0.4;
}

.leg {
  opacity: 0;
}
.leg.show {
  opacity: 1;
}

button {
	border: 1px solid #f5f5f5;
	border-radius: 2px;
	box-shadow: 0 1px 2px #000;
	-moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.20);
	-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.20);
	box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.20);
}

section.odd {
	background-color: #e0e0e0;
}

a {
	text-decoration: underline;
}

#menu a, .action-item, .action-item a {
	text-decoration: none;
}

section#share.noborder {
	border-width: 0px;
}

#action {
	/*margin-left: 100px;*/
}

.action-item.contact div.title {
	margin-top: 0px;
}

.action-item a {
	color: #4c545b;
}

header div.container {
	width: 100% !important;
	text-align: center !important;
}

header div.container img.logo.not-mobile {
	margin: 0;
}

div#country_left {
	width: 65%;
}

div#country_right {
	width: 35%;
}

div#world_chartcontainer {
	width: 80%;
}

/**
 * 
 */
@media all and (min-width: 1024px) {

	section.part div.container-narrow {
		width: 960px;
	}
}

@media all and (min-width: 768px) and (max-width: 1023px) {

	section.part div.container-narrow {
		width: 700px;
	}
	
	#menu li a {
		padding: 21px 12px; 
	}
	
	#countryselection input {
		width: 200px;
	}
	
	div#country_left {
		width: 60%;
	}
	
	div#world_chartcontainer {
		width: 70%;
	}
	
	text#legendtext {
		font-size: 1.6em;
	}
	
	g.tick text {
		font-size: 1.6em;
	}
	
	g.axis path {
		stroke-width: 2;
	}
	
	#legend text {
  	font-size: 1em;
  }
  
  .countrylabel {
  	font-size: 1.4em;
	}
}

@media all and (min-width: 480px) and (max-width: 767px)
{
	header div.container img.logo.only-mobile {
		margin: 0 auto;
	}
	
	div#world_chartcontainer, 
	div#country_left, 
	div#country_right,
	div#world_right,  
	#countryselection input {
		width: 100%;
	}
	
	div#country_right {
		float: none;
	}
	
	button {
		font-size: 10px;
		width: 145px;
	}
	
	text#legendtext {
		font-size: 1.6em;
	}
	
	g.tick text {
		font-size: 1.6em;
	}
	
	g.axis path {
		stroke-width: 2;
	}
	
	#action {
		float: none;
	}
	
	.action-item {
		float: none;
	}
	
	#action a {
		text-decoration: none;
  }
  
	header .logo {
		margin: 0 auto;
		width: 450px;
	}
	
	section.part.first {
		padding-top: 60px;
		border-top-width: 0px;
	}
}

@media all and (max-width: 479px)
{
	div#world_chartcontainer, 
	div#country_left, 
	div#country_right,
	div#world_right,  
	#countryselection input {
		width: 100%;
	}
	
	div#country_right {
		float: none;
	}
	
	button {
		font-size: 10px;
		width: 95px;
	}
	
	text#legendtext {
		font-size: 2.2em;
	}
	
	g.tick text {
		font-size: 1.9em;
	}
	
	g.axis path {
		stroke-width: 3;
	}
	
	#action {
		float: none;
	}
	
	.action-item {
		float: none;
	}
	
	#action a {
		text-decoration: none;
  }
  
  #legend text {
  	font-size: 3em;
  }
  
  .countrylabel {
  	font-size: 3em;
	}
	
	header .logo {
		margin: 0 auto;
		width: 450px;
	}
	
	section.part.first {
		padding-top: 40px;
	}
}