div#page-content {
    margin-top: 3%;
 }
 input#year-slider {
     width: 718.75px;
     margin: 0 auto;
     display: block;
 }
 body {
       font-family: Verdana, sans-serif;
       text-align: center
 }
 p.subtitle {
    font-family: Georgia, serif;
    font-size: large;
    margin-top: 0;
 }
 h1 {
     text-align: center;
     font-family: Georgia, serif;
 }
svg, canvas {
	  margin: 0 auto;
	  text-align: center;
}
div#map, div#chart {
  display: inline-block;
  position: relative;
}
div#map > svg {
    background: rgba(58,132,223,0.7);
}
path.countries {
    fill: rgb(200,200,200);
    stroke: black;
}
div#map circle {
    fill: red;
}
div#map circle:hover {
    fill: Cyan;
    stroke: black;
}
circle#line {
  fill: red;
  opacity: 0.7;
}
.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}
.x.axis path {
  display: none;
}
.line {
  fill: none;
  stroke: SteelBlue;
  stroke-width: 1.5px;
}
.control-elements {
  margin-top: 40px;
  text-align: center;
}
input[type=range] {
  display: inline;
}
p {
  margin: 20px;
}
.tooltip {
  color: #222;
  background: #fff;
  padding: .5em;
  text-shadow: #f5f5f5 0 1px 0;
  border-radius: 2px;
  box-shadow: 0 0 2px 0 #a6a6a6;
  opacity: 0.9;
  position: absolute;
}
.hidden {
  display: none;
}
.zoom-buttons {
  position: absolute;
  left: 20px;
  top: 20px;
}
.zoom-buttons > button {
  padding: 1px;
  height: 30px;
  width: 30px;
  font-weight: bold;
}
