body {
  padding: 50px;
  font-family: 'Kanit','Cagliostro', sans-serif;
}

a {
  color: #0099FF;
}

em {
  font-size: 200%;
}

span {
  font-size: 130%;
}

blockquote {
  margin: 0 auto;
  padding: 1em;
  border-left: 5px solid #999;
}
blockquote:before {
  display: none;
}
blockquote:not(:first-of-type) {
  margin-top: .5em;
}
blockquote p {
  color: #555;
  font-size: 12pt;
  line-height: 1.4;
  font-family: 'PT Serif', Cambria, 'Hoefler Text', Utopia, 'Liberation Serif', 'Nimbus Roman No9 L Regular', Times, 'Times New Roman', serif;
}
blockquote footer {
  margin-top: .5em;
  padding: 0;
  color: #777;
  font-size: 12pt;
  text-align: left;
  font-style: italic;
}
blockquote footer:before {
  content: '— ';
}
blockquote:nth-of-type(even) {
  text-align: right;
  border-left: none;
  border-right: 5px solid #999;
}
blockquote:nth-of-type(even) footer {
  text-align: right;
}
blockquote:nth-of-type(even) footer:before {
  content: '';
}
blockquote:nth-of-type(even) footer:after {
  content: ' —';
}
@element 'blockquote' and (min-width: 300px) {
  blockquote {
    padding: 1em 20% 1em 1em;
  }
  blockquote p {
    font-size: 14pt;
  }
  blockquote:nth-of-type(even) {
    padding: 1em 1em 1em 20%;
  }
}

svg { width:100%; height: 100% }

article{
	text-align: center!important;
}

#legend {
  position: absolute;
  left: 30px;
  top: 20px;
}

#legend .legend-title {
  margin-bottom: 4px;
  font-weight: bold;
}

#legend .legend-item {
  margin-bottom: 4px;
  font-size: .8em;
}

#legend .legend-swatch,
#legend .legend-value {
  display: inline-block;
  vertical-align: bottom;
}

#legend .legend-swatch {
  width: 16px;
  height: 16px;
  margin-right: 4px;
}

.counter-value {
  line-height: 130px;
  font-size:120px;
}


.counter-value-kong {
  line-height: 40px;
  font-size:30px;
}


/* Tooltip CSS */
div.tooltip {
  position: absolute;
  text-align: center;
  width: 150px;
  height: 60px;
  padding: 2px;
  font-size: 10px;
  opacity: 1;
  background: #fbffff;
  border: 0px;
  border-radius: 3px;
  pointer-events: none;
}

div.legendtip {
  position: absolute;
  text-align: center;
  color: black;
  width: 150px;
  height: 110px;
  padding: 2px;
  font-size: 10px;
  opacity: 1;
  background: rgba(255, 255, 255, 0.8);
  border: 0px;
  border-radius: 3px;
  pointer-events: none;
}

div.infotip {
  position: absolute;
  text-align: center;
  color: black;
  width: 150px;
  height: 35px;
  padding: 2px;
  font-size: 10px;
  opacity: 1;
  background: rgba(255, 255, 255, 0.8);
  border: 0px;
  border-radius: 3px;
  pointer-events: none;
}

div.heatmaptip {
  position: absolute;
  text-align: center;
  color: white;
  background: rgba(0,0,0,0.6);
  width: 50px;
  height: 40px;
  padding: 2px;
  font-size: 14px;
  opacity: 1;
  border: 0px;
  border-radius: 3px;
  pointer-events: none;
}

/* Bar Chart CSS */
.axis--x path {
  display: none;
}

.bars:hover{
  opacity: 0.6;
}

.audition-result {
  height: 400px;
  widows: 400px;
  color: white;
}

#auditionResult1 {
  font-size: 60px;
}

#auditionResult2 {
  font-size: 40px;
}


#loader {
  margin: auto;
  width: 120px;
  height: 120px;
  border: 16px solid #202122;
  border-radius: 50%;
  border-top: 16px solid #f3f3f3;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
.node circle {
  fill: #F7AEAE;
  stroke: #CD5C5C;
  stroke-width: 3px;
}

.node text {
  font: 15px 'Kanit';
}

.link {
  fill: none;
  stroke: #424949;
  stroke-width: 2px;
}


@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}