h1 {
  font-family: 'HaasTextBold', 'Helvetica', sans-serif;
  font-size: 28px;
  margin-bottom: 10px;
  /*margin-top: 40px;*/
  color: #3C3C3C;
  font-weight: 500;
}
b{
  /*font-family: "HaasText";*/
  /*color: #333;*/
  font-weight: 500;
}


h3{
  font-size: 1em;
}

.dek{
  margin: 0 auto 20px;
}

.copyblock{
  margin: 0px auto;
  width: 100%;
}

.copyblock p,{
  max-width: 733px;
  margin: 0px auto;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 15px;
  line-height: 1.5em;
}

.mini-chart{
  padding-top: 10px;
  margin-bottom: 30px;
  width: 280px;
  min-height: 250px;
}

.mini-chart.left{
  float: left;
  padding-right: 25px;
  margin-right: 25px;
}
.mini-chart.right{
  float: right;
  padding-left: 25px;
}

.mini-chart .name{
  font-family: 'HaasText';
}
.mini-chart path{
  stroke: rgb(64,204,204);
}
.mini-chart circle{
  stroke: rgb(64,204,204);
  fill: white;
  opacity: 1;
  fill-opacity: 1;
}
.mini-chart .count{
  fill: rgb(64,204,204);
}

.full-width{
  padding-bottom: 30px;
  margin-bottom: 60px;
  border-bottom: 1.5px solid #ddd;
  display: block;
  width: 100%;
  clear: both;
}
.full-width svg{
  display: block;
}

.article-title{
  width: auto !important;
  max-width: 880px !important;
}

#inner-content{
  overflow: visible !important;
}

.tiny-camp{
  display: inline-block;
  width: 350px;
  text-align: left;
  width: 31%;
}

.tiny-camp h1{
  font-size: 16px;
}


#candidates{
  text-align: center;
  /*border: 1px solid lightgrey;*/
  padding: 1px;
  margin-bottom: 60px;
  margin-top: 25px;
}

#candidates svg{
  /*display: none;*/
}

.candidate{
  padding-right: 7px;
  padding-bottom: 2px;
  padding-top: 3px;
  padding-left: 7px;
  font-size: 16px;
  cursor: pointer;
  color: grey;
  display: inline-block;
  font-family: 'HaasText', 'Helvetica', sans-serif
}

.candidate:hover{
  color: rgb(92,62,174);
}

.candidate.active{
  /*text-decoration: underline;*/
  font-weight: bold;
  background-color: rgba(64,204,204, 1);
  /*border: solid 1px black;*/
  color: white;
  border-radius: 4px;
}


.connection{
  opacity: .1;
}
.connection.hovered{
  opacity: 1;
  stroke: rgb(92,62,174);
}

.connection.active{
  text-decoration: underline;
  stroke: rgb(64,204,204);
  opacity: .7;
}


.connection.hovered.active{
  opacity: 1;
}

svg{
  overflow: visible !important;
}

circle{
  fill-opacity: .01;
  opacity: .6;
  stroke: black;
}

circle.camp-donation{
  fill: rgb(92,62,174);
  stroke: rgb(92,62,174);
}

circle.bush-donation{
  fill: lightgrey;
  stroke: rgb(64,204,204);
}

circle.null-donation{
  display: none;
}

circle{
  transition: stroke-width .5s;
}
circle.active{
  stroke-width: 20;
  pointer-events: none;
}

rect{
  opacity: .3
}

rect.camp-donation{
  fill: rgb(92,62,174);
  stroke: rgb(92,62,174);
}

rect.bush-donation{
  fill: lightgrey;
  stroke: rgb(64,204,204);
}

rect.null-donation{
  display: none;
}

.camp{
  color: rgb(92,62,174);
}
.bush{
  color: rgb(64,204,204);
}

path.camp{
  stroke: rgb(92,62,174);
  stroke-width: 2;
  fill: none;
}
path.bush{
  stroke: rgb(64,204,204);
  stroke-width: 2;
  fill: none;
}


.key.title{
  font-size: 1.6em;
  margin-top: 20px;
  margin-bottom: 10px;
}
.key{
  color: grey;
  font-family: "HaasText";
  text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
  position: relative;
  z-index: 100;
}
span.key{
  display: inline-block;
}

.key.top{
  color: black;
  margin-bottom: 4px;
  margin-top: 10px;
}
.key .line{
  font-size: 30px;
  font-weight: bold;
  line-height: 0px;
  position: relative;
  top: 3px;
}

 
text.key{
  fill: black;
}

.donor rect{
  opacity: 0;
}



path.annotation{
  stroke: grey;
  fill: none;
}

.annotation{
  pointer-events: none;
}


g.hover{
  pointer-events: none !important;
}

g.hover text{
  font-family: 'HaasTextBold';
}


g.hover circle{
  fill: rgba(0,0,0,0);
  stroke: rgb(64,204,204);
  stroke-width: 2.5;
  opacity: 1;
}
g.hover circle.camp{
  stroke:rgb(92,62,174);
}



text {
  fill: grey;
  font: 12px sans-serif;
  pointer-events: none;
  text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
}
.axis line,
.axis path {
  fill: none;
  stroke: grey;
  shape-rendering: crispEdges;
}
.axis text{
  fill: grey;
}

.axis path{
  display: none;
}

div.tooltip {
  top: -1000px;
  position: absolute;
  padding: 10px;
  background: rgba(255, 255, 255, .90);
  border: 1px solid lightgray;
  pointer-events: none;
}
.tooltip-hidden{
  opacity: 0;
}




@media only screen and (max-width: 700px){
  .mini-chart{
    display: block;
    margin: 0px auto  !important;
    padding: 0px;
    float: none !important;
  }
}

@media only screen and (max-width: 1010px){
  .tiny-camp{
    width: 49%;
  }
}
@media only screen and (max-width: 680px){
  .tiny-camp{
    width: 100%;
  }
}



@media only screen and (max-width: 1060px){
  .candidate{
    width: 6%;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
  }
  .candidate.in{
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }
  .candidate.active{
    text-decoration: underline;
    color: rgb(64,204,204);
    background-color: rgba(0,0,0,0);
  }
}