@charset "ISO-8859-1";
.hh-box-area {
  height:300px;
  margin-top:30px;
  position:relative;
}
.hh-box-area h6 {
  margin-bottom:10px;
  text-align:center;
  width:100%;
}
.hh-half-time {
  bottom:-10px;
  box-sizing:border-box;
  color:#000;
  font-size:10px;
  font-weight:700;
  left:50%;
  position:absolute;
  text-align:center;
  width:50%;
}
.hh-full-time {
  left:0;
}
.hh-polar-area {
  float:left;
  margin:0 10%;
  padding:0;
  position:relative;
  width:80%;
}
.canvas-area {
  position:relative;
  z-index:2;
}
.canvas-origin {
  color:#707070;
  left:50%;
  margin-left:-8px;
  position:absolute;
  top:20px;
}
.canvas-origin span {
  display:block;
  height:12px;
  text-align:center;
}
.band-label {
  box-sizing:border-box;
  position:absolute;
}
.band1 {
  right:40px;
  top:0px;
}
.band2 {
  right:-10px;
  top:39%;
}
.band3 {
  bottom:0px;
  right:40px;
}
.band4 {
  bottom:0px;
  left:40px;
}
.band5 {
  left:-8px;
  top:39%;
}
.band6 {
  left:40px;
  top:0px;
}
.band-goals {
  box-sizing:border-box;
  color:#00197d;
  display:block;
  font-size:12px;
  font-weight:bold;
  line-height:16px;
  text-align:center;
  width:28px;
}
.band-line {
  background:#d0d0d0;
  box-sizing:border-box;
  display:block;
  height:2px;
  width:28px;
}
.band-percentage {
  box-sizing:border-box;
  color:#b0b0b0;
  display:block;
  font-size:10px;
  font-weight:bold;
  line-height:16px;
  text-align:center;
  width:28px;
}