#canvas{
  visibility: hidden;
  text-align: center;
}

.circle{
  cursor: pointer;
  fill: #fff;
  stroke: #336699;
  stroke-width: 4px;
}

.circle.selected, .circle.hover{
  fill: #fff;
}

.year {
  font-size: 1.8rem;
  fill: #336699;
}

.row:nth-child(odd){
  background-color: #f0f0f0;
}

.row:nth-child(1){
  background-color: #fff;
}

.prj-header {
  text-align: center;
}

.prj-header h3 {
  margin-top: 0px;
}

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
  .prj-header {
    text-align: right;
  }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
  #canvas {
    visibility: visible;
  }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
}