@-webkit-keyframes fadeIn {
   0% {
      opacity: 0;
   }
   100% {
      opacity: 1;
   }
}
@keyframes fadeIn {
   0% {
      opacity: 0;
   }
   100% {
      opacity: 1;
   }
}

svg .countries, svg .states {
   stroke-width: 1.4px;
   stroke: #fff;
   fill: #ddd;

}

#Scotland, #California, #Texas, #NorthCarolina, #Georgia, #SouthCarolina, #Indiana, #Minnesota, #Florida, #NewYork {
   fill: #b40000;
   opacity: 1;
}

#USA {
   stroke-width: 0;
   fill: #fff;
}

.locations-stroke circle {
   fill: #FF1500;
   opacity: .7;
}

.locations circle {
   fill: #fff;
   stroke: #FF1500;
   stroke-width: 0px;
}

.locations circle:hover {
   cursor: pointer;
   cursor: hand;
}

.wolfprint path:nth-child(1) {
   fill: #fff;
   fill: #FF1500;
   stroke: #FF1500;
   stroke-width: 4px;
   opacity: .7;
}

.wolfprint path:nth-child(2) {
   fill: #fff;
   stroke-width: 0px;
   stroke: #fff;
   transition: fill 0.2s ease-out;
}

.wolfprint:hover {
   cursor: pointer;
   cursor: hand;
}

#us-uk-map{
   position: relative;
   max-width: 1100px;
   margin: 0 auto 0;
   margin-top: 20px;
}

.detail {
   width: 100%;
   text-align: center;
   position: relative;
}

@media screen and (min-width: 1100px) {
   .detail {
      width: 25%;
      text-align: left;
      position: absolute;
      right: 0;
      top: 250px;
   }
}

#detail h2.map-title {
    font-family: GlyphaRoman;
    letter-spacing: .02em;
    color: #cc0000;
    font-size: 2.5em;
    font-weight: 700;
    display: block;
}

#detail h2 {
    font-family: GlyphaRoman;
    letter-spacing: .02em;
    color: #cc0000;
    font-size: 1.75em;
    font-weight: 700;
    display: block;
}

#detail ul li {
    font-family: Univers, Arial, sans-serif;
    margin-bottom: 5px;
}

#detail ul li a {
    color: #000;
}

#detail ul li a:hover {
    color: #666;
}

.d3-tip {               
   padding: 6px 8px;
   font: 14px sans-serif;        
   background: #5e0000;
   border: 0px;
   color: #fff;
   border-radius: 1px;
   pointer-events: none;
}

.d3-tip:after {
  box-sizing: border-box;
  display: inline;
  font-size: 10px;
  width: 100%;
  line-height: 1;
  color: #5e0000;
  content: "\25BC";
  position: absolute;
  text-align: center;
  margin: -1px 0 0 0;
  top: 100%;
  left: 0;
}

.d3-tip.animate {
   animation: fadeIn 0.15s cubic-bezier(0.470, 0.000, 0.745, 0.715);
   -webkit-animation: fadeIn 0.15s cubic-bezier(0.470, 0.000, 0.745, 0.715);
}
