/* Google Fonts 已移除，使用系统字体 */
/*
  VARIABLES
*/
/*
  ANIMATIONS
*/
@-webkit-keyframes trolley-path-move {
  to {
    stroke-dashoffset: 100%;
  }
}
@keyframes trolley-path-move {
  to {
    stroke-dashoffset: 100%;
  }
}
/*
  GLOBAL STYLING
*/
body {
  background: #7AA226;
  color: #fff;
  font-family: "Source Sans Pro", sans-serif;
}

h1.title {
  font-family: 'Microsoft YaHei', 'PingFang SC', 'Helvetica Neue', Arial, sans-serif;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: .1rem;
  color: #AA0E76;
}
h1.title a {
  color: #920c66;
  text-decoration: none;
}
h1.title a:hover {
  color: #7b0a55;
}

@media screen and (min-width: 640px) {
  h1.title {
    font-size: 4rem;
    letter-spacing: .2rem;
  }
}
/*
  SVG STYLING
*/
svg#map-w-legend {
  display: block;
  margin: 0 auto;
  max-width: 800px;
}
svg#map-w-legend text {
  text-rendering: geometricPrecision;
  font-size: .35rem;
  font-weight: 400;
}
svg#map-w-legend text.text-label {
  font-family: Oswald, sans-serif !important;
  fill: #fff !important;
  letter-spacing: .02rem;
}
svg#map-w-legend .fills .fill-street-fest {
  fill: #f8a514;
}
svg#map-w-legend .fills .fill-club-hb {
  fill: #13a3aa;
}
svg#map-w-legend .dots {
  fill: #BCF9F4;
}
svg#map-w-legend .streets .pedestrian-mall {
  fill: #C768E8;
}
svg#map-w-legend .streets .street-paths {
  fill: #fff;
}
svg#map-w-legend .labels {
  fill: #fff;
}
svg#map-w-legend .labels text {
  font-family: Oswald, sans-serif;
  text-transform: uppercase;
  letter-spacing: .025rem;
  font-size: .4rem;
}
svg#map-w-legend .labels text.s2 {
  font-size: .4rem;
}
svg#map-w-legend .labels text.s3 {
  font-size: .35rem;
}
svg#map-w-legend .chinatown-eats use:nth-of-type(1) {
  stroke: #fff;
  fill: transparent;
}
svg#map-w-legend .chinatown-eats use:nth-of-type(2) {
  fill: #BCF9F4;
}
svg#map-w-legend .hb-ball text {
  fill: #fff;
}
svg#map-w-legend .hb-ball .hisam-block {
  fill: #111;
}
svg#map-w-legend .hb-ball use {
  fill: #fff;
}
svg#map-w-legend .stages .stage-block {
  fill: #B83D54;
}
svg#map-w-legend .stages [data-label] {
  fill: #fff;
}
svg#map-w-legend .trolley use {
  fill: #EDE213;
}
svg#map-w-legend .trolley .trolley-path {
  fill: transparent;
  stroke: #AA0E76;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2px;
  -webkit-animation: trolley-path-move 30s linear infinite;
          animation: trolley-path-move 30s linear infinite;
  stroke-dasharray: 5;
}
svg#map-w-legend .bolts text, svg#map-w-legend .squares text {
  font-family: "Source Sans Pro", sans-serif;
}
svg#map-w-legend .bolt text {
  fill: #885804;
}
svg#map-w-legend .bolt use {
  fill: #f8a514;
}
svg#map-w-legend .square use {
  fill: #B83D54;
}
svg#map-w-legend .square text {
  fill: #fff;
}
svg#map-w-legend .square.purple use {
  fill: #C768E8;
}
svg#map-w-legend .square.orange use {
  fill: #f8a514;
}
svg#map-w-legend .square.blue use {
  fill: #13a3aa;
}